Action and Component Tags

  • #action - this tag opens a dialog for selecting actions by clicking on this component

  • #text - this tag opens a string text editing dialog (for labels, labels, and so on)

  • #multitext - this tag opens a text editing dialog (text can be formatted in this block, HTML tags can be used). It is most suitable for using a large text insert.

  • #image - this tag opens a dialog for selecting an image that will open in this container.

  • #frame - this tag opens the URL dialog for the frame, the frame will be displayed in this container. If there is something inside the container, it will be deleted during import, but it will be present on the page preview.

  • #youtube - this tag opens a dialog for specifying the video ID. The video player will be displayed inside the container. If there is something inside the container, it will be deleted during import, but it will be present on the page preview. In the title, using the | sign, you can specify the address for the video, for example #youtube|https://www.youtube.com/watch?v=K7ghUiXLef8

  • #vimeo - this tag opens a dialog for specifying a link to a vimeo video. The video player will be displayed inside the container. If there is something inside the container, it will be deleted during import, but it will be present on the page preview. In the title, through the | sign, you can specify the address for the video, for example #vimeo|https://vimeo.com/860216948

  • #lottie - this tag opens a dialog for specifying a link to a file with a Lottie animation. Animation will be displayed inside the container. If there is something inside the container, it will be deleted during import, but it will be present on the page preview.

  • #video - this tag opens a dialog for specifying a link to an MP4 (or other format) video. The video player will be displayed inside the container. If there is something inside the container, it will be deleted during import, but it will be present on the page preview. In the title, through the | sign, you can specify the address for the video, for example #video|https://sample lib.com/lib/preview/mp4/sample-20s.mp4

  • #yourcode - this tag opens the HTML component dialog. There are 3 items in the dialog - editing HTML code, editing SCSS styles and editing Angular code to interact with this block. Angular editing is only for advanced users familiar with programming in Javascrtipt and Angular. Otherwise, it is better to leave the default value there.

  • #hidden - elements with this tag will be invisible on the screen.

  • #timer - this tag adds a timer (or interval). Just add this this tag to any element. An element in such a tag can be any number. You can add a regular frame, add another #hidden tag to it so that this element is not visible on the screen. If you move the arrow from the element to another screen, menu, modal window or popover, then the action will be automatically applied when importing from the figure. Using the “|” symbol, you can specify the interval value in milliseconds in advance, for example #timer|3500 - will set the timer for 3.5 seconds.

  • #slider - this tag adds a slider. Inside this tag, each slide should have a #slide tag. By default, one slide per screen is calculated, but these settings can then be changed in the constructor. You can immediately specify the number of slides on the screen, and the number can be fractional, for example #slider|1.5 - in this case, the whole and another half will be shown

  • #link - if you put this tag on an element, then clicking on this element will open the link specified in the settings. Using the “|” symbol, you can specify the url of the link in advance (including email to and tel). Cannot be combined with the #action tag! Macros from the database can be used in the url component settings.

  • #aspect-ratio - this tag has no functionality, but all elements with such a tag will be rendered with the original proportions preserved, despite the size of the device screen.

  • #share - this tag on the element will open the standard "Share" dialog. Using the “|” symbol, you can specify the url of the link in advance. Macros from the database can be used in the url, text, title component settings.

  • #ion-back-button - clicking on an element with this tag returns you to the previous screen, no matter where the transition was made.

  • #width|50% - the tag means that the width of the block will be 50% of the width of the parent block

  • #toast - A container with this tag can be shown as a Toast notification. Via | you can set the time after which it will be hidden from the screen.

Last updated