Magento Commerce, 2.3.x

Add Block

Use the Block content type to add an existing, active block to the stage. In the following example, the first column contains the HTMLHyperText Markup Language: A standard for tagging and structuring text, images, videos, and other media on a web page. Code for the page. The second column contains a block with a Google map.


Block with Map on “About Us” Page
  • Add Block Toolbox

    TOOL

    Icon

    Description

    Move

    Moves the block container and its content to another position on the stage.

    Settings

    Opens the Edit Block page, where you can choose the block, and change the properties of the container.

    Hide

    Hides the current block container and its content.

    Show

    Shows the hidden block container and its content.

    Duplicate

    Makes a duplicate copy of the block container and its content.

    Remove

    Deletes the block container and its content from the stage.

  • Block Settings

    Setting

    Description

    Block

    The name of the selected block.

    Select Block

    Displays a list where you can select an existing active block.

    Advanced

    Alignment

    Determines the horizontal alignment of the block. Options:

    Default

    Applies the alignment default setting that is specified in the style sheet of the current theme.

    Left

    Aligns the block along the left border of the parent container, with allowance for any padding that is specified.

    Center

    Aligns the block in the center of the parent container, with allowance for any padding that is specified.

    Right

    Aligns the block along the right border of the parent container, with allowance for any padding that is specified.

    Border

    Determines the border style that is applied to all four sides of the block container. Options:

    Default

    Applies the default border style that is specified by the associated style sheet.

    None

    Does not provide any visible indication of the container borders.

    Dotted

    The container border appears as a dotted line.

    Dashed

    The container border appears as a dashed line.

    Solid

    The container border appears as a solid line.

    Double

    The container border appears as a double line.

    Groove

    The container border appears as a grooved line.

    Ridge

    The container border appears as a ridged line.

    Inset

    The container border appears as an inset line.

    Outset

    The container border appears as an outset line.

    Border Color

    Determines the color of the container border. Specify the color by choosing a swatch, clicking the color picker, or by entering a valid color name or equivalent hexadecimal value.

    Border Width

    Determines the width in pixels of the container border.

    Border Radius

    Specifies the size of the radius that is used to round each corner of the border.

    CSS Classes

    Specifies the names of CSS classes from the current style sheet which apply to the container. Separate multiple class names with a space.

    Margins and Padding

    Determines the size, in pixels, of the outer margins and inner padding of the block container. Enter the corresponding values in the diagram. Options:

    Margins

    The amount of blank space, in pixels, that is applied to the outside edge of all sides of the container. Options: Top, Right, Bottom, Left.

    Padding

    The amount of blank space, in pixels, that is applied to the inside edge of all sides of the container. Options: Top, Right, Bottom, Left.