INTRODUCTION TO LAYOUTS

Layout is the tool with which you can assign content blocks to each structural block you create. Magento’s layout files are in the form of XML text-files and by modifying the layout you are able to move blocks around in a page and assign templates to the content blocks to produce markup for the structural blocks. In fact,
with the help of a few layout files alone, you are able to modify the visual layout of every page in your store.

Now look at the break-down of the above snapshot into Magento’s structural blocks and the content blocks assigned to each of those structural blocks.

In concept, the outlines in the left diagram above are the structural blocks. They are the parent blocks of content blocks and in realization, serve to position its content blocks within a store page context (as in the right diagram above). These structural blocks exist in the forms of the header area, left column area, right column, etc, which serve to create the visual structure for a store page. In this chapter, we’re going to work with Magento’s default structural blocks. Structural blocks are handled by Magento’s Page module and are defined in app/design/frontend/base/default/layout/page.xml file and the default page templates defined in
the app/design/frontend/base/default/template/page/ directory.

A content block is the individual-colored blocks that make up a structural block. In a store context, they are the true content of a store page. They are representations of each functionality featured in a page (such as category list, callout and product tags, etc.), and employ template files to generate xHTML to be inserted into its parent structural block. Content blocks make up the bulk of the remainder of the template files contained in the app/design/frontend/base/default/template/ directory.

Layout is the tool with which you can assign content blocks to each structural block you create. Layout
exists in the form of XML text-file and by modifying the layout you are able to move blocks around in a page and assign templates to the content blocks to produce markup for the structural blocks. In fact, with the help of a few layout files alone, you are able to modify the visual layout of every page in your store.

With Magento, you will no longer have a template file named “left_column.ext” and in it have the never- ending morass of markups that must be manually managed depending on each functionality needed for the page. Instead, your templates are managed on a per-functionality basis and you can load and unload
functionalities in your store page by the virtue of a couple of layout commands alone.

magento one step checkout - fancy product designer - magento extension store