KTC PARTY BLOGGER

Wednesday, April 16, 2014

Memasang Navigasi Halaman Pada Blog

Navigasi halaman adalah suatu daftar halaman pada blog dengan nomor - nomor halaman. Dengan memasang navigasi halaman tentunya akan memudahkan pengunjung dalam menjelajahi blog Anda.

Langkah Pertama

Simpan kode CSS dibawah ini diatas kode </head>..

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<style type="text/css">
.showpageNum a,.showpage a,.showpagePoint{margin-top:10px;margin-bottom:20px;background:#f35d5c;border:none;margin-left:5px;color:#FFF;font-size:15px;font-family:'Arial';font-weight:700;transition:all 0.3s ease-in-out;padding:10px 15px;box-shadow:0 1px 2px 0 rgba(0,0,0,0.1);}
.showpagePoint{background:#555;color:#fff;}
.showpageNum a:hover,.showpage a:hover{background:#555;color:#fff;}
</style>
</b:if>
</b:if>

Silakan Anda atur CSS nya untuk menyesuaikan dengan kebutuhan blog.

Langkah Kedua

Simpan kode dibawah ini diatas kode </body>.

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<script type='text/javascript'>
var pageCount=5;
var displayPageNum=8;
var upPageWord =&#39;Prev &#39;;
var downPageWord =&#39; Next&#39;;
</script>
<script src='https://googledrive.com/host/0B8WEGGjyXlaMMWdabjB6Q3RhRjg/PageNavigation.js' type='text/javascript'></script>
</b:if>
</b:if>

Pengaturan

Opsi	Keterangan
`pageCount`	Jumlah per halaman
`displayPageNum`	Jumlah halaman yang ingin ditampilkan
`upPageWord`	Tombol sebelumnya
`downPageWord`	Tombol selanjutnya

Friday, April 11, 2014

Mas Sugeng 2014 Blogger Template

Demo

Download

Template yang sangat fenomenal buatan +Sugeng Riyadi ini mampu menghipnotis para blogger. Dengan kelebihan template ini yaitu SEO Friendly, banyak para blogger yang sudah membuktikan keampuhan template blogger yang satu ini.

Fitur Template

Custom Mobile
Auto Readmore
Breadcrumbs
SEO Ready
Dropdown Menu
Related Articles
Cool Threaded Comment
Social Share
and more.

BroSense Blogger Template

Demo

Download

Template minimalis buatan +Sugeng Riyadi ini sangat cocok bagi Anda yang memasang Google Adsense, karena template ini dikhususkan untuk itu. Walaupun template ini tidak responsive, tetapi template ini memiliki fitur mobile.

Fitur Template

Custom Mobile
Auto Readmore
Breadcrumbs
SEO Ready
Ads Ready
Related Articles
Cool Threaded Comment
Social Share
and more.

Pengaturan Template

1. Menu Navigasi
Untuk mengatur menu pada template ini, silakan cari kode dibawah ini dan edit oleh Anda.
Versi Mobile

<div id='mobile-nav'>
  <span><a expr:href='data:blog.homepageUrl'>Beranda</a></span> &#183; 
  <span><a href='#'>Teknologi</a></span> &#183; 
  <span><a href='#'>Olahraga</a></span> &#183; 
  <span><a href='#'>Entertainment</a></span> &#183; 
  <span><a href='#'>Gaya Hidup</a></span>
 </div>

Versi Desktop

 <nav id='nav'>
    <ul id='menu'>
      <li><a href="/">Home</a></li>
      <li><a href="#">Menu 1</a>
  <ul>
            <li><a href="#">Sub Menu 1</a></li>
            <li><a href="#">Sub Menu 2</a></li>
            <li><a href="#">Sub Menu 3</a></li>
        </ul>
      </li>
      <li><a href="#">Menu 2</a>
  <ul>
            <li><a href="#">Sub Menu 1</a>
    <ul>
     <li><a href="#">Sub Menu 1</a></li>
     <li><a href="#">Sub Menu 2</a></li>
     <li><a href="#">Sub Menu 3</a></li>
     <li><a href="#">Sub Menu 4</a></li>
     <li><a href="#">Sub Menu 5</a></li>
     <li><a href="#">Sub Menu 6</a></li>
    </ul>  
   </li>
            <li><a href="#">Sub Menu 2</a></li>
            <li><a href="#">Sub Menu 3</a></li>
        </ul>
      </li>
   <li><a href="#">Menu 4</a></li>
   <li><a href="#">Menu 5</a></li>
   <li><a href="/www.evotemplates.net">Error Page</a></li>
   <li><a href="/p/lorem-ipsum-dolor-sit-amet-consectetur.html">Static Page</a></li>
 </ul>
 
 <form id="search-form" action="/search" style="display: inline;" method="get"><input onfocus="if(this.value==this.defaultValue)this.value='';" value="Search..." type="text" id="search-box" onblur="if(this.value=='')this.value=this.defaultValue;" vinput="" name="q"/> <input id="search-button" value="Go" type="submit"/></form>
 
  </nav>

2. Iklan Dibawah Judul
Template Ini memliki iklan dua versi yaitu mobile dan desktop, untuk menggantinya silakan edit kode dibawah ini.
Versi Mobile

   <!-- iklan bawah judul versi mobile -->
   <a target='_blank' href='http://www.evotemplates.net'><img alt='blogger templates' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhslgG-5DJ_CNzcYl2oSoUWJxulG-ZiYaFPs2AHTeb6CAkbxbuFoDFW_yapi0JOQ2bD0Nsqx7vd48EQA6F2vdUo87YQF4631n9JyOEolQ-SxoYv23SXNUtP-QBG96DDQFXvZevw2ORJQt7t/s1600/bannernew.png'/></a>

Versi Desktop

   <!-- iklan bawah judul -->
  <a target='_blank' href='http://www.evotemplates.net'><img alt='blogger templates' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhslgG-5DJ_CNzcYl2oSoUWJxulG-ZiYaFPs2AHTeb6CAkbxbuFoDFW_yapi0JOQ2bD0Nsqx7vd48EQA6F2vdUo87YQF4631n9JyOEolQ-SxoYv23SXNUtP-QBG96DDQFXvZevw2ORJQt7t/s1600/bannernew.png'/></a>

Kompi Males Responsive Blogger Template

Demo

Download

Kali ini Saya berbagi sebuah template gratis buatan salah satu blogger Indonesia yaitu +Adhy Suryadi. Template ini memiliki kelebihan dan kaya akan fitur. Walaupun template ini gratis, tetapi fitur - fitur pada template ini bisa dibilang premium. Sudah banyak blogger yang menggunakan template yang Satu ini.

Fitur Template

Responsive
Valid HTML5 ( Home Page and Post Page )
Valid CSS3
SEO Friendly
Full Title
Breadcrumbs
Page Navigation
Smooth Scroll To Comment Hash
Back To Top and Go To Down Button
Costumized Error Page
Cool Threaded Comment
Emoticon In Comment
Custom Pager In Post Page
Related Acticles
Social Icon Share
Sucscribe Form Email
Ads Ready
and more.

Pengaturan Template

Untuk mengganti url gambarnya silakan ganti url gambar pada kode dibawah ini.

<b:includable id='title'>
  <b:if cond='data:blog.url == data:blog.homepageUrl'>
<img alt='logo blog' height='90' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSBgE6wNouL4sSHX6hCZ_buKTU9facbjRKLDYuGfqaCSZ4w39Jx4rMy8eMDx47kLYbvEcvzTfMJIIBzNmhzxLCYCP23-hI6F-Ws6naFIOp8Ed33DLIbaFnDcRx8SCh9Cwor660Qon0UhA/s1600/titlekompimales.png' title='Kompi Males' width='212'/>
  <b:else/>
    <a expr:href='data:blog.homepageUrl' expr:title='data:title' itemprop='url'><span itemprop='name'><img alt='logo blog' height='90' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSBgE6wNouL4sSHX6hCZ_buKTU9facbjRKLDYuGfqaCSZ4w39Jx4rMy8eMDx47kLYbvEcvzTfMJIIBzNmhzxLCYCP23-hI6F-Ws6naFIOp8Ed33DLIbaFnDcRx8SCh9Cwor660Qon0UhA/s1600/titlekompimales.png' title='Kompi Males' width='212'/></span></a>
  </b:if>
</b:includable>