-->
logo blog

Kompi Doang - Template 1 Kolom, Responsive, Fast dan Keren

Kompi Doang - Template 1 Kolom, Responsive, Fast dan Keren

Sahabat Ngonline06, ingin membuat blog personal? Atau sahabat ingin membuat blog masakan? Atau sahabat ingin membuat blog tentang review produk? Atau sahabat ingin membuat blog dengan tampilan keren dan elegan? Maka, template Kompi Doang adalah pilihannyanya.

Demikianlah testimoni para penikmat template Kompi Doang. Mereka sangat mengagumi template Kompi Doang dikarenakan balutan dan tampilannya yang elegan dan 'klimis.' Belum lagi, struktur kodenya nampak profesional dan wusss wusss kecepatannya. Untuk kecepatan inilah yang menjadikan para netizen bersorak sorai pada template Kompi Doang ini.

Yups, template buatan kang Adhy Suryadi ini memang cucok untuk sahabat semua yang menginginkan template 1 kolom, responsive, keren, dan fast loading. Seakan-akan semua keunggulan template ada pada template ini. Biar sahabat memiliki gambara utuh, berikut adalah komposisi daripada template Kompi Doang tersebut:
  • Fast loading
  • Responsive
  • 1 kolom dengan tampilan super elegant
  • Dilengkapi dengan kotak pencarian
  • Dilengkapi dengan related post dengan thumbnail
  • Dilengkapi dengan sosial share yang komplit
  • Dilengkapi dengan blogger comment dan facebook comment
  • Read more otomatis
  • Dilengkapi dengan breadcrumt yang menambah SEO
  • HTML 5 dan CSS 3, buktikan aja sendiri...hehe
  • Dan, kelebihan-kelebihan lainnya yang Ngonline06 tak bisa jelaskan.

Ah, pokoknya Sahabat tidak menyesal untuk memilih dan menggunakan template Kompi Doang ini. Jika penasaran, silahkan lihat demo dan langsung comot saja link downloadnya.

kompi doang template 1 kolom responsive fast keren

Petunjuk Penggunaan Template Kompi Doang

#Iklan

Walau mengunakan 1 kolom, sahabat jangan bersedih hati atau kebingungan untuk meletakkan iklan di dalam template sahabat. Pada template Kompi Doang ini, Sahabat bisa meletakkan iklan di atas, dalam postingan atau tempat lainnya.

Untuk iklan di postingan 728x90 seperti yang ada di bawah menu, maka silahkan sahabat mencari kode di bawah ini di template sahabat.
<div class='content-wrapper'>
<div class='outer-wrapper'>
<div class='belowmenu'>
  <div class='contoh-iklan'/>
  </div>
Silahkan ganti kode <div class='contoh-iklan'/> dengan script iklan sahabat. Direkomendasikan juga menggunakan iklan responsive seperti pada adsense.

Adapun iklan di dalam postingan yang berukuran 300x250, silahkan cari kode di bawah ini dan ganti dengan script sahabat yang sudah diparse.
<div class='post-ontop'>
  <div class='ad-title'>Advertisement</div>
SKRIPT IKLAN DI SINI
      </div>

#Widget Subscribe

Untuk menggunakan widget subscribe seperti pada demo, gunakan kode berikut pada gadget HTML/Java Script
<div id='subscribe-box'>
                 <p>Sign up here with your email address to receive updates from this blog in your inbox.</p>
             <div class='emailfield'>
              <form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=Ngonline06&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'>
               <input name='name' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Your Name&quot;;}' onfocus='if (this.value == &quot;Your Name&quot;) {this.value = &quot;&quot;;}' type='text' value='Your Name'/>
               <input name='email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Your Email&quot;;}' onfocus='if (this.value == &quot;Your Email&quot;) {this.value = &quot;&quot;;}' type='text' value='Your Email'/>
<input name='uri' type='hidden' value='Ngonline06'/>
<input name='loc' type='hidden' value='en_US'/>
                <input class='submitbutton' type='submit' value='Subscribe Now!'/>
              </form>
             </div></div>
Keterangan: Silahkan ganti Ngonline06 dengan id Feedburner blog Sahabat.

#Widget Recent Post

Untuk widget recent post, gunakan kode berikut ini.
<ul id='recent-posts'></ul>
<script>
//<![CDATA[
var homePage = "http://ngonline06.blogspot.com/",
numPosts = 5;
function recentPosts(a){if(document.getElementById("recent-posts")){var e=a.feed.entry,title,link,content="",ct=document.getElementById("recent-posts");for(var i=0;i<numPosts;i++){for(var j=0;j<numPosts;j++){if(e[i].link[j].rel=="alternate"){link=e[i].link[j].href;break}}var title=e[i].title.$t;content+='<li class="recent-posts"><a href="'+link+'" title="'+title+'" target="_blank">'+title+'</a></li>'}ct.innerHTML=content}}var you_script=document.createElement('script');you_script.src=homePage+'/feeds/posts/summary?alt=json-in-script&orderby=published&max-results='+numPosts+'&callback=recentPosts';document.getElementsByTagName('head')[0].appendChild(you_script);
//]]>
</script></ul>
Keterangan: Silahkan ganti Url-nya dengan Url dari blog Sahabat.

#Cara Memposting

Jika sahabat memposting, direkomendasikan untuk memakai satu gambar pada setiap postingan. Hal itu karena gambar yang satu tersebut tidak akan nampak dan akan diletakkan secara otomatis di atas judul postingan. Adapun jika sahabat memang 'memaksakan' diri untuk memposting gambar lebih dari satu, maka silahkan hapus kode class="separator" di gambar yang kedua dan selanjutnya.

Kelebihan dari template kompi doang lainnya adalah foto profil penulis secara otomatis akan disesuaikan dengan foto profil di google+. Jika kebetulan, penulisnya seorang administrator, maka foto administrator itulah yang akan nampak.

Demikian serba serbi template kompi doang dengan satu kolom, responsive, fast, dan keren tersebut. Jika ada kesulitan atau hal yang belum dipahami, silahkan coret-coret saja di kotak komentar di bawah ini. Salam sukses dari Ngonline06.

Share this:

Artikel Menarik Lainnya

Show comments
Hide comments

1 comment

Sob, untuk memunculkan hanya satu post tanpa readmore gimana ya?

Silahkan berkomentar dengan baik.

Info Pendidikan