Loading..

To make additional style customizations to your site other than options already available – go to Theme Options >> Other Options > Custom CSS. Here you may insert your CSS code and even override theme styles!

To make custom CSS changes to your theme, knowledge of CSS styling is needed. What will also be helpful is to use the browser Google Chrome to help discover which elements on your site are associated with what CSS #ID or .class .

How to Use Google Chrome to Customize Your Site

1) Open up your website in the Google Chrome Browser

2) ‘Right-Click’ on the element you’d like to customize & select ‘inspect element’

3) As shown here, you’ll see that to change the background color of this page I need to call the body.page-id-6 class as well as the #container ID

4) When I make my CSS style declariations, I declare those changes by adding the following under Theme Options >> Other Options >> Custom CSS:

body.page-id-6 #container {

background-color: #474747;

}

Other Style Edits You Might Find Useful

This puts a shaded area behind the navigation menu items:

.menu a:link,.menu a:visited {  background : hsla(120,0%,0%,0.3);}

This creates a static background image (replace 150px with the height of your header:

body {
background-position: 0px 150px;
background-attachment :   fixed;
}