Sight Blogger Template Html5 CSS3





DemoDownload
Template name : Sight

Platform: Blogger / Blogspot

Release date : June 2013

Free download blogspot template Html5 CSS3

Designer: presslayer

Template features : Blogging, Pinterest, Responsive, Clean, Featured Content Slider, Fixed Width, Dropdown Menu, Social Widget.

License : Creative Commons Attribution 3.0

Basic Instructions : How to install a Blogger Template

Configure Featured Content Slider:
Login to blogger dashboard --> layout --> Edit HTML. Now scroll down to where you see the codes below:
  • <div class='fullwidth flexslider' id='homeslider'>
 <ul class='slides'>
 <li data-height='500' style='position:relative; background: url(../image.jpg) 50% 0'>
 <div class='caption_wrapper'>
 <div class='caption'>
 <h3><a href='#'>In luctus luctus est vestibulum luctus</a></h3>
 Lorem ipsum dolor sit amet... <a href='#'>Read more </a>
 </div>
 </div>
 </li>
 ..........
Replace:
  • "#" with your featured post URL.
  • "image.jpg" with your slider image.

Configure Dropdown Menu:
Login to blogger dashboard --> layout --> Edit HTML. Now scroll down to where you see the codes below:
  • <div class='menu-navigation-container' id='top_menu'>
 <ul class='sf-menu' id='mainmenu'>
  <li class='current-menu-item'><a href='#'>Homepage</a></li>
  <li><a href='#'>Single</a>
  <ul class='sub-menu'>
   <li><a href='#'>Submenu Example</a></li>
   <li><a href='#'>Submenu Example</a></li>
 ..........
Replace "#" with your menu item URL.

Configure Social Widget:
search for:
  • <div class='social_inner'>
 <a class='facebook' href='#' title='Facebook'/>
 <a class='twitter' href='#' title='Twitter'/>
 <a class='rss' href='#' title='RSS Feed'/>
 ..........
Replace "#" with your Social Account's URL.

How to change Author Section
search for:
  • <div class='author_avatar'>
     <div class='small_thumb'>
     <img height='auto' src='../Avatar.jpg' width='100'/></div></div>
 <div class='author_wrapper'>
 <h4>About author: <a href='#'>Admin</a></h4>
 <p>Cress arugula peanut tigernut... </p></div>
<div class='clear'/>
</div>

Posted by Dexcuit at 8:16:00 AM No comments :

No comments :

Post a Comment

Subscribe to: Post Comments ( Atom )