Sunday, March 22, 2015

Responsive New Faster Blogger Template

Responsive New Faster Blogger Template

Responsive New Faster Blogger Template - Setelah sekian lama ga ada aktivitas otak atik template blog akhirnya bisa juga membuat template design sederhana dengan konsep  blog cantik dan cepat . Sesuai slogan dari blog ini yang lebih menonjolkan dengan speed loading maka template ini pun saya kembangkan dengan design minimalis dan cepat agar lebih seo friendly yang menjadikan template blogger super cepat.



Untuk fitur template ini :

RESPONSIVE NEW FASTER BLOGGER TEMPLATE

  1. Responsive Design Check disini
  2. Mobile friendly Check disini
  3. Simple and Minimalis Design
  4. Faster Loading
      Check GTMetrix
      Check PageSpeed Insight
      Check Web page Test
      Check Pingdom Tool
  5. Thread Komentar
  6. Sticky Menu Responsive
  7. SEO 100% chkme.com
  8. Simple Dropdown Navigasi Menu



Navigasi Breadcrumb

Cari kode

<b:includable id='main' var='top'>

Kemudian ganti dengan kode dibawah ini :


<b:includable id='breadcrumb' var='posts'><b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> &#187; <span><data:blog.pageName/></span></div>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- breadcrumb for the post page -->
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<div class='breadcrumbs' xmlns:v='http://rdf.data-vocabulary.org/#'>
<span typeof='v:Breadcrumb'><a expr:href='data:blog.homepageUrl' property='v:title' rel='v:url'>Home</a></span>
<b:loop values='data:post.labels' var='label'>
&#187; <span typeof='v:Breadcrumb'><a expr:href='data:label.url' property='v:title' rel='v:url'><data:label.name/></a></span>
</b:loop>
&#187; <span><data:post.title/></span>
</div>
<b:else/>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> &#187; <span>Unlabelled</span> &#187; <span><data:post.title/></span></div>
</b:if>
</b:loop>
<b:else/>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<!-- breadcrumb for the label archive page and search pages.. -->
<div class='breadcrumbs'>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> &#187; <span>Archives for <data:blog.pageName/></span>
</div>
<b:else/>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<div class='breadcrumbs'>
<b:if cond='data:blog.pageName == &quot;&quot;'>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> &#187; <span>All posts</span>
<b:else/>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> &#187; <span>Posts filed under <data:blog.pageName/></span>
</b:if>
</div>
</b:if>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>
<b:includable id='main' var='top'>
<b:include data='posts' name='breadcrumb'/>


Kemudian tambahkan kode CSS
.breadcrumbs{
background:#ff6c60;
padding:15px 20px 15px 20px;
margin-bottom:19px;
font-size:18px;
text-align:center;
color:#fafafa;
position:relative
}

.breadcrumbs a{

color:#555;
text-decoration:none
}

.breadcrumbs a:hover{

color:#fafafa;
text-decoration:none
}


Demikian sedikit sharing kali ini semoga bermanfaat
Happy Blogging

No comments:

Post a Comment