Senin

Wih gak terasa, ternyata dah lama nih tidak mengudate info tentang tutorial terbaru bagi para sahabat blogger….hehehe
Selain karena terhalang oleh tugas-tugas dari sekolah, banyak juga masalah yang datang silih berganti, sehingga dah lama blog ini tidak terurus.
Karena itu, nih sekarang ada tutorial terbaru buat para sahabat blogger yang lagi ngerasain demam.
demam yang di rasa`in 4 tahun sekali…He..he..he…
Ya Apa lagi kalau gak demam Piala Dunia,
Kalau ngomong-ngomong masalah Piala Dunia, pasti sahabat blogger dah kenal dong sama yang namanya ZAKUMI

Apa`an tuh ZAKUMI…???

ZAKUMI itu merupakan icon dari Piala Dunia yang sedang di laksanain di Afrika Selatan.

Gamana..??? tau gak…???

Kalau belum tau juga..yang di maksud ZAKUMI itu apa…???
Liat deh gambarnya di bawah ini :



Keterangan :
Jika kamu lihat, link gambar di postingan ini menggunakan nama TeoriNgeblog, itu adalah alamat Blog lama saya yang kini berpindah ke Blog ini, sehingga link gambar tersebut dapat di pastikan bukan hasil copy paste.

sebelum ke tahap pemasangan emoticon ZAKUMI di atas kotak komentar, silahkan di lihat-lihat dulu deh contoh emoticonnya di bawah ini :

















Gimana tertarik gak buat memasang emoticon ZAKUMI di atas kotak komentar..???

Kalau tertarik ikuti aja langkah-langkah di bawah ini :

1. Log in ke blog kamu
2. Pilih tata letak
3. Pilih Edit HTML
4. Beri centang pada expand Widget template
5. lalu cari kode </body> pada template
6. Letakkan Kode HTML dibawah ini sebelum kode </body>


<script src='http://mohammadiqbal.fileave.com/emoticon%20ZAKUMI%20by%20TeoriNgeblog.js' type='text/javascript'/>



7. Setelah selesai dengan Script diatas cari kode berikut :


<b:if cond='data:post.embedCommentForm'>


8. Setelah itu silahkan Copy-paste kode Script dibawah ini sebelum Kode Script diatas


<b><img height='50' src='http://lh4.ggpht.com/_QwvI2Zom950/TDFpjmEIpLI/AAAAAAAAAv0/D63r45olgaA/s128/Teoringeblog%20zakumi.1.gif' width='50'/>
:a:
<img height='50' src='http://lh6.ggpht.com/_QwvI2Zom950/TDFpjoKG3II/AAAAAAAAAv4/-CgvUsng9YY/s128/Teoringeblog%20zakumi.2.gif' width='50'/>
:b:
<img height='50' src='http://lh4.ggpht.com/_QwvI2Zom950/TDFpj5GDRXI/AAAAAAAAAv8/7GgEcX98WqY/s128/Teoringeblog%20zakumi.3.gif' width='50'/>
:c:
<img height='50' src='http://lh6.ggpht.com/_QwvI2Zom950/TDFpsvBmmNI/AAAAAAAAAwE/askgoLd2mes/s128/Teoringeblog%20zakumi.4.gif' width='50'/>
:d:
<img height='50' src='http://lh5.ggpht.com/_QwvI2Zom950/TDFpssXdJfI/AAAAAAAAAwI/NDVRfNmb8FY/s128/Teoringeblog%20zakumi.5.gif' width='50'/>
:e:
<img height='50' src='http://lh4.ggpht.com/_QwvI2Zom950/TDFpsor80oI/AAAAAAAAAwM/Jm7GLTlCEaM/s128/Teoringeblog%20zakumi.6.gif' width='50'/>
:f:
<img height='50' src='http://lh4.ggpht.com/_QwvI2Zom950/TDFpswOHK0I/AAAAAAAAAwQ/O4wTbsGTojA/s128/Teoringeblog%20zakumi.7.gif' width='50'/>
:g:
<img height='50' src='http://lh5.ggpht.com/_QwvI2Zom950/TDFps-fgwoI/AAAAAAAAAwU/4jTTmbh-lFw/s128/Teoringeblog%20zakumi.8.gif' width='50'/>
:h:
</b>


9. lalu klik Save Template

selamat mencoba semoga berhasil dan jangan lupa tinggalkan komentar
Rasanya tutorial ini udah banyak di ketahui oleh para sahabat blogger, tapi hanya untuk sekedar sharing aja, maka sayapun berbagi tutorialnya di blog ini.
Sesuai namanya Readmore versi 3 berbeda dengan readmore versi sebelumnya, yakni versi 1 dan versi 2, karena di readmore versi 1 dan versi 2, kita harus mengatur batas perpotingan text sevcara manual, nah tapi dengan readmore versi tiga atau yang lebih di kenal dengan Read More Automatis + Thumbnail ini bisa menentukan jumlah karakter text yang akan menjadi abstraksi postingan kita, karena itulah di sebut Readmore Automatis karena kita gak perlu ribet-ribet lagi untuk mengatur posisi perpotongan text dengan meletakkan text sebelum kode <span class="fullpost"> dan sisanya sebelum kode </span>, karena itu udah ketinggalan zaman…he..he…he…



Selain kelebihannya yang otomatis, readmore versi 3 ini juga memiliki kelebihan lain, yakni mampu menampilkan thumbnail dari gambar pertama postingan, untuk mewakili isi dari postingan kita

Hehehe…keren kan…???

Kalau para sahabat blogger tertarik denagan readmore versi 3 ini,
Ikuti aja langkah-langkah di bawah ini :

1. login dulu ke akun Blogger kamu

2. Pilih Layout > Edit HTML

3. Letakkan kode berikut di di bawah kode </head>


<!-- Read more v3 -->
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i ){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">") 1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop ;
strx = strx.substring(0,chop-1);
return strx '...';
}

function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) {
imgtag = '<span style="float:left; margin:0px 10px 5px 0px; padding:0; border-right:2px solid #ccc; border-bottom:2px solid #ccc;"><img src="' img[0].src '" width="' img_thumb_width 'px" height="' img_thumb_height 'px"/></span>';
summ = summary_img;
}

var summary = imgtag '<span>' removeHtmlTag(div.innerHTML,summ) '</span>';
div.innerHTML = summary;
}
//]]>
</script>

<script type='text/javascript'>
var thumbnail_mode = "float";
summary_noimg = 500;
summary_img = 400;
img_thumb_height = 125;
img_thumb_width = 120;
</script>
<!-- Read more v3 end -->


Catatan :
var thumbnail_mode = "float"; = Menentukan posisi thumnail
summary_noimg = 500; = Jumlah karakter bila tidak menggunakan thumbnail
summary_img = 400; = Jumlah karakter bila menggunakan thumbnail
img_thumb_height = 125; =Tinggi thumbnail
img_thumb_width = 120; = Lebar thumbnail

4. Klik Save Template

5. masih ada di kolom Edit HTML, lalu centang Expand Widget Template

6. Cari kode <data:post.body/>, dan ganti kode tersebut dengan kode berikut:
<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
<span class='rmlink' style='float:left'><a expr:href='data:post.url'>READ MORE - <data:post.title/></a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>

7. lalu Save template nya.

Catatan :

Tulisan READ MORE - bisa anda ganti sesuai keinginan kamu .jika kamu ingin mengubahnya ke bentuk gambar, …klik aja [ di sini ]

Selamat mencoba, Semoga berhasil , dan jangan lupa tinggalkan komentar.