Selamat datang: Ilmu Blog

Tampilkan postingan dengan label Ilmu Blog. Tampilkan semua postingan

Cara Mengganti Icon Blogger pada Address Bar

9/09/2014 04:08:00 PM

•

Suatu ketika teman-teman berkunjung ke suatu blog, dan melihat ada yang aneh dengan blog tersebut, padahal ya membuat blognya menggunakan jasa blogger juga seperti teman-teman. Apa tuh keanehan yang dimaksud? Itunya lho icon yang ada di Address Bar-nya kok nggak berlogo Blogger[Contoh Blog ini: T4belajarblogger_address_bar

(tulisan T4+B+Logo Blogger^]. Wah jadi pengen juga membuat icon seperti itu, tapi bagaimana caranya ya...?

Oh iya, maksudnya seperti ini lho:

Nah aslinya seperti di atas itu icon yang muncul di blonya teman-teman (kalau belum diotak-atik sama sekali). tapi teman-teman bisa mengganti icon Blogger tersebut dengan fotonya teman-teman ataupun gambar menarik lainnya.

Untuk mengganti icon tersebut tidaklah sulit, cukup terapkan langkah-langkah berikut:

1. Login ke Blogger.

2. Klik Tata Letak >> Edit HTML

3. Lalu cari kode </head>, dan letakkan kode berikut sebelum kode </head>

Keterangan:
Yang Biru itu bisa diganti dengan alamat URL gambarnya teman-teman.

4. Klik Simpan Template.

5. Selesai.

Coba lihat dah favicon saya di atas

Cara Membuat Emoticon Di Kolom Komentar Blog

9/09/2014 03:37:00 PM

•

Ilmu Blog

Selamat siang sobat Blogger semuanya. Apa kabar..?, semoga sobat semua dalam keadaan sehat wal afiat. Sebagai blogger, kadang kita selalu ingin mempunyai tampilan blog yang unik dan menarik agar ramai pengunjung. Banyak cara untuk mempercantik tampilan blog kita. Di kesempatan kali ini blog fblog, akan sedikit berbagi informasi dan tips tentang cara membuat emoticon di kolom komentar blog. Untuk emoticon ini di ambil dari emoticon forum kaskus. Tentunya sobat sudah mengenal kaskus kan..?, kaskus adalah salah satu situs sosmed ( sosial media )yang saat ini masih banyak penggemarnya, di kaskus ini sobat bisa saling berbagi dan mendapatkan banyak informasi, mulai blog, software, komputer, internet dan masih banyak lagi. Pokoknya banyak cendol yang bermanfaat di sana.. hehehe.

Oke, kita langsung ke pokok pembahasan dari postingan ini. Untuk memasang emoticon kaskus di kolom komentar blog sobat, berikut ini langkah-langkahnya.

Login ke Dasbor blog sobat >> Edit HTML.( backup atau download template lengkap sobat terlebih dahulu untuk jaga-jaga jika terjadi kesalahan ).
Jangan lupa centang Expand Template Widget.
Cari kode penutup </body>.
Simpan kode di bawah ini di atas </body>.

<script type='text/javascript'>
//<![CDATA[
a = document.getElementById('comment-holder');
if(a) {
b = a.getElementsByTagName("p");
for(i=0; i < b.length; i++) {
if (b.item(i).getAttribute('CLASS') == 'comment-content') {
_str = b.item(i).innerHTML.replace(/:a:/gi, "<img src='http://i.imgur.com/Jnwl1.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:b:/gi, "<img src='http://i.imgur.com/h9NDs.gif' class='smiley'/>");
_str = _str.replace(/:c:/gi, "<img src='http://i.imgur.com/IL1IB.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:d:/gi, "<img src='http://i.imgur.com/k3Fdh.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:e:/gi, "<img src='http://i.imgur.com/ZDlSF.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:f:/gi, "<img src='http://i.imgur.com/OXalA.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:g:/gi, "<img src='http://i.imgur.com/cnARR.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:h:/gi, "<img src='http://i.imgur.com/WTmJr.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:i:/gi, "<img src='http://i.imgur.com/kenHK.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:j:/gi, "<img src='http://i.imgur.com/aDJrj.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:k:/gi, "<img src='http://i.imgur.com/E5qba.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:l:/gi, "<img src='http://i.imgur.com/w3vTW.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:m:/gi, "<img src='http://i.imgur.com/0WFG2.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:n:/gi, "<img src='http://i.imgur.com/bkfG8.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:o:/gi, "<img src='http://i.imgur.com/zvteN.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:p:/gi, "<img src='http://i.imgur.com/xkzm0.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:q:/gi, "<img src='http://i.imgur.com/UqDiW.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:r:/gi, "<img src='http://i.imgur.com/5uihz.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:s:/gi, "<img src='http://i.imgur.com/5O9L2.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:t:/gi, "<img src='http://i.imgur.com/7RDAt.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:u:/gi, "<img src='http://i.imgur.com/WmQPn.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:v:/gi, "<img src='http://i.imgur.com/9C3hy.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:w:/gi, "<img src='http://i.imgur.com/fFhYI.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:x:/gi, "<img src='http://i.imgur.com/e50uc.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:y:/gi, "<img src='http://i.imgur.com/RjY5y.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:z:/gi, "<img src='http://i.imgur.com/lrZEF.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:ab:/gi, "<img src='http://i.imgur.com/KJbrk.gif' alt='' width='40' class='smiley'/>");
b.item(i).innerHTML = _str;
}}}
//]]>
</script>

Kemudian sobat cari lagi kode:

<div class='post-footer-line post-footer-line-3'/>
</div>
</div>
</div>

Dan pasang kode emoticon gif berikut ini di bawah </div> yang terakhir.

<b:if cond='data:blog.pageType == "item"'>
<div style='text-align:center; font-weight:bold; margin-top:15px; margin-bottom:10px;'>
Untuk menggunakan emoticon ini, COPAS kode ke kotak komentar.
</div>
<b><img src='http://i.imgur.com/4a2GG.gif' width='40'/>
:a:
<img src='http://i.imgur.com/Jnwl1.gif' width='40'/>
:b:
<img src='http://i.imgur.com/h9NDs.gif' width='40'/>
:c:
<img src='http://i.imgur.com/IL1IB.gif' width='40'/>
:d:
<img src='http://i.imgur.com/k3Fdh.gif' width='40'/>
:e:
<img src='http://i.imgur.com/ZDlSF.gif' width='40'/>
:f:
<img src='http://i.imgur.com/OXalA.gif' width='40'/>
:g:
<img src='http://i.imgur.com/cnARR.gif' width='40'/>
:h:
<img src='http://i.imgur.com/WTmJr.gif' width='40'/>
:i:
<br/>
<img src='http://i.imgur.com/kenHK.gif' width='40'/>
:j:
<img src='http://i.imgur.com/aDJrj.gif' width='40'/>
:k:
<img src='http://i.imgur.com/E5qba.gif' width='40'/>
:l:
<img src='http://i.imgur.com/w3vTW.gif' width='40'/>
:m:
<img src='http://i.imgur.com/0WFG2.gif' width='40'/>
:n:
<img src='http://i.imgur.com/bkfG8.gif' width='40'/>
:o:
<img src='http://i.imgur.com/zvteN.gif' width='40'/>
:p:
<img src='http://i.imgur.com/xkzm0.gif' width='40'/>
:q:
<img src='http://i.imgur.com/UqDiW.gif' width='40'/>
:r:
<br/>
<img src='http://i.imgur.com/5uihz.gif' width='40'/>
:s:
<img src='http://i.imgur.com/5O9L2.gif' width='40'/>
:t:
<img src='http://i.imgur.com/7RDAt.gif' width='40'/>
:u:
<img src='http://i.imgur.com/WmQPn.gif' width='40'/>
:v:
<img src='http://i.imgur.com/9C3hy.gif' width='40'/>
:w:
<img src='http://i.imgur.com/fFhYI.gif' width='40'/>
:x:
<img src='http://i.imgur.com/e50uc.gif' width='40'/>
:y:
<img src='http://i.imgur.com/RjY5y.gif' width='40'/>
:z:
<img src='http://i.imgur.com/lrZEF.gif' width='40'/>
:ab:
<br/>
</b>
</b:if>

Save Template dan lihat hasilnya pada komentar di bawah ini

Membuat Buku Tamu

3/22/2013 02:05:00 PM

•

Ilmu Blog

Kotak Chatting dimaksudkan untuk mempermudah pengunjung / visitor blog anda untuk berinteraksi layaknya chat pada facebook. Kalau pada Blog ini anda bisa lihat seperti gambar berikut :

Banyak sekali yang menyediakan fasilitas Chat ini secara gratis diantaranya Shoutmix, Shoutbox, Cbox dan lainnya. Namun yang akan kita coba pasang pada blog saat ini adalah fasilitas yang disediakan oleh Cbox

Cbox sebenarnya merupakan fasilitas buku tamu. Fungsi Cbox ini sama dengan lainnya. Cbox sangat membantu kita dalam aktivitas blogwalking.Para blogger bisa saling mengunjungi, dengan cara meninggalkan jejak link url blog.

Untuk Lebih Jelasnya silakan anda daftar dulu pada Cbox: ini alamake t url : http://www.cbox.ws/getone.php.

Isi form-form dengan data Anda
Cbox name (nama id yang mau dipakai)
Password (password untuk login)
Confirm Password (ulangi password untuk login)
Email Address ( email anda)
Website (URL website / Blog anda)
Language (Bahasa tampilan Cbox)
Style (Tema yang akan dipasang anda pilih sesuaikan)
Centang kotak jika data anda sudah benar
klik Create my Cbox

Dan jika sukses alamat konfirmasi ke e-mail anda,

Login dengan password yang didaftarkan dan pada Cbox,
Setelah login anda akan mendapatkan kode yang harus anda pasang lanjutkan dengan memasang kode tersebut pada blog anda. (di sidebar ataupun dimana yang anda inginkan)
Selesai

Cara Mengganti Background Blog Dengan Gambar Sendiri

3/22/2013 01:44:00 PM

•

Ilmu Blog

Sebelumnya saya ucapkan Assalamualaikum buat sobat semua !!! Kali ini kita akan bahas Cara Mengganti Background Blog Dengan Gambar Sendiri, sebenarnya tutorial Cara Mengganti Background Blog Dengan Gambar Sendiri udah banyak sekali bertebaran di google,,hehehe. Tapi gk apa lah,, semoga artikel saya nangkrik di no.1 hasil pencarian,,gkgkgkgk ngarep yang gk mungkin neh,, becanda aja sob. Sebenarnya saya posting Cara Mengganti Background Blog Dengan Gambar Sendiri hanya untuk mengisi waktu luang aja. OK deh tanpa banyak cing cong langsung aja ke TKP

Pertama-tama sobat Login di blog sobat, Pilih Template, Pilih Edit Html, Centang pada Expand Template Widget. Tekan Ctrl+F untuk memudahkan sobat mencari kode nantinya.
http://remajasampit.blogspot.com/
Berhubung setiap template berbeda-beda, sobat hanya perlu mencari kode yang mirip saja,,kalo ada yang sama ya bagus deh.. Cari kode :

body{background:

Kalo template sobat sebelumnya udah menggunakan background dengan gambar maka biasanya akan tampil Url gambarnya, seperti ini :body{background: url(http://i1062.photobucket.com/albums/t489/fidian1/jkkkk.jpg) nah yang berwarna biru itu adalah Url gambar background blog sobat, sobat ganti aja urlnya dengan Url gambar baru sobat yang mau dijadikan background.
http://remajasampit.blogspot.com/
Kalo template sobat sebelumnya menggunakan kode warna sebagai backgroundnya, maka akan tampil kode warnanya, seperti ini contohnya : body{background:#ded8c0; ,nah yang warna biru adalah kode warnanya sob,,kalo sobat mau ganti dengan warna lain tinggal ubah aja kodenya, sobat bisa liat kode warna lengkap Disini . Kalo sobat mau ganti dengan gambar tinggal tambah aja url gambarnya, jadi seperti ini :

body{background:#ded8c0 url(http://4.bp.blogspot.com/-dNS6cFsK2M4/TuwkW0K4RJI/AAAAAAAAAYk/hsaP92g98TI/s1600/wallpaper.jpg)

Yang berwarna biru adalah tambahan untuk Url gambar sobat, ganti dengan url gambar sobat sendiri.
Sampe disini Background blog sudah selsai di ganti, sobat hanya tinggal mensave saja. Tetapi saya ada catatan sedikit.
http://remajasampit.blogspot.com/
Biasanya ada background yang jika kita scroll halaman sampe ke bawag]h, backgroundnya gk gerak alias tetap, nah kalo sobat mau yang kaya gitu sobat cari aja kode repeat-x; atau yang mirip, sobat ganti menjadi repeat-x top left fixed;

SAVE DAN SELESAI,
Sekian catatan kecil dari saya terkait denganCara Mengganti Background Blog Dengan Gambar Sendiri

cara membuat logo BLOGGER INDONESIA pada sisi blog

3/18/2013 05:27:00 PM

•

Ilmu Blog

oke langsung saja LIHAT TUTORIAL BERIKUT

1.login blogger
2. masuk Rancangan/Design
3. > ELEMEN LAMAN
4. >add gadget
5.> HTML/java script

tinggal copas scriptnya sesuai gambar pilihan anda

1. I LOVE INDONESIA Pada pojok kanan atas

2. Logo Blogger Indonesia Pojok Kiri Atas

3. Logo Blogger Indonesia Pojok Kanan Atas

4. Logo Blogger Indonesia Pojok Kiri Bawah

5. Logo Blogger Indonesia Pojok Kanan Bawah

Cara Membuat Like Box Popup Dengan Timer di Blog

3/18/2013 11:37:00 AM

•

Ilmu Blog

Widget yang satu sudah tak asing lagi di blogger..pernahkah anda mengunjungi sebuah blog pada saat blog dibuka dan sedang loading akan muncul popup like box fans page nya pada tampilan layar anda contohnya seperti gambar yang dibawah ini,,

Widget like box yang satu ini sangat berbeda dari widget like box facebook melayang karena like box melayang akan selalu muncul pada saat halaman dibuka atau direload. Berbeda dengan like box fans page facebook popup dengan timer yang dirancang khusus dan dilengkapi dengan timer untuk menutup sendiri pada saat countdown timernya sudah habis serta dilengkapi dengan script atau fitur pembaca cookies pada browser sehingga membuat like box yang satu ini tidak akan muncul untuk kedua kalinya jika like atau suka pada box tersebut sudah di klik.

Like box ini sendiri didesain oleh kakiheboh yang diberi nama "LikeBox FB Fanpage Pro". Cara pemasangannya sendiri sangatlah mudah, cukup dengan mengcopy paste kode css/script dan memasukkannya kedalam template, tepatnya diletakkan di atas tag </body> atau di bawah tag <body> dan untuk demonstrasinya sendiri, silahkan sobat klik live demo di bawah ini.

Penasaran gimana cara bikinnya.. berikut kode dan cara meletakkan kode tersebut ke dalam template :

Login ke Blogger
Pilih Template » Edit HTML » Centang Expand Template Widget
Cari kode </body> untuk mempermudah tekan Ctrl+F Setelah kode tersebut ketemu
Copy kode di bawah ini dan pastekan tepat di atas tag </body> atau di bawah tag <body>

<style>
#fblikepop { background-color: #fff; display: none; position: fixed; top: 200px; _position: absolute; width: 450px; border: 10px solid #6F6F6F; z-index: 200; -moz-border-radius: 9px; -webkit-border-radius: 9px; margin: 0pt; padding: 0pt; color: #333333; text-align: left; font-family: arial,sans-serif; font-size: 13px;}
#fblikepop body {background: #fff none repeat scroll 0%; line-height: 1; margin: 0pt; height: 100%;}
.fbflush { cursor: pointer; font-size: 11px !important; color: #FFF !important; text-decoration: none !important; border: 0 !important;}
#fblikebg { display: none; position: fixed; _position: absolute; height: 100%; width: 100%; top: 0; left: 0; background: #000000; z-index: 100;}
#fblikepop #closeable { float: right; margin: 7px 15px 0 0;}
#fblikepop h1 { background: #6D84B4 none repeat scroll 0 0; border-top: 1px solid #3B5998; border-left: 1px solid #3B5998; border-right: 1px solid #3B5998; color: #FFFFFF !important; font-size: 14px !important; font-weight: normal !important; padding: 5px !important; margin: 0 !important; font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif !important;}
#fblikepop #actionHolder {height: 30px;overflow: hidden;}
#fblikepop #buttonArea {background: #F2F2F2;border-top: 1px solid #CCCCCC;padding: 10px;min-height: 50px;}
#fblikepop #buttonArea a {color: #999999 !important;text-decoration: none !important;border: 0 !important;font-size: 10px !important;}
#fblikepop #buttonArea a:hover {color: #333 !important;text-decoration: none !important;border: 0 !important;}
#fblikepop #popupMessage {font-size: 12px !important;font-weight: normal !important;line-height: 22px;padding: 8px;background: #fff !important;}
#fblikepop #counter-display {float: right;font-size: 11px !important;font-weight: normal !important;margin: 5px 0 0 0;text-align: right;line-height: 16px;}</style>
<script src='http://www.google.com/jsapi'/><script>google.load("jquery", "1");</script>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
kakinetworkdotcom01username="My Note Fanspage",
kakinetworkdotcom01title="Join us at Facebook!",
kakinetworkdotcom01skin="01",
kakinetworkdotcom01time="15",
kakinetworkdotcom01wait="0",
kakinetworkdotcom01lang="en"
//]]>
</script>
<script src='http://lostsector-project.googlecode.com/files/likebox-facebook-with-timer.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function(){$().kakinetworkdotcom({ closeable: true });});
//]]>
</script>

Note :

Lostsector.stars : Ganti dengan username fans page facebook sobat
Join us at Facebook : Silahkan disesuaikan dengan keinginan misalnya "Like nya dong!!"
kakinetworkdotcom01time="15" : adalah waktu (seconds/detik) yang diperlukan sampai popupnya tertutup sendiri Penting : disarankan waktu nya jangan lama2 ya,,karena bisa bikin pengunjung kesal harus menunggu lama.
Skin ="01" : Ganti dengan kode skin yang lain (01, 02, 03, 04). Contoh skinnya ada di bawah ini :

SKIN "01"

SKIN "02"

SKIN "03"

SKIN "04"

Terakhir simpan template dan lihat sendiri hasilnya

Yaapppp...sekarang gmn hasilnya..???kalau sudah berhasil kasih like nya ya,,dan kalau ada kesalahan dalam penulisan nya silahkan berkomentar dengan baik..Terimakasih !!

Sumber

Cara Memasang Yahoo Messenger di Blog

3/13/2013 10:29:00 AM

•

Ilmu Blog

Cara Memasang Yahoo Messenger di Blog - Cara membuat status online dan offline yahoo messenger atau cara menambah widget/icon yahoo messenger di blog. Setelah lama nggak update artikel seputar blogging dan SEO, kali ini saya akan update artikel cara mempercantik tampilan blog dengan judul cara memasang yahoo messenger di blog. Semua pasti tau yang namanya Yahoo Messenger kan? Aplikasi jejaring sosial yang dikeluarkan Yahoo ini memang sering digunakan untuk Chatting sesama pengguna YM maupun urusan Bisnis dan Blog, nah kali ini ada satu Tutorial bagaimana cara menambah icon yahoo messenger di blog Tentunya dengan Mudah dan Cepat, Penasaran ? Langsung saja ke TKP ...

1. Masuk ke dashbor blog sobat.

2. Klik Tata Letak >> Tambah Gadget >> Pilih HTML/Java Script.

3. Masukkan Code Berikut: