Adding custom buttons to your website used to be a task. But, we’ve made it easier! You can now add web push subscription buttons to your custom pages with the integration between PushOwl and PageFly.
Here are all the use cases for this integration:
Price Drop: Allow shoppers to subscribe to be alerted about price drops for specific products. (Works only on product pages)
Back in Stock: Allow shoppers to subscribe to products that are stocked out and receive alerts as soon as they are back in stock. (Works only on product pages)
One-click opt-in: Allow one-click subscription to your web push notifications (Works on all pages)
You can customize the button and how it looks based on how you’ve set up and designed the page. The subscription is simple— shoppers just need to click on the button and they will be prompted to subscribe via the browser prompt.
If the shopper is already a web push subscriber, they will instantly be added to the waitlist for the product.
How to Integrate PushOwl and PageFly
To set up this integration, you will need to:
You can now start using this integration!
How to Set Up Web Push Subscriptions On Pages Created On PageFly
1. Click on 'Product Pages' from your PageFly dashboard.
2. Click on the page you want to add the PushOwl subscription element to.
3. From the left icon menu, click on the 3rd menu item "Add third-party elements"
4. In the list, search for "PushOwl" or scroll to the bottom of the list to find 'PushOwl Web Push Notifications" under the tab "Push Notifications"
5. Click on the type of subscription you want to add to the page— price drop, back in stock, or a general subscription.
6. Once you've placed the button on the page, you can customize the content and styling from the right sidebar.
Here's everything you can customize under the 'General' tab on the right sidebar.
Button content: This includes button text, post subscription text, pre-display button (how the button will look before subscription), post-display button (how the button will look after subscription).
Visibility: You can choose to hide it on specific devices based on device type.
Animation: You can animate the button when displayed and when hovered over.
Under the 'Styling' tab on the left sidebar, you can customize:
Button state: You can choose if the button interaction will be normal, on hover, or active.
Content color: Choose the color of the content in the button.
Spacing: Set the margins and padding for the button.
Font: This includes font type, size, text alignment styling (like bold, italics, underline, etc), line height, letter spacing, and capitalization.
Background: Choose a background color or even an image.
Border: Select the border style and the radius.
7. Once you've made the changes, you can click on "Save and Publish".
8. If you'd like to preview and test how the button works, you can click on "View" and choose "View Live Page" from the dropdown.
I can't see the back in stock button on my product page. How do I fix it?
For the back in stock button to be shown on your product page, product's SKU (including variants) needs be less than 0.