Blog Design

May 3, 2009

How to Add your own Logo in Thesis Theme?


Ok, this is the post many users had asked for. Thesis, as we know, is one of the most wonderful themes around. But putting your own logo in the header is a bit tricky. You may find some tutorials for it, but they are all messy and would require a lot of programming knowledge. I will tell you how to achieve this easily.

Actually, there are two ways to do this. The first one is simple, but it won’t make the logo clickable. The idea is to put the logo as a background to the blog name value, so it can’t be linked to anywhere. The second one is less simpler (remember, I didn’t say difficult ;) ) ,which overcomes this problem and I personally recommend it. Read on for both options.

Method #1 -

Go to your blog’s /wp-content/themes/thesis/lib/css/header.php file and locate #header #logo .

When you find it, just add these three lines into the class -

background-image:url('path_to_your_logo');

background-repeat:no-repeat;

height: height_of_your_logo

That’s it! Your logo should show up by now!

Method #2 -

Open /wp-content/themes/thesis/lib/functions/document.php and search for <p id="logo"><a href="<?php bloginfo('url'); ?>"></a></p> and give your image url in place of the blog name. So it looks like this-

<h1 id="logo"><a href="<?php bloginfo('url'); ?>"><img src="path_to_your_logo" /></a></h1>

Do the same for <p id="logo"></p>so it looks like this -

<p id="logo"><a href="<?php bloginfo('url'); ?>"><img src="path_to_your_logo" /></a></p>

That’s it! You’re done! You’ve just learnt the easiest way to put your logo in thesis theme. Let me know if it didn’t work, I’d love to see your thesis blogs. Send your Thesis related queries here, we will try to solve them.

Update: New method to add clickable logo in Thesis theme header.

Put following code in your custom.css file.

.custom #logo {background-image: url('images/logo.jpg'); background-repeat: no-repeat; width: 331px; height: 71px; text-indent: -9999px; }
.custom #logo a {width: 331px; height: 71px; display: block; outline: none;}

Note – Change height & width values according to your logo size.







35 Comments


  1. Thanks for useful info.. Though I find it much easier to edit my custom.css and custom functions.css to make any changes.


  2. Have you purchased thesis theme? I heard a lot about this theme.

    Is 87$ not costly?


  3. Thesis Open hook plugin is the best and easiest way to customize the thesis theme.


  4. Cool tip… You can come up with similar tutorials as and when you explore THESIS theme.


  5. Thanks for useful info.. Though I find it much easier to edit my custom.css and custom functions.css to make any changes.


  6. Have you purchased thesis theme? I heard a lot about this theme.

    Is 87$ not costly?


  7. Thesis Open hook plugin is the best and easiest way to customize the thesis theme.


  8. Cool tip… You can come up with similar tutorials as and when you explore THESIS theme.


  9. Another thought. The method which you explained is effective but will create problem , when you will upgrade your Thesis…
    It’s better to make changes using your custom function. I find this code on Internet

    /* Custom Header Image */
    function add_header_image () {
    echo “

    “;
    }
    add_action(‘thesis_hook_after_title’, ‘add_header_image’);


    • Both the methods will create problem when we want to upgrade the Thesis theme. During this process, Thesis will put custom_sample folder instead of custom in theme’s folder.

      But your method is also good, I’ll try it later on.


  10. Another thought. The method which you explained is effective but will create problem , when you will upgrade your Thesis…

    It's better to make changes using your custom function. I find this code on Internet

    /* Custom Header Image */

    function add_header_image () {

    echo "

    ";

    }

    add_action('thesis_hook_after_title', 'add_header_image');


    • Both the methods will create problem when we want to upgrade the Thesis theme. During this process, Thesis will put custom_sample folder instead of custom in theme's folder.

      But your method is also good, I'll try it later on.


  11. [...] Hot to add your own logo in Thesis [...]


  12. thanks Arun for wonderful tutorial. I just chance my site logo and tweaking more with my site.


  13. thanks Arun for wonderful tutorial. I just chance my site logo and tweaking more with my site.


  14. Jean-Claude

    Anybody knows how to get Thesis to work in French ?

    Thanks !


  15. I am New to Thesis Theme thanks 4 u r Information

    Have a nice Day


  16. Government Jobs in India

    Nice help


  17. Freshers Walkin

    hey do u know how to convert this theme in indian hindi language?


  18. Nice blog and some interesting information, I found it really by mistake looking for something else. Have bookmarked it and will be back soon.


  19. Technology news

    Thanks for the information.I will give a try and i hope it works


  20. I agree with Mayur, Thesis Open hook plugin is the best and easiest way to customize the thesis theme.


  21. Thanks for the theme. I will start working on it.


  22. [...] How to add your own Logo in Thesis Theme? Hello there! If you are new here, you might want to subscribe to the RSS feed for updates on this topic. [...]


  23. [...] How to add your own Logo in Thesis Theme? [...]


  24. How do you change it on the actual dashboard???



Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>