4.5. Icon

The Icon widget allows you to add graphic icons to your landing page to highlight information, enhance design, or decorate. Icons can be used for guidance, to emphasize services, or simply to create visual appeal for the page interface.

12.1. Add Icon to the Landing Page

  • In the sidebar, click on Widgets, then select Icon.

  • Click and drag the Icon widget into your landing page.

12.2. Icon Editor

12.2.1. Content Editor

  • Click on the Icon widget and select Content from the quick setup bar to open the Icon content editor.

  • Click on Select Icon to choose an available icon or click on Upload SVG file.

  • To link the icon, click on Icon Link and select the page you want to link the icon to.

+ Alt Text: Enter Alt Text for the icon to create alternative text. Alt Text allows search engines to recognize the content of the image. Use descriptive text that clearly describes the image.

+ Tooltip: Enter Tooltip for the icon. The tooltip text will display when the user hovers over the image.

12.2.2. Design Editor

  • Click on the Icon widget and select Design from the quick setup bar to open the Icon design editor.

  • Align: Helps you align the Icon within the container. For more information, see Align.

  • Sizes: In the design editor, helps you adjust the size and position of elements on the website. For more information, see Sizes.

  • Display on: Allows you to control the display of the Icon on different devices, including Desktop and Mobile.

  • Styles: Allows you to change the background color and shadow effects of the selected Icon. For more information, see Styles.

  • Border: Allows you to add and customize the border around the Icon, and you can also adjust the border radius. For more information, see Border.

  • General: Allows you to change the border color of the Icon.

Last updated