Need help? Check out our Support site, then

How can I add logo to Ideation and Intent Theme?

  1. HI, I would like to add a logo to my theme but when I add it as the header the menu goes above it. Is there anyway to change that and have the logo sit where the title text is?

    The blog I need help with is

  2. Hi there, you can replace the existing textual site title with an image using the following CSS. Upload an image to your media library, get the URL of that image and then go to Appearance > Custom Design > CSS tab in your dashboard and add the following to your custom CSS below any existing CSS you have. Replace URL OF IMAGE between the double quote marks with the URL of your logo image. I've initially set an area of 100px x 300px for the image, but it can be larger, or smaller. Some adjustments to the code will probably need to be made once you get your image in. The existing text site title will be moved way off to the left out of site, but still be there for the search engines to find.

    .site-title {
        background: url("URL OF IMAGE") no-repeat scroll 0 0 transparent;
        height: 100px;
        margin-right: 20px;
        width: 300px;
    .site-title a {
        display: block;
        text-indent: -9999px;
        line-height: 100px;
  3. Hi , thanks for such a quick response. I have added that CSS and successful removed the title but the logo hasn't appeared in its place. Do you have any thoughts on what I might be doing wrong?

    Thanks again

  4. Oops ignore that. I have removed the "'s and I have fixed it. Thank you so so much. You have saved me so much time and frustration! :)

  5. @mexicoretold, you are very welcome, and your site is looking awesome!

  6. Is there a way now that I can make the menu come down a little, it seems rather high and I can't seem to change it. Thanks again

  7. oh gosh and one more thing. How can I make the menu text white whilst I am at it? Thank you so much for the compliment on the site :)

  8. Certainly. With the code below, I have floated the menu to the right and brought it down. You can move it up or down to your liking by adjusting the 110px top margin. The second and third bits of code move the content area up a little closer to the logo.

    .main-navigation {
    float: right;
    margin-right: 40px;
    margin-top: 110px;
    .site-header hgroup {
    margin-bottom: 0;
    .site-description {
    display: none;

    You can also reduce the height in .site-title to bring it up even more. It looks pretty good at 175px with the above changes.

  9. Worked an absolute treat. Now I would just love to change the menu items to white and I tried to add in some code and failed. Is it possible? I promise that is my last question. Thank you!!

  10. Here you go. I also remove the white text shadow which made the white text a little fuzzy looking.

    .main-navigation a {
    color: #FFFFFF;
    text-shadow: none;

    You are welcome, and no problem on the questions.

  11. I really can't thank you enough! I thought this was going to be really tricky but with your help it was so quick. I hope the karma returns! Many thanks! :)

  12. You are very welcome.

  13. I am attempting a similar thing on my blog,, and am wondering if it is possible to get the site title to appear to the right of the background image (they are currently superimposed). I used the code you first responded with, but line 2 of the title text is still pasted into the image. Thanks for any help in advance.

  14. @ldauner
    The blog linked to your username is a free hosted blog that's devoid of any blogger created content. Your other thread re: is already tagged and will be moved to the CSS Forum for you. Please post only into that thread

Topic Closed

This topic has been closed to new replies.

About this Topic