Icon button

Description of content types in the menus
Tool Bar Icon Description

Group of HTML elements

Editable: No, you can't edit the text.

Droppable: No, you can't drop other blocks or components inside.

Component Tool Bar:

Parent Selectable: Yes, you can select parent element from component.

Draggable: Yes, you can drag this component to other locations in the canvas.

Copyable: Yes, you can copy component in the canvas.

Removable: Yes, you can delete this component from the canvas.

Trait Manager Settings: Yes

  • href: Sets the link url.
  • Target: Sets how the link opens, in This Window or New Window.

Default Styles (doesn't include default browser styles): Yes

  • Padding set to 5 pixels on all sides.
  • Bottom margin set to 15 pixels.
  • Text decoration set to none.
  • Text color set to black.

Child Components: Yes

  • Icon Button Image
    • Component: Image
    • Tool Bar:
      • Parent Selectable: Yes 
      • Draggable: No 
      • Copyable: No 
      • Removable: No 
  • Stylable: Yes - Style Manager options limited to:
    • margin-top
    • margin-bottom
    • margin-left
    • margin-right
    • border-top-width
    • border-bottom-width
    • border-left-width
    • border-right-width
    • border-style
    • border-color
    • border-top-left-radius
    • border-top-right-radius
    • border-bottom-left-radius
    • border-bottom-right-radius
    • box-shadow
  • Default Styles (Not including default browser styles): Yes:
    • Bottom margin set to 10px.

  • Icon Button Text

    • Component: Custom span element

    • Editable: Yes 

    • Droppable: No

    • Tool Bar:

      • Parent Selectable: Yes - Can select parent element from component.

      • Draggable: No - Can not drag this component to other locations in the canvas.

      • Copyable: No - Can not be copied in the canvas.

      • Removable: No - Can not delete this component from the canvas.

    • Stylable: Yes - Style Manager options limited to:

      • font-family

      • font-weight

      • font-size

      • font-style

      • line-height

      • letter-spacing

      • text-align color

      • text-shadow

      • text-decoration

      • margin-top

      • margin-bottom

      • margin-left

      • margin-right

      • padding-top

      • padding-bottom

      • padding-left

      • padding-right

      • border-top-width

      • border-bottom-width

      • border-left-width

      • border-right-width

      • border-style

      • border-color

    • Default Styles (not including default browser styles): Yes

      • Text align set to center

    • Trait Manager Settings: No

Unique Documentation: No

Stylable: Yes, when double-clicked, some options are available via inline rich-text editor. These Style Manager options are available:

  • margin-top
  • margin-bottom
  • margin-left
  • margin-right
  • padding-top
  • padding-bottom
  • padding-left
  • padding-right
  • border-top-width
  • border-bottom-width
  • border-left-width
  • border-right-width
  • border-style
  • border-color
  • background-color
  • background-image
  • background-position
  • background-size
  • background-repeat
  • background-attachment
  • border-top-left-radius
  • border-top-right-radius
  • border-bottom-left-radius
  • border-bottom-right-radius
  • box-shadow

Back to Story Builder

Back to Page Builder