Support » Fixing WordPress » Can I Turn My Banner into an Image?

  • My site has an olive/gray-colored banner at the top of the screen. With some themes I’ve used in the past, I was able to replace the background image/border image by right clicking on the page and selecting “View Background” image. I could then identify the location of that image as well as the pixel dimensions so I could easily replace it with an image of my choice.

    It doesn’t appear to be so easy with this Silveray theme.

    My questions:
    1. Is it possible to replace the big olive/gray-colored banner with an image?
    2. If it’s possible, how would I go about doing that?
    3. How would I know the ideal pixel dimensions the replacing image would need to be to show up properly on the screen?

Viewing 15 replies - 16 through 30 (of 32 total)
  • best way to do that is create same image and make it 950px wide and upload

    Thanks. I just tried that, and the banner is still being cut off for some reason. If you look on the right side at the webpage, you can see that it’s cutting off the image.

    For some reason, the replacement banner image doesn’t fill-up the entire area that the greyish green color does on the theme in it’s natural state.

    Also, I’m noticing that the “Home” and “Contact Us” tabs are rising up on the page, and aren’t where they were originally.

    Any additional advice you can provide is appreciated. Thanks!

    The width of your #nav element exceeds the width of #header. To fix this, change:

    #nav ul {padding: 0 11px;}

    to:

    #nav ul {padding: 0;}

    I believe I made the change you’re referring to. That portion of my master.css now reads:

    #nav ul {
    
    	min-width: 780px;
    
    	max-width: 1200px;
    
    	margin: 0 auto;
    
    	padding: 0;
    
    	list-style: none;
    
    	}

    …but the border is still looking the same way. Did I do something wrong?

    It looks like there’s some code somewhere that’s preventing the banner image from stretching to the edge of the available space like the default border did.

    I also see that the border is beginning to replicate itself underneath itself, until it ran out of space.

    Your header width is 780px and your banner 800px (!). About the background, you’ll have to set it to no-repeat:

    #header {
    background: url(http://mysite.com/image.png) top center no-repeat;
    }

    Thanks, that turned-off the repeating.

    Regarding the banner being so big, I had it set to 780px originally. I then mentioned in this thread yesterday (see above) that the banner wasn’t covering all of the space that the original banner did.

    I was then told by govpatel (who’s been a tremendous help, by the way) to make the image 950px wide. I attempted to do so and uploaded the new image. That’s why it’s so big.

    Please let me know if I’m doing something wrong. Thanks!

    Is it possible to expand the header width so that the banner takes up the entire space instead of looking like it does now?

    Sure, use this css with a background banner that is 1030×140.

    #header {
        background: url("images/get2theleaguebanner.jpg") center top;
        margin: 0 10px;
        width: 1030px;
        height: 140px;
    }

    Wow thanks! I’m learning SO MUCH!

    One other question: is it possible to move the Contact Us and Home tabs down so that they don’t run through the middle of the banner?

    in master.css

    #nav ul {
    list-style: none outside none;
    margin: 0 auto;
    max-width: 1200px;
    min-width: 780px;
    padding: 0;
    }

    change to

    #nav ul {
    list-style: none outside none;
    margin: 75px auto;
    max-width: 1200px;
    min-width: 780px;
    padding: 0;
    }

    Wow. You guys are like magic. Thanks!

    OK, seriously this time, one more question…

    How do I make it so that if someone clicks anywhere on the banner, it takes them back to the home page as normal?

    To link your banner to home page will need to see your header.php code if you paste it in http://wordpress.pastebin.com
    and paste url here.

    Thanks govpatel, here it is here: http://pastebin.com/WZYuZKDV

    Line 79 in header.php you do not have image name
    <span><a href="<?php echo get_settings('home'); ?>"><img src="<?php bloginfo('template_directory'); ?>/images/(logo_name).gif" alt="<?php bloginfo('description'); ?>" /></a></span>
    replace
    (logo_name).gif
    with the name of header image
    get2theleaguebanner.jpg

Viewing 15 replies - 16 through 30 (of 32 total)
  • The topic ‘Can I Turn My Banner into an Image?’ is closed to new replies.