September 2008 ~ Blog Tip dan Trik

Tuesday, September 23, 2008

Memasang Mesin Pencari 4 Dalam 1

Posted by dav on 8:33 AM with

Sesuai judul artikel kali ini, kita akan mencoba memasang 4 buah mesin pencari dalam satu kotak pencarian. Teknik ini awalnya dibuat oleh PurpleMoggy setelah melalui percobaan panjang. 4 mesin pencari yang akan kita pasang adalah ; pencarian didalam blog itu sendiri (Self Search), pencarian dengan bantuan google (Google Blog Search), pencarian dengan bantuan blogger (Blogger Search) dan pencarian dengan bantuan technorati (Technorati Search). Dengan 4 mesin pencari ini mudah-mudahan akan membantu para pengunjung (visitor) untuk menemukan apa yang mereka butuhkan.

Berikut langkah demi langkah proses pemasangan 4 mesin pencari dalam blogger :

Langkah 1
Login ke blogger account anda

Langkah 2
Panel Kontrol - Tata Letak - Edit HTML - Expand Widget
Backup terlebih dahulu blogger template anda untuk mencegah kemungkinan yang tidak kita inginkan.

Langkah 3
Cari kode dibawah ini :

</head>

Langkah 4
Letakan (copy-paste) kode dibawah ini tepat diatas kode langkah 3 :

Langkah 5
Simpan template anda, sruput riyen kopi plus gendis jawi...

Langkah 6
Kembali ke Tata Letak dan tambahkan Element Halaman - HTML/JavaScript dan letakan (copy-paste) kode dibawah ini didalam konten setelah itu klik tombol "Simpan" :

<div id="pm-search">
<ul>
<li id="li-h" class="pm-search-selected" onclick="selectH()">here</li><li id="li-g" class="pm-search-unselected" onclick="selectG()">google</li><li id="li-b" class="pm-search-unselected" onclick="selectB()">blogger</li><li id="li-t" class="pm-search-unselected" onclick="selectT()">technorati</li>
</ul>
<div id="pm-search-h">
<form action="http://modification-blog.blogspot.com/search" method="get">
<input id="pm-f-h" value="" name="q" size="15" type="text"/>
<input value="Search" type="submit"/>
</form>
</div>
<div id="pm-search-g">
<form action="http://blogsearch.google.com/blogsearch" method="get">
<input id="pm-f-g" value="" name="as_q" size="15" type="text"/>
<input value="Search" type="submit"/>
<input value="modification-blog.blogspot.com" name="bl_url" type="hidden"/>
</form>
</div>
<div id="pm-search-b">
<form action="http://search.blogger.com/" method="get">
<input id="pm-f-b" value="" name="as_q" size="15" type="text"/>
<input value="Search" type="submit"/>
<input value="modification-blog.blogspot.com" name="bl_url" type="hidden"/>
</form>
</div>
<div id="pm-search-t">
<form action="http://www.technorati.com/search.php" method="post">
<input id="pm-f-t" maxlength="255" name="s" size="15" type="text"/>
<input value="Search" type="submit"/>
<input value="searchlet" name="sub" type="hidden"/>
<input value="modification-blog.blogspot.com" name="from" type="hidden"/>
<input value="n" name="authority" type="hidden"/>
<input value="n" name="language" type="hidden"/>
</form>
</div>
</div>

Keterangan :

modification-blog.blogspot.com : Alamat blog silahkan ganti dengan alamat blog anda
Nilai 15 : adalah lebar dari kotak input keyword
Search : nama tombol sebelah kanan kotak input silahkan ganti sesuai keinginan anda (misal : Cari)

Mudah-mudahan bermanfaat, dan jika ada bug silahkan tinggalkan komentar. Salam hangat dari Banjarsari - Ciamis - Jawa Barat - Indonesia - Bumi...

Tips Trik Widget

Monday, September 22, 2008

Collapse Posting with Readmore 2

Posted by dav on 7:07 AM with

