LexiConn Knowledgebase

LexiConn Knowledgebase

Knowledgebase Home | Favorites Knowledgebase Home | Favorites
Search the Knowledgebase Browse by Category

[Advanced Search]
Magento: Adding CMS Static Blocks to Templates
Article Details

Last Updated
24th of December, 2014
Would you like to...
Print this pagePrint this page
Email this pageEmail this page
Post a commentPost a comment
Subscribe me
Add to favoritesAdd to favorites
Remove HighlightingRemove Highlighting
Edit this ArticleEdit this Article
Edit this Article Quick Edit
Export to PDF
User Opinions (15 votes)
93% thumbs up 6% thumbs down
How would you rate this answer?
Helpful
Not helpful
CMS static blocks are used to create customized content in a Magento store.  In order to display a new CMS block, some code needs to be added to the stores custom layout.   This article will describe two processes for accomplishing this these tasks.

Define CMS Static Block

The first step is to create the necessary static blocks under CMS -> Static Blocks. 



Remember to write down the identifiers used when creating the static block.

Locate Template/Layout Files

Locating the template and layout files to update can be a bit tricky.  Enabling "Template Path Hints" is an efficient way to track these files down:

  • Navigate to System -> Configuration
  • Change 'Current Configuration Scope' to the store view
  • Under the Advanced section of the configuration menu, select Developer
  • Expand 'Developer Client Restrictions' and enter your IP address (this will insure that template path hints are not displayed to others)
  • Expand 'Debug' and set 'Template Path Hints' to Yes
  • Save Configuration
Viewing your store in another tab/browser will now show you which templates are used to render various sections of the page.  You'll want to note the full path to the template (phtml file).



Layout/Template files will be located in one or more of the following directory paths:
  • app/design/frontend/your_package/your_theme/template
  • app/design/frontend/your_package/your_theme/layout
  • app/design/frontend/your_theme/default/template
  • app/design/frontend/your_theme/default/layout
  • app/design/frontend/base/default/template
  • app/design/frontend/base/default/layout
Understanding Theme Fall-Back System

Prior to updating any template/layout files, it is important to understand how the template fall-back system works in Magento.

These articles are a good starting point:

http://www.magentocommerce.com/knowledge-base/entry/magentos-theme-hierarchy

http://code.tutsplus.com/articles/an-introduction-to-magento-design-terminology-and-concepts–cms-20644

When modifying the template (or layout file), we should consider whether the location of the file needs to change.  If the template to be modified is located in the default folder (e.g. app/design/frontend/your_package/default/template) for your theme or the base folder (e.g. app/design/frontend/base/default/template), you should first make a copy of the template and place it in your custom package/theme folder (e.g. app/design/frontend/your_package/your_theme/template). 

This is important for two reasons: 

1.  Insures the custom version of the template is rendered. 
2.  Prevents customizations from being overwritten by upgrades.

Modify Template/Layout Files

The next step is to add the necessary code in your templates to call these blocks.  The method used depends on the type of CMS block. 
  • CMS blocks which are to be displayed in multiple places throughout the site (i.e. on more than one template), we would use the XML method.
  • CMS blocks which are to be displayed in a specific location, we would likely use the template method (easier).

XML Method

The XML method requires updating the layout file (XML) and template file (phtml).
  1. Download the relevant XML and phtml files via FTP
  2. Prior to editing, make backup copies of each file (local or remote)
  3. In the XML file, locate the section where the block should appear and copy/paste the following code (change 'your_identifier' to the one associated with your CMS static block):

    <block type="cms/block" name="your_identifier" before="-">
          <action method="setBlockId"><block_id>your_identifier</block_id></action>
    </block>

  4. In the PHTML file, copy/Paste the code below in the desired location (change 'your_identifier' to the one associated with your CMS static block):

    <?php echo $this->getChildHtml('your_identifier'); ?>

  5. Upload the modified files via FTP (overwrite if applicable, otherwise set in proper location).
  6. Clear all caches

Template Method

The template method only requires updating the template file (phtml).
  1. Download the relevant phtml file via FTP
  2. Prior to editing, make a backup copy of the template (local or remote)
  3. Copy/Paste the code below in the desired location within the phtml file (change 'your_identifier' to the one associated with your CMS static block):

    <?php echo $this->getLayout()->createBlock('cms/block')->setBlockId('your_identifier')->toHtml() ?>

  4. Save the now customized phtml file and upload it via FTP (overwrite if applicable).
  5. Clear all caches

Important Notes

Paths are critical in Magento.  If a template was originally copied from 'app/design/frontend/base/default/template/customer/account/', then the modified version should be uploaded to 'app/design/frontend/your_package/your_theme/template/customer/account/'. 

Note that it may be necessary to create the required folder structure in your themes directory.

If templates are modified in 'app/design/frontend/base/default' or 'app/design/frontend/your_theme/default', they will be lost if/when either are upgraded.

Reference Materials

http://www.magentocommerce.com/knowledge-base/entry/magento-for-dev-part-4-magento-layouts-blocks-and-templates

http://code.tutsplus.com/tutorials/custom-layouts-and-templates-with-magento--cms-21419

http://info.magento.com/rs/magentocommerce/images/MagentoDesignGuide.pdf
Related Articles
No related articles were found.
Attachments
No attachments were found.

Powered by Interspire Knowledge Manager Knowledgebase Software