Magento – How to Change the Design for a Single CMS Page Content Heading

cmsdesign

I've been trying to set a custom design for a cms page, but I can't seem to figure out how to reference it. I just need to add a class to it, so I created a template as in the instructions here only I want to change the Content Heading, not the page header.

What block should I be referencing?

I tried this:

<reference name="content">
<block type="core/template" name="page_content_heading">
    <action method="setTemplate"><template>cms/headers/custom.phtml</template></action> 
</block> 
</reference>

But that also displayed my custom design at the bottom of the page

Best Answer

You already got it, "page_content_heading". You just need to reference it rather than adding it over again

<reference name="page_content_heading">
    <action method="setTemplate"><template>cms/headers/custom.phtml</template></action>
</reference>

On a similar topic, if you're literally just looking to add a class to the file, may I recommend using the original template file (copied to your theme of course) and adding the class conditionally.

Somewhere in your template file:

<?php if ($this->getData('added_class')): ?><?php echo $this->getData('added_class') ?><?php endif ?>

Then, you can add whatever class you want with a XML layout update:

<reference name="page_content_heading">
    <action method="setData"><key>added_class</key><val>YOUR_CLASS_NAME</val></action>
</reference>

That way you don't need to have a whole bunch of different .phtml files for the same purpose should you need to start adding different classes per CMS page.

On ANOTHER note... you could just add a class to the body tag without the need to customize any view script.

<reference name="root">
    <action method="addBodyClass"><class>YOU_CLASS_NAME</class></action>
</reference>

Then in your CSS file target the page header using the body class as well:

.YOUR_BODY_CLASS .page-title h1{/* style rules */}

Related Solutions

Magento – CMS XML Handles for Layout Updates

Why changing the root template doesn't work

Both

Mage_Cms_IndexController::indexAction()

and

Mage_Cms_IndexController::viewAction()

which are responsible for displaying the default homepage and a CMS page respectively call a helper:

Mage::helper('cms/page')->renderPage($this, $pageId)

If you jump into the helper (located at app/code/core/Mage/Cms/Helper/Page.php) and follow renderPage() to the protected method _renderPage() you'll see that Magento is checking two times for a root template (Magento CE 1.7.0.2):

if ($page->getRootTemplate()) {
    $handle = ($page->getCustomRootTemplate()
                && $page->getCustomRootTemplate() != 'empty'
                && $inRange) ? $page->getCustomRootTemplate() : $page->getRootTemplate();
    $action->getLayout()->helper('page/layout')->applyHandle($handle);     
}

and

if ($page->getRootTemplate()) {
    $action->getLayout()->helper('page/layout')
        ->applyTemplate($page->getRootTemplate());
}

Both calls happen after layout handles like "cms_page" and the like are processed, so you are out of luck here.

What you can do to change the root template

There is an event cms_page_render which you can use for adding your own XML layout handle on CMS pages. Create your own extension (I'll spare some details here) and configure the event observer in your config.xml:

<?xml version="1.0"?>
<config>
    <modules>
        <Emzee_Cms>
            <version>0.0.1</version>
        </Emzee_Cms>
    </modules>

    <global>
        <events>
            <cms_page_render>
                <observers>
                    <emzee_cms_page_render>
                        <class>emzee_cms/observer</class>
                        <method>cms_page_render</method>
                    </emzee_cms_page_render>
                </observers>
            </cms_page_render>
        </events>
        <models>
            <emzee_cms>
                <class>Emzee_Cms_Model</class>
            </emzee_cms>
        </models>
    </global>
</config>

Add your event observer:

<?php

class Emzee_Cms_Model_Observer
{
    public function cms_page_render(Varien_Event_Observer $observer)
    {
        $action = $observer->getEvent()->getControllerAction();

        $actionName = strtolower($action->getFullActionName());
        $action->getLayout()->getUpdate()
            ->addHandle($actionName . '_after');
        return $this;
    }
}

Finally, add your new layout XML handle (e.g. in your local.xml):

<?xml version="1.0"?>
<layout version="0.1.0">
    <cms_index_index_after>
        <reference name="root">
            <action method="setTemplate"><template>page/1column.phtml</template></action>
        </reference>
    </cms_index_index_after>
</layout>

You can use this method as well to add a cms_page_view_after handle or create page specific handles as cms_page_render passes the $page object to your observer.

Why you can't add a block to the 'reference left'

Are you sure that the template you're using has a left column? This question may sound silly but the default "2 columns with right bar" layout for example only offers a 'content' and a 'right' area. I can add blocks to the right column using cms_page without problems so this could be the problem.

In general, you can only easily add blocks to references and echo them if

the chosen root template uses the block you're referencing (see app/design/frontend/base/default/template/page/*.phtml) and
the block you're referencing either is of type core/text_list, calls $this->getChildhtml() without arguments or does something else to echo all child blocks.

Without further details, I can't tell you why your blocks are not echo'd in the left or right column.

Magento – Custom template for static blocks in CMS page

You cannot change the template for a static block because the static block does not have a template. Take a look at the method: Mage_Cms_Block_Block::_toHtml(). The _toHtml() method is used to render any block object, and in the case of the cms blocks it only renders the content of the block.

If you want to wrap the content of any cms block in some markup you can try this:

{{block type="core/template" template="custom/block.phtml" block_id="some_block_id"}}

And in the file custom/block.phtml do this:

<?php
$block = Mage::app()->getLayout()->createBlock('cms/block')->setBlockId($this->getBlockId()); //retrieve the cms block with the id set on this layout block
$html = $block->toHtml();//in this var you have the content of the cms block 
?>
<?php if ($html) : //this is needed to avoid additional markup if the cms block is empty?>
<div class="some-class">
    <div class="some-other-class">
        <?php echo $html;//actuall cms block?>
    </div>
</div>
<?php endif;?>

I hope this is what you needed.

Best Answer

Related Solutions

Magento – CMS XML Handles for Layout Updates

Magento – Custom template for static blocks in CMS page

Related Topic