Joomla 1.6 Beez20 Template – How to Make Logo Clickable

by Elaine on May 25, 2011

Joomla 1.6 help – There was a question regarding the Beez_20 Joomla template in my comments. The question was – How to make the Beez_20 logo clickable? How to change the logo to a link so it when clicked will always return to my homepage?

Below I will step you through how to make that change.

1. Login to your FTP manager or backend cpanel and access your file manager.

2. Go to your template directory and edit your index.php file. For example:

/home/myrootdir/public_html/joomla163/templates/Beez_20/index.php

3. Find the Beez20 logo and a link to your homepage. For example I want to create a link to my cmsmind.com

Find this code:

<img src=”<?php echo $this->baseurl ?>/<?php echo htmlspecialchars($logo); ?>” alt=”<?php echo htmlspecialchars($templateparams->get(‘sitetitle’));?>” />

Add the code in red: (slight modification-thanks sean for the update)

<a href=”http://www.cmsmind.com”><img src=”<?php echo $this->baseurl ?>/<?php echo htmlspecialchars($logo); ?>” alt=”<?php echo htmlspecialchars($templateparams-> get(‘sitetitle’));?>” style=”border: none;” /> </a>

Save your file and refresh your Joomla website. When you hover your mouse over your logo you should see your website link in the status bar. When you click on the logo, it should link you back to your homepage.

Hope that helped!

Elaine@cmsmind.com

Elaine

Elaine is the founder of CmsMind, an online blog providing Joomla and Wordpress tutorials. Elaine lives in Toronto and when she is not online, she is either Marathon and Triathlon training or travelling and racing somewhere in the world. Find her also at: Save Money, Premium Themes and Templates, and at Webhosting Tips.

More Posts - Website

Related Wordpress and Joomla Help:

Tagged as: Beez 20 Template, Beez20, Joomla 1.6

{ 13 comments… read them below or add one }

Sean May 25, 2011 at 10:31 pm

Thank you Elaine for all of your help!!! Worked like a charm!!! I now have a logo that’s able to be clicked and take you back to the homepage

*** style=”border: none;” can you modify the html text in your post to that( there is a space between the border: and none), otherwise you will still get the border (quick google search led me to that solution cause I was still showing the border)*

Elaine May 25, 2011 at 11:23 pm: Hi Sean,
Thanks for the update. I revised my code above. I’m glad it worked for you!
thanks for your visit,
elaine
Reply

Sergey June 2, 2011 at 9:52 am

Elaine, could you help me to make not logo, but header clickable? Because of I placed my logo in header.jpg.

The path:
..\templates\beez_20\images\nature\header.jpg

Defined in ..\templates\beez_20\cssnature.css

#header
{
background:#185359 url(../images/nature/header.png) bottom left no-repeat;
position:relative
}

Elaine June 2, 2011 at 12:43 pm

Hi Sergey,

I’m creating a post to respond to your comment. Essentially, I would just replace the logo image with your header image. You don’t really need both. The header is a background image and can’t be linkable. It’s like the background image/color on a normal website (in my case I have a white background with no image). After you replace your logo image with your header image you can follow the steps above. Also make sure the filenames are the same.

Thanks for your visit,
elaine

Sergey June 2, 2011 at 1:31 pm

Exactly!
Thank you very much, Elaine!
I made the logo.png with transparency, but its size was too big. Then I pasted logo into my backgroud, without transparency. to achieve the smaller size. But I didn`t guess that new header can be used as logo)

Thanks for your site and quick answer!

Elaine June 2, 2011 at 2:02 pm: Hi Sergey,
No problem! glad it worked for you.
elaine
Reply

Asger August 3, 2011 at 11:29 am

It worked perfectly for me (using Joomla 1.7).
Thanks =)

Elaine August 5, 2011 at 10:46 am: Hi Asger,
That’s great! No problem.
Thanks for your visit,
elaine
Reply

Charles August 16, 2011 at 12:57 pm

Hi Elaine,
Thank you for your great article – would you be kind enough to help me please? – I’ve tried

<a href=”baseurl ?>”><img src="baseurl ?>/” />

When you click on the logo, it repeat the url twice for example: “http://localhost/WIP/demo3/WIP/demo3″

Many Thanks for your Help and kind Regards

Charles

Elaine August 16, 2011 at 11:22 pm: Hi Charles,
Try to do it without the quotes in the link…ie:
<a href=baseurl ?>><img src="baseurl ?>”>
Hope that helps. Thanks for your visit,
elaine
Reply

Maciej February 13, 2012 at 3:19 pm

Hi! I’ve got problem with beez20 too. I would be really happy, if you can help me with it. My problem is:
How can i change all background images? How you can see on this picture: I can’t fill others fields with my image, because I can’t find it And can you give me an advice how to change buttons color too? Bacause white color looks bad with mine web colors. Hope, you will can help me, Maciej

Andrew March 6, 2013 at 1:50 pm

Hi,

I am trying to click on and it would go back to homepage. How do I do that? Because i cant find below link in the index.php file, using joomla 2.5.8 :

<img src=”baseurl ?>/” alt=” get(‘sitetitle’));?>” style=”border: none;” />

Please kindly advise.

Thanks,
Andrew

——————————————————————————————————————-

Elaine March 6, 2013 at 2:18 pm: Hi Andrew,
just wrap the <img src> code in <a href> code
<a href=”linktoyoursite”> <img src = ……></a>
Hope that helps,
elaine
Reply

Leave a Comment

Older Post: eBay Template – Cost to Create an Auction Site like eBay

Newer Post: Joomla 1.6 Help – Remove word “Articles” from Heading