Bootstrap Parallax WordPress Theme 


----------------------------------------------------------------------------------


HOMEPAGE BACKGROUND IMAGES
Go to Appearance -> Theme Options -> Parallax. Here you can upload any image you would like to use. A huge image or a small image that is repeatable will work best. We have supplied 3 images that are used in the demo that you can use. They are in the zip file you downloaded. 

Use the upload feature to upload an image for all 3 sections if you would like.  


----------------------------------------------------------------------------------

HOMEPAGE 

To get your site like the demo, create a new page called 'Section 1' and copy and paste the following code. The images are in the /images/ directory of the theme files if you want to use the same images. 

<div class="row-fluid">
<div class="span4 text-center">
<img src="/wp-content/themes/bootstrapparallax/images/desktop.png" alt="desktop" width="256" height="256" class="alignnone size-full wp-image-15" />
</div>
<div class="span8 text-center">
<img src="/wp-content/themes/bootstrapparallax/images/title.png" alt="title" width="626" height="183" class="alignnone size-full wp-image-16" />
</div>
</div>
<div class="hero-unit">
<h2>This page demonstrates parallax within Twitter Bootstrap.</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</div> 

--------------

Create a second page called 'Section 2' and copy and paste the following code.

<div class="row-fluid">
<div class="span4 well">
<h2>Heading</h2>
<p>Donec sed odio dui. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Praesent commodo cursus magna, vel scelerisque cursus nisl consectetur et.</p>
<p><a class="btn btn-success" href="#">View details &raquo;</a></p>
</div>
<div class="span4 well">
<h2>Heading</h2>
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
<p><a class="btn btn-success" href="#">View details &raquo;</a></p>
</div>
<div class="span4 well">
<h2>Heading</h2>
<p>Donec sed odio dui. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Vestibulum id ligula porta felis euismod semper. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum odio, dapibus ac in, massa justo sit amet.</p>
<p><a class="btn btn-success" href="#">View details &raquo;</a></p></div>
</div>

Once these two pages are created go into the WordPress Dashboard. From here go to Appearance -> Theme Options -> Parallax. Here you can select the two newly created pages. Select 'Section 1' for the Homepage Section 1 Page section and 'Section 2' for Homepage Section 2 Page and click Save. 

----------------------------------------------------------------------------------

FOOTER

The bottom of section of the theme that is displayed on every page is the footer and uses widget areas. To add content to this section go to Appearance -> Widgets from the WordPress Dashboard. Here you will see 'Footer Widget 1', 'Footer Widget 2', and 'Footer Widget 3' in the right hand column. To get your site to look like the demo, drag the 'Text' widget into these three widget areas. Copy and paste the following code into the 'Text' widgets

Footer Widget 1
Title: More Details
<p>Donec sed odio dui. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Praesent commodo cursus magna, vel scelerisque cursus nisl consectetur et.</p>
<p>Donec sed odio dui. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Praesent commodo cursus magna, vel scelerisque cursus nisl consectetur et.</p>
<p><a class="btn btn-success">View details &raquo;</a></p>

Footer Widget 2
Title: Heading
<div class="media">
<a class="pull-left" href="#">
<img class="media-object" src="/wp-content/themes/bootstrapparallax/images/check.png">
</a>
<div class="media-body">
<h4 class="media-heading">Media heading</h4>
Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante.
</div>
</div>
<div class="media">
<a class="pull-left" href="#">
<img class="media-object" src="/wp-content/themes/bootstrapparallax/images/check.png">
</a>
<div class="media-body">
<h4 class="media-heading">Media heading</h4>
Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante.
</div>
</div>
<div class="media">
<a class="pull-left" href="#">
<img class="media-object" src="/wp-content/themes/bootstrapparallax/images/check.png">
</a>
<div class="media-body">
<h4 class="media-heading">Media heading</h4>
Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante.
</div>
</div>

Footer Widget 3
Title: Social Icons
<div class="social-icons">
<a href="'http://#.com"><i class="icon-twitter-sign"></i> </a>
<a href="'http://#.com"><i class="icon-facebook-sign"></i></a>
<a href="'http://#.com">  <i class="icon-pinterest-sign"></i></a>
<a href="'http://#.com">  <i class="icon-linkedin-sign"></i></a>
<a href="'http://#.com"> <i class="icon-google-plus-sign"></i></a>
<a href="'http://#.com">   <i class="icon-github-sign"></i></a>			
<a href="'http://#.com">     <i class="icon-rss"></i>  </a>
</div>

----------------------------------------------------------------------------------


BLOG
Create a new page called 'Blog' and use the 'Blog' page template in the right hand column. Once that page is published, you can create posts and they will automatically be added to this page. Add the 'Blog' page to the menu in Appearance -> Menus 


----------------------------------------------------------------------------------

THEME OPTIONS
Go to Appearance -> Theme Options and set general options, homepage settings, and social icons 


----------------------------------------------------------------------------------

MENUS

Go to Appearance -> Menus to create and set the header menu.  

----------------------------------------------------------------------------------
