Beacon Bootstrap Template
Okay, so you’ve decided that you want to build your website with Bootstrap. You want your site to be responsive and on the cutting edge of web design and development. One of the best things about Bootstrap is that it is really easy to use to build responsive layouts. You can rapidly build responsive layouts using a 12 column grid, and wrapping it in a container. This week’s free website template is called the Beacon Bootstrap Template. It has several nice elements that you may want to use as a part of your next website design. You can preview Beacon Bootstrap via the images below, or you can demo it here.
Home Page
The home page is a basic 3 column grid with a large header image that spans the width of the browser. The navigation is in the top right. There is also a caption and call-to-action button over the image in the header.
About Page
The About page has some goodies in it. besides having a small bio section, it also lists my main skills in small labels next to my name. The desktop layout is 2 columns, and education and work history is on the left, and skills are on the right, using classes to colorize each bar. Also the ones that are 100% are striped and animated, as an extra effect.
Portfolio Page: 3 & 4 Column
The two portfolio pages are complete with images, titles, and descriptive text. You can have all of these present in your galleries. When re-sized, each column goes to full-width.
Contact Page
The contact page is simple, but well structured. The basic fields are on the left side, while the text area is to the right. Outside of this form is an aside with basic contact information provided. Depending on the device size, the content and fields restructure to span the width of the screen.
Download the Beacon Bootstrap Template
The Beacon Bootstrap Template is free to download. If is created with Bootstrap 3, and to edit it, you will want to look at all of the Bootstrap documentation. The custom CSS for this Bootstrap template can be found in the theme.css file and will overwrite the CSS of the other stylesheets. For a demo, go here, to download the Beacon Bootstrap Template, click the button below to be taken to the download page.
