Onboarding

How to customize your widget🚀

  • Published on
  • Jan 7, 2022
  • Reading time
  • 3 min read

Context

There are thousands of themes for Shopify that you can use or you can even create your own theme. With this in mind while creating our app we realised that providing the ability to customize our widget is a key feature that must be included at its core. Because of this, we allow you to be creative in order to fully integrate our widget with your brand needs and requirements.

You can customise our widget in three different ways:

  • Choosing a theme;
  • Customise a theme to match your Shopify theme colour patterns;
  • Full customisation using CSS;

Apart from customising the theme, you can also customise its content i.e title or highlight badge, etc.

Theme customization

First, go to the main page and click on Settings

How to customize - Step 1

Once you are on the Settings page in the Themes section you can select which theme you want from the select box. As you can see the widget preview (on the right-side) changes based on the customizations you selected.

How to customize - Step 2

If you want to do further customization you can activate “I want to customise this theme” and a new section will show up where you can define which colours you want to have for each parameter available.

How to customize - Step 3

If this is not enough for you and you need more flexibility you can use our CSS customization by selecting “I want to apply custom CSS to match my Shopify theme” and you can add CSS code that will be applied to your widget. This feature gives you extreme flexibility but you need to have CSS skills. If you do not have CSS skills we strongly advise you to contact our support or contact someone else that has those skills to implement these customizations for you.

How to customize - Step 4

As you can see we give you different levels of customization that you can use to make our widget match your Shopify theme.

Content customization

We can also customise the content used by the widget. This section allows you to customise the following:

  • Title
  • Discount description
  • Discount highlight badge
  • Discount button

As you type you can see the changes being applied to the widget on its preview.

How to customize - Step 5

This customization will be by default applied to all offers you have. Anyway because we know that you might need different requirements for some of your offers you can also customise this content at the offer level (under Customise section).

Conclusion

As you can see you can customise pretty much everything in our widget in order to match your Shopify store needs. If your store has a special need that cannot be archived using this customization please feel free to contact us.