Pada posting sebelumnya saya pernah menuliskan teknik pemenggalan posting dengan teknik simple/sederhana. Pada posting kali ini kita akan menggunakan teknik pemenggalan posting dengan Peekaboo. Perbedaan mendasar antara simple dengan peekaboo adalah proses loading main page. Pada teknik simple, posting halaman per halaman benar-benar di penggal sehingga ketika kita meng-klik Selengkapnya.../Readmore... melalui halaman utama (main page) maka kita akan di arahkan ke halaman baru. Sedangkan pemenggalan posting dengan peekaboo adalah teknik melipat halaman perhalaman pada halaman utama, ketika kita meng-klik Selengkapnya.../Readmore... maka kita tidak akan di arahkan ke halaman yang bersangkutan tetapi tetap berada pada halaman utama (main page) sedangkan artikel yang terlipat akan di tampilkan secara lengkap tanpa meninggalkan halaman utama.

Perhatikan illustrasi dibawah, gambar 1 (simple readmore) sedangkan gambar 2 (peekaboo readmore) :

Integrasi Selengkapnya/Readmore Jenis Peekaboo

Langkah 1
Login ke blogger
Langkah 2
Pada Panel Kontrol - Tata Letak - Edit HTML - Expand Widget
Langkah 3
Backup terlebih dahulu template blogger anda untuk menghindari kegagalan transflantasi readmore
Langkah 4
Cari kode dibawah ini menggunakan fasilitas (find) pencarian pada browser:

</head>

Langkah 5
Letakan (Copy - Paste) kode dibawah ini tepat diatas kode langkah 4:

<b:if cond="data:blog.pageType != &quot;item&quot;">
<script type="text/javascript">
var fade = false;
function showFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
for (var i = 0; i &lt; spans.length; i++) {
if (spans[i].id == &quot;fullpost&quot;) {
if (fade) {
spans[i].style.background = peekaboo_bgcolor;
Effect.Appear(spans[i]);
} else spans[i].style.display = 'inline';
}
if (spans[i].id == &quot;showlink&quot;)
spans[i].style.display = 'none';
if (spans[i].id == &quot;hidelink&quot;)
spans[i].style.display = 'inline';
}
}

function hideFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
for (var i = 0; i &lt; spans.length; i++) {
if (spans[i].id == &quot;fullpost&quot;) {
if (fade) {
spans[i].style.background = peekaboo_bgcolor;
Effect.Fade(spans[i]);
} else spans[i].style.display = 'none';
}
if (spans[i].id == &quot;showlink&quot;)
spans[i].style.display = 'inline';
if (spans[i].id == &quot;hidelink&quot;)
spans[i].style.display = 'none';
}
post.scrollIntoView(true);
}

function checkFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
var found = 0;
for (var i = 0; i &lt; spans.length; i++) {
if (spans[i].id == &quot;fullpost&quot;) {
spans[i].style.display = 'none';
found = 1;
}
if ((spans[i].id == &quot;showlink&quot;) &amp;&amp; (found == 0))
spans[i].style.display = 'none';
}
}
</script>
</b:if>

Langkah 6
Cari kode dibawah ini:

<data:post.body/>

Langkah 7
Gantilah (Replace) kode pada langkah 6 dengan kode dibawah ini:

<div class="post-body" expr:id="&quot;post-&quot; + data:post.id">
<b:if cond="data:blog.pageType == &quot;item&quot;">
<style>#fullpost{display:inline;}</style>
<p><data:post.body></data:post.body></p>
<b:else></b:else>
<style>#fullpost{display:none;}</style>
<p><data:post.body></data:post.body></p>
<span id="showlink">
<a expr:href="data:post.url">Read More...</a>
</span>
<script type="text/javascript">
checkFull(&quot;post-&quot; + &quot;<data:post.id></data:post.id>&quot;);
</script>
</b:if>

