Best 2 Know

The Ultimate Blogging Resource

  • Advertising
  • WebHosting
  • Contact Us
  • Blogger
    • Blogger Templates
    • Blogger Tutorials
  • Browser
    • Firefox
    • Google Chrome
  • Google
  • Internet
    • Facebook
    • Twitter
  • Thesis
  • Windows
  • WordPress
    • WordPress Themes
    • WordPress Plugins
  • More
    • Linux
    • Review
    • Solutions
    • Announcements

How to add Logo to Thesis theme

Normally thesis theme has no logo it has the title of our Blog in the header but no option to add logo to thesis theme, but you have seen many blogs out their using thesis and having a logo still their but how to do that, well its too easy and just a CSS trick to maintain the SEO and also to keep the nice looks.

Removing Text title from thesis theme

So the trick is quit too easy if you are familiar with CSS then you would have probably done it earlier. So now lets start the work and get a cool logo to our blog

As you can see in the above image I have written first of all we have to remove the text written in the header, some of you will use CSS as

#header{display:none;}

#header{display:none;}

Well it is completely wrong this will reduce the SEO of the site also so instead we are going to use text Indent property like below :

#header #logo, #header #tagline {text-indent:-99999px;}

#header #logo, #header #tagline {text-indent:-99999px;}

once you add the below code in custom.css file you will receive the below results

Adding Logo/Image to Header in Thesis theme

Now once we have cleared the title , we will now add the logo to our thesis theme for that first make a logo for your blog then upload it on the site, for me I have placed it in “custom/images” folder so here is my code

#header{background:url('images/best2know.png') no-repeat;}

#header{background:url('images/best2know.png') no-repeat;}

so as you can see the CSS you can understand if you are experienced with CSS and it gives me below result

Making Clickable Logo/Header

As you have placed the Logo you can see it is not clickable and we hate it because usually Visitors click on the logo to go back to homepage so it is essential to make the header clickable so here is the trick

#header #logo a{display:block;width:300px;height:100px;}

#header #logo a{display:block;width:300px;height:100px;}

Well above you can see something which might be confusing you , why i have used width and height attribute , well this are used because i just want the Image area only to be clickable so i have used the Image attributes their.

Conclusion

Now the conclusion is the result you get but before that we have to bring in together the code we have made , so the final code in custom.css will be :

#header #logo, #header #tagline {text-indent:-99999px;}
#header{background:url('images/best2know.png') no-repeat;}
#header #logo a{display:block;width:300px;height:100px;}

#header #logo, #header #tagline {text-indent:-99999px;} #header{background:url('images/best2know.png') no-repeat;} #header #logo a{display:block;width:300px;height:100px;}

i guess you can see the final output now , hope you are happy with it, hope you also liked my new style of writing i tried to explain the more aspect of this tutorial if you need any further help contact me or just leave a comment

Subscribe via Email

Share this:

  • Twitter
  • Facebook
  • Pocket
  • Print
  • Email

Related

June 21, 2011 Ritesh Sanap Thesis Customization Clickable, CSS, custom.css, Header, logo, SEO, Thesis, Thesis Customization, title

Post navigation

Previous Previous post: How to add Slider to thesis theme
Next Next post: How to Remove Read More jump

Currently Trending

  • Windows Vista CD key
  • How to download Specific parts of YouTube videos
  • How to Increase Dropbox upload speed
  • How to download torrents without utorrent
  • How to Add Breadcrumb for blogger blog
  • How to Change the Welcome/Login Screen in Windows XP ?
  • You might also like this Widget for blogger or Related post widget
  • HORIZONTAL AND VERTICAL SPACING
  • How to Delete Feedbacks from JetPack Contact Form
  • Hard Drives are not opening/working by Double-Click - Solution

Random Posts

How to add Breadcrumbs in thesis

April 22, 2011 By Ritesh Sanap 10 Comments

Google Talk for Chrome – Chat for Google

December 2, 2012 By Ritesh Sanap Leave a Comment

Make Firefox Work Faster Than Ever

February 29, 2008 By Ritesh Sanap Leave a Comment

Hack windows xp passwords: For FAT32 System

February 28, 2009 By Ritesh Sanap 1 Comment

Top 5 Jquery Slide Gallery

June 12, 2010 By Ritesh Sanap 2 Comments

WordPress

HTTP2 Server Push for W3 Total Cache Minify plugin

August 17, 2016 By Ritesh Sanap 5 Comments

How to Disable Emojis in WordPress

January 6, 2016 By Ritesh Sanap Leave a Comment

JetPack Related posts and Sharing not working with NGINX

November 10, 2015 By Ritesh Sanap Leave a Comment

Simply Pure – WordPress Theme

November 2, 2014 By Ritesh Sanap 2 Comments

Advanced What should we Write about next? – WordPress Plugin

July 28, 2014 By Ritesh Sanap Leave a Comment

How to Disable Self Pingback or TrackBack

January 16, 2014 By Ritesh Sanap Leave a Comment

BlueStrap – WordPress Theme

January 1, 2014 By Ritesh Sanap 15 Comments

How to Create Multiple Excerpts in WordPress

December 24, 2013 By Ritesh Sanap Leave a Comment

How to Disable Auto Update in WordPress

November 21, 2013 By Ritesh Sanap Leave a Comment

How to Delete Feedbacks from JetPack Contact Form

November 19, 2013 By Ritesh Sanap 9 Comments

Recent Posts

  • HTTP2 Server Push for W3 Total Cache Minify plugin
  • How to show hidden files and folders in Mac OS X
  • How to Disable Emojis in WordPress
  • Canva – Online Photo Editor
  • JetPack Related posts and Sharing not working with NGINX

Archives

Recommends

  • DigitalOcean – Cloud Hosting
  • Dropbox – Cloud Storage
  • Elegant Themes – WordPress Themes
  • LastPass – Password Manager
  • Like us on Facebook
  • Follow on Twitter
  • +1 on Google
  • Subscribe via Email
  • RSS Feed

© 2021 Best 2 Know · All Rights Reserved · We ♥ DigitalOcean

loading Cancel
Post was not sent - check your email addresses!
Email check failed, please try again
Sorry, your blog cannot share posts by email.