Hero Cards
Since version 2.87 we also include a special kind of form, already well-known Hero Cards (usable in chat with the client).
Under the name Hero Cards are interactive forms, offering new ways to connect customer care and sales, as well as advanced work with structured data and advanced reporting.
Hero Cards are one of the premium features of mluvii, so you will only find them in your administration if your company's licenses include this feature.
The Hero Cards editor is accessed via Settings -> Forms. Form settings can be made by users with minimum Tenant admin permissions.
Na Hero Cards můžete narazit i v případě komunikačního kanálu WhatsApp. Hero Card typu WhatsApp (tzv. Template Message) na rozdíl od ostatních Hero Cards lze v editoru formulářů editovat pouze omezeně (nahrání obrázku či videa). Až na tyto výjimky jsou obsah a podoba je definovány mimo platformu mluvii. Více informací naleznete here.
If you are creating a Hero Card for an Apple channel, we recommend using the following sizes (180 x 180 pixels) within the list picker and time picker components.
How to create a new Hero Card
To create a new Hero Card, click on the Add button. First, choose a form name (in this case, Hero Card). Next, select the type (Hero Card) and select the channel the Hero Card will be used for (WebChat or Apple). You can then select an existing Hero Card in the Created from field. The last thing to select when creating a new Hero Card is its location in the (if you do not select a location in the directory the form will be added to the default folder - All Forms). Then just click on the Create button.
The language of Hero Cards is governed by the language that the client has set in the browser (or on the device). In addition to the basic language (e.g. Czech), we recommend setting a foreign language, preferably English (default value).
The Hero Card menu in the operator interface is displayed according to the language of the client's browser. However, the operator can switch the Hero Card language at any time. For more information, see Hero Cards for Operators.
Editing Hero Cards
First, let's look at the Editor of Hero Cards. Click on the Add button and select one of the available field types from which you can compose Hero Cards.
When creating Hero Cards for Apple devices, only one component can be used in every single Hero Card.
Available Hero Card components:
Text
Classic text fields support rich text format. You can change its size, font style, and line spacing or add bullets and hyperlinks.
Image
If you choose to use an image, you must first upload it within files. To select an image, click in the space with the image symbol and select the specific file in the window that opens. You can also fill in the URL, which will redirect the image to your website.
Video
Similar to the image, you can also add the video you previously uploaded to the file tenant in the same way.
Field
First, name the field type by clicking the pencil icon. Then choose one of the five functions the field can have:
Text line - line for inserting shorter text, for example first and last name.
Text field - field for inserting and editing longer text. Click on Preview to immediately see the changes you are making to the form. For example, you can adjust the size of the text box by moving the bottom right corner.
E-mail - the field for inserting an email address controls the form of the address.
Number - a field that only allows you to type numbers.
Phone - a field to enter a phone number. It checks the standard format of the phone number.
Finally, in the right corner of the Field, assign a parameter, or a variable. You can choose from the preset parameters, or add your own.
You can also mark the field as Mandatory. If the client sees a mandatory field in the form, they cannot confirm the form submission without filling it in. When you're done with your edits, be sure to Save your changes.
List
Another option is to insert a List. First name the list and assign it a parameter. You can choose from two types of lists; radio button or drop-down list. To add options to the list, click on the + button. You can then check your edits in the preview before saving the form. The list, like the Field, can be made mandatory.
Confirmation buttons
Confirmation buttons always appear at the end of the Hero Card. They are inserted automatically if you use the Field or List component in the Hero Card editor. If you have only inserted a Text Field into the Hero Card, the confirmation buttons will not be added automatically, but you can insert them manually. The Buttons are used to record confirmation or rejection of information or offers in the Hero Card.
Authentication buttons
You can use this component as an alternative way to identify a client using a Facebook or Google account. You can force the use of the component by selecting the "required field " checkbox.
Selection of time
The Time Picker component allows the client to select one of the offered times/dates (e.g. to make an appointment). These times are always added to the specific Hero Card by the operator before sending the Hero Card. Don't forget to select the parameter that will be used to save the option selected by the client.
List picker
You can give the client a choice between two (or more) products, for example. The client then simply clicks on one product to select the option and then confirms.
Quick Reply
You can use this component when you want the client to select and confirm one of the options. For both WebChat and Hero Cards for Apple devices, we can give the client up to 5 options to choose from.
The Identification Hero Card should be used as an alternative to the mandatory entry form. You don't necessarily need to have a mandatory entry form set up instead use the Identification Hero Card at the right time when you need to get identification information from the client.
If you have a WhatsApp channel you may encounter Hero Card for the WhatsApp channel, the so-called Template Message. If you decide to delete it, be prepared to delete the Hero Card not only in mluvii but also in the 360Dialog Client Portal.
Last updated