Create a front page like the demo site

December 24, 2013|

This video in this series provides an overview of how to create a front page just like I did for the Encounters demo website. In particular, we will focus on the main content area with the Call to Action and the four boxes with images and content.

Demo Front Page

What we will do here is create the demo site front page with 4 image content boxes, but you can go with 2 or even 3 if you wish. How you change this is by changing the class=”span3″ to span6 for 2 boxes, or span4 for 3 boxes. This is a 12 column layout theme so we want everything side-by-side to total 12 columns. This is why for four columns you will see in the code, 4 containers each with a class of span3 which adds up like this:

span3 + span3 + span3 + span3 = 12

Covered in this video:

  • Introduction to the demo front page.
  • Introduction to the code snippets.
  • Setting up the front page template
  • Setting up the Call to Action
  • Setting up the four boxes

Video

 

 

Categories: Setup Tutorials for Encounters

Leave a Reply