Here at Smooch, we love inventing awesome new tools for you to communicate with customers via messaging. This being said, it is also our mission to make it as easy as possible for you to use these tools.
We derived a universal syntax (derived from markdown – a minimal syntax for marking up your documents with formatting, using punctuation and special characters ~ Ghost, Blog) to send buttons, images and more in all of our backend business app integrations.
It’s simple to use, and it works across all channels.
How? Smooch adapts outgoing messages to the features supported by each channel.
That means, channels that natively support buttons and images (such as Facebook Messenger and Telegram) will render buttons and images natively.
Text-only channels (like SMS) will gracefully downgrade from a button to a tappable link.
The best part is, you and your staff can use the same syntax across all of your CRM and team chat business apps (such as Zendesk or Slack) to send out these rich messages.
We’ve prepared a cheat sheet below to show you how.
The CheatSheet
An Example
Let’s breakdown an example conversation by syntax.
This syntax:
 How about these? $49.99 and I have size 11 in stock
will render like this, in Facebook Messenger for example.
Similarly, for a buy button using our Stripe integration, the following syntax:
Great. Would you like to buy them now? $[Buy Now]($49.99)
gives this result:
Stripe then opens up a purchase window like this.
But, what if your customer happens to be chatting over SMS and not Facebook? No problem! The image will be sent as an MMS message, and what rendered as a buy button in Messenger will be sent as a hyperlink in SMS, like this:
And it’s that simple.
Things to keep in mind:
- Image Alt Text. In traditional markdown for publishing, the text between the square brackets is treated as alt text – what you see when you hover over an image, and also the stuff that Google crawls so the image can be found in a Google search. In the context of a Smooch chat, most clients won’t use this alt text, so it’s optional. You can leave the text between brackets blank.
- Image hosting. To send an image over messaging, the image needs to be hosted somewhere on the public internet, with Google Drive, Dropbox, or a tool like Imgur. Your link should look something like http://i.imgur.com/mhNE5f3.png and it should end in png, jpeg, or gif. Images you post directly to Slack for example are only visible within your team, so before you can send it over Smooch you’ll need to re-upload it to one of the services listed above.
- Captions. You can attach captions or text before or after your syntax to complement the buttons or images.
- Incoming files. Many user-facing channels such as Messenger and SMS+MMS natively support image upload, meaning your customers don’t need the syntax to send you images, Smooch takes care of this. The image syntax is strictly meant to allow you to send images out to your customers.
- Money transfer. You’ll have to integrate with Stripe before sending a payment button. We want those payments to go into your bank account.
Postbacks + Replies
Postbacks are a special kind of button. The most a regular link button can do is open a URL in the customer’s browser, however you can use a postback button to trigger a custom action on your own backend web service. Note: some coding knowledge is required to implement postback buttons.
A common example for postback buttons is for building bots. Postback buttons can be used to present your customer with a list of options to choose from, the same way SmoochBot does during the conversational onboarding.
To respond to a postback event, you’ll need to set up a Smooch webhook. You can do this from the Smooch dashboard.
When the customer taps a postback button, Smooch will deliver a webhook event to the target URL you configure. The webhook event will include the postback payload text specified in the syntax %[Button label](postback:PAYLOAD). Note that the PAYLOAD string may not contain spaces.
Replies are similar, but appear horizontally and disappear after the user clicks. So postbacks remain inside the thread for ‘scroll up’ reference and replies disappear for a clean UI. See gif example below.
You can read more about sending postback buttons here, replies here and you can view API reference documents to see how to handle postback webhook events in your own code here.
Emojis
Emojis are particularly fun, if they fit with your brand experience. And are most definitely possible with Smooch.
Because every messaging or business app uses its own syntax for emojis (for example Slack’s emojis are different from those of Front), we enable the emoji syntax of your operating system so emojis work across all channels.
This is how to open your OS emojis:
MAC: CTRL + COMMAND + SPACE Windows: click on the keyboard icon in the bottom right of your window
And there you have it. All the fun and easy ways you and your agents can have simple, beautiful engagements with your customers over messaging.