Informasi Online

Cara Menggunakan Google Drive Untuk Javascript

2016-06-01T20:27:00.000+07:00

Informasi Online - Sejak pihak Google resmi menghapus salah satu fasilitas yakni Google Code, banyak pengguna Google Code yang kebingungan dimana harus mengupload file Javascriptnya apalagi yang mempunyai link back.
Sebenarnya pihak Google pun tidak serta merta langsung menghapus fasilitas tersebut, para pengguna masih diberi waktu tenggang untuk me-backup file mereka yang telah disimpan di Google Code sebelumnya. Pihak Google memberi opsi lain, pengguna bisa menggunakan provider lain antara lain: GitHub, Bitbucket, Dropbox dan lain-lain.

Dan siapa sangka pihak Google masih menyediakan fasilitas upload file Javascript melalui Google Drive dan ternyata lebih mudah dan cepat dibandingkan dengan Google Code dan juga para pengguna diberikan ruang 15 GB Gratis untuk menyimpan file Foto, Dokumen dll :)

Disini saya akan mencoba berbagi cara menggunakan Google Drive untuk upload file Javascript.
Hal utama untuk bisa menggunakan Google Drive yakni harus mempunyai akun Gmail.

Login Gmail
Klik tombol Grid Aplikasi Google (menu sebelah kanan-atas) dan pilih Google Drive

Lihat menu sebelah kiri, klik Baru > folder (untuk membuat folder),
nama folder bisa dibuat sesuai keinginan anda lalu klik Buat untuk menyimpan folder
sebagai contoh: saya membuat folder Javascript

Untuk menggunakan folder yang telah di buat tadi, tinggal klik 2x nama Foldernya

Untuk me-Upload File: klik Baru > unggah file
Pilih file yang mau di upload sebagai contoh saya mengupload file js. Yang ada di Download

Setelah file js tadi terupload atau terunggah 100 % selanjutnya klik kanan pada file dan pilih 'Bagikan' Untuk mengatur opsi supaya kode nya bisa di lihat diweb atau blog.

Cara mengunakan kode nya buat blog yaitu copy code yang tampil dan pastekan sementara dulu di notepad.

Selanjut nya contoh menggunakan code nya untuk hosting yaitu mengambil code di tandai yang sudah di pastekan di notepad tadi Gabungkan URL nya sehingga kode menjadi seperti contoh kode di bawah ini .

Note:

https://drive.google.com/file/d/0B3q0-wpa2PDWLTZveGk2cWlZZ0E/view?usp=sharing

https://googledrive.com/host/masukan kode yang di tandai warna merah disini

https://googledrive.com/host/0B3q0-wpa2PDWLTZveGk2cWlZZ0E

Cara diatas bisa juga diterapkan untuk code HTML, CSS dan JavaScript yang bisa anda coba sendiri.
Selamat Berkreasi! :)

Cara Membuat Halaman/Fanspage Facebook dan Like Box di Blog

2014-01-02T22:40:00.000+07:00

Informasi Online - Fans page atau halaman facebook pada dasarnya digunakan untuk membangun sebuah komunitas atau grup online.

Pada akun biasa/pribadi hanya mampu menampung hingga 5000 teman sedangkan fanpage tidak terbatas.
Para blogger juga banyak yang membuat fans page facebook agar para penggemarnya dapat selalu mengikuti artikel-artikel terbaru blognya, dan dapat like (suka) dan share agar blognya semakin terkenal dan mendapatkan banyak pengunjung.

Lalu bagaimana cara membuat halaman di Facebook? Disini indolaron akan berbagi tutorial membuat halaman/fanspage facebook dan like box.

Cara Membuat Halaman/Fanspage Facebook

Login ke Facebook anda, lalu kunjungi http://www.facebook.com/pages/create.php.
Pada halaman ini anda akan menemui 6 jenis kategori, silahkan pilih kategori halaman yang sesuai dengan kebutuhan atau minat anda, misal Merk atau Produk.
Pada kolom Pilih Kategori: tentukan kategori dari halaman yang akan anda buat , dan beri nama halaman tersebut pada kolom yang tersedia lalu beri tanda centang pada Saya setuju dengan Ketentuan Halaman Facebook, Setelah itu langsung saja klik Mulai
Isi pengaturan dari halaman yang hendak dibuat,

- Kolom Tambahkan deskripsi dengan informasi umum tentang...: Silahkan beri penjelasan tentang halaman yang anda buat.
Misal: Tempat Sharing Informasi Online,berita ringan,tutorial blogger,free download,dan mengupas tentang cara meraup dollar via online, informasi lowongan pekerjaan, kerjasama bisnis, dan lain-lain.
- Kolom Situs web (misal: situs web Anda, tautan Twiter atau Yelp): Silahkan masukkan alamat situs blog atau web atau alamat profil google plus anda, jika tidak ada maka boleh dikosongkan.
- Pada bagian akhir ada pertanyaan silahkan jawab Ya atau Tidak
Klik Simpan Info
Silahkan masukkan lambang gambar atau foto pada step Foto Profil atau langsung saja klik tombol Lewati/Skip
Tentukan alamat web facebook anda, saran saya dalam pemilihan nama, sama dengan cara memilih nama alamat blog agar unik dan mudah ditemukan di google. Setelah itu tekan Atur Nama atau Lewati
Enable Ads, pada bagian ini langsung Lewati saja.

Sampai tahap ini, anda telah berhasil membuat dan mempunyai alamat Halaman Facebook.
Tahap selanjutnya yakni membuat tombol LIKE dan Memasangnya di Blog sobat tapi catan url halaman anda karena akan dibutuhkan untuk menuju tahan berikutnya.

Langkah-Langkah Membuat Like Box/Tombol Like Facebook

Buka halaman berikut: http://developers.facebook.com/docs/reference/plugins/like-box
akan muncul halaman sbb:

Setting Facebook Like Box:
- Facebook Page url: url Facebook Page anda.
- Height-Width: Tinggi dan lebar tampilan facebook like.
- Color scheme: pilih light jika ingin tampilan terang, dan dark untuk tampilan gelap.
- Show Friends' Faces: Centang untuk menampilkan foto profil likers.
- Show Post: Centang jika ingin menampilkan postingan
- Show Header: Centang jika ingin menampilkan tulisan header "Find Us on Facebook".
- Show Border: Centang jika ingin memberi border atau kosongkan agar transparan.
(Lihat preview tampilan di bawah form tersebut)
Jika sudah sesuai dengan keinginan anda, lalu klik Get Code
Kemudian akan muncul pop-up window yang menampilkan 4 jenis kode, HTML5, iFrame , XFBML dan URL, pilih salah satu dan copy kodenya. (Untuk Blogger, saya sarankan pilih HTML 5).

Langkah-langkah Memasang Like Box di Blog

Login ke Blogger anda > Buka Dashboard > Tata Letak > Klik add a gadget/tambah gadget.
Pilih opsi HTML/Javascript.
Masukkan kode yang telah dicopy ke dalam kotak kode lalu Save
Like box telah siap digunakan, dan setiap pengunjung blog/website yang menyukai blog/website anda dapat dengan mudah meng-klik like pada like box yag telah disediakan.

Jika pemasangan kode dan like box tidak muncul:

Copy paste saja semua kode ke dalam HTML/Javascript.
Misalnya ketika memilih HTML 5, kemudian ada dua kolom yang masing-masing berisi dua kode, jangan pisahkan pemasangan kode, pasang saja keduanya ke gadget HTML/Javascript secara berurutan, yaitu taruh kode kedua di bawah kode pertama. Kemudian save.
Atau opsi lain yaitu gunakan pilihan code IFRAME

Menampilkan Menu Penghasilan di Dahsboard Blogger

2013-06-28T11:05:00.002+07:00

Pada tulisan ini saya hanya ingin berbagi pengetahuan saja menurut pengalaman pribadi Admin. Jika ada diantara sobat yang bingung saat hendak mendaftar di Google Adsense via blog yang berflatform Blogspot/Blogger mungkin akan menemukan sedikit perubahan.

Coretan ini dikhusus-kan bagi sobat yang ingin main di Google Adsense ya, jika agann tidak bertujuan kearah sana menu penghasilan saya rasa tidak diperlukan.

Jika kita langsung mendaftar di situsnya yakni: https://www.google.co.id/adsense kita akan sisuruh daftar via Blogger langsung, dan jika settingan blogger anda masih Default maka di Dashboard blogger anda tidak ditemukan Menu Penghasilan.

Saya teringat bahwa dulu blog saya pernah muncul menu Penghasilan di Dasboard. Namun pada blog ini kog tidak ada. setelah saya menganalisa ternyata ada pada bahasa. Google Adsense hanya mensuport Bahasa Indonesia tapi tidak mensuport menu Blog Berbahasa Indonesia.
Langsung saja kita simak cara memunculkan menu Penghasilan di dasboard blog:
1. Login ke Blogger
2. Pilih menu Setelan > Bahasa dan Pemformatan > Pilih Bahasa Inggris

