Created: 29/12/2018

By: 0effortthemes 0effortthemes.com

Thank you for your purchase! If you have any questions that you feel should have been in this document,
please feel free to contact us through our Support. Thanks!

Also you'll need some knowledge of bootstrap, css, jquery to edit this theme.

Release: v1.0

Theme Overview

Typeface Theme is multi purpose HTML5 template, but can also be used for other template purposes to serve as a foundation of your website/web page. It is based on Twitter Bootstrap with SaSS.

To use the template you have to be a little familiar with HTML and CSS. If you are familiar with HTML and CSS and if you go through the HTML files, you will discover how easily you will be able to customize the template according to your needs. This documentation covers some basics to help you get started with the customization process.

File Structure

When you download the 0effort theme folder you'll see something like this 

				ROOT FOLDER
				-----------
				+-- fonts /
				¦	+-- all fonts used
				+-- images /
				¦	+-- all images used
				+-- styles /				
				¦	+-- main.css
				¦	+-- vendor.css
				+-- scripts /					
				¦	+-- main.js	
				¦	+-- vendor.js			

				PAGES
				-----
				+-- index.html			
				+-- blog.html			
				+-- blog-details.html
				+-- members.html
				+-- about_us.html
				+-- contact_us.html

Home page Layouts

The main layout of the Index page template can be summarized in the following snapshot.

image homepage

Page Layout

The pagelayout can be summarized in the following snapshot.

image categories page image blog page

CSS Structure

CSS files used in this template are as follows:

1. main.css - main css file , desktop resolution , tablet resolution, mobile resolution specific css
2. vendor.css - contains third party css file, mentioned by gulp

Icon Usage

All icons are customized icons used in this template. The size and color of the icons can be modified by template CSS. More icons can be added from the "Flaticon" site; then download them as SVG image and put them in site for creating icons using "prefix" name as the template name. After that, download the generated fonts.

To use the icons, simply write like as follows

				<i class="fa fa-dribbble"></i>
				<i class="fa fa-facebook"></i>
				<i class="fa fa-twitter"></i>
				<i class="fa fa-behance"></i>
				<i class="fa fa-vimeo-square"></i>
				<i class="fa fa-youtube"></i>
				<i class="fa fa-rss"></i>
				<i class="fa fa-chevron-left"></i>
				<i class="fa fa-chevron-right"></i>
				<i class="fa fa-files-o"></i>
				<i class="fa fa-map-marker"></i>
				<i class="fa fa-phone"></i>
				<i class="fa fa-envelope-o"></i>
				<i class="fa fa-clock-o"></i>
				<i class="fa fa-facebook-official"></i>
				<i class="fa fa-twitter-square"></i>
				<i class="fa fa-google-plus-official"></i>
				<i class="fa fa-pinterest-square"></i>
				<i class="icon-long-arrow"></i>
				<i class="icon-text-document"></i>
				<i class="icon-photo-camera"></i>
				<i class="icon-play-button"></i>
				<i class="icon-link"></i>
				<i class="icon-music"></i>
				<i class="icon-edit"></i>
				<i class="icon-trophy"></i>
				<i class="icon-alarm-clock"></i>
				<i class="icon-television"></i>
				<i class="icon-paper-plane"></i>
				<i class="icon-internet"></i>
				<i class="icon-edit-pencil"></i>
				<i class="icon-award"></i>
				<i class="icon-settings"></i>
				<i class="icon-chat"></i>
				<i class="icon-heart"></i>
				<i class="icon-event"></i>
				<i class="icon-price-tag"></i>
				<i class="icon-add"></i>
				<i class="icon-substract"></i>
				<i class="icon-quote"></i>
				<i class="icon-reply"></i>

Font Usage

Get them here google fonts.

Javascript

Sources & Credits

The images included in the templates are for demonstration purposes only. They are available at

Pexels: www.pexels.com
Unsplash: www.unsplash.com


Thank you so much for purchasing this theme!

Regards,
0effortthemes Team