Tagged: ,

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • #2694

    Hello and happy new year!

    I have a small, tiny question. I would like to add a text box next to my logo so that I can write a description of what the website is about.

    For the moment, I have the text that describes what the website is about inside the image and I would like to change that:

    LOGO & DESCRIPTION TEXT = IMAGE

    into that

    LOGO = IMAGE – DESCRIPTION = TEXT

    Thank you if you can help,

    Best regards,

    Ari

    #38941

    Hey,

    just replace following code in header.php:

    <h2 class="logo <?php echo $logoclass; ?>"><a href="<?php echo get_settings('home'); ?>/"><?php echo $logo; ?></a></h2>

    with:

    <h2 class="logo <?php echo $logoclass; ?>"><a href="<?php echo get_settings('home'); ?>/"><?php echo $logo; ?></a></h2>
    <div id="description">My website is about</div>

    and add following i.e. following code to style.css:

    #description{
    position: absolute;
    right:0px;
    top:30px;
    width:50px;
    font-weight: bold;
    font-size: 15px;
    color: #777;
    }

    You can adjust the position by changing the values of “top” and “right”. Change the font size, color, width, etc. as you like. Change the description text to anything you like :)

    #38942

    Thank you. It almost works. I would like the text to be on the right of the logo though. I added “floating=right” but it does not seem to be the right way. Any idea?

    #38943

    Hey,

    please adjust the top and the right value so that the text is situated on the right of the logo. I.e. if you increase the “right” attribute value the text will move to the left (because the distance to the right side increases). If you increase the top value the logo will move down. So just try to find values which fit your needs (I can’t help you with that as it depends on your taste).

    #38944

    Hey,

    I changed this

    #description{

    position: absolute;

    right:0px;

    top:30px;

    width:50px;

    font-weight: bold;

    font-size: 15px;

    color: #777;

    }

    to this:

    #description{

    position: absolute;

    right:100px;

    top:100px;

    width:50px;

    font-weight: bold;

    font-size: 15px;

    color: #777;

    }

    but the text did not move. It is still in the upper left corner (aligned left with the logo but upon it). I might have made a mistake while copying the code but I can’t find it.

    If it can help, I copied the code line 96 of the style.css sheet just after

    #top .logobg a {

    text-indent:-9999px;

    and before:

    #headextras{

    position: absolute;

    right:20px;

    padding:14px 14px 10px 0px;

    top:-6px;

    width:328px;

    z-index: 10;

    }

    Thank you for helping and for taking your time to sort this out.

    Ari

    #38945

    Hey,

    can you send me a link to your site? I need to investigate the css/html code first hand.

    #38946

    Hello,

    Here is my website: http://www.zhongguo-wine.com/

    Thanks for investigating !

    #38947

    Heym

    I checked the stylesheet here: http://www.zhongguo-wine.com/wp-content/themes/newscast/style.css and I couldn’t find the #description css code. Maybe you didn’t save the css modification?

    #38948

    Indeed. When I downloaded the stylesheet to my PC again, the #description was here though. I uploaded it once again and now it appears. Please don’t hate me! :)

    It looks like I did something else wrong as the text is now in the bottom right corner of the header. it should not: right:500px;

    top:13px;

    #38949

    Hello, It seems ok now.

    Thanks

    #38950

    Glad that I could help you :)

Viewing 11 posts - 1 through 11 (of 11 total)

The topic ‘Add Text next to logo’ is closed to new replies.