3. Refresh halaman maka menu penghasilan akan muncul, seperti gambar:

Bagaimana sobat...? Di Dasboard blog sobat sudah ada menu penghasilan nya..?
Jika menu penghasilan sudah muncul, anda sudah bisa memulai mendaftar di Google Adsense :)

Membuat Halaman 404 Pada Blogspot

2013-04-29T23:37:00.000+07:00

Halaman Error 404 adalah halaman yang akan ditampilkan bila halaman yang sebenarnya tidak ditemukan.
Saya yakin diantara sobat yang pernah Googling dengan suatu keyword tertentu dan kadang setelah diklik ternyata halaman yang kita akses telah dihapus oleh Admin/Penulis. Nah cara ini berguna untuk membantu pengunjung yang salah mengakses link / halaman yang ada di blog kita dengan memberikan petunjuk atau saran pada halaman error yang mereka akses.
Tutorial ini saya peroleh dari salah satu sobat indolaron yakni Mas Achmad Muharya.

Secara default jika kita mengakses link blogspot yang salah maka akan keluar info:

Sorry, the page you were looking for in this blog does not exist.atau
Maaf, laman yang Anda cari di blog ini tidak ada.

atau tampilanya kira-kira seperti ini:

Penasaran seperti apa sih Halaman Error 404 yang saya coba jabarkan?
Silahkan sobat buka Homepage blog masing-masing trus ditambahin kalimat/kata apapun, misal:
http://nama.blogspot.com/ganteng gimana gan hasilnya..?? :p
Nah coba klik http://indolaron.com/pelit dah tahu kan apa maksud dan arti dari postingan kali ini.

Disini ada 2 cara untuk membuat Halaman ERROR 404 yakni dari setelan blog (Preferensi penelusuran) atau dengan modifikasi HTML yang kita masukkan di bagian body blog.

CARA I: - Setelan blog

1. Login ke account blogspot
2. Setelah di Dashboard > Setelan > Preferensi penelusuran > klik edit pada Pesan Khusus untuk Laman Tidak Ditemukan
akan muncul tampilan kotak seperti ini:

3. Copy kode ini, lalu paste pada kotak Pesan Khusus untuk Laman Tidak Ditemukan

<h2 style="font-size: 35px;margin: 0;text-align: center;">Oops..! </h2>
<h3 style="font-size:17px;">Maaf Halaman Yang Anda Cari Tidak Di Temukan Atau Sudah di hapus<br><a href="URL Blog">Klik DISINI</a> untuk kembali ke Beranda <br> Have a nice Day...</h3><img src="URL gambar 404"/>

4. Klik Simpan Perubahan
Note:
* URL Blog : ganti dengan link blog atau homepage blog anda
* URL gambar 404: isi dengan link gambar ERROR 404 sesuai selera anda, misal:
- https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkiCmOxYbfME_pIs2j3uh6ASJb-koO7QlAbZ935SDfGOsn3wEl2g8drtH3OmaZXLwUxeivKVvTysFW7cbO842vw1H62-GKypkx-IVFhaJFebZH4AIOEqHAmkaX0vKIth0Ajs_C1ev8bEs/s400/404_not_found.png
- https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi82pJwmGJvKiAjLUsccNZM6VQG_M2yg17bAx7UUNeG8y8BapumW_nv9Hbi0NbEtiQjWaNQUh-QJAHj4CyNsqfSqdY5pjSVwYwLa9R5jtgri9h0FF13jQawrA1n1aWBlvSfpkG3DT5z-ow/s1600/ERROR_404.png

CARA II: - Modifikasi HTML

1. Login ke account blogspot
2. Setelah masuk di Dashboard lalu pilih Template > Edit HTML
3. Cari kode ini ]]></b:skin>
4. Masukkan kode CSS berikut tepat diatas kode ]]></b:skin>

#error-page {
text-align:center;
background-color:#fff;
position:fixed !important;
position:absolute; /* IE6 Fallback */
top:0px;
right:0px;
bottom:0px;
left:0px;
padding-top:100px;
z-index:99999;
}

5. Sekarang cari kode ini </body>
6. Lalu masukan kode HTML berikut ini diatas kode </body>

<b:if cond='data:blog.pageType == &quot;index&quot;'>
<title><data:blog.pageTitle/></title>
<b:else/>
<title><data:blog.pageName/>Oops ! | Error 404</title>
</b:if>
<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<div id='error-page'>
<h1><img src='URL gambar 404'/><br/>
You Enter a wrong page, please check Your URL once more.<br/>
Please go to <a href='URL Blog' title='Home'>Homepage</a> 
</h1>
</div>
</b:if>

7. Kemudian Simpan template.
Note:
* URL gambar 404: isi dengan link gambar error 404 sesuai selera, misal:
- https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkiCmOxYbfME_pIs2j3uh6ASJb-koO7QlAbZ935SDfGOsn3wEl2g8drtH3OmaZXLwUxeivKVvTysFW7cbO842vw1H62-GKypkx-IVFhaJFebZH4AIOEqHAmkaX0vKIth0Ajs_C1ev8bEs/s400/404_not_found.png
- https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi82pJwmGJvKiAjLUsccNZM6VQG_M2yg17bAx7UUNeG8y8BapumW_nv9Hbi0NbEtiQjWaNQUh-QJAHj4CyNsqfSqdY5pjSVwYwLa9R5jtgri9h0FF13jQawrA1n1aWBlvSfpkG3DT5z-ow/s1600/ERROR_404.png
* URL Blog : ganti dengan link blog atau homepage blog anda
SELAMAT BERKREASI.....

Tampilan Baru Edit HTML Template Blogger

2013-04-21T01:46:00.000+07:00

Beberapa hari tidak sempet update di blogger/blogspot dikarenakan ada kesibukan yang lain, dan hari ini pengen otak-atik template blog...ELADALAH tampilan Editor HTML kok beda, kaget plus bingung saya kira error :o .
Karena penasaran, kemudian saya buka blog yang lain lah kok juga sama....??? E ternyata mulai 10 April 2013 Google mengumumkan telah melakukan inovasi penyesuaian untuk Editor HTML template blogger/blogspot :p .

Jika anda melihat pada bagian editor template blogger, maka anda akan menemukan bahwa sekarang fitur tersebut mendukung line numbering, syntax highlighting, auto-indentation dan code folding.

Tampilan Baru Edit HTML Template Blogger diantaranya:

1. Tampilan yang paling mencolok adalah setiap baris html ada nomor urutnya persis di Notepad++
2. Setiap kode HTML dibedakan dengan SyntaxHighligter (kode warna-warni sesuai kelompoknya).
3. Tombol Expand Widget Templates tergantikan dengan adanya tombol Format template
4. Menggunakan sistem Collapse (klik tanda ► ) disamping nomor urut untuk menampilkan kode yang disembunyikan.

5. Editor HTML tidak lagi berbentuk popup, tapi embedded di dalam layout halaman.
6. Preview hasil editing juga tak membuka halaman baru tapi menyatu dengan Editor HTML/ditampilkan dalam 1 frame.
7. Pencarian kode dengan Ctrl+F harus di dalam kotak/bidang.

8. Penambahan fungsi Ctrl+Shift+F (untuk mengganti teks kode satu persatu) dan Ctrl+Shift+R (untuk mengganti semua kode sekaligus).

Dengan fitur atau inovasi ini diharapkan para pengguna blogspot akan lebih friendly dengan kode-kode HTML. Demikian sedikit ulasan dari indolaron, semoga kedepannya blog ini selalu memberikan info-info yang bermanfaat.
Happy Blogging :)

Membuat Recent Comments Lebih Elegan

2013-02-25T23:29:00.001+07:00

Membuat Recent Comments atau Komentar Terbaru sebenarnya banyak sekali caranya dari mulai menggunakan Widget Creator, Alamat Feed maupun Javascript

Fungsi dari widget ini sudah jelas yakni untuk menampilkan komentar terbaru pada blog. Dan sobat Info Dari Om pernah menanyakan cara membuat widget seperti ini, pada kesempatan ini, saya akan mencoba memberikan Tutorialnya.

Dan tergantung kreatifitas Anda saja untuk membuat widget seperti ini, bisa diotak-atik sendiri kode-kodenya sesuai dengan selera Anda masing-masing :)

O.K gak usah panjang lebar langsung saja jika Anda ingin membuat widget seperti ini, silahkan terapkan Tutorial berikut

Langkah-langkah Membuat Recent Comments Lebih Elegan

1. Masuk ke account Blogger sobat
2. Pilih Tata Letak >> Tambah Gadget/Widget >> Tambahkan HTML/JavaScript

<style type="text/css">
#komentar {
font:normal 11px Comic Sans MS,Verdana,Arial,Sans-Serif;
background-color:#597624;
margin:0px 0px;
padding:10px 10px;
color:#000;
border:2px solid #597624;
-webkit-box-shadow:inset 0px 0px 2px #000;
-moz-box-shadow:inset 0px 0px 2px #000;
box-shadow:inset 0px 0px 2px #000;
}

