Appearance

Ybug + Shopify ​

Installing Ybug on your Shopify site ​

To install the Feedback Widget on your Shopify site, follow these simple steps.

1. Ybug: copy your code snippet ​

Go to your Ybug dashboard. Select the project from the dropdown menu in the top-left corner, navigate to the widget configuration tab, and copy your code snippet.

Ybug – Copy your code snippet

2. Shopify: paste your snippet ​

2.1 In your Shopify admin, go to your current theme and click Edit code.

Shopify – click Edit code

2.2 In the file editor, open the Layout folder and select the main layout (in the example below it's Layout/theme.liquid). Paste your code snippet right above the closing </body> tag and click Save.

Shopify – paste the code

2.3 Go to your site (refresh the page if needed) and you should see the Feedback button.

Restricting to admins only ​

Need to show the widget to administrators only? Wrap Ybug's code in a Liquid if condition:

liquid
{% raw %}{% if content_for_header contains 'adminBarInjector' %}
    /* Your Ybug code here */
{% endif %}{% endraw %}
Shopify – load widget conditionally for admins

If you also want to show the Feedback button in preview mode, add another condition content_for_header contains 'previewBarInjector'. Combined:

liquid
{% raw %}{% if content_for_header contains 'adminBarInjector' or content_for_header contains 'previewBarInjector' %}
    /* Your Ybug code here */
{% endif %}{% endraw %}