Magento Forum - UK Magento Forum (Unofficial)

An unofficial but dedicated Magento Forum for Magento Users, Designers and Developers

Adding a callout or static block

A forum for Magento users to discuss tips, issues etc with regards to actually using the Magento front and back end systems.

Adding a callout or static block

Postby Mark » Sat Sep 19, 2009 11:00 pm

Hello all,

Really good idea having this forum for UK users mainly.


What i am trying to do is either add a callout or create a static block, however i am finding it difficult to get it to be displayed.

I am editing catalog.xml.

I see that if i use this:

Code: Select all
        <reference name="left">
            <block type="core/template" name="left.permanent.callout" before="-" template="callouts/left_col.phtml">
                <action method="setImgSrc"><src>images/media/col_left_callout.jpg</src></action>               
            </block>
            <block type="wishlist/customer_sidebar" name="wishlist_sidebar" as="wishlist" after="cart_sidebar" template="wishlist/sidebar.phtml"/>           
        </reference>


and i copy it just under it, but change the image, it will then display the same image twice for some reason, even although i've changed the <src> part?

Any help would be greatly appreciated.

Thanks in advance!
Mark
 
Posts: 65
Joined: Sat Sep 19, 2009 10:53 pm
Location: UK

Re: Adding a callout or static block

Postby Mark » Sat Sep 19, 2009 11:42 pm

My bad, sorted it now.

For anyone else wanting to know, this is what i did.

This is the first part in catalog.xml in /app/design/frontend/default/{your_theme}/layout:

Code: Select all
<!--
Default layout, loads most of the pages
-->

    <default>
        <!-- Mage_Catalog -->
        <reference name="top.menu">
            <block type="catalog/navigation" name="catalog.topnav" template="catalog/navigation/top.phtml"/>
        </reference>
        <reference name="left">
            <block type="core/template" name="left.permanent.callout" before="-" template="callouts/left_col.phtml">
                <action method="setImgSrc"><src>images/media/col_left_callout.jpg</src></action>               
            </block>
            <block type="wishlist/customer_sidebar" name="wishlist_sidebar" as="wishlist" after="cart_sidebar" template="wishlist/sidebar.phtml"/>           
        </reference>
        <reference name="right">
            <block type="core/template" name="right.permanent.callout" after="-" template="callouts/left_col.phtml">
                <action method="setImgSrc"><src>images/media/col_right_callout.jpg</src></action>
                <action method="setImgAlt" translate="alt" module="catalog"><alt>Delivery</alt></action>
            </block>
         <block type="core/template" after="wishlist" name="catalog.compare.sidebar" template="catalog/product/compare/sidebar.phtml"/>
        </reference>
      
        <reference name="footer_links">
            <action method="addLink" translate="label title" module="catalog" ifconfig="catalog/seo/site_map"><label>Site Map</label><url helper="catalog/map/getCategoryUrl" /><title>Site Map</title></action>
        </reference>
    </default>


<!--
Category default layout
-->


and this is what i added first of all to create a static block:

Code: Select all
<!--
Default layout, loads most of the pages
-->

    <default>
        <!-- Mage_Catalog -->
        <reference name="top.menu">
            <block type="catalog/navigation" name="catalog.topnav" template="catalog/navigation/top.phtml"/>
        </reference>
        <reference name="left">
            <block type="core/template" name="left.permanent.callout" before="-" template="callouts/left_col.phtml">
                <action method="setImgSrc"><src>images/media/col_left_callout.jpg</src></action>               
            </block>
            <block type="wishlist/customer_sidebar" name="wishlist_sidebar" as="wishlist" after="cart_sidebar" template="wishlist/sidebar.phtml"/>           
        </reference>
        <reference name="right">
            <block type="core/template" name="right.permanent.callout" after="-" template="callouts/left_col.phtml">
                <action method="setImgSrc"><src>images/media/col_right_callout.jpg</src></action>
                <action method="setImgAlt" translate="alt" module="catalog"><alt>Delivery</alt></action>
            </block>
         <block type="core/template" after="wishlist" name="catalog.compare.sidebar" template="catalog/product/compare/sidebar.phtml"/>
        </reference>      
      
      
      <!--EDITS-->


  <reference name="right">
<block type="cms/block" name="right.permanent.callout ">
<action method="setBlockId"><block_id>right_column_block</block_id></action>
</block>
</reference>

      <!--END EDITS-->


      
        <reference name="footer_links">
            <action method="addLink" translate="label title" module="catalog" ifconfig="catalog/seo/site_map"><label>Site Map</label><url helper="catalog/map/getCategoryUrl" /><title>Site Map</title></action>
        </reference>
    </default>


<!--
Category default layout
-->



Then you need to go to your Magento backend, go to CMS>Static Blocks>Add New Block.

You need to ensure that the identifier matches what you put in the catalog.xml file, in this case it was:

right_column_block

Then to add to the Content field:

<a href=""><img src="http://www.{your_URL}/skin/frontend/default/{your_theme}/images/media/{your_image_name}" width="240" class="callout" alt="" /> </a>


(make sure you have named the image you want to callout and placed it into the skin/frontend/default/{your_theme}/images/media/ directory, also remember the img tag)

Also make sure you enable the static block.
Refresh or disable cache.
Re-fresh the relevant page to view the results.


This is what i wanted to achieve, not bad for a Magento n00b.
Image

Hope its useful to someone.
Mark
 
Posts: 65
Joined: Sat Sep 19, 2009 10:53 pm
Location: UK

Re: Adding a callout or static block

Postby stacks » Sun Sep 20, 2009 5:07 pm

Whats your website URL? I think this is something like what I want to do but just want to check your site out to make sure I'm understanding what your saying here.
stacks
 
Posts: 36
Joined: Sat Sep 12, 2009 12:34 pm

Re: Adding a callout or static block

Postby edmondscommerce » Mon Sep 21, 2009 8:44 am

welcome to the forum and thanks for posting the question and the solution :)
User avatar
edmondscommerce
 
Posts: 1157
Joined: Fri Sep 11, 2009 8:55 am
Location: UK

Re: Adding a callout or static block

Postby stacks » Wed Oct 14, 2009 7:49 am

I've followed these instructions and it works a treat!

One further step that I'd like explained is how to adapt this so that the image can be clickable and it will take you to a URL of your choice.

e.g a Free delivery image will take you to the Delivery information page.

Anyone help?
stacks
 
Posts: 36
Joined: Sat Sep 12, 2009 12:34 pm

Re: Adding a callout or static block

Postby stacks » Wed Oct 14, 2009 10:34 am

One other thing...

Following the instructions I manged to get one static block displayed but if I repeat the process to add a 2nd & 3rd block all the images are the same.

This is what the section of code looks like:
Code: Select all
        <reference name="right">
            <block type="core/template" before="cart_sidebar" name="catalog.compare.sidebar" template="catalog/product/compare/sidebar.phtml"/>
            <block type="core/template" name="right.permanent.callout" template="callouts/right_col.phtml"/>
        </reference>

   <reference name="right">
       <block type="cms/block" name="right.permanent.callout ">
           <action method="setBlockId"><block_id>right_sale</block_id></action>
       </block>
   </reference>

   <reference name="right">
       <block type="cms/block" name="right.permanent.callout ">
           <action method="setBlockId"><block_id>right_pricepromise</block_id></action>
       </block>
   </reference>

   <reference name="right">
       <block type="cms/block" name="right.permanent.callout ">
           <action method="setBlockId"><block_id>right_column_block</block_id></action>
       </block>
   </reference>

        <reference name="footer_links">
            <action method="addLink" translate="label title" module="catalog" ifconfig="catalog/seo/site_map"><label>Site Map</label><url helper="catalog/map/getCategoryUrl" /><title>Site Map</title></action>
        </reference>

    </default>



and it's always the last block that gets displayed 3 times.

Where have I gone wrong?
Last edited by magentoforum_admin on Sat Oct 17, 2009 8:54 am, edited 1 time in total.
Reason: please use [code] [/code] tags
stacks
 
Posts: 36
Joined: Sat Sep 12, 2009 12:34 pm

Re: Adding a callout or static block

Postby zam » Sat Oct 17, 2009 7:12 am

Firstly ... thanks for this post. It helped me in getting my first callout there. For the additional callouts I was facing the similar problem. But all you need to do is change the name of the blocks:

<block type="cms/block" name="right.permanent.callout ">

Name your subsequent blocks "right.permanent.callout02", "right.permanent.callout03" and so on. It should work. With the same name ... it refers to the same block ... thus the repetitions.

And regarding setting up the URLs and Alt text for each callout observe the below sample code:
Code: Select all
<reference name="right">
  <block type="core/template" name="right.callout1" template="callouts/left_col.phtml" before="-">
    <action method="setImgSrc"><src>images/media/callout_side1.jpg</src></action>
    <action method="setImgAlt" translate="alt" module="catalog"><alt>Call Us Toll Free. (555) 555-555</alt></action>
    <action method="setLinkUrl"><url>checkout/cart</url></action>
  </block>
  <block type="core/template" name="right.callout2" template="callouts/left_col.phtml" after="right.callout1">
    <action method="setImgSrc"><src>images/media/callout_side2.jpg</src></action>
    <action method="setImgAlt" translate="alt" module="catalog"><alt>Free domestic shippings</alt></action>
    <action method="setLinkUrl"><url>checkout/cart</url></action>
  </block>
</reference>

The code is from the "Absolute Magento Theme".
Last edited by magentoforum_admin on Sat Oct 17, 2009 8:55 am, edited 1 time in total.
Reason: please use [code] [/code] tags
zam
 
Posts: 1
Joined: Sat Oct 17, 2009 6:59 am


Return to Magento Users

cron