#komentar ul {
margin:0px 0px;
padding:0px 0px;
border-top:1px solid #455F20;
border-bottom:1px solid #799D1A;
}

#komentar ul li {
border-top:1px solid #799D1A;
border-bottom:1px solid #455F20;
padding:3px 0px;
list-style:none;
}

#komentar ul li b a,
#komentar ul li b a:link,
#komentar ul li b a:visited,
#komentar ul li b {
color:#D7E5FD;
text-shadow:0 1px 1px rgba(0,0,0,0.4);
}

#komentar ul li b:before {
content:url(http://3.bp.blogspot.com/-abTiDALn6h0/TpJYHn1AmoI/AAAAAAAAA8I/hRAhFSBZhlY/s1600/feed-icon-green.png);
margin:0px 4px 0px 0px;
display:inline-block;
*display:inline;
vertical-align:middle;
}
</style>
<script type="text/javascript">
var jmlkomentar = 10,
jmlkarakter = 25,
home_page = "http://www.indolaron.com";
</script>
<script src="http://indolaron-js.googlecode.com/svn/trunk/elegan_rc.js" type="text/javascript"></script>

3. Save template

Keterangan:
- http://3.bp.blogspot.com/-abTiDALn6h0/TpJYHn1AmoI/AAAAAAAAA8I/hRAhFSBZhlY/s1600/feed-icon-green.png
bisa diganti dengan url icon sesuai selera Anda inginkan
- angka 10 : jumlah komentar yang ditampilkan
- angka 25 : jumlah karakter
- http://www.indolaron.com ganti dengan alamat blog anda

SELAMAT BERKREASI....!!!! :)

Cara Mengatasi ERROR 401 - svn trunk

2013-02-15T21:43:00.003+07:00

Anda pernah mengakses blog/website dan menemukan Alert seperti ini, atau bahkan mungkin Error seperti ini menimpa pada Blog Anda sendiri..???? :p

Alert itu adalah ERROR 401, itu menandakan bahwa script yang di gunakan sudah rusak dan harus diganti agar setiap kali anda membuka web/ blog tidak disuruh mengisi username dan pasword.
Hal ini terjadi karena adanya 1 atau beberapa script yang rusak /dihapus /atau yang paling fatal adalah tempat penyimpanan kode tersebut kena baned oleh mbah google.

Jika ini terjadi pada blog Anda, maka Anda tidak usah resah karena Informasi Online akan mencoba memberi solusinya. Silahkan simak Tutorial ini dengan seksama

Langkah-langkah Mengatasi ERROR 401 - svn trunk

1. Coba ANDA lihat pada bagian yang ada dikotakan berwarna merah di atas ada tulisan https://indolaron.googlecode.com jadi sudah dipastikan yang rusak berhubungan dengan code script.
2. Lalu untuk mencari+mengetahui letak code script yang rusak,
Login > Template > Edit HTML > Lanjutkan > Centang Expand Template widget
*[ pada kasus ini saya mencari dengan keyword = https://indolaron.googlecode.com_bla_bla_bla]
Klik Ctrl + F pada keyboard nanti akan keluar seperti gambar di bawah ini:

3. Kita akan menemukan seperti gambar kode no 2 coba copy script tersebut mulai https sampai ke js sebagai contoh saya menemukan kode : https://indolaron.googlecode.com/svn/trunk/TESTING.js
4. Lalu pastekan di adressbar dan jika muncul seperti gambar di bawah ini:

Authorization Required

This server could not verify that you are authorized to access the document requested. Either you supplied the wrong credentials (e.g., bad password), or your browser doesn't understand how to supply the credentials required

Maka ini lah penyebab ERROR 401 tersebut :)
5. Untuk mengatasi hal tersebut Hapus code script yang dimaksud kemudian ganti dengan script yang fungsinya sama

Tips:
Jika anda sering comot code script maupun menerapkan Tutorial yang berisi script dari blog orang lain, usahakan simpan script di tempat penyimpanan sendiri.

Widget Statistik Jumlah Posting dan Jumlah Komentar

2012-12-25T20:16:00.000+07:00

Informasi Online - Sesuai dengan judul artikel, widget ini memiliki fungsi yakni menampilkan berapa banyak jumlah postingan dan jumlah komentar yang telah diterbitkan. Tampilannya lumayan menarik karena ada icon posting dan komentar sehingga terlihat ciamik.
Widget ini bisa menjadi acuan statistik suatu blog, untuk tampilannya kira-kira seperti ini:

Widget ini terinspirasi dari salah satu sobat indolaron yakni blog File Professional.
Bagaimana sobat, Anda tertarik juga untuk memasang widget ini? O.K tidak usah panjang lebar karena yang Panjang punyanya ... dan Lebar punyanya ... :p

Langkah Membuat Statistik Jumlah Postingan dan Komentar

1. Login di Blogger
2. Pilih Tata Letak » Tambah Gadget » HTML/Javascript
- Judul : isi dengan nama widget sesuai keinginan anda atau bisa dikosongin saja
- Konten: isi dengan code berikiut

<div class='widget-content'>
<div class="widget-content">
<div name="Posting Diterbitkan" style="margin-top: 5px; float: left; width: 150px; height: 50px;">
<div name="img" style="float: left; margin: 2px 5px 2px 2px; padding: 0pt; width: 44px; height: 44px; background: url(&quot;http://i1237.photobucket.com/albums/ff469/indolaron/icon/arsips.png&quot;) no-repeat scroll 0% 0% transparent;"></div>
<div name="contador" style="padding: 6px 0pt 0pt; margin: 0pt; font-size: 13px; font-weight: bold; font-family: Arial,Helvetica,sans-serif;"><script type="text/javascript">  function showpostcount(json) {  document.write(parseInt(json.feed.openSearch$totalResults.$t,10));  }</script><script src="/feeds/posts/default?alt=json-in-script&amp;callback=showpostcount"></script> Posting</div>
<p name="texto" style="padding: 0pt; margin: 5px 0pt 0pt; font-size: 10px; font-family: Arial,Helvetica,sans-serif;">Posting Diterbitkan</p>
</div>
<div name="comentarios" style="margin-top: 5px; margin-left: 5px; float: right; width: 150px; height: 50px;">
<div name="img" style="float: left; margin: 2px 5px 2px 2px; padding: 0pt; width: 44px; height: 44px; background: url(&quot;http://i1237.photobucket.com/albums/ff469/indolaron/icon/koments.png&quot;) no-repeat scroll 0% 0% transparent;"></div>
<div name="contador" style="padding: 6px 0pt 0pt; margin: 0pt; font-size: 13px; font-weight: bold; font-family: arial,Helvetica,sans-serif;"><script type="text/javascript">  function showpostcount(json) {  document.write(parseInt(json.feed.openSearch$totalResults.$t,10));  }</script><script src="/feeds/comments/default?alt=json-in-script&amp;callback=showpostcount"></script> Komentar</div>
<p name="texto" style="padding: 0pt; margin: 5px 0pt 0pt; font-size: 10px; font-family: Arial,Helvetica,sans-serif;">Komentar Diterbitkan</p>
</div>

Catatan:
* http://i1237.photobucket.com/albums/ff469/indolaron/icon/arsips.png
bisa ganti dengan icon artikel/posting sesuai keinginkan anda
* http://i1237.photobucket.com/albums/ff469/indolaron/icon/koments.png
bisa ganti dengan icon komentar sesuai keinginan anda
* margin-left: 5px
jarak jumlah komentar dari kiri(jarak jumlah posting - jumlah komentar)

SELAMAT MENCOBA......HAPPY BLOGGING :)

Membuat Recent Comments dengan Avatar

2012-09-17T01:48:00.000+07:00

Recent Comments With Avatar - Setiap blogger menginginkan tampilan blog yang menarik dan secantik mungkin. Selain merupakan sebuah kebanggan tersendiri, blog yang menarik juga merupakan salah satu cara untuk membuat pengunjung lebih betah dan senang berkunjung ke blog.

Cara yang paling baik adalah dengan menambahkan beberapa widget menarik pada sidebar blog. Salah satu widget yang menarik yang sebaiknya menghiasi sidebar blog adalah Recent Comments dengan Avatar.

Recent comments adalah widget yang akan menampilkan beberapa komentar terakhir di blog. Adapun jumlah komentar yang ditampilkan bisa diatur sesuai keinginan. Dengan adanya Avatar atau foto profil komentator di dekat tulisan komentar, membuat Recent Comments dengan Avatar ini lebih menarik di bandingkan Recent Commnets biasa yang tidak menampilkan avatar profil komentator.

Langkah Membuat Recent Comments dengan Avatar

1. Masuk ke account Blogger
2. Klik Layout/ Tata Letak
3. Klik Add a Gadget/Tambahkan element Baru
4. Tambahkan HTML/JavaScript

