Sitemap

Mengganti Icon/Favicon di Address Bar

Saat membuka sebuah website maupun blog, kita sering melihat gambar kecil yang ada pada judul address bar (kotak di atas tempat mengetikkan alamat web). Biasanya gambar yang digunakan adalah huruf atau simblo tertentu. Ini menjadi ciri khas dari sebuah website atau blog, contohnya saja google dengan gambar kecil huruf g, facebook dengan huruf f dan masih banyak lagi yang menggunakan gambar untuk Icon address barnya. Bagi para blogger, tampilan awal iconnya adalah huruf B, icon ini bisa diganti dengan cara



Cara pertama

• Masuk ke akun blog kalian kemudian klik Rancangan, kemudian klik Tata Letak (pada tampilan lama) atau klik Tata letak (pada tampilan baru)
• Kemudian pada bagan favicon klik Edit
• Lalu klik Choose file untuk memilih gambar yang akan dijadikan icon address bar
• Klik Simpan

Dengan seketika icon blog kalian berubah sesuai gambar yang kalian upload tadi.......... Jika belum berhasil coba 

Cara kedua

    Syaratnya kita harus telah mengupload gambar yang diinginkan menjadi icon address bar dan mendapatkan url gambar tsb

• Masuk ke akun blog kalian kemudian klik Rancangan (pada tampilan lama) atau Klik Template  (pada tampilan baru)
• Klik Edit html
• Tekan Ctrl + F lalu cari kode <b:skin><![CDATA[/* 
• Setelah ketemu, copy kode di bawah ini tepat di bawah kode  <b:skin><![CDATA[/* 

<link href='URL gambar yang akan dijadikan icon address bar' rel='shortcut icon' type='image/vnd.microsoft.icon'/>

Jangan lupa di simpan ya........... 

Cara Membuat Recent Post bergerak

Salah satu cara membuat para visitor dapat betah berjalan-jalan di blog kita adalah dengan memberikan mereka pilihan artikel terakhir yang kita buat secara menarik. Tak percaya??? Misalkan saja ada cewek cantik lewat, gak mungkin gak ada cowok yang gak melirik............ Begitu juga dengan blog, jika ada widget yang menarik gak mungkin visitor gak mau lihat dan pasti dah lihat-lihat pengennya lama-lama. Bener kan? Dah, daripada kelamaan, langsung saja kita buat recent post yang bergerak. Langkahnya

• Log in ke Blogger
• Klik Rancangan (pada tampilan lama) atau Tata Letak (pada tampilan baru)
• Klik Tambah gadget lalu pilih tipe HTML/Javascript
• Masukkan kode di bawah ini

<style type="text/css">

    #rp_plus_img{height:377px;}

    #rp_plus_img li {height:60px;padding:5px;list-style:none;

    background-color:#ffffff;

    border:solid 1px #000000;}

    #rp_plus_img a{color:#00000;}

    #rp_plus_img .news-title{display:block;font-weight:bold ;margin-bottom:4px;font-size:11px;

    text-align:justify;

    -moz-border-radius: 5px;}

    #rp_plus_img img{float:left;margin-right:14px;padding:4px;border:solid 1px #00000;width:55px;height:55px;}

    

</style>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript">

</script>

<script src="https://sites.google.com/site/unwanted86/javascript/recentpost.js" type="text/javascript">

</script>

<script type="text/javascript">

    var speed = 1500;

    var pause = 3500;

    $(document).ready(function(){

    rpnewsticker();

    interval = setInterval(rpnewsticker, pause);

    });

    

</script>

<ul id="rp_plus_img"><script>

    var numposts = 5;

    var numchars = 0;

    

</script>     <script src="/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rpthumbnt">

</script>     </ul>

<small><a href="http://guidefor-you.blogspot.com/2012/05/cara-membuat-recent-post-bergerak.html" target="_blank">get this widget here</a></small>

• Lalu simpan........Selamat mencoba

Cara Mengubah Background Blog

Salah satu cara untuk menunjukkan jati diri dari blog adalah dengan tampilan background, dengan memiliki background yang menarik namun berkualitas membuat para visitor menjadi betah untuk berlama-lama di blog kita. Lalu, bagaimana caranya? Untuk mengganti background blog, hal yang utama adalah mengupload gambar yang akan dijadikan background. Boleh saya sarnkan upload gambarnya ke Photobucket saja, karena lebih praktis....(Menurut Saya). Jika sudah diupload, langkah selanjutnya adalah:

• Log in terlebih dahulu ke blogger
• Klik Rancangan (pada tampilan lama) atau klik Template (pada tampilan baru)
• Klik Edit html, jangan lupa centang Expand Widget Template
• Tekan Ctrl + F lalu cari kode </head>
• Copy kode berikut ini tepat sebelum kode </head>

<style type="text/css">
<!--
body {
    background-image: url(URL Foto Anda);
}
-->
</style>

• Simpan Template. 
• Bagaimana hasilnya???? Menarikkah? Jika belum menarik, kalian bisa ganti gambarnya dengan yang lain

Cara Membuat Spoiler di Blog

Pernahkah mendengar kata spoiler??

Kalau dalam dunia penerbangan, spoiler berarti alat untuk mengurangi gaya dorong. Sedangkan dalam dunia otomotif berarti alat untuk mengubah arus udara pada kendaraan bermotor. Tapi bukan ini yang dimaksud dalam dunia blog, menurut saya, spoiler itu adalah tombol yang dapat menyembunyikan sebuah teks atau gambar sehingga bisa mengurangi panjang dari postingan sebuah blog. Untuk membuatnya tidak terlalu sulit, kita hanya perlu melakukan langkah seperti di bawah ini:

1. Seperti biasa log in ke blogger, kemudian buat/buka postingan yang akan ditambahkan spoiler
2. Masukkan kode berikut ini pada bagian postingan yang yang akan diberi spoiler

<div><div style="margin-bottom: 2px;"><i><b>Judul Spoiler anda </b></i><input value="Show" style="margin: 0px; padding: 0px; width: 60px; font-size: 10px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" type="button"/></div><div style="border: 1px inset ; margin: 0px; padding: 6px;"><div style="display: none;">isi spoiler anda

</div></div></div>

Kode yang berwarna biru dapat diganti sesuai keinginan dan kode yang berwarna hijau adalah isi dari spoilernya. Sebaiknya pratinjau terlebih dahulu sebelum menerbitkan postingan. Selamat mencoba...........

Cara Membuat Auto Read More di Blog

Read More merupakan tombol yang digunakan untuk mempersingkat tampilan sebuah artikel. Ada 2 cara untuk membuat tombol ini, yaitu secara manual dan secara auto/otomatis.

Untuk secara manual, kita harus selalu memasukkan sebuah kode html pada postingan, jika hanya beberapa postingan tidak terlalu bermasalah, tapi bagaimana jika yang ingin diberikan tombol read more ada ratusan. Sudah terbayang bukan susahnya. 

Untuk secara auto/otomatis, kita hanya harus melakukan beberapa langkah di bawah ini;

• Tentu saja login terlebih dahulu ke blogger
• Klik Rancangan kemudian klik Edit html, jangan lupa conteng Expand Widget Templates.
• Lalu cari kode </head> pada susunan kode html, tekan Ctrl + F untuk lebih cepat menemukan kode tsb.
• Setelah ketemu letakkan kode ini tepat dibawah/setelah kode </head>

<script type='text/javascript'> var
thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 430;
summary_img = 340; img_thumb_height = 100; img_thumb_width = 120;
</script> <script
src='http://projectloss.googlecode.com/files/read-moreotomatis.js'
type='text/javascript'/>

• Cari lagi kode  <data:post.body/> atau <p><data:post.body/></p> 
• Setelah melihat salah satu dari kode di atas, hapus kode tersebut ( <data:post.body/> atau <p><data:post.body/></p> ) kemudian ganti dengan kode berikut

<b:if cond='data:blog.pageType != &quot;item&quot;'><div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div><script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script><span class='rmlink' style='float:right;padding-top:20px;'><a expr:href='data:post.url'>[Read More..]</a></span></b:if> <b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/><br/> </b:if>

• Simpan... Dan lihat hasilnya 

Cara Mengganti Header Blog

      Kali ini saya akan menginformasikan tentang cara mengganti header blog untuk mereka yang baru menekunin dunia blog. Tak perlu basa basi, langsung saja.

1. Log in ke blogger, lalu klik Rancangan, lalu klik Elemen laman (pada tampilan blog lama) atau Klik "Opsi lainnya" yang terletak sebelah kotak "Buat Entri Baru", kemudian klik Tata Letak(pada tampilan blog baru, lihat gambar)
2. Pada elemen Header klik edit, maka akan tampil jendela konfigurasi header
3. Pada bagian gambar, pilih gambar yang akan menjadi header dari blog kita
4. Atur posisi gambar dengan memilih posisi penempatan gambar, karena kita akan menempatkan gambar di depan judull dan deskripsi blog, maka kita pilih "Selain judul dan keterangan". Lalu jangan lupa klik simpan ya.

     Bentuk header tidak hanya sebatas gambar belaka, tetapi bisa juga gambar bergerak(.gif), untuk membuatnya sangat mudah, cukup menggunakan Photoscape. Jadi jika ingin mendapatkan header blog sesuai keinginan, jangan takut untuk bereksperimen ya. OK?

Membuat Tulisan bergerak di Address Bar

Pernahkah kalian melihat tulisan bergerak pada kotak di atas alamat website saat kita melihat blog lain? Inginkah kalian punya seperti itu juga pada blog kalian? Langkahnya sangatlah mudah, ikutin saja langkah di bawah ini

1. Login ke Blog kalian dan masuk ke dasbor
2. Klik Rancangan
3. Klik menu Edit HTML
4. Lalu cari kode </head> . Cara cepatnya tekan Ctrl + F lalu letakkan kodenya
5. Setelah ketemu kodenya, copy  kode HTML di bawah ini

<script type='text/javascript'>//<![CDATA[

msg = " Masukkan Teks yang Diinginkan ";

msg = " Masukkan Teks yang Diinginkan " + msg;pos = 0;

function scrollMSG() {

document.title = msg.substring(pos, msg.length) + msg.substring(0, pos); pos++;

if (pos > msg.length) pos = 0

window.setTimeout("scrollMSG()",100);

}

scrollMSG();

//]]>

</script>

Tulisan yang berwarna hijau adalah tulisan yang akan ditampilkan pada address bar kalian, sebelum menyimpannya sebaiknya di preview/pratinjau dahulu supaya lebih yakin dengan teksnya. Mudah Bukan???

Membuat Blog dengan Mudah dan Cepat

Blog merupakan bentuk aplikasi web yang isinya berupa tulisan-tulisan (posting) pada sebuah halaman Web Umum. Untuk membuat kita bisa dikenal pada nantinya sama orang lain, kita harus terus melakukan update pada blog kita setidaknya 1 postingan sehari. Daripada kelamaan, langsung saja kita buat blog

• Syarat yang terpenting untuk membuat blog, kita harus memiliki sebuah e-mail. Jika kalian belum punya e-mail, saya saranin untuk buat melalui layanan penyedia e-mail Gmail pada Google. Isi data yng dibutuhkan dengan lengkap ya.
• Jika sudah, kita buka penyedia layanan blog. Kali ini saya akan menggunakan layanan blog Blogger.com
• Klik DAFTAR pada sudut kanan atas halaman.

• Isi Alamat email dengan e-mail kita yang telah dibuat tadi. Isi datanya dengan lengkap kemudian klik LANJUT.

• Beri nama blog Anda dan pilih templatenya.
• Selamat Kalian telah membuat sebuah blog baru. Klik Entri Baru untuk mulai menulis.