By Darin on October 3, 2012
Create a featured slider that uses a Static Block for each slide. I’m writing this with jQuery and the Cycle plugin in mind. But it could be adapted for other slider plugins.
Create a Home Template
Refer to this post on how to create a new template that will be used by the home page.
Create the Slider
Paste the following into your template (\app\design\frontend\your_package\your_theme\template\page\home.phtml):
Option 1
<div id="featured-slider">
<div class="slides">
<?php
$numOfSlides = 6;
for ($x = 1; $x <= $numOfSlides; $x++) {
if(Mage::getModel('cms/block')->load('featured_slide_' . $x)->getIsActive()) {
echo '<div class="slide">';
echo $this->getLayout()->createBlock('cms/block')->setBlockId('featured_slide_' . $x)->toHtml();
echo '</div>';
}
}
?>
</div>
<div class="nav"></div>
</div>
Change the numOfSlides variable for the number of slides you will have.
Option 2
With this one you don’t have to specify the number of slides there will be, but if a Static Block is deleted, no slides after that point will be loaded.
<div id="featured-slider">
<div class="slides">
<?php
$x = 1;
$mage = Mage::getModel('cms/block')->load('featured_slide_' . $x);
while(intVal($mage->getBlockId()) != 0) {
if($mage->getIsActive()) {
echo '<div class="slide">';
echo $this->getLayout()->createBlock('cms/block')->setBlockId('featured_slide_' . $x)->toHtml();
echo '</div>';
}
$x++;
$mage = Mage::getModel('cms/block')->load('featured_slide_' . $x);
}
?>
</div>
<div class="nav"></div>
</div>
Create the Slides
In the Admin, create a Static Block with the following settings:
Block Title: Featured Slide – 1
Identifier: featured_slide_1
Status: Enabled
Content: Use Magento’s built-in Media Storage feature to upload and insert your slide image.
Create a new Static Block for each slide in your slider, incrementing the numbers as you go.
Using the Slider
To remove a slide or hide unused slides, just set its Static Block’s status to “Disabled”.
Reordering slides isn’t as simple.
– You could just recreate the content in each block so that they are displayed in the right order.
– You could copy and paste the html from one block into another.
– You could rename all the Static Blocks with a higher number: featured_slide_23, featured_slide_24, featured_slide_25… then update the numbers in the order you now want the blocks to appear: featured_slide_1, featured_slide_2, featured_slide_3…
Styling Tip
The Static Block WYSYWYG will wrap your image in a “p” tag, so remember to remove any margins and padding from paragraphs in the slider.
Posted in Magento | Tagged featured slider, Magento, static block |
By Darin on May 14, 2012
To your local.xml file (which you should be using rather than editing individual xml files), add:
<layout>
<contacts_index_index><!-- the page to be edited, found in its original xml file -->
<reference name="content"><!-- Structural Block where placing Static Block -->
<block type="cms/block" name="your_block_identifier">
<action method="setBlockId"><block_id>your_block_identifier</block_id></action>
</block>
</reference>
</contacts_index_index>
</layout>
If you already have an existing local.xml, you won’t need to include <layout>. If the page you want to edit already has existing changes in local.xml, you only to add the <reference> bit and its contents.
Posted in Code, Ecom, Magento | Tagged Magento, non-cms page, static block |
By Darin on February 14, 2012
When editing a CMS page, go to the “Design” tab and add the following to “Layout Update XML”
<reference name="right">
<block type="cms/block" name="your_block_identifier" before="-">
<action method="setBlockId"><block_id>your_block_identifier</block_id></action>
</block>
</reference>
Remember to replace “your_block_identifier” with your own block. Also the reference name can be changed to display it in the “left” column or “content”.
“before” will put the block before everything in the structural element. That can be changed to “after” to put it after everything. If you know the “name” attribute of the other blocks, you can set your block before or after it like so: before=”cart_sidebar”
Posted in Code, Ecom | Tagged cms, Magento, static block |
By Darin on February 14, 2012
To a template page (1column.phtml, 2columns-left.phtml, columns-right.phtml, etc.) add:
<?php echo $this->getLayout()->createBlock('cms/block')->setBlockId('your_block_identifier')->toHtml() ?>
Posted in Code, Ecom, PHP | Tagged Magento, static block, template |
Recent Comments