<style type="text/css">
ul.w2b_recent_comments{list-style:none;margin:0;padding:0;}
.w2b_recent_comments li{background:none !important;margin:0 0 6px !important;padding:0 0 6px 0 !important;display:block;clear:both;overflow:hidden;list-style:none;}
.w2b_recent_comments li .avatarImage{padding:3px;background:#fefefe;-webkit-box-shadow:0 1px 1px #ccc;-moz-box-shadow:0 1px 1px #ccc;box-shadow:0 1px 1px #ccc;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;}
.avatarRound{-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;}
.w2b_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}
.w2b_recent_comments li span{margin-top:4px;color: #666;display: block;font-size: 12px;font-style: italic;line-height: 1.4;}
</style>
<script type="text/javascript">
//<![CDATA[
// Recent Comments Settings
var
numComments = 5,
showAvatar = true,
avatarSize = 30,
roundAvatar = true,
characters = 30,
defaultAvatar = "http://www.gravatar.com/avatar/?d=mm",
hideCredits = true;
//]]>
</script>
<script type="text/javascript" src="http://indolaron-js.googlecode.com/svn/trunk/Recent_Comments_With_Avatar.js"></script>
<script type="text/javascript" src="http://indolaron.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=5"></script>

5. Ganti indolaron.blogspot.com dengan blog Anda.
6. Simpan

Keterangan:
avatarSize = 30        : Ukuran avatar atau gambar profil
characters = 30        : Jumlah kata pada komentar yang ingin ditampilkan.
jumlah angka 5      : Jumlah komentar yang ingin ditampilkan
SELMAT BERKREASI....

Membuat Show-Hide Komentar

2012-08-26T04:44:00.001+07:00

Indolaron kembali akan mencoba menulis artikel Tutorial Blog yakni Membuat Show-Hide Komentar pada blog. Sebenarnya tips ini sudah menjamur di blog-blog para Master,tapi berhubung saya baru menerapkan dan alhamdulillah berhasil,maka saya juga akan berbagi kepada Anda yang sedang mampir di blog sederhana ini. Tutorial ini saya tulis guna kita sesama newbie saling sharing dan berbagi informsai,dan bagi saya Tutorial ini untuk catatan online jika sewaktu-waktu kita membutuhkan.

Bentuk fisik dari Tutorial ini:'sliding' yang bisa sobat buka juga sobat tutup untuk menghemat tempat dan pastinya sudah berhasil saya terapkan.
Ini screenshot Tampilan awal sebelum di Klik:

Dan Ini screenshot Tampilan setelah di klik:

Saya rasa gak perlu panjang lebar saya jelaskan,jika Anda ingin mencoba silahkan baca dan terapkan.

Langkah Membuat Show-Hide Komentar

1. Silakan login ke akun Blogger Anda
2. Selanjutnya pilih Template - Edit HTML - Procced
3. Cari kode berikut </head> (Gunakan Ctrl+F)
4. Letakkan script berikut tepat diatas kode tadi:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
var panelSelector = '#comments',
openPanelText = "Tampilkan Komentar",
closePanelText = "Tutup Komentar",
slideDownPanelSpeed = 600,
slideUpPanelSpeed = 400;
//]]>
</script>
<script type='text/javascript'>
</script>
<script src='http://membuatgempar.net23.net/comment.js' type='text/javascript'/>

5. Setelah itu,cari kode ]]></b:skin>
6. Masukkkan code CSS berikut tepat diatasnya:

