Putting the widget in your theme
- Open the theme editorGo to the product page in Shopify's theme editor. 'Get started' has a button that takes you straight there.
- Add the blockAdd the block 'Loyalo abonnementskeuze' to the product form and save the theme.
- Check a productThe widget only appears on products that are in a subscription plan.
What you set
| Part | What you do with it |
|---|---|
| Layout and style | How the choices look and how the customer picks a frequency |
| Colours and shape | Your own colours and rounding, or 'Follow brand' so the widget follows Loyalty > Brand |
| Texts | Titles, labels and the text for discount, saving and the next delivery |
| Labels | An extra label such as 'Most chosen', the saving and the price per day |
| Explanation | A link 'How does our subscription work?' with a panel, and the minimum term in plain words |
| Gift option | The customer gives the subscription as a gift with recipient, message and start date |
| Product tiles | A subscription label in collections and search results |
| Cart | Changing the frequency in the cart and a block that turns one-time purchases into a subscription |
| Custom CSS | For those who want to decide the last details themselves |
Draft, live and testing
You can save a new design as a draft first. You look at the draft in your shop and put it live when it is right. With an A/B test half of the visitors see the draft and the other half the live widget; per version you see the number of views and how often a subscription or a one-time purchase went into the cart.
Numbers and page speed
The Widget page opens on the design. The tab Testing and statistics has the numbers of your widget, with or without an A/B test. Pick 7, 30 or 90 days and see per day how often the widget was viewed and how often a subscription or a one-time purchase went into the cart. Counting is anonymous and uses no cookies.
Under Loading times you see how fast the product pages with the widget are for your visitors: how soon the main content is visible (LCP), how fast the page responds to a click (INP) and whether the page shifts while loading (CLS). Per measure you see which share of the visits was good, moderate or slow. These three cover the whole page, including your theme, your images and other apps. The line Widget ready is about Loyalo itself: the moment the widget works.
Languages
The widget is in Dutch and automatically shows visitors of an English, German or French shop the texts in their language. You adjust the translations per language.
Check that the product is in a subscription plan and that the block 'Loyalo abonnementskeuze' is in your theme. When 'Only show Loyalo subscriptions' is on, plans of other apps are not shown.
Why do I not see the widget on a product?
Usually the product is not in a subscription plan yet, or the block is not in the product form of your theme yet.
Does the widget fit my brand style?
Yes. You set colours, rounding and texts, or let the widget follow the brand style from Loyalty > Brand. The font comes from your theme.
Can I see how the widget performs?
During an A/B test you see the views and add-to-carts per version. That is how you pick the design that brings in most.
Setting up selling plans
Create subscription plans with frequencies, discounts and products. Loyalo puts them on your products as native Shopify Selling Plans.
One-time extras
Let subscribers add an extra product to their next delivery once. You choose the products and a discount for subscribers.
Troubleshooting
The widget does not show, a collection fails or an email does not arrive: per problem you find the cause and the fix here.