Need help modifying CSS for Wordpress header

Discussion in 'CSS' started by Cartman, Jun 19, 2007.

0
  1. #1
    I launched a new Wordpress blog (http://www.steelersgab.com) and I found a theme that I liked. The problem is, the default header is just a small .jpg file that’s repeated across the top of the page. I wanted to customize the header with a logo in place of the <h1> text that’s currently there, and then add a picture to overlay the background somewhere near the center of the page. What would be the best way to declare that in the existing stylesheet? (I could hack something together that would work, but I wanted to do it correctly, as I plan on using this template on a few other blogs that I run)

    ** Just to clarify, I'm well aware of how to edit my header.php and style.css files, I just want to know the best way to declare the elements in the style sheet and call the images from my header.php
     
    Cartman, Jun 19, 2007 IP
  2. Will Morgan

    Will Morgan Peon

    Messages:
    70
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Paste me the code or hit me up on MSN (will at avengex dot com)
     
    Will Morgan, Jun 19, 2007 IP
  3. client3

    client3 Banned

    Messages:
    169
    Likes Received:
    14
    Best Answers:
    0
    Trophy Points:
    0
    #3
    check the css may be there is a class called h1 under header id, you have to edit that in the css with your logo image. Then check your header.php file for this code <?php bloginfo(’name’); ?> remove it, may be this helps....
     
    client3, Jun 19, 2007 IP
  4. Dan Schulz

    Dan Schulz Peon

    Messages:
    6,032
    Likes Received:
    436
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Hi Cartman,

    Could you please paste the header.php and style.css files here (as inline text, not attachments), and then attach a screenshot of how the page currently looks and how you want the new header to look (the former just in case you change the presentation or the server dies, just to be on the safe side)?
     
    Dan Schulz, Jun 20, 2007 IP
  5. Cartman

    Cartman Active Member

    Messages:
    354
    Likes Received:
    5
    Best Answers:
    0
    Trophy Points:
    88
    #5
    style.css:

    #wrapper {
    background: url(images/img2.jpg) repeat-x;
    }

    #header {
    width: 900px;
    height: 250px;
    margin: 0 auto;
    }

    #header * {
    text-transform: lowercase;
    color: #FFFFFF;
    }

    #header h1 {
    float: left;
    padding: 90px 0 0 0;
    letter-spacing: -2px;
    font-size: 36px;
    }

    #header h2 {
    float: left;
    padding: 110px 0 0 6px;
    background: none;
    font-size: 12px;
    font-weight: normal;
    }

    #header h2 a {
    text-decoration: none;
    }

    #header ul {
    float: right;
    margin: 0;
    padding: 110px 0 0 0;
    list-style: none;
    }

    #header li {
    display: inline;
    }

    #header li a {
    display: block;
    color: #ffffff;
    float: left;
    padding: 0 15px;
    border-left: 1px solid #61A4B3;
    }

    #header li.first a {
    border: none;
    }


    header.php:

    <div id="wrapper">
    <div id="header">
    <h1><a href="<?php echo get_settings('home'); ?>/"><?php bloginfo('name'); ?></a></h1>
    <h2><?php bloginfo('description'); ?></h2>
    <ul>
    <li><a href="<?php echo get_settings('home'); ?>/">Home</a></li>
    <?php wp_list_pages('sort_column=menu_order&depth=1&title_li='); ?>
    <li><a href="http://www.celebrityseats.com/sports/football/pittsburgh-steelers-tickets.html">Steelers Tickets</a></li>

    </ul>
    </div>
    </div>
     
    Cartman, Jun 20, 2007 IP