Nothing puts you more closely in contact with your customers than good live chat software. Customers can converse with you in an accessible manner and interaction with an actual human helps building an emotional connection with your brand.

Moreover, chat is a very light-weight way for local businesses to connect with online customers, without having to set up an e-commerce store. A chat conversation can help convert an online customer to visit a physical store and make an offline purchase.

So how can you encourage consumers to start the conversation while sparking on- or offline sales? You reach out to them as soon as they're inspired by your online content, be it images or videos. Here's how you can link the products that are featured in your marketing content with a conversational landing page built with Landbot.io.

As soon as customers come across a product they're interested in, they can start the conversation with a single click. Let's take a look at how to implement this with Spott:

1. Set up your Landbot.io account

2. Build a chatbot from scratch

We want to create a single URL that we can use to include in a pop-up in interactive image or video. Let's create the chatbot that will be shown in this pop-up.

Start by building a new chatbot from scratch.

3. Add your hidden fields

We want our chat conversation to include information about the product the user just clicked on. This makes the chat more personal, but it also gives you more context about what product the customer is talking about, from which store he would like to buy it, etc.

We'll pass the product information we want to include in the chat conversation through URL query parameters. An example with the product name looks like this:
https://landbot.io/u/%7Blandbot-chatbot-id%7D/index.html?productname={your-product-name}

We'll use Landbot's Hidden fields feature for this, as seen on this documentation page. Go to the Settings > Hidden fields page and add a new hidden field to your chatbot called "productname".

Any product information you like can be added in this way - you can supply it manually or import it from a product feed in the Spott platform. This is the power of Spott's assets module, about which you can read more here.

4. Personalize the conversation and save

Go back to the "build" tab and personalize your message. You can now use the variables you added in the previous step.

Don't forget to save your chatbot. It's ready to be added to your interactive content!

5. Get your full page chat link

Go to the "Share" tab and copy the URL.

6. Add the chatbot to your Spott interactive content

We assume you have a Spott account and have already added a video and tagged an asset on there. Check out this article to see how.

The steps are almost identical for interactive images.

Select the bounding box you created in the tagger. In the right panel, click "Default style". We'll replace it by a different style that triggers the chat functionality. Click "New style". Call it "Chat" and choose any of the available types. We'll go with "Cards" in this example.

Change the "Button text" to "Chat with us" or something similar. Set the "Button action" to "Open in iframe popup". Now paste the chatbot URL from the previous step in the "Button URL" field. Append the correct query parameters as defined in Step 3.

A. Paste your URL, e.g.

 https://landbot.io/u/H-316172-M6VRAEX0DHA31983/

B. Append the query string key, e.g.

 https://landbot.io/u/H-316172-M6VRAEX0DHA31983/?productname= 

The first query parameter is appended with a ? symbol, any parameters afterwards are delimited with a & symbol. 

C. Drag and drop the query string value, e.g. 

 https://landbot.io/u/H-316172-M6VRAEX0DHA31983/?productname={name} 

Save your new style and select it from the list to apply it.
Your product information will now be passed from Spott to Landbot as soon as the user clicks the button in the interactive video! 😎

7. Embed the interactive video on your website

Click the "Preview" button in the tagger to see what the end result looks like.
Share your video by embedding it on your website following these steps.

Congrats! Users can now instantly start a conversation with you right from your video content 🎉

--

This is only one example of the use cases you can build with Spott's interactive image and video tagger. The option to open an iframe pop-up linked to product information allows you to link a variety of third party SaaS applications.

Do you have a use case for this yourself? Contact us!

Did this answer your question?