This thread is over two years old and may be outdated. Please create a new thread if you need help, or email us if you have an active Premium license.

Background

11 years ago · Last reply by Andrew Misplon 11 years ago

I use full with for my site but I want to be able te color the backround of both the body area and the sidebar. I managed more or less to get a background color on de actual body but not the sidebar. Attached a page of the site with a screenshot. I want to have a background color on the part within te dotted line. Can you help me with this?

thanks

Rene

URL: http://demowp.edutestweb.nl/blog/?page_id=164&preview=true

This is our free support forum. Replies can take several days.

Need fast email support? Get SiteOrigin Premium

Replies

6
  1. Rene 11 years, 1 month ago

    I mean full width…

  2. Andrew Misplon Staff 11 years, 1 month ago

    Hi Rene

    Thanks for reaching out.

    The way the full width layout was constructed unfortunately means there is no container around the the primary and sidebar areas that we can easily use for a background color. It’s possible to set the overall page background color under Appearance > Customize > Page. You might consider using the Vantage Boxed Layout, that would give you the regular background color option you’re after.

    Sorry we don’t have more.

  3. Rene 11 years, 1 month ago

    Hello Andrew,

    Thanks for this. I indeed could not find the container but thought is was my lack of experience! Would be great if you can add this container in the next upgrade.

    Rene

  4. Andrew Misplon Staff 11 years, 1 month ago

    There is a full-container wrapping #primary and #secondary. It’s however not floated left so given the current setup we can’t use it for a background color.

    You could change things in a child theme, you’d need the following under Appearance > Custom CSS:

    #main {
    padding: 0;
    }
    
    .full-container-inner {
    background: #ccc;
    padding: 35px;
    }
    

    You could start with this vanilla child theme:

    https://siteorigin.com/wp-content/uploads/2015/01/vantage-child-vanilla-enqueue.zip

    Un-zip it. Copy header.php and footer.php from the parent theme into the child theme.

    Edit header.php and insert the following after

    :

    <div class="full-container-inner">
    

    So the end of header.php will then look as follows:

    	<div id="main" class="site-main">
    		<div class="full-container">
    			<div class="full-container-inner">
    			<?php do_action( 'vantage_main_top' ); ?>
    

    Then close that div in footer.php. The start of footer.php will then look as follows:

    			<?php do_action( 'vantage_main_bottom' ); ?>
    			</div>
    		</div><!-- .full-container -->
    	</div><!-- #main .site-main -->
    
  5. Rene 11 years, 1 month ago

    This is great! I will see if I can pull this off!

    Rene

  6. Andrew Misplon Staff 11 years, 1 month ago

    Super, let us know how it goes.

Replies on this thread are closed.

Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Have a different question or issue?

Start New Thread