a.openpanel {display:block;width:620px;height:30px;padding:0px 0px;text-align:center;font-weight:bold;line-height:30px;background:#000;font-size:20px;font-family:Comic Sans MS;color:#0099FF;border:2px solid #0099FF;text-shadow:0 1px 0 #CCC;-moz-border-radius: 3px;-webkit-border-radius:3px;border-radius: 3px;-moz-box-shadow: 0 1px 3px #C6C6C6, 1px 1px 0 rgba(255, 255, 255, 0.4) inset;-webkit-box-shadow: 0 1px 3px #C6C6C6, 1px 1px 0 rgba(255, 255, 255, 0.4) inset;box-shadow: 0 1px 3px #C6C6C6, 1px 1px 0 rgba(255, 255, 255, 0.4) inset;}
a.openpanel em {width:0px;height:0px;display:block;position:absolute;top:15px; right:15px;border:6px solid transparent;border-top-color:white;}
a.openpanel.active {background-color:#ffffff;}
a.openpanel.active em {top:6px;border color:#222222;}
div.paneline {height:0px;-webkit-transition: all .15s ease-in-out;-webkit-transform-origin: 50% 1px;}
div.hompiPanel {padding:10px 20px 20px;margin:0px 0px !important;}

Terakhir SAVE template
---SELAMAT MENCOBA---

Hapus Tulisan Showing Post with Label

2012-08-01T04:45:00.000+07:00

Sobat pasti sudah paham apa maksud dan tujuan artikel ini,disisi lain jika sobat kurang paham silahkan simak baik-baik.
Tulisan showing post with label merupakan keterangan yang muncul pada saat kita mencoba mencari artikel-artikel pada blog yang kita kunjungi sebagai keterangan dari pencarian berdasarkan label yang kita cari. Dari keterangan ini, mudah-mudahan teman-teman sudah punya gambaran awal tentang akan kita lakukan sebentar.

Mungkin ada blogger senior yang siap untuk memberikan masukan tentang artikel cara menghilangkan tulisan showing post with label pada blog. Artikel ini akan menjadi informasi tersendiri tentang tips dan trik blog bagi indolaron untuk selalu berbagi hal-hal yang sudah saya lakukan pada blog yang sederhana ini serta teman-teman newbi yang berkunjung di blog ini.

Langkah Menghilangkan Tulisan Showing Post with Labe

1. Silakan login ke akun blog Anda
2. Pada halaman dasbor, silakan klik nama blog Anda.
3. Selanjutnya pilih Template - Edit HTML - Procced - Expand Widget Templates
4. Kemudian silakan cari kode seperti di bawah ini pada kode HTML blog Anda.

<b:includable id='status-message'>
<b:if cond='data:navMessage'>
<div class='status-msg-wrap'>
<div class='status-msg-body'>
<data:navMessage/>
</div>
<div class='status-msg-border'>
<div class='status-msg-bg'>
<div class='status-msg-hidden'><data:navMessage/></div>
</div>
</div>
</div>
<div style='clear: both;'/>
</b:if>
</b:includable>

5. Jika sudah ketemu kodenya, silakan ganti semuanya dengan kode di bawah ini:

<b:includable id='status-message'>
<b:if cond='data:navMessage'>
<div>
</div>
<div style='clear: both;'/>
</b:if>
</b:includable>

6. Save tempalte blog anda

Untuk melihat perubahan yang sudah kita lakukan, silakan pilih salah satu label atau kategori pada blog Anda. Maka tulisan showing post with label tidak akan muncul atau ditampilkan lagi sebagai keterangan dari pencarian berdasarkan label yang kita lakukan.

SELAMAT BERKREASI......

Membuat Daftar Isi Akordion dengan Sortir Label

2012-07-29T01:32:00.057+07:00

Setelah menghajar keyboard(nyapcai) disalah satu sites Paid To Typing jempol rada pegel dan mata berkunang-kungang,akhirnya beranjak sejenak meninggalkan PC dan langsung ke warteg (minta sedekah untuk makan sahur hehehe.....). Setelah makan,sambil rokok-an langsung menghadap layar Komputer lagi. Iseng-iseng buka blog indolaron,ternyata ada Visitor yang berkomentar tertarik dengan Script Sitemap yang ada di blog saya.

Memenuhi permintaan dari sobat Wammy, indolaron akan mencoba memberi Tutorial Cara Membuat Daftar Isi(Sitemap) akordion berdasarkan label.
Tutorial ini saya peroleh dari Master Web Design dan Web Develop Taufik Nurrohman. Sebenarnya saya juga gak begitu paham tentang yang di jabarkan oleh Beliau masalah JQuery,tetapi setelah saya otak-atik dan di cermati dengan seksama akhirnya code-code bisa berjalan.

Langkah Membuat Daftar Isi Akordion dengan Sortir Label

TAHAP I - MODIFIKASI kode CSS
1.Klik Template » Edit HTML » Proceed
2.Cari kode ]]></b:skin> kalau dah ketemu letakkan kode CSS berikut tepat diatasnya:

#daftar-isi {
background-color:#333;
border:2px solid #fafafa;
color:#fff;
margin-bottom:10px;
-webkit-box-shadow:0 1px 2px #000;
-moz-box-shadow:0 1px 2px #000;
box-shadow:0 1px 2px #000;
margin-top:-55px;
overflow:hidden;
}
#daftar-isi .judul-label {
overflow:hidden;
cursor:pointer;
text-decoration:none;
font:normal 13px/100% 'Electrolize',Arial,Sans-serif;
padding:10px 15px 11px;
color:#bbb;
text-shadow:0 1px 1px rgba(0, 0, 0, 0.3);
border-top:1px solid #444;border-bottom:1px solid #222;
background-color:#333;
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#3c3c3c', endColorstr='#333333');
background-image:-webkit-linear-gradient(top, #3c3c3c, #333);
background-image:-moz-linear-gradient(top, #3c3c3c, #333);
background-image:-o-linear-gradient(top, #3c3c3c, #333);
background-image:linear-gradient(top, #3c3c3c, #333);
}
#daftar-isi .headactive {
color:#efefef;
border-top:1px solid #24B6E3;border-bottom:1px solid #104968;
background-color:#248AB0;
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#248AB0', endColorstr='#21739B');
background-image:-webkit-linear-gradient(top, #248AB0, #21739B);
background-image:-moz-linear-gradient(top, #248AB0, #21739B);
background-image:-o-linear-gradient(top, #248AB0, #21739B);
background-image:linear-gradient(top, #248AB0, #21739B);
}
#daftar-isi ol {
background-color:#333;
margin:0 0;
padding:0 0;
color:#999;
list-style:none;
}
#daftar-isi li {
line-height:normal;
font:normal 11px/100% 'Verdana',Arial,Sans-serif;
margin:0 0;
white-space:nowrap;
padding:5px 5px 5px 15px;
text-align:left;
border-top:1px solid #444;border-bottom:1px solid #222;
}
#daftar-isi li:first-child {border-top:none;}
#daftar-isi a              {color:#5687f8;}
#daftar-isi a:hover        {text-decoration:underline;}
#daftar-isi a:visited      {color:#5687b8;}
#daftar-isi strong {
font-weight:bold;
font-style:italic;
color:red;
}

lalu Save template lalu Close dialog
TAHAP II - BUAT HALAMAN BARU
1.Klik Pages/Laman » New page/Laman baru » Blank page/Laman kosong
2.Beri nama halaman sesuai keinginan anda(misal:Sitemap,Daftar Isi,Table of Content,dll)
3.Pilih mode HTML
4.Copy paste code dibawah ini ke dalam formulirnya

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
var showNew    = true,
accToc     = true,
openNewTab = true, 
maxNew     = 10,
baru       = "Baru!",
sDownSpeed = 600,
sUpSpeed   = 600;
</script>
<script src="https://sites.google.com/site/indolaron/file-js/labels-accordion.js" type="text/javascript"></script>
<script src="http://indolaron.blogspot.com/feeds/posts/summary?max-results=9999&alt=json-in-script&callback=loadtoc"></script>

5. Lalu Simpan dan Terapkan
Catatan:
- Kode warna Biru : jika pada template anda sudah sudah terdapat code tsb,maka tidak perlu menyisipkan lagi
- Tulisan warna Merah! : boleh ganti dengan keinginan kalian anda (misal:New!!, Terbaru!!, dll).
- Ganti URL http://indolaron.blogspot.com dengan URL blog Anda

- var showNew : Jika bernilai true, tanda merah bertuliskan Baru! akan ditampilkan, jika bernilai false, tanda merah bertuliskan Baru! akan disembunyikan.

- accToc : Jika bernilai true, effect accordion akan diterapkan, jika bernilai false, effect accordion akan hilang sehingga semua daftar isi akan terlihat.

- openNewTab : Jika bernilai true, setiap link akan secara otomatis terbuka di tab/jendela baru saat diklik, jika bernilai false, setiap link akan terbuka di tab/jendela yang sama saat diklik.

- maxNew : Digunakan untuk menentukan jumlah maksimal Baru! yang tampil pada setiap posting baru (Menentukan seberapa banyak posting bisa disebut sebagai posting baru).

- sDownSpeed : Digunakan untuk menentukan kecepatan effect .slideDown() panel.

- sUpSpeed : Digunakan untuk menentukan kecepatan effect .slideUp() panel.

sumber: http://hompimpaalaihumgambreng.blogspot.com/2012/02/widget-daftar-isi-akordion-dengan.html#.UBQlfNlTenA
SEMOGA BERMANFA'AT...!!!

Cara Mengatasi Error XHTML Part-1

2012-04-24T01:48:00.005+07:00

Melanjutkan postingan sebelumnya tentang Validasi Blog via Validator W3. Pada artikel tersebut kita sudah menge-check seberapa ERROR kah blog kita. Secara konsep Blogger/Blogspot memang sulit untuk valid 100% karena masih banyak widget yang tidak didukung secara valid oleh W3. Sebenarnya Blogger/Blogspot hanya bisa valid CSS dan HTML melalui template Klasik dan HTML5. Setelah ditelusuri memang Template New Blogger dengan Template Klasik Blogger sedikit berbeda dan untuk mencari Tutorial Validasi Template Klasik di Mbah Google pun terbilang sulit.

Apa Manfaat Valid HTML dan CSS?
Valid CSS dan HTML adalah sesuai standar W3, sebab template website dan blog akan lebih bersahabat dengan search engine. Secara teknis search engine akan mudah mengindeks data website dan blog dengan mudah tanpa gangguan error. Hasil tersebut memudahkan web dan blog anda untuk cepat tampil pada mesin pencari seperti Google, Yahoo, Bing dsb. Valid CSS dan HTML berpengaruh erat untuk SEO (Search Optimization Engine).

SEO berperanan penting dalam kesuksesan website dan blog yang anda kelola, bagaimana tidak! Rata-rata pengunjung lebih banyak melalui search engine. Posisi serp teratas menjanjikan bisnis atau usaha yang anda kelola terbilang sukses. SEO penting untuk dipelajari lebih lanjut jika anda betul-betul mengelola website atau blog secara serius.
Blog yang Anda buka ini SENGAJA TIDAK SAYA VALIDASI dengan alasan tertentu,dan jika sobat ingin lihat beberapa blog yang berhasil saya Validasi silahkan cek blog ini:
1. http://blog-indolaron.blogspot.com

Gimana sobat hasil setelah blog sobat di cek Validatro W3, Passed(Lulus) atau Error? Jika setelah dicek dan ternyata muncul bebereapa Error dan Warning,maka perlu perbaikan mulai dari penulisan html yang benar,meletakkan code-code tepat pada tempatnya,mengatur widget dan lain sebagainya.

Langkah-langkah Cara Mengatasi Error XHTML

1. Memperbaiki "DOCTYPE",letaknya pada bagian paling atas
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Ubah menjadi:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

2. Menghapus Navbar pada template,Letakkan kode ini tepat sesudah kode </head>

<!-- <body><div></div> -->

3. Pada sebagian template sering kita lihat deklarasi seperti ini misalnya:
/* Header
------------------------------ */ atau /*------------Header----------*/
Hal yang harus dilakukan adalah menghapus semua bentuk deklarasi template blogspot yang menggunakan garis panjang tersebut. Sehingga format deklarasi yang benar adalah:

/* Header */

4. Setiap kali kita melakukan aksi Add Gadget/Menambahkan Widget baru,pasti di bagian html akan muncul kode seperti ini:

<b:include name='quickedit'/>

Jadi pastikan kamu MENGHAPUSNYA lagi setiap melakukan penambahan gadget.

5. Setiap kita upload gambar diposting akan tampil html-nya sbb:

Kode uploadan akan dianggap ERROR oleh W3 Validator jika tetap dibiarkan begitu. Untuk membuat valid jika kita habis upload gambar maka hapus kode yang berwarna merah dan tambahkan kode "alt" pada setiap gambar yang diposting, sehingga menjadi:

6. Jika pada template sobat menggunakan Meta Content:

<b:include data='blog' name='all-head-content'/>

Ubah menjadi:

<!-- Blogger Default Meta -->
<meta content='true' name='MSSmartTagsPreventParsing'/>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<link expr:href='data:blog.url' rel='canonical'/>
<link href='http://www.blogger.com/profile/IDBLOGGERANDA' rel='me'/>
<link href='http://www.blogger.com/openid-server.g' rel='openid.server'/>
<link href='http://www.blogger.com/rsd.g?blogID=IDBLOGANDA' rel='EditURI' title='RSD' type='application/rsd xml'/>
<link href='http://www.blogger.com/feeds/IDBLOGANDA/posts/default' rel='service.post' title='NAMABLOGANDA - Atom' type='application/atom xml'/>
<link href='http://www.URLANDA.blogspot.com/feeds/posts/default' rel='alternate' title='NAMABLOGANDA - Atom' type='application/atom xml'/>
<!-- End Blogger Default Meta -->

Tunggu postingan berikutnnya cara untuk mengurangi Error xhtml

Cara Membuat Related Post(Postingan Terkait)

2012-04-16T21:03:00.009+07:00

Mendengar perkataan Related Post saya yakin para sahabat blogger sudah tahu maksudnya. Tetapi masih banyak juga yang memiliki blog dan tidak membuat related post pada postingnya. Hal ini tentu saja akan merugikan blog itu sendiri, mengapa saya katakan demikian ?? Karena dengan adanya related post atau artikel terkait di setiap postingan, tentu saja ini akan memberikan backlink kepada posting yang lama dan visitor bisa mengunjungi postingan tersebut walaupun sudah lama dipublish. Bagaimana sobat, anda ingin tahu Cara Membuat Related Post/Postingan Terkait? Silahkan baca dan terapkan step-step nya:

Langkah-langkah Membuat Related Post

1. Login ke Blogger.com --> Design --> Edit HTML
2. Lalu tandai kotak kecil Expand Widget
3. Lalu cari kode <data:post.body/> jika menemukan banyak kode tersebut, gunakan kode yang ke-2
4. Copy-paste kode berikut di bawah kode <data:post.body/>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<p style='font-style:bold;'>ARTIKEL TERKAIT:</p>
<div class='rbbox'>
<div style='margin:0; padding:10px;height:150px;overflow:auto;border:1px solid #ccc;'>
<div id='albri'/>
<script type='text/javascript'>
var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 15;
maxNumberOfPostsPerLabel = 50;
maxNumberOfLabels = 3;
function listEntries10(json) {
var ul = document.createElement(&#39;ul&#39;);
var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i &lt; maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k &lt; entry.link.length; k++) {
if (entry.link[k].rel == &#39;alternate&#39;) {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement(&#39;li&#39;);
var a = document.createElement(&#39;a&#39;);
a.href = alturl;
if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l &lt; json.feed.link.length; l++) {
if (json.feed.link[l].rel == &#39;alternate&#39;) {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);
var txt = document.createTextNode(label);
var h = document.createElement(&#39;b&#39;);
h.appendChild(txt);
var div1 = document.createElement(&#39;div&#39;);
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById(&#39;albri&#39;).appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement(&#39;script&#39;);
script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;
+ label +
&#39;?alt=json-in-script&amp;callback=listEntries10&#39;);
script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);
document.documentElement.firstChild.appendChild(script);
}
var labelArray = new Array();
var numLabel = 0;
<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = &quot;<data:label.name/>&quot;;
var test = 0;
for (var i = 0; i &lt; labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel &lt; maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>
<script type='text/javascript'>RelPost();</script>
</div>
</b:if>

5. Kemudian cari kode ]]></b:skin>
6. Copy-paste code CSS berikut ini tepat diatasnya

.rbbox{ border: 1px solid #000000; padding: 5px; background-color: #F2F2F2; -moz-border-radius:5px; margin:5px;}
.rbbox:hover{background-color: #EFFBEF;}
.rbbox ul li {
display : block;
background : url(http://i1237.photobucket.com/albums/ff469/indolaron/icon/007.png) no-repeat 0px 0;
margin-left : -10px;
padding-top : 0;
padding-right : 0px;
padding-bottom : 1px;
padding-left : 20px;
margin-bottom : 5px;
line-height : 1em;
border-bottom:1px dotted #cccccc;}

Terakhir klik Save/Simpan
KETERANGAN:
*ARTIKEL TERKAIT,bisa Anda ganti sesuai keinginan...misal:Related Post,Baca Juga,dll
*maxNumberOfPostsPerLabel = 50 adalah jumlah posting atau artikel terkait yang ingin di tampilkan *maxNumberOfLabels = 3 adalah jumlah label terkait yang ingin ditampilkan
* #F2F2F2 adalah warna background kotakan(bisa anda ganti sesuai keinginan)
* #EFFBEF adalah warna background waktu disorot kursor(bisa diganti sesuai keinginan)
*http://i1237.photobucket.com/albums/ff469/indolaron/icon/007.png adalah icon didepan link(bisa diganti sesuai keinginan,usahaka size gambarnya kecil)

Cara Mengatasi Error XHTML Part-2

2012-04-15T02:49:00.044+07:00

Kembali lagi kita akan membahas tentang Validasi XHTML W3. Pada proses validasi kita akan menemukan tempat-tempat dimana letak error berada dan oleh Validator w3 juga telah dijelaskan cara memvalidasi-nya. Error dan Warning tersebut kadang kita dengan mudah menemukan letaknya dan kita pun langsung menuju TKP dan melakukan tindakan Perbaikan. Tapi terkadang kita juga akan mendapat sedikit kesulitan dimana letaknya,sebagian Error muncul karena SETTING-an mulai dari template,post,widget,code css yang diletakkan diwidget,dan sebagainya.

Pada postingan kali ini Blog Portal Information akan sedikit memberikan cara mengatasi error xhtml, dan ini sudah admin terapkan pada blog ini dan hasilnya lumayan memuaskan.
1. Silahkan masuk ke situs http://validator.w3.org
2. Masukkan url blog sobat pada Address Box
3. Kemudian pilih More Options
4. Centang pada Show Source untuk menampilkan dimana letak error jika ada dan juga Group Error Messages by Type untuk menampilkan Pesan Kesalahan Menurut Jenis.
5. Kemudian klik Check untuk memulai proses validator.
Bagaimana hasilnya,berapa jumlah Errors dan Warning(s) blog Anda? Gak usah galau gak usah risau ada jalan keluarnya kok :)
6. Baca keterangan yang ada lalu eksekusi/lakukan tindakan.
Berikut beberapa contoh error dan Warning dan cara mengatasinya.

Misal keluar keterangan seperti ini:

Line xxx, column xxx: required attribute "alt" not specified

…PhI/AAAAAAAAA5o/RQRi25ssEV4/s640/black-menu.JPG" width="640" /></a></div><br />
Tindakan:
-Cari gambar yang dimaksud,lalu tambahkan atribute alt pada gambar
-Untuk menambah-kan atribut alt silahkan baca di Cara Mengatasi Error XHTML Part-1 (no.5)
Line xxx, column xxx: required attribute "type" not specified

<script style="text/javascript"> bla..bla..bla …
Artinya:
Letak error pada style, style (digunakan untk "text/css") dan type (digunakan utk "text/javascript").
Tindakan:
Ubah style menjadi type,sehingga codenya menjadi

<script type="text/javascript"> bla..bla..bla …
Line xxx, column xxx: & did not start a character reference. (& probably should have been escaped as &.)

…spot.com/search/label/Tutorial%20Blog?&max-results=7' rel='tag'>Tutorial Blog<…
Artinya: letak error pada &
Tindakan:
Karena letak persis didepan code max-results=7,maka cari code max-results=7 terlebih dahulu. Jika dah ketemu,disana penulisannya khan spt ini : & amp;max-results=7
maka ganti & dengan

&
sehingga codenya menjadi:

&amp;max-results=7

Cara Pasang Icon Smile Pada Blogspot

2012-04-02T13:05:00.012+07:00

Ada sahabat yang bertanya tentang cara membuat smile icon pada Blog atau tepatnya kalo dilayanan Blog lain semisal Wordpress, setiap Anda mengetikkan
tanda ini : ) maka yang muncul adalah gambar ini
tanda ini : p maka yang muncul gambar ini dan lain-lain .
Nach kalo gitu kan akan membuat blog Anda menjadi lebih expressive. Sayangnya, bagi Anda yang memakai layanan diBlogger tidak mendapat fasilitas tersebut. Tapi indolaron akan mencoba membahas bagaimana supaya bagi Anda yang memakai layanan Blogger bisa seperti yang ada di Wordpress.

Langkah-langkahnya sebagai berikut:

1. Login di Blogger.com
2. Kemudian klik Template --> Edit HTML
3. Cari code ]]></b:skin> lalu letakkan code berikut tepat dibawah-nya

<script src='https://sites.google.com/site/indolaron/file-js/addSmiley.js' type='text/javascript'/>

4. Kemudian Save Template
Gimana hasilnya? Selamat mencoba Happy Blogging :)

Catatan:
Widget Followers/Pengikut akan mengalami ERROR, jika pada template sobat tidak menggunakan widget Followers trik tutorial ini akan bekerja dengan baik

Cek validasi Blog di Validator W3

2012-03-17T09:51:00.007+07:00

Buat sobat blogger yang ingin mengecek blognya dari segi kode-kode html di blog kita apakah ada yang error atau tidak, dapat di check di situs W3 Markup Validation Service
W3 Markup Validation Service adalah sebuah situs penyedia service untuk mengecek kode-kode HTML yang berada dalam blog sudah valid dan ditulis dalam kode yang benar.
Jika sobat ingin mengecek seberapa valid-kah blog/web,sobat bisa ikuti langkah-langkah berikut:

1. Silahkan masuk ke situs http://validator.w3.org.
2. Di halaman awal akan tampil sebuah Address Box,
3. Masukkan url blog sobat yang ingin dicek valid nya pada Address Box tadi .
4. Kemudian pilih More Options
5. Berikan centang pada Show Source untuk menampilkan dimana letak error jika ada dan juga Group Error Messages by Type untuk menampilkan Pesan Kesalahan Menurut Jenis.
6. Kemudian klik Check untuk memulai proses validator.
Silahkan coba cek blog sobat dan belajarlah mengurangi Error tersebut dengan memperhatikan bagian-bagian Error yang ada dibagian bawah penjelasan W3 Validator.

Validitas sebuah halaman blog/web, entah suatu mitos ataukah benar adanya, sangat berpengaruh kepada posisi artikel kita di SERPs. Hal ini sangat berbanding terbalik dengan template blogspot yang memang tidak ada yang valid. Yang bisa dilakukan adalah hanya menekan tingkat error se-minimal mungkin.
Iseng-iseng saya coba cek validitas halaman Mbah Google di validator.w3.org, sebuah layanan untuk validasi halaman web. Dan hasilnya sungguh mengejutkan:

Apa mungkin ini sebabnya blog copas-pun bisa bersaing di SERPs asal ngeblognya di blogspot? Lha wong Mbah-nya ja dah gak bener...hehe. Tapi jika saya boleh mengutip salah satu Web Developer-nya W3 Validator, David Dorward;
"Nothing wrong with the validator here, it just knows HTML better than you do".
mungkin ada benarnya. Tidak ada yang salah dengan urusan valid atau tidaknya sebuah halaman web. Tapi dengan W3 Validator kita bisa tahu bagaimana menulis HTML yang lebih baik dari yang sudah-sudah.

Dan sayapun mencoba cek ke-validatan blog saya,BUJUG....setelah saya cek ternyata blog ane ERROR-nya berjibun hufh... :o ampe 263 Errors, 236 warning(s) (saat posting ini)

Dan sayapun ingin mencari dan memperbaiki dimana letak ERROR+WARNING-nya. Semoga beberapa hari ini saya bisa menekan tingkat error se-minimal mungkin. AMIN....!!!

Buka Tab Baru Ketika klik Nama Blog

2012-02-10T10:25:00.007+07:00

Sobat paham maksud judul di atas ? Yuk kita ulas bersama maksimalkan link komentar, maksud dari judul blog di atas ialah ketika kita mengklik langsung nama/nickname komentar pengunjung, (tanpa menggunakan fungsi open new tab) blog kita pasti akan tenggelam,gak mau dong blog kita ditinggalkan begitu saja.

Jika sobat masih belum paham, coba sobat klik salah satu nama/nickname komentar pengunjung di blog ini,gimana? sudah paham maksud artikel yang saya bahas?
Coba perhatikan gambar berikut:

O.K saatnya menerapkan,jika sobat ingin mencoba Tutorial ini simak langkah-langkahnya sbb:
1. Masuk ke account Blogger.com sobat
2. Klik Template > Edit HTML > Lanjutkan > centang Expand Template Widget
3. Note: Untuk mencegah hal-hal yang tidak di inginkan sebaik backup dulu template sobat/download full template.
4. Ok sekarang cari kode dibawah ini . (gunakan Ctrl + F)

<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
<b:else/>

Lalu tambahkan kode merah berikut target='_blank' di antara kode diatas,shg mjd:

<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow' target='_blank'><data:comment.author/></a>
<b:else/>

Terakhir klik Save/Simpan

Mengatur Jarak Spasi Di Bawah Kotak Komentar

2011-12-21T23:21:00.012+07:00

Mungkin cara untuk mengedit template blogger kali ini akan sangat berguna bagi sobat yang suka ngeblog dengan blogspot.
Sering kali kita mendapatkan template blogspot yang jarak antara kotak komentar dengan footer terlalu jauh dan kerena terlalu jauhnya footer blog kita tidak terlihat oleh pengunjung.
Sebelumnya jarak spasi di bawah kotak komentar blog ini memiliki jarak yang lumayan panjang, setelah saya melakukan uji coba dengan trik saya sendiri, akhir nya berhasil tanpa error sedikitpun, karena saya hanya merubah dan mengatur jumlah height dari template blog di bagian kode komentar.

Awalnya blog ini memiliki jarak 410 dengan footer,perhatikan gmbr sbb:

Oleh karena itu saya berikan cara mengatur/ merubah jarak spasi di Bawah kotak komentar agar terlihat lebih dekat.
1. Login Blogger
2. Klik Template > pilih tab Edit HTML > Lanjutkan
3. centang Expand Widget Templates
4. Cari kode dibawah ini dengan menekan keypad ctlr+F yang mirip sebagai berikut :

<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='100%'/>

6. Jika ada 2 kode yang sama,pilih yg pertama lalu Ganti jumlah yang berwarna merah sesuai keinginan Anda (saya menggantinya dengan jumlah 210)
7. Jika sudah di ganti, klik tombol Simpan Template, dan lihat hasil nya.
Bagaimana berhasil kan, saya harap sih berhasil, karena saya telah membuktikan cara nya pada blog ini.

SELAMAT BERKREASI............. :)

Menghilangkan Garis Bawah Pada Link

2011-12-17T01:36:00.014+07:00

Berbicara mengenai link, pada kesempatan kali ini saya coba berbagi tips sederhana untuk menghilangkan garis bawah (underline) pada suatu link yang biasanya ada di blogspot (bawaan template).
Biasanya setiap link atau tautan yang ada di blog bila disorot oleh mouse akan muncul garis bawah pada link tersebut. Ada juga yang tanpa disorot sudah ada garis bawahnya, tergantung rancangan template blog masing-masing. Sebenarnya, garis bawah link ini dapat dihilangkan bila Anda tidak menyukainya. Yang perlu Anda lakukan adalah mengubah kode CSS template blog pada bagian yang membuat link bergaris bawah.

Kode CSS yang berhubungan dengan link biasanya tampak seperti di bawah ini:

a:link {

color:#007ACC;

text-decoration:underline;

}

a:visited {

color:#007ACC;

text-decoration:underline;

}

a:hover {

color:#5588AA;

text-decoration:underline;

}

Berikut sedikit penjelasan tentang kode di atas:

a:link {
color:#007ACC;
text-decoration:underline;
}

Artinya:Kode di atas berarti link yang belum pernah dikunjungi atau diklik akan berwarna #007ACC dan bergaris bawah.

a:visited {
color:#007ACC;
text-decoration:underline;
}

Artiya:Kalau kode yang ini mempunyai arti link yang sudah pernah dikunjungi akan berwarna #007ACC dan bergaris bawah.

a:hover {
color:#5588AA;
text-decoration:underline;
}

Artinya:Sedangkan kode yang yang ini menunjukkan link pada saat mouse di atasnya akan berwarna #5588AA dan bergaris bawah.

Lalu, yang manakah kode yang membuat link bergaris bawah? Ya, dari penjelasan di atas sudah tergambar kalau yang membuat link bergaris bawah adalah kode text-decoration:underline;
Nah, untuk menghilangkan garis bawah link Anda ubah semua kata underline dengan none sehingga menjadi text-decoration:none;

Gimana...mudah bukan??? :p
Happy Blogging

Cara Membuat Jumlah Komentar Disamping Judul Posting

2011-12-16T16:18:00.066+07:00

Pada edisi kali ini(chailah bahasanya :)) Blog Informasi Online akan mencoba menulis Tutorial yang masih berhubungan dengan Komentar Blog. Apakah itu? Yap...benar! Kali ini kita akan mengotak-atik Cara Membuat Jumlah Komentar Disamping Judul Posting. Sebenarnya link jumlah komentar berada disamping judul postingan,dibawah judul posting maupun berada dibawah postingan itu sah-sah saja,tergantung selera Blogger masing-masing. Di Artikel ini Admin hanya berkreasi untuk mempercanting template blog.

Gak usah panjang lebar,jika sobat ingin mencoba menerapkan Tutorial ini,silahkan ikuti Langkah-langkah berikut:

1. Login di Blogger.com

2. Klik Template > Edit HTML > Lanjutkan

3. Jangan lupa centang Expand Template Widget

4. Cari code ]]></b:skin> ,letakkan CSS berikut tepat diatasnya

.comment-ballon{
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8e3qlBf3oFWxBJPcsD8VFBucXURJCXOXjXJ4RM4KpUA2jXWl9tvQACncHMoLbAtVrnYI0Oc-jULXIvxa307OsL22xU_5W5pJDrQwSzJQlcjKb3FJdMdBDdx7ET12_kCDyCsPhwFfc0hU/s1600/comments.png) no-repeat;
width:32px;
height:32px;
text-align:center;
font-size: 16px;
float: right;
padding-top: 3px;
margin-right: 10px;
font-color: #ffffff;
}
.comment-ballon a{
color: #000000;
}

5. Cari kode berikut dengan cara Ctrl + F:

<a expr:name='data:post.id'/>

biasanya ada 2 code sejenis,pilih yang pertama

6. Jika sudah ketemu,letakkan code dibawah ini tepat diatasnya

<div class='comment-ballon'><b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <b:else/><data:post.numComments/> </b:if></a>
</b:if></div>

Jangan buru-buru di Save,klik "Preview/Pratinjau" terlebih dahulu. Gimana hasilnya? Sudah muncul belum jumlah komentar disamping Judul Postingan?
Jika sudah muncul,itu artinya kerja kita hampir selesai.
Perhatikan dibawah postingan juga masih muncul jumlah komentar gak?
Coba lihat gambar berikut:

7. Untuk menghilangkan Jumlah komentar dibawah postingan,cari kode berikut lalu HAPUS kode tsb:

<span class='post-comment-link'>
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
</b:if>
</b:if>
</span>

SELAMAT BERKREASI....

Cara Menambahkan 3 Kolom Di Bagian Footer

2011-11-14T23:45:00.009+07:00

Sebenarnya Menambahkan kolom tambahan ke bagian footer Anda akan memberikan lebih banyak ruang berharga untuk widget blog, dan juga berkontribusi "Web 2.0" modern banding untuk desain blog Anda.

Hanya ada empat langkah utama untuk tutorial ini, dan semua proses secara keseluruhan cukup sederhana. hack ini footer adalah khusus untuk blog yang memiliki lebar yang berbeda dan gaya, dan sebagainya bloggerbuster telah merancang solusi cairan yang harus bekerja di setiap template layout Blogger.

Membuat kolom baru Footer
Back up template blog yang ada! Sebelum membuat modifikasi pada template blog Anda!

Untuk membuat cadangan template yang ada Anda, pergi ke Template> Edit HTML di dashboard Blogger Anda, dan klik pada link "Full Download Template" di dekat bagian atas halaman. Anda kemudian dapat menyimpan file yang ada template XML untuk komputer Anda.

Tambahkan kode ekstra untuk bagian footer
Pergi ke Template> Edit HTML di dashboard Blogger Anda, dan jangan centang "Expand Template Widget" kotak (ini menyederhanakan proses).

Sekarang Anda perlu menemukan bagian ini dalam template Anda:

<div id='footer-wrapper'>
<b:section class='footer' id='footer'/></div>

kita perlu mengubah code yang berwarna merah dengan code berikut:

<div id='footer-column-container'>
<div id='footer2' style='width: 30%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col1' preferred='yes' style='float:left;'/>
</div>
<div id='footer3' style='width: 40%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col2' preferred='yes' style='float:left;'/>
</div>
<div id='footer4' style='width: 30%; float: right; margin:0; text-align: left;'>
<b:section class='footer-column' id='col3' preferred='yes' style='float:right;'/>
</div>
<div style='clear:both;'/>
<p>
<hr align='center' color='#5d5d54' width='90%'/></p>
<div id='footer-bottom' style='text-align: center; padding: 10px; text-transform: lowercase;'>
<b:section class='footer' id='col-bottom' preferred='yes'>
<b:widget id='Text2' locked='false' title='' type='Text'/>
</b:section>
</div>
<div style='clear:both;'/>
</div>

Menambahkan style untuk bagian footer baru
Cari kode </b:skin> lalu letakkan code berikut sebelum kode </b:skin>

#footer-column-container {
clear:both;
}
.footer-column {
padding: 10px;
}

Sekarang Anda telah selesai menambahkan bagian-bagian baru untuk footer Anda, pergi ke bagian Tata Letak Anda dashboard Blogger (Template> Tata Letak), dan Anda akan melihat kolom baru tiga, ditambah bagian yang lebih rendah yang membentang lebar dari semua kolom tiga, untuk yang kini Anda dapat menambahkan widget baru!

Saya menambahkan garis horizontal ke bagian footer untuk memastikan bahwa ada perbedaan yang jelas antara konten di kolom footer dan konten dalam bagian bawah yang lebih luas. Jika Anda ingin mengubah warna baris ini, Anda dapat melakukannya dengan mengganti nilai warna dengan warna yang berbeda:

SELAMAT BERKREASI.............

Membuat Recent Comments dan Recent Post

2011-11-04T18:36:00.015+07:00

Tutorial Blog kali ini akan membahas tentang Cara Membuat Recent Comments dan Recent Post. Ada beberapa cara untuk membuat Widget ini,dari mulai menggunakan widget creator,alamat feed maupun Javascript. Tutorial Blog kali ini akan menggunakan Alamat Feed untuk menghindari loading page yang terlalu berat jika kita menggunakan Javascript.
Berikut Tutorial-nya:

Cara Membuat Recent Comments/Komentar Terbaru

1. Login ke Account Blogger anda
2. Pada Dashbord --> Tata Letak--> Add a Gadget(Tambahkan Elemean)
3. Pilih Feed dan masukkkan url feed berikut,
http://bloganda.blogspot.com/feeds/comments/full

kemudian pilih continue/lanjutkan, jangan lupa mengganti tulisan yang berwarna merah dengan nama blog anda

4. Jika Muncul pop up window, isikan
- Title/Judul : label widget anda (misal : komentar terbaru, recent comments dll,)
- Show : jumlah komentar yang akan ditunjukkan (max 5 item),
- Anda bisa menampilkan atau tidak tanggal dan pembuat komen dengan mencentang kotak item date dan item source/author

5. Klik Save dan lihat hasilnya

Cara membuat Recent Post atau Artikel/Posting Terbaru

1. Login ke Account Blogger anda
2. Pada Dashboard --> Tata Letak --> Add a Gadget(Tambahkan Elemean)
3. Pilih Feed dan masukkkan url feed berikut,
http://bloganda.blogspot.com/atom.xml

kemudian pilih continue/lanjutkan, jangan lupa mengganti tulisan yang berwarna merah dengan nama blog anda

4. Jika Muncul pop up window, isikan
- Title/Judul : label widget anda (posting terbaru, recent post dll,)
- Show: jumlah posting yang akan ditunjukkan (max 5 item),
- Anda bisa menampilkan atau tidak tanggal dan pembuat komen dengan mencentang kotak item date dan item source/author

5. Klik Save dan lihat hasilnya.

Hanya Menampilkan Judul Posting

2011-11-03T15:06:00.013+07:00

Kita sering menjumpai pada banyak blog ketika kita mengklik tabel atau category dan waktu kita mengetik Keyword di kotak pencarian postingan yang tampil sangat banyak sesuai dengan banyaknya postingan yang diberi label yang kita klik dan parahnya jika blog tersebut tidak menggunakan readmore sehingga loading page akan sangat lama dan berat, nah untuk solusinya kita bisa terapkan trik berikut yang hanya menampilkan judul posting ketika diklik.
Dan sayapun menerapkan trik tersebut

Screenshot waktu mengetik Keyword di Kotak Pencarian
Contohnya saya ketik keyword "blog"

Jika Anda ingin mencoba silahkan ikuti langkah-langkah berikut:

1. Login dulu di Blogger.com
2. Pilih Template > Edit HTML > Lanjutkan > centang Expand Template Widget
3. Cari kode berikut:

<b:include data='post' name='post'/>

4. Lalu hapus dan ganti kode tersebut dengan kode berikut:

<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<a expr:href='data:post.url'>
<div style='border: 1px solid #333; padding: 5px; font-family: Pristina; font-size: 20px; margin: 0px 5px 2px;'><data:post.title/></div></a>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>

Kode yang berwarna merah bisa kalian edit sesuai keinginan anda
5. Terakhir Save Template

Good Luck..!!

Cara Membuat Reply Komentar

2011-11-02T20:47:00.017+07:00

Reply Komentar di kotak komentar blogspot, itu sangat penting untuk dipasang pada blog kita. Dengan begitu anda akan lebih mudah menjawab setiap komentar para pengunjung pada setiap postingan.

Selain itu cara ini juga akan memudahkan para pengunjung blog untuk membalas setiap komentar yang ditinggalkan oleh pengunjung yang lain. Sehingga kotak komentar kita akan lebih praktis menjawab pertanyaan atau kritik dan saran para pengunjung.

Langkah Cara Membuat Reply Komentar di kotak komentar blogspot

1. Login ke akun Blogger anda.
2. Klik Template > Edit HTML > Lanjutkan
3. Centang Expand Template Widget (saya anjurkan download dahulu template anda).
4. Cari kode seperti dibawah ini:

<b:include data='comment' name='commentDeleteIcon'/>

5. Jika sudah ketemu, maka copy paste-kan kode di bawah ini persis berada dibawahnya:

<a expr:href='&quot;https://www.blogger.com/comment.g?blogID=Blog ID anda&amp;postID=&quot; + data:post.id + &quot;&amp;isPopup=true&amp;postBody=%40%3C%61%20%68%72%65%66%3D%22%23&quot; + data:comment.anchorName + &quot;%22%3E&quot; + data:comment.author + &quot;%3C%2F%61%3E#form&quot;' onclick='javascript:window.open(this.href, &quot;bloggerPopup&quot;, &quot;toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=yes,width=400,height=450&quot;); return false;'><img alt='Reply To This Comment' src='Url Image Reply Anda'/></a>

Blog ID anda → Silahkan ganti dengan Blog ID (nomor id blog) anda.
Url Image Reply Anda → Silahkan ganti dengan Url gambar reply anda.

6. Klik Simpan Template.

Jika sobat belum mempunyai Url Image Reply, silahkan gunakan Url gambar di bawah ini:

SELAMAT MENCOBA....