Icon

Table of Contents

• Adding an Icon
• Option 1
• Option 2
• Moving and Resizing the Icon
• Customizing an Icon
• Deleting the Icon
• More Menu

Adding an Icon

Option 1

• Hover over the desired section, and click the Add Element:

• Choose the Icon element from the modal that appears:

• After you choose the element from the list, drag it to the desired section and drop using the grid.

Option 2

• Hover over the left sidebar of the Site Editor and click Build (+) button:

• Choose the element:

• After you choose the element from the list, drag it to the desired section and drop it using the grid.

Moving and Resizing the Icon

Please refer to the Elements Management (Drag and Drop Grid) article to learn more about moving and duplicating elements.

Customizing an Icon

To edit, duplicate, layer or delete the element, click on it and switch between the buttons that appears in its toolbar:

• Replace Icon: Click the icon area to select a different icon from the pop-up.
• Orientation: Use the Rotate Left or Rotate Right buttons to rotate your icon. Use the Flip Vertically or Flip Horizontally buttons to flip your icon.
• Align: Click the Align button to align the icon (with the background) to the Left, Right, or place it in the Center of the placeholder.
• Icon Color: Click the Square icon on the right of the сolor to open the color picker to change the Icon Color.
• Icon Size: Use the Slider Control to configure the size of the Icon.
• Background Color: Change the Background Color by clicking the square icon to open the color picker.
• Background Size: Use the Slider Control to configure the size of the background shape.
• Background Shape: Add a background shape to the icon by clicking the area on the left. The color will be added automatically.

Deleting the Icon

To delete the icon:

• Click the Remove button [Bin]:

• The element will be removed immediately.

More Menu

• Click the More icon in the editing menu to access the available options:

• Cut. Click Cut or Ctrl+X to cut your element.
• Copy. Click Copy or Ctrl+C to copy your element.
• Duplicate. Click Duplicate or Ctrl+D to duplicate your element. The duplicate will appear immediately.
• Delete. Click Delete to remove the element. The element will be deleted immediately.
• Move Forward. Click Move Forward or Ctrl+⇑ to move your element.
• Move Backward. Click Move Backward or Ctrl+⇓ to move your element.