Learn how to build a Customer Contact widget to support your website or web store customer queries through XSellco Fusion in this guide.
Building a Customer Contact widget for your website is easy. Create the form, embed it in your website, and you’re ready. Let’s go through the process, step-by-step.
When logged into the Dashboard:
- Go to Messages
- Click on the Widgets tab (next to the SmartTags, Templates and Labels tabs)
- Add New Widget on the right-hand side.
When you reach the page below, name your Widget, select a channel to which the Widget will be applied and hit Create Widget.
Customize the widget
After clicking Create Widget, you will see your Widget name, Type & Channel, the button to activate the widget, and the embed code for your website.
This embed code will only work for the Channel you selected.
There are four sections for you to customize – Button style, Pop-up style, Form and Labels -and then your pop-up form is ready to embed.
In this section you can customize the button that appears on your website.When clicked on, this button will open the pop-up box.
Type: Here you can choose between the standard button or inputting your own custom HTML button.
Button label: Choose what you want the text to in the button to say, eg. Contact Us.
Position: Select where on the page you want the button to be displayed. Use the offset controls to move the box to an exact position of your choice.
Color: Choose the color scheme of your button, its border and the containing text, either by using the color spectrum provided or by entering the color’s hex value.
Font: Select your font style and size.
Once you’re finished, select the second tab, Pop-up style.
Decide the color, placement and text of the pop-up box. This is a similar process to designing the button, except with more options to choose from.
Once you’re finished designing the pop-up style, select Form.
You can customize the text that appears in the Customer Contact widget, including the name, message field and confirmation message.
You can also add a Label Group. This helps organize support queries by giving the customers an option to choose what the query is about. The selected label will then be applied to the ticket in Fusion.
The Labels section allows you to predetermine how queries from this widget are labelled in your Messages in Fusion.
You can add different types of labels to the Customer Contact widget. For example, If you place this widget on a page you consider important, you might give it a high priority label.
Or, if the widget is placed on a certain product page, you can label it as that product. You can also label by query type, and support level, if these queries should go to a specific tier of your support team.
Once you’re done, click on Save Widget changes. Now the embed code is ready to use. Embed the code in a page of the website you have selected and the Customer Contact widget will be set up and ready to take queries.
Got some questions about the Customer Contact widget? We’ll be happy to answer any questions you have. Get in touch with us at firstname.lastname@example.org.