In this article, you’ll learn about the OnVoard – Back In Stock element and how to use it. In order to use this element, the OnVoard Back In Stock app has to be installed on your Shopify store.
Install OnVoard Back In Stock
OnVoard Back In Stock allows customers to subscribe for back in stock notifications and automatically notifies them when products are restocked.
Before using this element, you have to install the OnVoard Back In Stock app to your store, configure options in the app, and then come back to PageFly to use the element(s) on your PageFly product pages.
With OnVoard Back In Stock element integrated into PageFly product page(s), it will display as a button for customers to click on and be directed to a signup form to get notified when the product(s) are available again.
Step 1: In your PageFly Dashboard, head to the Integrations section > search for OnVoard > Enable OnVoard Back In Stock element.
Step 2: Open your PageFly page editor. OnVoard Back In Stock’s element will be listed under the Push Notification category and called OnVoard – Back In Stock. Now you can drag and drop this element into your page editor.
NOTE: the OnVoard Back In Stock element only works once used in the Product page and inside the Product Details element. You can only use each variant of this element one time on each product page.
Step 3: Click on the OnVoard Back In Stock element and head to the General Tabs. You’ll see the Short code section where you need to put in the code for your element trigger.
To get this code, you have to visit your OnVoard Back In Stock Overview page. The code only shows up when you’re done configuring the options in OnVoard Back In Stock app, so we’ll come back to this later in this article.
Step 1: Set up OnVoard Back In Stock element by your Shopify Account.
Go to your Shopify Admin > Apps > Choose OnVoard Back In Stock to set it up.
Step 2: Set up element triggers in OnVoard Back In Stock.
- In the Overview of OnVoard Back in Stock, head to Configuration section > Choose Edit Config
- In the Settings section, head to Triggers to enable triggers to use for back-in-stock. There are two triggers integrated into PageFly: Inline Button and Inline Text.
- Once you’re done, the Inline Button and Inline Text tabs will appear at the top. Head to one of these tabs for further configuration. You can also customize the styling of OnVoard Back In Stock element here.
IMPORTANT NOTE: You have to choose Custom Placement option in Placement section, and Any Variant (Out-Of-Stock) option in Display Condition section. PageFly app doesn’t support other settings.
After completing the configuration, choose Submit.
Step 3: Set up OnVoard Back In Stock element on PageFly page(s).
After configuring the triggers in OnVoard Back In Stock app, go back to PageFly editor. In your product page editor > Add third-party elements > drag and drop the OnVoard Back In Stock element into your Product Details section. The OnVoard Back In Stock element has two variants: Notification Button and Notification Text.
Now, to get the code for your element trigger, go back to your OnVoard Back In Stock Overview page. Head to the Configurations section and click on Show Code. Copy the code for the element trigger you want to use, then paste it into the Short code section in the General Tab in your PageFly page editor.
You can customize the styling of the Onvoard element in the Styling tab.
You can check more information about the Styling tab here.
That’s it! Don’t forget to Save and Publish your product page to see the element on your PageFly page.