add logo to copyblogger theme

Community Forums Forums Design Tips and Tricks add logo to copyblogger theme

This topic is: resolved

This topic contains 4 replies, has 2 voices, and was last updated by  dominick42 1 year, 9 months ago.

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #8612

    dominick42
    Participant
    Post count: 3

    I am needing to add a logo in header to Genesis Copyblogger theme. Can anyone help?

    Site: http://www.mywebsitetraffictips.com

    #8682

    TishaOehmen
    Participant
    Post count: 15

    I’m sorry — I don’t have a copy of the theme readily at hand, however, it’s pretty easy to manage in most Genesis themes. Just follow these steps:

     

    In the Genesis settings in the admin panel, change from a “text” logo to an “image” logo.
    Then about line 225 of the style sheet, add the following lines:

     

    <code>#title-area {

    background: url(images/xxxx.png) no-repeat center top;

    min-height: 100px;

    }</code>

    Put your logo image in the images folder of your child theme.
    If you decide you want the logo to be left-aligned, instead of centered, just use “left” instead of “center” on the css above.
    If the image is more or less than 100px tall — adjust the code above to reflect the full height of the logo. (this may cause additional styling to be necessary on the #header background.
    On line 181 of the style sheet, set the area to read:

    <code>#title a, #title a:hover {
    color: white;

         display: none;
    text-decoration: none;

    }</code>

    and on line 186, the style sheet should read:

    <code>#description {
    color: #999;

    display: none;
    font-family: Georgia, Times, ‘Times New Roman’, serif;
    font-size: 14px;
    font-style: italic;
    }</code>

    Let me know if you have any trouble.


    Tisha Oehmen, Paradux Media Group
    Twitter: @TishaOehmen

    #8768

    dominick42
    Participant
    Post count: 3

    Tisha,

    Thanks for the code. I do not have a line counter in the style shhet editor so am not sure where to put your code? Below is my styleshhet starting near the current title area. Where do I put your  code?

    My Stylesheet

    #header p {  color: #fff; }

    #title-area {  float: left;  overflow: hidden;  padding: 20px 0 0;  width: 400px; }

    #title {  font-size: 36px;  line-height: 42px;  margin: 0; }

    #title a, #title a:hover {  color: #fff;  text-decoration: none; }

    #description {  color: #999;  font-family: Georgia, Times, ‘Times New

     

    Thank You,

    Sam Goble

    #8880

    TishaOehmen
    Participant
    Post count: 15

    Instead of: #title-area {  float: left;  overflow: hidden;  padding: 20px 0 0;  width: 400px; } make it say #title-area {  background: url(images/xxxx.png) no-repeat center top; float: left;  overflow: hidden;  min-height: 100px; padding: 20px 0 0;  width: 100%; }

    And instead of  #title {  font-size: 36px;  line-height: 42px;  margin: 0; } put in #title {  display: none; font-size: 36px;  line-height: 42px;  margin: 0; }

    And instead of #description {  color: #999;  font-family: Georgia, Times, ‘Times New…. make it say #description {  color: #999;  display: none; font-family: Georgia, Times, ‘Times New….

    that should do it. You’ll also really like http://notepad-plus-plus.org/ as an editor — it’s got line counts and it’s free. :)


    Tisha Oehmen, Paradux Media Group
    Twitter: @TishaOehmen

    #8994

    dominick42
    Participant
    Post count: 3

    Tisha,

    Ok, it’s all good. Thank you for your help.

    Sam

     

     

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

The topic ‘add logo to copyblogger theme’ is closed to new replies.