Kompiimut, Template Blog Yang Imut Dan Amit Amit
Bosen dengan tampilan blog yang lebar? Nah kali ini saya share modifan template yang ramping dan imut hehehe... Lebarnya hanya 750px dengan sidebar 200px. Dasarnya masih dari Johny Wusss, dan template ini diambil dari template Bukan Johny yang digunakan Kompi Ajaib. Aslinya arahan xml-nya diambil dari template Kompi Ajaib yang saya pakai kini ini.
Sepertinya template ini cocok untuk blog personal. Warna mayoritas yaitu warna abu-abu agar sedikit adem tapi tidak menyakitkan mata hehehe.....
Seperti biasa, templatenya sudah disertai tag h1, h2, h3, slot iklan 728px x 80px di bawah header (sebaiknya diisi dengan Adsense teks satu baris). Sudah ada breadcrumb, related posts, share buttons, tombol scroll to top, translator ringan dan kotak subscribe di bawah postingan. Dan sudah saya sertakan arahan js untuk SMILEY pada komentar blog. Penampakannya menyerupai gambar di bawah ini.
Instalasinya sama menyerupai template Kompiana yang saya share kemarin, dapat dilihat DI SINI. Seperti untuk sajian header, sajian footer, popular post, dan recent posts, juga untuk paginasi di homepage. Untuk skor SEO template di Chkme sudah 100% dan validasi HTML5 di W3C menyisakan 2 buah error.
Di situ sudah saya sertakan juga untuk pengaturan DROP CAP atau aksara besar pada awal postingan. Anda tinggal menambahkan arahan menyerupai di bawah ini pada aksara awal postingan Anda pada posisi postingan HTML.
<span class="awal">T</span>Huruf T berwarna merah sebagai pola aksara awal postingan, sehingga penampilannya akan menyerupai di bawah ini.
<span class="awal">T</span>idak menyerupai template-template lainnya..... Untuk kotak subscribe di bawah postingan, cari arahan menyerupai di bawah ini:
<div class='clearfix' id='related'>
<div class='related2'>
<form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open('http://feedburner.google.com/fb/a/mailverify?uri=JohnyTemplate', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true' target='popupwindow'>
<input name='uri' type='hidden' value='JohnyTemplate'/>
<input name='loc' type='hidden' value='en_US'/>
<input id='botsub' name='email' onblur='if (this.value == "") {this.value = "Enter your email...."}' onfocus='if (this.value == "Enter your email....") {this.value = ""}' type='text' value='Enter your email....'/>
<input id='botsubbutton' type='submit' value='Submit'/><br/>
<small>Your information will not be shared. Ever.</small><br/><br/>
<a href='http://feeds.feedburner.com/JohnyTemplate' title='feedburner'><img alt='feed count' height='26' src='http://feeds.feedburner.com/ fc/JohnyTemplate?bg=ceaa6c&fg=444444&anim=1' style='border:0' title='readers' width='88'/></a>
</form>
</div>
<div class='subscribe'>
<p class='intro'>If you enjoyed this article just <a href='http://feeds.feedburner.com/JohnyTemplate' target='_blank' title='feedburner'>
<b>click here</b></a>, or subscribe to receive more great content just like it.</p>
<p class='feed'><a href='http://johnytemplate.blogspot.com/feeds/posts/default' title='feed blog'>Subscribe via RSS Feed</a></p>
</div>
</div> Untuk goresan pena berwarna merah silahkan sesuaikan dengan akun feedburner blog Anda.
Untuk deskripsi blog silahkan isi pada Dashboard >> Settings >> Search Preferences >> pada Description silahkan pilih radio button "Yes" pada Enable Search Description. Dan silahkan isikan deskripsi blog Anda pada kotak di bawahnya. Terakhir silahkan klik tombol Save Change.
UPDATE:
Ada bab yang saya lupa hehhehe, untuk search boxnya itu masih memakai punya Kompi Ajaib. Jika ingin membuatnya menyerupai itu silahkan baca cara menambahkan fungsi Google custom search ke search box blog DI SINI. Namun jikalau ingin menciptakan yang simple silahkan ganti arahan di bawah ini:
UPDATE:
Ada bab yang saya lupa hehhehe, untuk search boxnya itu masih memakai punya Kompi Ajaib. Jika ingin membuatnya menyerupai itu silahkan baca cara menambahkan fungsi Google custom search ke search box blog DI SINI. Namun jikalau ingin menciptakan yang simple silahkan ganti arahan di bawah ini:
<div class='menusearch'>
<div style='float:right;padding:0px 8px 0 0;'>
<form action='http://www.kompiajaib.com/p/kompi-ajaib-search-result.html' class='searchform' id='cse-search-box' target='_blank'>
<input name='cx' type='hidden' value='partner-pub-006106396690849460662:zxyadz2g7gi'/>
<input name='cof' type='hidden' value='FORID:10'/>
<input name='ie' type='hidden' value='ISO-8859-1'/>
<input class='searchfield' id='q' name='q' onblur='if(this.value=='')this.value=this.defaultValue;' onfocus='if(this.value==this.defaultValue)this.value=''' type='text' value='Search here....'/>
<input alt='search button' class='searchbutton' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDm2PwWf00GAO4Y3Mo6jmRFg2ewZzk-Ar3QeNSK5Sf6wkKouMWt3W2zDYGSVtCwZnhuPXU6voMln-g_oRRKMgaDdm5h5ua4virQPNxCi4qzbsGlJXPXssIPCgw_SJ9H1yvVivpCo5X3yE/s1600/tombolcari.gif' style='cursor:pointer;vertical-align:top' type='image'/>
</form>
</div></div> Ganti dengan arahan di bawah ini:
<div class='menusearch'>
<div style='float:right;padding:0px 8px 0 0;'>
<form action='/search' method='get' class='searchform' target='_blank'>
<input class='searchfield' id='q' name='q' onblur='if(this.value=='')this.value=this.defaultValue;' onfocus='if(this.value==this.defaultValue)this.value=''' type='text' value='Search here....'/>
<input alt='search button' class='searchbutton' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDm2PwWf00GAO4Y3Mo6jmRFg2ewZzk-Ar3QeNSK5Sf6wkKouMWt3W2zDYGSVtCwZnhuPXU6voMln-g_oRRKMgaDdm5h5ua4virQPNxCi4qzbsGlJXPXssIPCgw_SJ9H1yvVivpCo5X3yE/s1600/tombolcari.gif' style='cursor:pointer;vertical-align:top' type='image'/>
</form>
</div></div> Seperti biasa, dimohon untuk tidak menghilangkan atau merubah credit link di kanan bawah blog. Namun untuk kredit link di sebelah kiri dapat Anda rubah sesuka hati Anda.
UPDATE:
Bagi pengguna template yang mengalami dilema pada tombol Readmore-nya, silahkan atasi dengan cara menyerupai di bawah ini:
Silahkan cari arahan menyerupai di bawah ini:
Kemudian silahkan ganti dengan arahan di bawah ini:
Sumber https://www.kompiajaib.com/
UPDATE:
Bagi pengguna template yang mengalami dilema pada tombol Readmore-nya, silahkan atasi dengan cara menyerupai di bawah ini:
Silahkan cari arahan menyerupai di bawah ini:
http://4.bp.blogspot.com/-LAGOPpd8H_o/UUVvnuO4yEI/AAAAAAAAAfE/Q26j4shYyzE/s1600/readmore.pngKemudian silahkan ganti dengan arahan di bawah ini:
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRHbojP3lgia0uq2LMRaWS9ny-RoUPEmv6OzYOIbdI6wF_DV95gLFNK_dJL2P6J1LstiHrU1s4L_euAoRQWPOFT4UCcMsI49pVBRz3Ez1sOdILqdl5TEO1K2KLf3yUzFrfukZ-_ROPglBb/s1600/readmore.png
0 Response to "Kompiimut, Template Blog Yang Imut Dan Amit Amit"
Posting Komentar