Magento Open Source 2.3.x

Page Layout

The layoutThe visual and structural composition of a page. of each page in your store consists of distinct sections, or containers, that define the header, footer, and content areas of the page. Depending on the layout, each page might have one, two, three columns, or more. You can think of the layout as the “floor plan” of the page, and assign a specific layout to be used as the default for CMSContent Management System: A software system that is used to create, edit, and maintain content on a website., product, and categoryA set of products that share particular characteristics or attributes. pages.

On the page, content blocks float to fill the available space, according to the section of the page layout where they are assigned to appear. You will discover that if you change the layout from a three-column to a two-column layout, the content of the main area expands to fill the available space, and any blocks that are associated with the unused side bar seem to disappear. However, if you restore the three-column layout, the blocks reappear. This fluid approach, or liquid layoutA flexible approach to web design that specifies the size and position of elements as percentages rather than as exact measurements in pixels., makes it possible to change the page layout without having to rework the content. If you are used to working with individual HTMLHyperText Markup Language: A standard for tagging and structuring text, images, videos, and other media on a web page. pages, you will discover that this modular, “building block” approach requires a different way of thinking.

Two Column Page Layout

To configure default layouts:

1. On the Admin sidebar, choose Stores. Then under Settings, choose Configuration.
2. In the panel on the left under General, choose Web.
3. Expand the Default Layouts section, and do the following:
a. Choose the Default Product Layout that you want to use for product pages.
b. Choose the Default Category Layout that you want to use for category pages.
c. Choose the Default Page Layout that you want to use for CMS pages.
4. When complete, tap Save Config.