Langkah 8
Simpan template anda, gantilah kata "Read More..." dengan kata yang anda inginkan.
Langkah 9
Nah sekarang setiap anda menuliskan artikel untuk di-posting jangan lupa sisipkan kode dibawah ini, jika tidak semua kode yang sudah kita pasang pada template tidak akan bereaksi apapun.

Postingan awal yang tampil pada halaman utama (main page)
<span id="fullpost">
Isi posting yang terpenggal dan akan tampil jika kita klik Read More.../Selengkapnya...
</span>

Selamat mencoba, semoga berhasil.....
Salam hangat dari Banjarsari - Ciamis - Jawa Barat - Indonesia - Bumi...

Bloghack Tips Trik

Monday, September 15, 2008

Blog Title yang SEO Friendly II

Posted by dav on 9:40 AM with

Pada posting yang lalu saya pernah membahas tentang Blog Title yang SEO Friendly walaupun sempat dikomentari oleh teman blogger dari Philipine yang katanya "Au ah elap" alias "Ora Mudeng". Pada posting terdahulu sebenarnya sudah cukup lumayan untuk mengarahkan mesin pencari supaya mengindex blog kita dengan cepat dan bukan berarti gagal bahkan banyak teman blogger menggunakan teknik itu. Artikel ini adalah bentuk tambahan atau ~~penyempurnaan~~ dari teknik terdahulu. Teknik yang akan kita bahas sekarang cukup rumit dalam pemahamannya tapi tentunya dengan hasil yang cukup ampuh untuk merangsang mesin pencari jatuh hati pada blog kita.

Setelah melakukan riset berulang-ulang ada beberapa hal yang membuat mesin pencari dengan mudah mengindex blog kita. Blog Title ternyata mempunyai andil yang besar dalam membantu proses indexing sehingga semakin cepat pula kita memperoleh backlink.

Sebelum menjelaskan panjang lebar, silahkan ikuti langkah berikut untuk sedikit merubah Blog Title.

Langkah 1 :

Login terlebih dahulu pada Blogger dengan account kita untuk memperlancar proses modifikasi, karena tidak ada jalan pintas lain.

Langkah 2 :

Cari kode dibawah ini dengan bantuan fasilitas pencarian pada browser

