Set up the WhatsApp and Telegram contact widget

Before you start

You need your WhatsApp number in international format without + (for example 447700900123) or your Telegram username without @. For the button to show on your store, the toggle in the theme must be on: see Turn on the widget in your theme.

Everything happens in Shopify Admin › Apps › IFG AI Chat › Widget. This page is the same on every plan, Free included.

Connect WhatsApp

1. Open Widget from the left menu.
2. In the Contact channels section turn on the WhatsApp toggle.
3. In the field below (showing the example 393512345678 and the note “International number, without the + symbol”) type your number: country code and number, all together.

4. Press Save at the top right.

   What you’ll see: the message “Settings saved.” appears at the bottom. If the red notice “The widget is not active…” was at the top of the page, it disappears.

Warning: if the widget is already on in your theme, saving changes your live store straight away: visitors see the new button.

Connect Telegram

1. In the same Contact channels section turn on the Telegram toggle.
2. In the field below (showing the example bottegamilano and the note “Username, without the @ symbol”) type your Telegram username.
3. Press Save.

You can keep WhatsApp and Telegram on at the same time.

Choose look and behaviour

The Appearance section has three fields.

1. In Position choose Bottom right (the starting value) or Bottom left.
2. In Accent color pick the button colour with the picker, or type the code in #RRGGBB format. The starting value is #2C6ECB.
3. In Action on click choose what happens when a visitor taps the button:
   • WhatsApp (starting value): opens a WhatsApp chat with you directly;
   • Telegram: opens a Telegram chat with you directly;
   • Contact channels: opens a small menu with WhatsApp and Telegram, and the visitor picks one;
   • AI Chatbot: opens the chat with the AI assistant (Grow and Unlimited plans, with the chatbot switched on).
4. Press Save.

Note: the button never does nothing. If the chosen action isn’t available, the widget falls back on its own: for example with Telegram chosen but only WhatsApp on, the button opens WhatsApp; with AI Chatbot chosen but the chatbot off or not in your plan, it opens WhatsApp or Telegram.

Advanced options

Press Advanced options to show three more fields. They open by themselves if you’ve already filled one in.

• Appearance delay: how many seconds to wait before the button appears, from 0 to 30. With 0 it appears straight away.
• Accessible name of the button: the name screen readers announce to blind users. The button itself always shows only the icon.
• Prefilled message (WhatsApp): text the customer finds already typed when WhatsApp opens, for example “Hi, I have a question”.

After each change press Save.

Choose the icon

In the Launcher icon section (“Free choice on every plan”) pick one of the two options and press Save:

• Official channel logo (default): the button shows the WhatsApp or Telegram logo. If both channels are on and the click action is WhatsApp or Telegram, your store shows two buttons stacked, one per channel.
• Neutral IFG bubble: a generic speech bubble in the accent colour, with no reference to the channel.

With the Contact channels or AI Chatbot action the button uses the bubble, even if you chose the logo.

Undo an unsaved change

Until you press Save, the unsaved changes bar appears at the top. Press Discard to go back to the saved values.

Troubleshooting

Under the number you see “Numero non valido (formato E.164, senza +).” (Italian for “Invalid number (E.164 format, without +)”). The number contains symbols or is too short. Type digits only, with the country code first: 7 to 15 digits in total, and the first one can’t be 0. The app removes spaces, dashes and a leading + by itself.

Under the username you see “Username Telegram non valido.” (Italian for “Invalid Telegram username”). The username must be 5 to 32 characters, using letters, numbers and _. Remove spaces and dots.

After saving you see “Settings saved, but syncing with the theme failed.” Your settings are saved in the app, but the store hasn’t received them yet. Press Save again in a few minutes.

The red notice “The widget is not active…” is at the top of the page. No channel is on with a number or username. Turn on WhatsApp or Telegram, fill in the field and press Save.

The button doesn’t show on the store. In Overview, check that Widget block says Active. If it says Not added, follow Turn on the widget in your theme. If you set an Appearance delay, wait that many seconds.

Next step

Turn on and customise the AI chatbot