Cara Menambah Widget Variasi Blog

Langkahnya sebagai berikut:
 
1. Login Ke blog> pada dasboard blog kamu pilih Design > Page Element > Add Gadget dan pilih JavaScript/HTML. Kemudian pastekan kode yang kamu pilih.
Silahkan pilih widget - widget dibawah ini:

Kumpulan Widget Blogger Indonesia

Style #1

Sudut Kiri atas

<script language="JavaScript" src="http://my-project-hujangede.googlecode.com/files/hujangede_Kiri_Atas.js" type="text/javascript"></script> <script language="JavaScript" type="text/javascript"> cot("http://lh4.ggpht.com/_55xfixw5xxA/TSQeqQkaV7I/AAAAAAAAAO0/kFJ7ZrLVy3s/Widget%20Blogger%20Indonesia.png") </script>

Style #2 

Sudut kanan atas

<script language="JavaScript" src="http://my-project-hujangede.googlecode.com/files/Hujangede_kanan_atass.js" type="text/javascript"></script> <script language="JavaScript" type="text/javascript"> cot("http://lh6.ggpht.com/_55xfixw5xxA/TSRAD5V-CeI/AAAAAAAAAPc/czrjhswKpVo/Widget%20Kanan%20Blogger%20Indonesia.png") </script>

Style #3 

Sudut Kiri bawah

<script language="JavaScript" src="http://my-project-hujangede.googlecode.com/files/hujangede_kiri_bawah.js" type="text/javascript"></script> <script language="JavaScript" type="text/javascript"> cot("http://2.bp.blogspot.com/-Y1dKjqpXvgA/Tb92aJRlKoI/AAAAAAAABYs/PLNETiLrfRQ/s1600/Blogger+Indonesia+Kiri.png") </script>

Style #4 

Sudut kanan bawah

<script language="JavaScript" src="http://my-project-hujangede.googlecode.com/files/Hujangede_kanan_Bawahh.js" type="text/javascript"></script> <script language="JavaScript" type="text/javascript"> cot("http://2.bp.blogspot.com/-Y1dKjqpXvgA/Tb92aJRlKoI/AAAAAAAABYs/PLNETiLrfRQ/s1600/Blogger+Indonesia+Kiri.png") </script>

Semoga bermanfaat

Cara Membuat Kotak Script pada Posting

Jika sobat mempunyai blog yang bertemakan tutorial blog, atau blog trik maka yang pasti anda sering menggunakan kode script HTML, CSS, dll. Ada cara yang mudah untuk menayangkan kode tersebut pada blog agar mudah dilihat namun tetap terlihat cantik dan stylis. Jika sobat ingin tau cara kerjanya maka ikuti langkah berikut ini:

1. Masuk ke Rancangan --> Edit HTML
2. Carilah kode ]]></b:skin>
3. Paste kode dibawah ini diatas kode tadi:

.codeview {
margin : 15px 15px 15px 35px;
padding : 10px;
clear : both;
font-family : "Courier New", "MS Sans Serif", sans-serif, serif;
line-height:1.6;
background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRC5S38QOlcIX3x2xuabHRMd-UYtKO5Copi6iSPIdOb00drFZMadoeaQlwYXbsqRbeplDyXR4MmV0p-jaroU77LvjgYWQr1BIFhP5MB_K_PDA77BLwtBWh4WtjpV6TRK3MnSOE4AO4qtwr/') no-repeat scroll bottom right #EFFBF5;
border-top : 1px solid #eeeeee;
border-right : 2px solid #cccccc;
border-bottom : 2px solid #cccccc;
border-left : 1px solid #eeeeee;
}
.codeview li {
line-height : 24px;
color : #333333;
margin : 0;
padding : 0;
}

Keterangan: Anda dapat mengganti kode berwarna biru dengan url gambar yang anda inginkan

4. Simpan template anda

Untuk cara kerjanya, jika sobat menulis Script Kode pada posting maka masuk ke tab Edit HTML, lalu sisipan kode yang ingin ditayangkan (kode warna merah) pada div class seperti dibawah ini:

<div class="codeview">
<!-- Letakkan kode anda disini -->
</div>

Demikian tutorial dari Blog Trik dan Tips, semoga bermanfaat!

http://blogtrikdantips.blogspot.com

Cara Membuat Auto Read More di Blog

Tapi, sebelum saya mulai, mungkin sobat sudah memakai read more yang manual. Jadi agar read more otomatis ini mau bekerja di blog anda, anda bisa melakukan cara berikut:

<div class='post-header-line-1'/>

<div class='post-body'>

<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style&gt;

<p><data:post.body/></p>

<a expr:href='data:post.url'>Readmore</a>
</b:if>

<div style='clear: both;'/>

- Hapus kode yang berwarna merah

Ok, setelah read more manual di blog anda sudah dinonaktifkan, sekarang anda bisa memasang read more otomatis di blog anda:

1. Pertama yang harus anda lakukan adalah Log in ke akun Blogger anda.
2. Buka Tata Letak --> Edit HTML, centang Expand Template Widget.
3. Cari kode </head> dan paste kode berikut di atas kode </head> : 

<script type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 250;
summary_img = 250;
img_thumb_height = 120;
img_thumb_width = 120;
</script>
<script type='text/javascript'>
//<![CDATA[
/******************************************
Auto-readmore link script, version 2.0 (for blogspot)
(C)2008 by Anhvo
visit http://en.vietwebguide.com to get more cool hacks
********************************************/
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; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}
var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script>

- Keterangan:

var thumbnail_mode = "float";  (bisa ganti apakah letak thumbnail berada di (float) kiri atau jika tidak bisa diganti dengan (no-float)
summary_noimg = 250; (Menentukan berapa banyak karakter yang akan ditampilkan di posting tanpa gambar)
summary_img = 250; (Menentukan berapa banyak karakter akan ditampilkan di posting dengan gambar)
img_thumb_height = 120; (Thumbnail/Gambar 'tinggi dalam piksel)
img_thumb_width = 120; (Thumbnail/Gambar 'lebar dalam piksel)

4. Setelah dipasang, sekarang anda cari kode <data:post.body/> dan ganti kode <data:post.body/> 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>

- Tulisan READ MORE tersebut bisa anda ganti dengan tulisan apa aja.

Dan setelah itu simpan deh dan lihat hasilnya. Semoga tips ini bisa bermanfaat dan selamat mencoba :)

Jadwal Final Liga Champion 2012

Jadwal Final Liga Champion 2012 - Satu tempat di final Liga Champions 2012 sudah di pegang Chelsea yang menang agregat 3-2 atas Barcelona. The Blues akan menghadapi Bayern Munchen yang brehasil menaklukan Real Madrid. Jadwal final perlu anda catat agar tak ketinggalan menyaksikan kompetisi club  paling bergengsi di Sentero Eropa.

Final Liga Champions digelar 19 Mei 2012 di Allianz Arena Jerman pukul 20.45 waktu setempat atau di Indonesia jatuh pada tanggal 20 Mei 2012 dinihari pukul 01.45 WIB.