<b:skin><![CDATA[/*

Langkah 3 :

Wah langsung ketemu, soalnya hanya beberapa baris kebawah. Letakan (copy-paste) kode dibawah tepat diatas kode Langkah 2

<b:include data='blog' name='all-head-content'/>
<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.title/></title>
<meta content="<data:blog.title/> | [DESCRIPTION] " name="description"/>
<b:else/>
<title><data:blog.pageName/> @ <data:blog.title/></title>
<meta content="<data:blog.pageName/> | <data:blog.title/> | <data:blog.url/> | [DESCRIPTION] " name="description"/>
</b:if>

Wah mumet lihat kodenya....

Perhatikan kode-kode yang saya beri warna biru :

Meta Content : inilah ternyata yang ~~memaksa~~ mesin pencari dengan mudah mengindex blog kita, karena tag meta ibarat mulut untuk mampu menyampaikan apa yang terkandung dalam blog kita. Dengan tag meta kita akan memperoleh backlink dengan informasi yang dinamis (sesuai kebutuhan mesin pencari dengan pengambilan informasi dari setiap halaman/artikel bukan secara keseluruhan seperti halnya tag meta umum)
Description : ini ibarat wadah (container) penampung informasi-informasi yang akan diberikan kepada mesin pencari sesuai dengan isi setiap halaman blog kita bukan informasi secara keseluruhan seperti halnya deskripsi umum
@ : kecil simbolnya besar manfaatnya... ini sama halnya jika kita membuat alamat email simbol @ [at] adalah jalan penunjuk yang menunjukan dimana rumah kita, misal hendriono@telkom.net - seandainya kita baca "saya itu ada berada/tinggal disebuah bangunan telkom.net dan mempunyai kamar dengan nomor hendriono"

Tetapi semua ada konsekwensi-nya, pada saat awal kita merubah blog title itu membuat mesin pencari mengindex ulang blog kita. 1 sampai 7 hari blog kita seakan hilang dari peredaran mesin pencari. Tapi ya itu tadi semua perlu perjuangan walaupun sedikit tetapi dengan harapan kedepan akan lebih baik.

Bagi teman blogger yang sudah mempunyai PR baik sangat tidak disarankan melakukan ini. Demikian ulasan singkat kali ini, jika ada yang mampu menyempurnakan tolong infonya ya... Salam hangat dari Banjarsari - Ciamis - Jawa Barat - Indonesia - Bumi

Tips Trik

Tampilkan Top Komentator di Blogger

Posted by dav on 9:36 AM with

Memberikan penghargaan tidak harus selalu berupa barang, sekedar ucapan terima kasih atau pemuatan tulisan juga sudah merupakan penghargaan yang sangat bermakna bagi yang bersangkutan. Jika kita ingin memberikan salah satu bentuk ekspresi ucapan terima kasih mungkin salah satunya dengan mengaktifkan fitur "Top Komentator" pada blog kita sudah mampu membuat bangga bagi yang bersangkutan. Top Komentator bukan hanya sekedar fasilitas tambahan tapi lebih dari itu maksud dan tujuannya.

Banyak teman blogger yang sudah membuat artikel tentang "Top Komentator" tetapi tidak ada salahnya saya kembali mengulang (mengingatkan) artikel-artikel yang sudah banyak bergentayangan didunia blogger. Ya minimal untuk selalu mengingatkan diri sendiri jikalau lupa. (Maklum pelupa hehehe....)

Fitur Top Komentator menurut informasi dan cerita pertama kali diperkenalkan oleh Ionut Alex Chitu dengan menggunakan bantuan fasilitas Yahoo Pipes berintikan core json. Kalau kita mendengar json mengingatkan kita pada Code JavaScript dan memang itulah yang akan kita gunakan. JavaScript memang coding yang paling bersahabat dengan blogger sampai-sampai menurut cerita pembuatan Google Chrome, JavaScript adalah coding yang sangat diperhitungkan. Tidak heran kenapa JavaScript diperhitungkan, perhatikan saja beberapa browser sangat tidak bersahabat dengan JavaScript. Bahkan ada browser yang jelas-jelas melarang suatu website atau blog menggunakan JavaScript dengan memblok setiap code yang dibuat dari JavaScript. Entahlah... Mungkin karena kadang-kadang ditumpangi sesuatu yang merugikan oleh para ~~master~~ terhadap komputer kita. Lho malah cerita JavaScript?

Mari langsung keinti permasalahan yaitu memasang fitur Top Komentator pada blog kita, ikuti langkahnya :

Langkah 1 :

Biasa Login ke Blogger

Langkah 2 :

Tambahkan sebuah element halaman melalui Panel Kontrol - Tata Letak - Tambah Element - HTML/JavaScript

Langkah 3 :

Masukan (copy-paste) kode dibawah ini ;

Langkah 4 :

Proses editing untuk penyesuaian terhadap blog kita

Ubah bagian nickname pada kode "filter=nickname" untuk mem-filter nama-nama yang tidak kita inginkan masuk pada Top Komentaror, sebaiknya nama kita supaya kita tidak masuk dalam top komentator. Tidak lucu seandainya yang punya blog masuk dalam Top Komentator
Ubah alamat namablog.blogspot.com dengan alamat blog kita
Ubah nilai 10 pada kode num=10 untuk menentukan jumlah maksimal komentator yang akan ditampilkan
Hapus 2 kode document.write("<ol>") dan document.write("</ol>") jika kita tidak menginginkan urutan jumlah komentator.

Demikianlah cara memasang fitur Top Komentator pada blogger. Tapi ngomong-ngomong di blog ini sebelah mana ya? Hehe... nanti kapan-kapan ya teman-teman kalau aku dapat koneksi inet yang cukup kenceng untuk mengotak-atik template. Maklum bandwidth-nya ~~kebagusan~~ jadi error terus...

Salam hangat dari Banjarsari - Ciamis - Jawa Barat - Indonesia - Bumi...

Tips Trik Widget

Monday, September 1, 2008

Memasang Alexa Rank Pada Blogger

Posted by dav on 7:09 AM with

Sebenarnya tutorial ini bukan hal baru tetapi tidak salahnya kalau saya mencoba membuatnya, kalau-kalau ada blogger yang membutuhkan. Mohon ma’af kepada para master blogger jika artikel ini membuat para master muak untuk membacanya, jika anda tidak senang atau bosan dengan artikel ini berikan saja kepada teman anda yang membutuhkan jangan langsung tekan tombol "DELETE". Banyak teman bertanya, untuk apa sih kegunaan Alexa Rank? Ada beberapa alasan mengapa kita memasang Alexa Rank :

Dapat dengan mudah memantau perubahan rangking website kita dengan perhitungan alogaritma-nya Alexa, karena secara tidak langsung Google memanfaatkan hasil perhitungan rangking Alexa untuk menentukan Google Page Rank.
Sebagai daya tarik para pengunjung website kita ketika mereka melihat rangking website kita di Alexa (Apalagi kalau masuk Top 10, Top 100 atau Top 1000), kredibilitas sebagai pengelola website juga ikut terdongkrak dengan rangking Alexa yang bagus.
Advertiser akan berani menawar harga tinggi untuk website kita jika Alexa Rank kita bagus.
Sebagai penyemangat kita untuk memperbaiki kualitas website kita jika ternyata Alexa Rank-nya dari hari kehari semakin membaik.
Salah satu cara untuk menunjukan keseriusan kita untuk mengelola website kepada pengunjung (visitor).
Dan masih banyak lagi…

Untuk memasang Alexa Rank ikutilah langkah-langkah dibawah ini :
Langkah 1 :
Tujukan browser kita ke alamat : http://www.alexa.com/site/site_stats/signup

Langkah 2 :
Masukan alamat website kita pada kotak yang disediakan (kotak merah)

Langkah 3 :
Klik tombol “Build Widget” dan tunggu proses verifikasi Alexa…

Langkah 4 :
Halaman baru akan terbuka dan disana kita bisa melihat Alexa Rank website kita, pilihlah jenis Alexa Rank mana yang akan kita gunakan, direkomendasikan gunakan format 120x95 (kita juga bisa mengecek Alexa Rank website orang lain)

Langkah 5 :
Copy kode (javascript) yang diberikan pada kotak dengan latar kuning (kotak merah)

Langkah 6 :
Login ke blogger anda kemudian pada halaman “Panel Kontrol” klik “Tata Letak”

Langkah 7:
Pilihlah posisi dimana Alexa Rank akan kita pasang, pastikan anda memasang di Sidebar (Hindari memasangnya pada bagian halaman posting karena membuat blog kita tidak enak dilihat)

Langkah 8 :
Setelah kita menentukan posisi dimana Alexa Rank akan ditempatkan, klik “Tambah Elemen Halaman” jendela baru akan terbuka

Langkah 9 :
Halaman “Pilihlah sebuah Elemen Halaman Baru” terbuka, cari “HTML/JavaScript” dan klik “TAMBAHKAN KE BLOG”

Langkah 10 :
Halaman “Mengkonfigurasi HTML/JavaScript” terbuka. Pada kotak “Judul” beri nama (misal : Widget)

Langkah 11 :
Paste kode dari Alexa Rank (Lihat Nomor 4) pada bagian “Konten” kemudian klik “SIMPAN”

Sebuah Widget baru terpasang dengan baik, kunjungi dan lihatlah perubahan blog anda, jadi malu ranking blognya 10 jetian. Tapi tak apalah.... Mudah-mudahan bermanfaat, salam hangat dari Banjarsari – Ciamis – Jawa Barat

Widget

Blog Tip dan Trik