Installation Guide
HOT TIP: Open this Installation Guide in a separate browser window to follow along with the steps as you go.
1: Now that you have installed the Conversagent app and synced your store content, you will need to add the app in the theme customizer.
How do I do this?
In the Shopify menu bar to the left, select ‘Online Store’ and then ‘Themes’. Find your current theme & select ‘Customize’.
2: The next steps depend on whether you are using a Shopify 1.0 or 2.0 theme. Shopify 1.0 themes do not support the embedded chat interface.
How do I find out what theme I'm using?
If your theme was created before June 2021, and you haven’t updated versions, there is a good chance you are still using Shopify 1.0. Within your theme customizer experience, click Add Section (+), and note whether an App section is available. If App sections are available to add, then you are leveraging Shopify 2.0.
Installation steps for Shopify 2.0 themes
3a: Add the Conversagent ‘block’ on the desired pages you’d like the Conversagent chat to appear.
How do I do this?
Use the drop-down menu at the top of the page to find the page type you’d like your Conversagent chat window to appear on. If the drop-down menu isn’t visible in your browser, select the magnifying glass at the top the page to open the drop-down menu.
‘Add block’ from either the apps section on the left menu or under an existing section in the template and select ‘Conversagent’.
4a: Now it’s time to adjust the position of the chat interface & customize it.
HOT TIP: Each time you add a Conversagent block you will need to customize your shopping assistant.
How do I do this?
To change the position of the chat interface you can click, hold, and drag the item in the menu or you can click the chat interface, hover and select ‘Move to previous position’, or ‘Move to next position’.
To customize it’s appearance, select the block and then add details in the panel to the left: name, tag line, and agent image. At this point you could also elect to have your chat interface floating (like a pop up bubble) instead of embedded into the page.
If you would like to further customize the chat interface, you can also add custom CSS here. To remove the app block, select ‘Remove block’ at the bottom of this panel.
5a: Click ‘Save’ and repeat steps for other page types you would like the Conversagent chat to appear.
HOT TIP: Remember to do this for all categories, collections, product types, page types, etc. that you plan to have the Conversagent chat interface on.
Installation steps for Shopify 1.0 themes
3b: If you are using a Shopify 1.0 theme, you will need to add the chat interface via the App Embeds section. This version of Conversagent is displayed as the floating chat interface.
How do I do this?
Select the ‘App Embeds’ icon on the far left-hand panel, this will likely be underneath the settings icon. Select the Conversagent app from the list & select the toggle to enable the app. The floating chat interface will now appear on every page using the theme the app has been enabled for. Use the search app embeds bar at the top of the menu if you can’t see Conversagent on the list.
4b: Now you can customize your Conversagent.
How do I do this?
After using the toggle to enable the Conversagent app, the customization options will appear below this toggle. Add a name, tagline and/or character image. You can also add custom CSS to further customize the chat interface.
5b: Remember to hit ‘Save’ in the top right-hand corner of the screen to save your settings.
HOT TIP: The floating Conversagent chat interface will be added automatically to all pages using the theme you have enabled the app on.
For further support, please see our FAQs or contact support@clevertar.com.