It's not about me, it's my blog!

Tampilkan postingan dengan label Blog. Tampilkan semua postingan

25.1.10

Menghilangkan border pada kumpulblogger

Meskipun tampak sepele, tetapi bisa saja mengganggu. Misalnya, jika kita memasang kode kumpulblogger, ada garis tepi (border). Jika kita pasang di gadget yang memiliki garis tepi, tentu akan terlihat ada dua garis tepi di gadget tersebut. Untuk itu, dengan sedikit trik, garis tepi pada kumpulblogger bisa kita hilangkan.

Caranya sebagai berikut.

Salin kode di bawah ini.

.garping,.garpinghor {
border: none !important;
}
.garping table,.garpinghor table {
border:#FFFFFF solid 1px !important;
background-color:#FFFFFF !important;
}
.garping td,.garpinghor td{
color:#000000 !important;
background-color:#FFFFFF !important;
font-family:arial !important;
font-weight: !important;
font-style: !important;
}
.garping a,.garpinghor a{
color:#000080 !important;
font-family:arial !important;
font-weight: !important;
font-style: !important;
}
.garping a:hover,.garpinghor a:hover{
color:#FF0000 !important;
}

Klik Edit HTML lalu cari kode <b:skin><![CDATA[LETAKKAN KODE DISINI/*.
Klik SAVE TEMPLATE.

Membuat readmore otomatis di blogger

Secara default, artikel pada blogger tidak dipenggal. Kita bisa saja menyisipkan kode untuk memenggal artikel. Namun, tetap merepotkan bila harus selalu menyertakan kode untuk memenggal saat menulis artikel. Supaya hal itu tidak dilakukan, kita bisa membuat penggalan artikel secara otomatis.

Caranya sebagai berikut.

Sisipkan kode ini di atas kode </HEAD> pada halaman EDIT HMTL.

<script type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 350;
summary_img = 350;
img_thumb_height = 120;
img_thumb_width = 120;
</script>
<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; 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>

Klik SAVE TEMPLATE.

Ceklis Expand Widget Templates.
Cari kode <data:post.body/> lalu ganti (replace) menjadi kode di bawah ini.

<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</a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>

Klik SAVE TEMPLATE.

Hasilnya seperti blog ini.

Jika Anda sudah menyisipkan kode readmore sebelumnya, hapus dulu kode tersebut baru masukkan kode seperti di atas.

Memasang random banner di blog

Punya banyak banner yang mau dipasang di blog? Pasti bingung menempatkannya di mana. Kalau dipasang semua kemungkinan memenuhi tampilan blog. Untuk mengatasinya, buat saja random banner. Kita hanya menempatkan satu banner dan berubah otomatis ketika blog kita direfresh.

Caranya sebagai berikut.

Salin kode berikut.

<script language="JavaScript">  </script>

Ganti tulisan yang berwarna merah dan biru sesuai kebutuhan lalu masukkan ke gadget HMTL/JavaScript atau tempat lain yang Anda inginkan.

Untuk melihat hasilnya, refresh (F5) browser beberapa kali.

Jumlah iklan bisa ditambah maupun kurangi. Jika ingin menambah, cukup menambahkan kode berikut ini.

if (pasang_iklan==4) {

url="alamat url";

alt="alamat/nama url";

banner="alamat gambar";

width="468";

height="60";

Hasilnya bisa dilihat di blog ini.

22.1.10

Membuat komentar di blog via aplikasi facebook

Berawal dari iri ketika melihat situs MetroTV, pada live streaming bisa ngirim komentar via facebook. Saya coba menggunakan facebook developer ternyata harus mengupload file xd_receiver.htm. Padahal, di blogger tidak bisa mengupload file tersebut. Namun, ternyata ada alternatif lain. Caranya sebagai berikut.

Klik link ini lalu beri nama aplikasi. Klik Create Application.

Catat API Key yang diberikan. Kalau punya, upload ikon maupun logo blog Anda.

Klik tab Connect lalu isi Connect URL dengan blog Anda.

Klik tab Widget. Lakukan pengaturan sesuai keinginan Anda. Misalnya, tidak mengizinkan orang tak dikenal memberi komentar, pilih No pada Allow Anonymous Comments. Klik Save Changes.

Klik Edit HTML.

Klik Download Full Template untuk berjaga-jaga terjadi kesalahan. Ceklis Expand Widget Templates. Cari kode di bawah ini.

xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>

Simpan xmlns:fb='http://www.facebook.com/2008/fbml' di akhir kode tersebut seperti di bawah ini.

xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr' xmlns:fb='http://www.facebook.com/2008/fbml'>

Letakkan kode di bawah ini sebelum tag </head>.

<script src='http://static.ak.connect.facebook.com/js/api_lib/v0.4/

FeatureLoader.js.php'type='text/javascript'/>

Letakkan kode di bawah ini sebelum tag </body>.

<script type='text/javascript'>
FB.init("LETAKKAN_API_KEY_ANDA_DISINI", "");
</script>

Letakkan kode di bawah ini di tempat yang Anda inginkan. Misalnya, Gadget HTML/JavaScript.

<fb:comments width='250'/>

Hasilnya seperti gambar berikut.

4.1.10

Menyisipkan teks bergerak di blog

Berbagai cara bisa dilakukan untuk membuat blog lebih atraktif. Salah satu yang paling sederhana adalah menampilkan teks berjalan. Bisa disisipkan di dalam artikel maupun gadget. Baik teks biasa maupun dalam bentuk link.

Berikut ini, beberapa alternatif teks berjalan yang bisa Anda gunakan.

Bergerak biasa.

<marquee>masukkan teks sederhana di sini</marquee>

Hasilnya seperti ini.