Header image on Cordobo Greenpark 2

  • Resolved magician1111

    (@magician1111)


    14 years, 1 month ago

    When I tried to add a header image to the Cordobo Greenpark 2 theme, I couldn’t find the code to modify as described in Codex. Do I need to be in another area rather than header.php? Also, I uploaded the image through “Media” in the Dashboard and I think it resized my header. Do I need to upload it through FTP, and to what folder?

Viewing 13 replies - 1 through 13 (of 13 total)
  • esmi

    (@esmi)

    14 years, 1 month ago

    There are thousands of WordPress themes – which means that many people won’t be familiar with your particular theme. So a link to your site might help.

    Thread Starter magician1111

    (@magician1111)

    14 years, 1 month ago

    Thank you. Makes sense. Here it is: http://landscapephotographyblogger.com/

    tisbrian

    (@tisbrian)

    14 years, 1 month ago

    That is one heck of a long domain! 0_o

    tisbrian

    (@tisbrian)

    14 years, 1 month ago

    Look into the style sheet, you should be able to change:

    #header {
 background: url(img_url.jpg);
}

    Thanks, Brian

    Thread Starter magician1111

    (@magician1111)

    14 years, 1 month ago

    Thanks for writing. There are only two sections in the style.css that contain the word header:

    #header,
    #main,
    #footer {
    background-color: #fff;
    text-align: left;
    margin: 0 auto 3px;
    width: 985px;
    }

    #header,
    #sidebar,
    #footer { font-size: 0.7em; }

    #header { height: 146px; margin-top: 10px; position: relative; }

    #container { float: left; margin: 0 -350px 0 0; width: 100%; }

    #content {
    border-right: 3px solid #D5DADD;
    margin: 0 350px 0 0;
    overflow: hidden;
    padding: 19px 0 0;
    }

    (AND A LITTLE LOWER DOWN THE PAGE)

    /* HEADER
    ——————————————————————- */

    /* Start EXAMPLE CODE image logo */
    /*
    #logo, #logo a { display: block; height: 19px; width: 87px; }
    #logo { position: absolute; top: 28px; left: 27px; }
    #logo a { background: transparent url(img/logo.png) top left no-repeat; text-indent: -9999em; }
    .description { color: #B8860B; display: block; left: 124px; position: absolute; top: 44px; }
    */
    /* End EXAMPLE CODE image logo */

    /* Start EXAMPLE CODE text logo */

    #branding { display: block; position: absolute; top: 30px; left: 28px; }
    h1#logo { font-size: 30px; line-height: 1.2; margin: 0; }
    #logo, .description { color: #B8860B; float: left; margin: 17px 0 0 10px; }

    /* End EXAMPLE CODE text logo */

    I thought I could put an image in the logo area, but it is only a small portion of the header. I want an image all the way across the top, like I read in the instructions in the Codex, but there is no code anywhere that looks anything like the instructions in the Codex. It is after all a photography blog and needs a photograph as a header. I would just dump and move to another theme, but there are features I like about this theme. I already am trying out the “Cutline” them as recommended by ProBlogger, but it is lacking in a few areas that my current them has.

    Michael

    (@alchymyth)

    14 years, 1 month ago

    there is no background style for #header yet;
    you could add one in style.css:

    #header {background: url(img/myheaderimage.jpg); }

    ideally you would save your header background image in the /img folder of your theme, and reference it as above.
    (if you have saved it somewhere else, you would need to use the full path to the location: example – http://www.website.com/full/path/myheaderimage.jpg )

    some fancy shadow covers the #header area below the nav:
    #submenu-bg { background: transparent url(img/bg-submenu.jpg) 0 3px repeat-x; height: 30px; width: 985px; }
    change it to:
    #submenu-bg { background: transparent; height: 30px; width: 985px; }

    the background image should be 985px wide by 146 px high.

    any other height would need some fine adjustment in one of the #header styles.

    Thread Starter magician1111

    (@magician1111)

    14 years, 1 month ago

    Thank you. I’ll try that.

    Thread Starter magician1111

    (@magician1111)

    14 years, 1 month ago

    Oh, by the way, any ideas of how I can move the text and header color band/bar up some and put the image below that? I can play around with doing it different ways, but my sense is that the header will not look so good or even be very readable in front of an image in the same position it is now.

    Michael

    (@alchymyth)

    14 years, 1 month ago

    this style in style.css determines the position of the green bar:

    #nav { position: absolute; top: 75px; left: 0; width: 985px; }

    changing ‘top: 75px;’ will move the band up/down.

    then there are these two edges hanging out:

    body {
  background: url(img/bg-body.png) 50% 74px no-repeat;
  *background-position: 50% 84px;
  font: 100.1%/1.5 "Helvetica Neue", Arial, "Lucida Grande", "Lucida Sans Unicode", "Microsoft YaHei", sans-serif;
  font-smooth: always;
  text-align: center;
}

    changing the ’74px’ will move this background image up/down.

    and this style moves the title position:

    /* Start EXAMPLE CODE text logo */

#branding { display: block; position: absolute; top: 60px; left: 28px; }

    that should give you enough levers to play around with; good luck 😉

    Thread Starter magician1111

    (@magician1111)

    14 years, 1 month ago

    Thank you, this is a great help. I’ll experiment and ask another question if something is not smooth. Best to you.

    Thread Starter magician1111

    (@magician1111)

    14 years ago

    Hi Alchymyth, I was able to add an image to my header using your instructions. It worked out very nicely, thank you. Now I need to change the color of the main site title. Any idea what the code will look like for this? I have been fishing around in style.css and haven’t been able to locate what I need to change.

    Thread Starter magician1111

    (@magician1111)

    14 years ago

    Anyone?

    Thread Starter magician1111

    (@magician1111)

    14 years ago

    Well, thank you for your help with the main issue in this thread. I started another thread on the color, but I also have now solved that issue too.

Viewing 13 replies - 1 through 13 (of 13 total)
  • The topic ‘Header image on Cordobo Greenpark 2’ is closed to new replies.