This is not slider. This is simple image rotator. Every refresh make image changed in page.
In admin panel add N static blocks (“CMS->Static Blocks->Add new block”)
For identifier field use something like this:
For each content use this:
Now when all is set, make new file called banner_rotator.phtml in “/app/design/frontend/YOUR_INTERFACE/YOUR_THEME/template/callouts/banner_rotator.phtml”
And use this code inside:
In order to show this block, you should be familiar with Magento layouts.
Since that is out of scope for this article, I’ll show you how to put it below the content on cms pages.
Open “/app/design/frontend/YOUR_INTERFACE/YOUR_THEME/layout/cms.xml”
[*] Put this line:
UPDATE:
If you want this to work for specific page such as homepage do this:
Instead of here /app/design/frontend/YOUR_INTERFACE/YOUR_THEME/layout/cms.xml
put this:
Everything else is the same…
In admin panel add N static blocks (“CMS->Static Blocks->Add new block”)
For identifier field use something like this:
SomeBannerIdentifierName_1 SomeBannerIdentifierName_2 SomeBannerIdentifierName_3 ... SomeBannerIdentifierName_N
For each content use this:
<a href="ADDRESS_YOU_WANT_TO_USE"><img src="{{skin url=images/media/IMAGE_YOU_WANT_TO_USE.jpg}}" alt="Some alt text" /></a>
Please note that you are not restricted only to images, you could
use text, video or whatever you want here, but I’ll focus on images
with links as title says. (you have to create folder "callouts")Now when all is set, make new file called banner_rotator.phtml in “/app/design/frontend/YOUR_INTERFACE/YOUR_THEME/template/callouts/banner_rotator.phtml”
And use this code inside:
<?php
echo $this->getLayout()->createBlock('cms/block')->setBlockId('SomeBannerIdentifierName_'.mt_rand(1, N))->toHtml()
?>
*Make sure you replace “N” with highest number of your static blockIn order to show this block, you should be familiar with Magento layouts.
Since that is out of scope for this article, I’ll show you how to put it below the content on cms pages.
Open “/app/design/frontend/YOUR_INTERFACE/YOUR_THEME/layout/cms.xml”
[*] Put this line:
<block type="core/template" name="home.banner.rotator" template="callouts/banner_rotator.phtml"/>
Find this:<cms_page> <reference name="content"> <block type="cms/page" name="cms_page"/> P U T [*] H E R E ! ! ! </reference> </cms_page>
Unfortunately I can’t be more specific so feel free to ask me anything.UPDATE:
If you want this to work for specific page such as homepage do this:
Instead of here /app/design/frontend/YOUR_INTERFACE/YOUR_THEME/layout/cms.xml
put this:
<reference code="content"> <block type="core/template" name="home.banner.rotator" template="callouts/banner_rotator.phtml"/> </reference>
or put this codeinto your Admin panel’s CMS->Pages->Your page->Design->Layout Update XML field{{block type="core/template" name="home.banner.rotator" template="callouts/banner_rotator.phtml"}}
Everything else is the same…
No comments:
Post a Comment