Back to blog home

Adding Static Blocks in Magento

Static blocks are blocks of content which are created and modified through the Magento Admin. Their main purpose is to act as a dynamic piece of content which can be placed on one or multiple pages, highly customisable and allows clients to modify the content through the admin area. They’re ideal for sections of you site where you need to display a piece of content which is likely to change throughout the course of the site’s lifetime and the piece of content doesn’t require its own page like About Us or Terms and Conditions pages.

Examples of how static blocks are used can be seen in the default installation of Magento. For example, on the Electronics product category page, instead of listing the products in the category, a static block is displayed as a landing page and the advantage of using a static block is that when the content on this page needs to be changed, the developer or client can easily modify the content through the admin area without the need to modify any templates.

Another example of how a static block can be used is on the homepage of the magento demo The ‘Buy Canon Rebel’ and ‘Back to School’ promotion blocks don’t use static block by default, but promotions such as these can be used created using static blocks and placed on multiple pages. Other examples of how static blocks can be used include:

  • Adding additional content such as phone numbers or links to the header and footer
  • Adding content to product category or product pages
  • Breaking up the content of the home page into manageable sections.

How to Create a Static Block

1. To create a static block, go to the Magento Admin area and then select the Static Block dropdown from the CMS tab.

2. Click on the ‘Add New Block’ button in the top right

3. Fill in the following fields:

  1. Block Title: Name of the static block, only used as a title in the admin. It’s not displayed on the frontend
  2. Identifier: the id of the block. Used to reference the block to when adding to a template file or content page.
  3. Status: setting the visibility of the static block on the frontend.
  4. Content: This is where to add the static block content. Content can be plain text, HTML code and Javascript. PHP code is not accepted in this area.

Adding a Static Block

A static block can be added or referenced to display on the frontend in the following ways (substituting ‘your_block_identifier’ with the id you assigned the static block):

1. Adding a static block to a content page stored in the Magento admin:

2. Adding a static block to a template phtml file:

3. Adding a static block to a XML layout file:

There are a few shortcut codes in Magento which you can place in content pages and static blocks to help speed up development time. When creating static blocks, the two most useful shortcuts are the store URL and skin URL shortcut codes, which provide links to the store home page and skin folder respectively.

The shortcut code to the store URL:

e.g. <a href=”{{store url=’customer/account/login/’}}”>Login</a>

With this code above, by default it will link to the frontpage of your store, but you can extend it by adding the path to pages such as the customer login, checkout, contact page etc.

The code for the skin folder URL:

e.g. <img src=”{{skin url=’images/image.jpg’}}” alt=”” border=”0″ />

 


Article update
This article was originally published under Session Digital, which unified with Inviqa in June 2016. For more information about the unification visit https://inviqa.com/new-era.