Overview
After successfully creating a widget from within your Rebuy Admin, see how here. You can then manually install that widget or placeholder ID if you are A/B testing, into a theme file of your choosing. If you are using app blocks, you can follow the app block installation guide. If you are using checkout extensions, you can follow the checkout extensions guide.
Installation Instructions
Theme.Liquid - Widget Installation
Step 1 | Finding Widget Placement ID
Open the widget in your Rebuy Admin and click the Placement tab on the right side.
Step 2 | Copying Widget Placement ID
Opening the placement tab will give you access to that widgets HTML div. You can copy this exactly and place it in your Theme files, to install the widget in that specific file.
Step 3 | Accessing the Theme.Liquid File
Open the theme file of your choosing (this example uses the theme.liquid file) and paste the widget div you copied in Step 2 into that file. Doing this will manually install the widget into your theme.
You can access your theme.liquid file by going to your online store settings within the Shopify admin portal, clicking the horizontal ellipsis, and clicking "edit code."
Once you are in the code files, you find the theme.liquid file and proceed to step 4 where you will install the widget placement ID you previously copied in step 2.
Step 4 | Installing Widget Placement ID
If using the theme.liquid file, the widget will now be installed across your theme.
{% if product %}
<div data-rebuy-id="78540" data-rebuy-shopify-product-ids="{{ product.id }}"></div>
{% endif %}
Pro Tip - If you're using a product widget and have multiple product files you need the widget installed in, you can utilize this snippet to install the widget into all product files at once.
Checkout.Liquid - Legacy Checkout Widget Installation
If your store has a checkout.liquid file, the process is the exact same. Follow steps 1-3. The only addition is that you may need to add the Rebuy load Script to ensure Rebuy is running on that page so that the widgets can work.
You can access your checkout.liquid file by going to your online store settings within the Shopify admin portal, clicking the horizontal ellipsis, and clicking "edit code."
A/B Testing - Placeholder ID Installation
If you are manually installing the place holder ID for an A/B test, you can follow the steps 1-4 with the specific A/B testing placeholder ID. You can find the A/B testing placeholder ID by following these instructions. The A/B testing placeholder ID will be inserted into this code snippet replacing "PLACEHOLDER"
<div data-rebuy-id="PLACEHOLDER"></div>
