If you want to customize or use dynamic information in any of your Magento content, you either need to use XML, PHP or Magento’s special code. Who can remember the syntax needed for all the little things you can do in Magento? Here’s my cheat sheet.
Magento’s CMS Code
Magento has a specialized way of dynamically adding in CMS Blocks, relative links, and dynamic product information. Here’s a rundown of the codes needed, with what you need to substitute in caps:
Add a CMS Block to Product Content or CMS Page
{{block type="cms/block" block_id="CMS-BLOCK-NAME"}}
Insert an image that’s located in your theme’s images folder
<img src="{{skin url='images/YOURIMAGE.jpg'}}">
Display Product Information using a .phtml file
If you have a specialized template to display product information, you can use this code to use the template:
{{block type="catalog/product" product_id="PRODUCTID" template="catalog/product/TEMPLATE-NAME.phtml"}}
PHP for .phtml Files
Magento’s .phtml files are the template files that work in conjunction with XML to generate all the content shown in your store.
Display a CMS block from within a .phtml file
<?php echo $this->getLayout()->createBlock('cms/block')->setBlockId('CMS-BLOCK-NAME')->toHtml(); ?>
Display an image from your theme’s images folder
<img src="<?php echo $this->getSkinUrl('images/IMAGE-NAME.jpg'); ?>">
XML for Layout Files and Design Updates
I had never worked with XML before Magento, but with my cheat sheet, I’m now able to put in and order CMS blocks within a sidebar, and remove blocks as well. With XML, you can also add stylesheets to specific pages or products, or even change a product’s template.
Add a block to a sidebar
The following code is to add a block to the right sidebar; to add the block to the left sidebar, just change the reference name from right to left:
<reference name="right"><block type="cms/block" name="CMS-BLOCK-NAME"> <action method="setBlockId"><block_id>CMS-BLOCK-NAME</block_id></action> </block></reference>
To position the block between or before other blocks, you’ll have to edit the block tag using the following methods:
Position the block as the very first block
<block type="cms/block" name="CMS-BLOCK-NAME" before="-">
Position the block directly before another block
<block type="cms/block" name="CMS-BLOCK-NAME" before="BLOCK-NAME-2">
Position the block directly after another block
<block type="cms/block" name="CMS-BLOCK-NAME" after="BLOCK-NAME-1">
Technically, you’re supposed to be able to use after=”-“ to position a block as the very last block, but I have never gotten it to work.
Set the Robots Meta tag as NOINDEX,NOFOLLOW
<reference name="head"> <action method="setRobots"><value>NOINDEX,NOFOLLOW</value><name>robots</name></action> </reference>
Apply a CSS class to the HTML body
<reference name="root"><action method="addBodyClass"><className>CUSTOM-CSS-CLASS</className></action></reference>
Remove or “Unset” an XML block
<action method="unsetChild"><name>NAME-OF-XML-BLOCK</name></action>
Use XML to define and insert a linked image
You know the “Back to School” sale banner that Magento automatically adds to your site when you first start? Yeah, that’s this code (if right_col.phtml doesn’t work, try left_col.phtml):
<reference name="right"> <block type="core/template" name="YOUR-BLOCK-NAME" template="callouts/right_col.phtml"> <action method="setImgSrc"><src>images/YOUR-IMAGE-NAME.jpg</src></action> <action method="setImgAlt" translate="alt" module="catalog"><alt>SET YOUR ALT TEXT</alt></action> <action method="setLinkUrl"><url>SET YOUR URL</url></action> </block> </reference>
Add in a stylesheet to a specific page or product
<reference name="head"> <action method="addItem"><type>skin_css</type><name>css/STYLESHEET-NAME.css</name><params/></action> </reference>
Apply a different template to a product
Duplicate and edit your default catalog/product/view.phtml template to suit your needs (renaming your new template as you go), and put this code in the Design Update for your particular product:
<reference name="product.info"> <action method="setTemplate"> <template>catalog/product/NEW-TEMPLATE-NAME.phtml</template></action> </reference>
That’s it!
Those are all the code snippets I like to keep handy whenever I’m working on Magento. Do you have any Magento code that you use often or need a cheat sheet for?