• 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 - 1 through 15 (of 32 total)
  • This is the image that repeated in style.css
    https://www.get2theleague.com/wp-content/themes/silveray/images/bg_header.gif

    this is code in master.css file
    for the header image

    #header {
    background: url(“images/bg_header.gif”) repeat-x scroll 0 0 #D3D9B7;
    height: 140px;
    position: relative;
    }

    You add you image in same folder images and change name take out repeat-x scroll 0 0 #D3D9B7 that will replace with your header image your header is 140px so you widen that if you want.

    Thread Starter agfreesafety

    (@agfreesafety)

    Thanks! 140px, as in 140px wide, correct? What would happen to the blog title and slogan underneath it, would they remain there, or would they be replaced if I followed the instructions you provided above?

    Thanks again!

    They will still be there as all you doing is change background

    the header background image is 140px high;

    your theme seems to be flexible in width:
    from min-width: 780px; to max-width: 1200px;

    so your header image would need to be 1200px wide, but only have interesting content in the 780px on the left.

    Thread Starter agfreesafety

    (@agfreesafety)

    If it’s flexible, why would it need to be 1200px? No offense, I’m just trying to grasp the concept behind your response.

    And would you be so kind as to explain what you mean by “interesting content?”

    Thanks!

    If it’s flexible, why would it need to be 1200px?

    the maximal width of the flexible range is 1200px;
    the minimum width is 780px;

    the actual width will depend on the size of your browser window.

    v

    if you make a banner image with some essential information beyond the 780px width, it may not be seen by some users.

    Thread Starter agfreesafety

    (@agfreesafety)

    Hey guys, thanks for your help! I had a banner created and I have it placed now on my site.

    As you can see, I now need to remove the site name and slogan, as it’s conflicting with the banner.

    My additional questions:
    1. How do I go about removing the title “Get to the League” as well as the slogan underneath it, “Let’s Get It”?

    2. The banner is 780 x 140px. How can I stretch it so that it covers the whole page horizontally? As you can see, the new banner imag repeats on the right in attempt to fill the border space at the top of the screen.

    Thanks again!

    1. How do I go about removing the title “Get to the League” as well as the slogan underneath it, “Let’s Get It”?

    Check if it is hard coded in header.php

    <h1>
    <a href="https://www.get2theleague.com">Get To The League</a>
    </h1>
    <p class="description">Let's "Get It."</p>
    Thread Starter agfreesafety

    (@agfreesafety)

    The only part of the Header.php that says <h1> is where it says:

    <h1><a href="<?php echo get_settings('home'); ?>"><?php bloginfo('name'); ?></a></h1>
    
    		<p class="description"><?php bloginfo('description'); ?></p>
    
    	<!--<div id="logo">
    
    (edit this line if you want to put logo)

    Ok it picked up from your Settings General

    check if you have theme options from where you can change setting to not display Title and description.

    Thread Starter agfreesafety

    (@agfreesafety)

    Thanks, that fixed it. How do I stretch the banner image so it doesn’t repeat itself on the right side of the screen?

    This is the code that repeats the image in master.css check if you have it in theme options not to repeat

    #header {
        background: url("images/get2theleaguebanner.jpg") repeat scroll 0 0 transparent;
        height: 140px;
        position: relative;

    Thread Starter agfreesafety

    (@agfreesafety)

    So should I remove the portion of the code that reads

    repeat scroll 0 0 transparent

    or do I remove all of the code that you referenced above? This theme doesn’t allow me to access options/settings from within the WordPress, so I’m thinking I have to just modify the master.css, maybe?

    If you take out repeat scroll 0 0 transparent from master.css that leave you your image 780px float to left you may want center it

    Try this see if you like it

    #header {
    background: url(“images/get2theleaguebanner.jpg”) repeat scroll 0 0 transparent;
    height: 140px;
    margin: auto;
    position: relative;
    width: 780px;
    }

    Thread Starter agfreesafety

    (@agfreesafety)

    Thanks for the feedback, I made the suggested changes. It looks better, only the banner doesn’t stretch to cover the entire area horizontally.

    Is there a way to stretch the width of the image to cover the whole area now?

    Thanks again for your time and help.

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