Add and Configure the Rental Widget

Onboarding - Step 5

The Rental Widget is the part of Product Rentals Pro that your customers see on your website. It's what enables option, duration and date selection on your Product pages.

You need to be using a theme that supports Shopify Online Store 2.0 to use Product Rentals Pro. Online Store 2.0 was launched in 2021 and the vast majority of Shopify merchants are using a supported theme. Online Store 2.0 introduced "App Blocks", allowing merchants to add blocks provided by installed apps into their preferred position within their page templates in the theme editor. More info available here: I don't see the option for App Blocks within the theme editor so I can't add the PRP Rental Widget into my product page template.

If your website is already live and is using an alternative rental app, you may want to Duplicate your current live theme. You can then add Product Rentals Pro to that theme without affecting your live website at all. You can test it for as long as needed, by using the Preview function of the duplicate theme, and only need to Publish the theme once you're ready to go live with Product Rentals Pro.

Adding the Rental Widget to your Theme

1. Go to Online Store > Themes in your Shopify admin menu

2. Click the black Customize button beside your current active theme.

3. Select the appropriate page template, by clicking the Home Page button in the top bar, then going to Products. From there, you can either use the "Default product" template (or another existing Products template), or you can choose to "Create template", if you want to create a new product page template specifically for rental products. We recommend using the "Default product" template if your store is primarily offering rentals, and you aren't already selling products on your website. Otherwise you can create a new one by following Shopify's instructions here: Shopify: Create a New Page Template

4. After selecting a product page template, add the Product Rentals Pro Rental Widget to the page. You can choose where this fits, and each theme may be different, but typically you should put it between the existing "Price" and "Variant picker" blocks within the "Product information" section of the template.

5. Click "Add block" and then select the Product Rentals Pro Rental Widget.

   

6. After a moment, the Rental Widget will appear within the template at the spot you selected. You should now delete some existing blocks on the template. They're no longer needed as this functionality is provided by the Rental Widget. Delete the blocks under "Product information" named "Variant Picker" and "Buy Buttons". Depending on your theme, you may want to delete or adjust other blocks, or the blocks mentioned above may actually be labelled something else. The important thing to know is that the Product Rentals Pro Rental Widget provides variant selection and add-to-cart functionality for rental products, and any other blocks relating to these features for the main product on the product template should be removed.

7. Click on the Rental Widget within the page, or in the blocks list, to show all the customization options available for the widget. For a detailed overview of the customization options, including advanced customization via CSS, view the guide here: Rental Widget - Configuration Options

8. Optional: We also recommend activating the Cart Manager App Embed, which will limit the amount of time a rental Product will stay in a customer's cart. Follow the guide linked here: Cart Manager