Skip to content
Platforms

Webareal

How to add the Otto chat to a Webareal store through the site footer or through Google Tag Manager, and where to generate the product feed.

On this page

Webareal is a platform for renting an online store. Its guides do not mention a separate field for custom code, so you add the chat code to an item in the site footer or through Google Tag Manager, which takes about 10 minutes. The admin is in Czech, so the steps give the Czech names with their meaning in brackets.

What you need

  • An Otto account. You find the chat code in the panel under Overview, on the Installation & integrations card, on the Webareal tile. It is under the More platforms tile, and you can also search for it.
  • For the footer route, a template with the Patička webu (Site footer) tab. Older templates do not have it.
  • For the Google Tag Manager route, a Tag Manager account with a web container.

Chat code

On the Webareal tile, click Copy code. You get one line with your company’s public key:

<script async src="https://ottoai.sk/widget.js" data-otto-key="pk_vas_kluc"></script>
The sample shows pk_vas_kluc instead of a key, the tile gives you the code with your own key. The key is not a password, you do not need to hide it. Add the code once, it covers the whole site.

Adding the code

Site footer

  1. In the admin open Obsah webu (Site content), Struktura webu (Site structure), Patička webu and the Patička webu tab.
  2. Open a footer item whose Obsah (Content) row is set to Vlastní (Custom), or add a new one with the + Přidat položku (Add item) button.
  3. In the item's text editor switch to the source code, paste the chat code at the end and confirm.
  4. Save the changes.
  5. On your site open the page source (Ctrl+U) and check that the line with widget.js and data-otto-key is there, whole and unchanged.

Google Tag Manager

  1. In Google Tag Manager add a Custom HTML tag with the Otto loader from the documentation, section Through Google Tag Manager, and a trigger on all pages. Replace the key in the loader with yours from the tile.
  2. Publish the container in Tag Manager.
  3. In Webareal open E-shop, Webová analytika (Web analytics), Google měřící kódy (Google tracking codes).
  4. In the ID field for Google Tag Manager enter the container ID without the GTM- prefix and click Uložit nastavení (Save settings).
The footer editor is a text editor for content, not a field for scripts. After saving, always check in the page source that the chat line stayed whole.
Do not paste the usual line from the tile into Tag Manager. Tag Manager drops the attribute that holds the key, and the chat does not start.

Checking it works

  1. Open your website in a new browser window and reload. A chat bubble should pop up in the bottom right.
  2. Send the chat a test question. Otto answers within a few seconds.
  3. In the panel, under Settings, Connections, the Your website row shows the domain the chat runs on.

Product catalogue

You create the feed in E-shop, Export, Export produktů (Product export): pick a comparison site in the drop-down, for example Zboží.cz, click Vygenerovat (Generate) and the feed address shows below. According to the price list, Webareal generates feeds once every 14 days on the regular plans and once every 2 hours on the EXCLUSIVE plan, so generate the feed again after a bigger price change.

Paste the feed address in the panel under Settings, Catalogue, and click Check feed. The panel tells you how many products it found, and Otto keeps the feed up to date on its own. More in Product catalogue.

Troubleshooting

I do not see the Patička webu tab

Your template does not support it, older templates do not have it. Add the chat through Google Tag Manager.

The code shows as text in the footer

You pasted the code into the editor in the normal view. Delete the text from the item, switch the editor to the source code and paste the code again.

The chat line is missing or changed in the page source

The text editor changed the code. Paste it again in the source code view, and if the editor still changes it, use Google Tag Manager.

The chat does not show through Tag Manager

Check that the tag holds the loader from the Otto documentation with your key, not the line from the tile, and that the container is published. Also check that the container ID is saved in Webareal.

Also check

  • Reload the page without cache with Ctrl+F5, or open it in a private window.
  • The code should be on the page only once, a second copy is ignored.
  • A cookie consent bar can block scripts until the visitor agrees. If the chat only shows up after consent, see Cookie consent.
  • If your site sends a Content-Security-Policy header, allow https://ottoai.sk in it, as shown in Content-Security-Policy.
  • In the browser console (F12), look for messages starting with [Otto]. They tell you what the chat is missing.
  • Still nothing? Write to us at podpora@ottoai.sk and include your website address.

Removing the chat

In Patička webu open the item with the code and delete the line with widget.js from the source code, or delete the whole item. With the Tag Manager route, remove the Otto tag and publish the container.