Menu

Owned by Olesya Tantsyura
Last updated: Nov 21, 2024
3 min read

1. Description

The component generates a navigation menu, storing the selection in a variable.

This component is present in flow types like:

  • Chat.

The block (Fig.1(1)) is used in space to build the Flow. The settings panel for this component opens (Fig.1(2)) when you click on the block.

Fig.1. Menu component

1.1. Menu block

The block consists of the following elements:

  1. The name of the component;

  2. In branch — receiving (connecting with the previous block) branch;

  3. Out branch — outgoing (connecting with the following block) branch. When hovering over the Out field, a switch appears. The switch allows this component to be connected to a component that already has a connection.

The presence of an icon indicates that the switch is on, and this component can be connected to a component that already has a connection.

Changing the switch position removes the outgoing branch of this component.

The button deletes the block from the Flow Schema.

1.2. Menu settings panel

It consists of the following elements:

  1. Text;

  2. Set;

  3. Type;

  4. Rows of buttons;

  5. Break;

  6. Limit;

  7. Add description.

1.2.1. Text

Here, enters the text that will be displayed along with the navigation menu.

1.2.2. Set

Here enters the variable's name in which the result of the subscriber's selection is written.

The field is automatically populated with ${onClick.Menu} value.

1.2.3. Type

Here, chooses the type of button placement. There are such options:

  • message — buttons are displayed in the message;

  • chat — buttons are displayed under the chat;

  • clear — no buttons.

1.2.4. Rows of buttons

It is designed to create rows of buttons in the navigation menu. 

The No input switch becomes available when at least one row is present.

 — indicates that you should disable input options (text, media, video, files, location, etc.), and allow only a response using one of the buttons.

Only for portals!

When you click on the Add row button, the following options are displayed (Fig.2):

  1. Button;

  2. Add button;

  3. Delete row.

Fig. 2. Add row

1.2.4.1. Button

It is designed to create a button. Consists of:

  1. Remove button;

  2. Type;

  3. Text.

1.2.4.1.1. Remove button

It is intended for removing the button. Clicking the  button removes the button.

1.2.4.1.2. Type

The button type.

For the message button placement type, the following options are available:

  • reply;

  • url.

For the chat button placement type, the following options are available:

  • postback;

  • contact;

  • email;

  • location.

1.2.4.1.3. Text

The name of the button that is displayed in the messenger.

 You can create branches along which the Flow scheme will pass, according to the selected button, by using the Switch component.

To do this, in the Cases field of the Switch component, you have to enter the button code created in the Menu component. In the Variable field of the Switch component — a variable whose name is entered in the Set field of the Menu component.

1.2.4.2.  Add button

When this button is clicked, the Button element is added to the row to which the Add button button belongs.

1.2.4.3.  Delete row

Clicking this button removes the row and all buttons from that row.

1.2.5. Break

1.2.6. Limit

Fig. 3. Setting a limit

1.2.7. Add description

Fig. 4. Add description