Moving / Removing Callouts on the left / right columns
Posted on 03. Sep, 2008 by Fido in Design, Magento
I recently answered a question on the magento forums about how to remove the callout images in the right / left columns.
This is a pretty easy task, but finding them required a small bit of digging (as usual).
My first recommendation when trying to find any thing in the front end is to turn on Template Path hints in the admin section
- Admin > System > Configuration
- Switch your “Current Configuration Scope” to your store (’Main Website’ on a stock build)
- Click on the Developer Tab (bottom left) and find the Debug area
- Template Path Hints: Yes (also might want to add Block Names to hints)
You will find that the template files (phtml files) which include the html for the callouts are located at:
app/design/frontend/*/*/template/callouts/right_col.phtml
app/design/frontend/*/*/template/callouts/left_col.phtml
You will also find that the block is being added onto your Magento install via catalog.xml
app/design/frontend/*/*/layout/catalog.xml
For the right column:
<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>
to
<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"/>--> <!-- or delete this line altogether --> </reference>
You can do the same for the left callouts (the dog with the laptop)




50 Comments
Ben
04. Sep, 2008
I’m just getting started – so these hints, tip and tricks are great – keep up the good work !
Ben
justin
08. Sep, 2008
got lost at “Click on the Developer Tab (bottom left)”
I did this but only see options for
developer client restrictions
debug
translate inline
log settings
and i suppose to edit the phtml files physically?
Fido
08. Sep, 2008
You need to do step 2: “Switch your “Current Configuration Scope” to your store”
This is an option on the top left.
Changing it to ‘Main Website’ will add the Template Path hints in the Debug area (where the template path hints resides)
You can edit the PHTML files directly, but I suggest moving them (and their file structure) to your own theme so you have a stock template to fall back on.
Say you want to edit:
app/design/frontend/default/default/Catalog/Product/New.phtml
Copy New.phtml, and move it here to edit:
app/design/frontend/default/mytheme/Catalog/Product/New.phtml
You’ll need to activate “mytheme” in the admin area in order to see your changes.
ohmmega
15. Dec, 2008
Hello fido,
I tested your tuto to remove both left and right pictures from category page but even if i commented phtml code, there are always displayed …
I correctly put Template Path Hints to Yes in configuration of Main web site. I cleared my cache. I directly edited phtml code.
What should i do ? i miss a step ?
ohmmega
15. Dec, 2008
I resolved my problem
Fido
15. Dec, 2008
Hi ohmmega – How exactly did you resolve your problem? It may help future visitors!
ohmmega
18. Dec, 2008
I just forgot to clear all my cache in the admin backend:
System -> cache management -> on the form “cache control” -> field “All Cache” i just selected “desactivate” and then saved it. After that i rechecked all the check list and just saved the page again.
crakmonkey
29. Dec, 2008
hi fido. your tips are really helpful.
after removing the right call out box, i inserted the code to remove the left call out box, but for some reason i keep getting an error message.
since the right and left call out codes were different im confused as to where to insert the “” code. ive been at this for hours its driving me nuts.
Ashley Bailey
08. Jan, 2009
Thank you very much for these hints!
Ashley Bailey
08. Jan, 2009
Thank you very much for your tips!
How do you change the link that the callout is going to? By default the left callout is going to the checkout screen instead of customer service, which I think is odd. I’d like to change it but don’t know how to. Thank you very much for your time.
~Ashley Bailey
Ashley Bailey
08. Jan, 2009
Never mind….I made the appropriate change from your instructions, I just wasn’t seeing it because I needed to clear my cache.
Prashant
20. Jan, 2009
Hi,
I want to edit the “Recently Viewed Product” section which is displayed in the right side bar, after viewing some of the products. I want to do some modification in this section, but I don’t know where the files related to this section are located in magento.
Please tell me where the files related to “Recently Viewed Products” are located.
Thanks,
Prashant
Tash
16. Feb, 2009
Hi Prashant
You will have to switch on template hints as Fido has already explained, in order to see the path.
Tash
Guy
10. Mar, 2009
How did you know that
You will also find that the block is being added onto your Magento install via catalog.xml
app/design/frontend/*/*/layout/catalog.xml
I sure i missed something basic
Thanks,
Guy
Fido
13. Mar, 2009
Catalog.xml is a very highly used layout (2nd probably only to page.xml). We just happen to dig through it all the time.
A better answer is this: We see the callouts when we are viewing the catalog (the categories, product lists, products, etc) and so its logical to look in the catalog.xml to see if there are references to the callouts there.
Frank D.
20. Mar, 2009
Perfect! Many thanks.
shahriat
26. Mar, 2009
Could u tell me why callouts is named here?
Swan TBS
28. May, 2009
Hi
Great help…….
Joe
30. May, 2009
Hello
Thanks for this website! And to Magento too!
Joe
Jeremy
13. Jun, 2009
Hello Fido, I went into the files just to remove the alt text. I then download the two images and changes to them and uploaded them back. I then cleared my cache in the cache management, next to “All Cache” I put “Refresh” I then saved but it still shows up with the old images, can you please help?
Chloee
09. Jul, 2009
Hi Fido,
Thanks for the tips! I’m glad someone’s out there to figure this stuff out for us.
I’m using a customized Magento template, and I really like the ‘leave a reply’ comment script you’re using on this website, how do I find this script and will it be hard to implement into my website?
ashvindx
14. Jul, 2009
It’s named in order to allow positioning that block above or another block, via the ‘before’ and ‘after’ attributes.
Anyone knows how to add callouts that can be managed from the admin?
Bernal Aguilar
17. Jul, 2009
After I fixed the callout I turned off the path hints but navigation/top and footer paths are still there. How can I remove all of the hints?
Fido
17. Jul, 2009
I would try clearing your cache in the admin area. They should definitely not be showing up anymore. If that doesn’t work, you can manually delete the cache files.
Micah
30. Jul, 2009
awesome explanations
Name
03. Aug, 2009
its good but i am looking for pagination in magento can u help me
LIz Lee
07. Aug, 2009
Hey Fido,
Interesting, I’m trying to put the cart_sidebar block underneath the right.permanent.callout block, but this is not working.
Doing the commenting out thing did work, so I know I’m on the right page, and I cleared my cache, so that shouldn’t be the issue.
Here’s my code… any ideas?
Liz Lee
07. Aug, 2009
Nm, I figured it out. I had an extra “before=” in there. Oops.
Dman
01. Sep, 2009
Hi Fido, I’m working on the left column banner. All I need to do is update the link and alt text for the banner. I had already found the files you outlined in your post, but thanks for verifying that I’m correct!
Here’s my question/concern. I’ve updated the existing alt text and banner URL/link in my app/design/frontend/*/*/layout/catalog.xml document. But, once this is modified, and then posted back to the server, there is still no change in the behavior of the banner. (Same ‘old’ alt tag, and bad ‘original’ link). I’ve cleared my browser cache, etc. but not luck.
Is there something I’m missing?!?
Thanks in advance!!!
Dan
26. Sep, 2009
Brilliant, thanks for sharing these little gems, really helpful!
PLR MART
05. Oct, 2009
Hi Fido,
Thanks for your help. I made changes to my site and now the left sidebar images gone. But i am able to see lot of white space bellow the footer(in firefox). Can you please help me why this is happening please.
site: http://www.theplrmart.com
Thanks in advance.
Regards
Venkat
Ryan
16. Jan, 2010
HI,
can i set a callouts right side in 3 column pages but not in 2 columns with right bar .
i set callouts in right side but display in both page in right side, i want keep it in 3 columns and remove in 2 columns with right bars.
any help?
Thanks
Gisely
05. Feb, 2010
Thank you very much! @Fido and @ohmmega
Robert
06. Feb, 2010
Does upgrading Magento remove any changes you have made to the catalog.xml file?
Fido
06. Feb, 2010
If you are editing the core template, than upgrading will most likely ( not 100% sure) overwrite your changes. It’s best to make new templates which override the core template.
Guillaume BRETOU
19. Mar, 2010
Hi,
You can also use the remove tag in the XML.
For example, if you want to remove the callout block from the left, just add to your custom xml file :
…
…
ching
18. Apr, 2010
how to get rid of the block hints on the top of the page:
http://www.metrosourceline.com
I have tried, but the blocks left up there.
1. Admin > System > Configuration
2. Switch your “Current Configuration Scope” to your store (’Main Website’ on a stock build)
3. Click on the Developer Tab (bottom left) and find the Debug area
4. Template Path Hints: NO (also NO to add Block Names to hints)
Thank you,
Ching
ching
18. Apr, 2010
Aha… the problem was solved! the block hints on the top were gone “automatically”… not sure why… maybe cache.
happy now
Ching
Name
24. Apr, 2010
I’m using the “modern” theme and there is no
app/design/frontend/*/*/template/callouts/left_col.phtml file.
There isn’t even the callouts folder.
I’ve tried to edit the catalog.xml file with no luck either.
Does anybody know which file I need to edit in order to get rid
of the callouts on the left side?
Hahnefeld
28. Apr, 2010
I want to use col_left_callout.jpg, but in change with another one. Is there an extension for randomizing?
aparna
02. Jul, 2010
@Fido, I need to move the compare products to show up in the footer, changing the reference name to footer in catalog.xml and report.xml is not helping..
SJ
23. Jul, 2010
Worked exactly as described, thanks for the share
Welanie
31. Aug, 2010
HI,
Im new to magento. Please help me.
I did what you said, I see the red markers on the front-end. But how do I edit…Isnt there an editor on magento that I can use to edit files. Also, when I turn it back OFF, the red markers are still there.
Thank you
Welanie
31. Aug, 2010
Alright, I found how to get rid of the hints by deleting the cache. Still need help to find how I can edit the file.
I tried finding the file and transfer it to my editor but I cant even find the damm files on my ftp event thow my debugger tells me it existes.
Men…cant wait to be comfortable with this software…
Thanks for helping me if you can.
ronaldo
09. Sep, 2010
thank you very much!!!!
Peter
11. Sep, 2010
You can also remove this using a local.xml file so you can upgrade Magento base files without a problem:
Enrique
07. Nov, 2010
I don´t understand nothing. Why you want to see the names of the blocks if if the file right_col.phtml doesn contain the boick itself?
I need to remove or edit the original back to school graphoc and replace it with one that really work on my web site and I can´t find anything to help me to solve it.
I hope some day somebody creates a step by step tutorial on how to change this things.
Marco
04. Dec, 2010
Hi Fido,
Thanks for a great tutorial! I got almost everything working. I only got one problem that I can’t seem to correct.
I made a table (3 rows 1 col.) In each row I specified one of the payement methods we accept by using the code snippets I got from the providers websites.
They all show up… But 2 of them get streched to the width and height of the biggest image.
If I edit the file in Dreamweaver, or use the included editor, the preview shows the images with their right dimensions. With whitespace in the tables. What am I missing?
Marco
04. Dec, 2010
P.S. The file I use and edit in the post above is the right_col.phtml
Mark
21. Dec, 2010
Hi there,
I know this is an old post, but still relevant just now for me
Can you tell me how to move Shop By/Shopping Options/Navigation section to the top of the left column, before the likes of the tags callout and newsletter callout?
I noticed that it automatically does this when the categories are not anchor categories, but if they are, it shifts the shopping options down the left column…
Any help would be greatly appreciated!
Thanks
Leave a reply