MAAF, MASIH DALAM PERBAIKAN OLEH AASLAMDUNK SILAKAN masuk ke http://aaslamdunk.blogspot.com

Selasa, 14 Juli 2009

Blogroll Alternatif

Blogroll atau link exchange, tapi gw lebih suka nyebutnya "Link Sahabat". Dulu pernah bikin windget kaya gini yang langsung ambil dari windget blogger, tapi waktu mau ganti template gak tau caranya backup windget ini, yaudah deh harus direlakan hangus.

Terus Kemarin ada temen slam yang namanya teavatar nanyain, "slam gimana cara bikin link atau tukeran link temen si??". Maka dari itu slam mau bikin deh artikel tentang itu.

Oprek punya oprek mampir dari tempatnya kang-rohman sam wara-wiri di halamannya o-om.com akhirnya dapet ilmunya juga...

Apa manfaat Blogroll?

Pernah sekilas di otak slam, "memasang link address milik orang lain pada blog/website milik kita akan MERUGIKAN??!!", sebab dengan itu tentu saja kita memberikan jalan kepada para pengunjung untuk meninggalkan blog kita. mungkin ada benarnya juga, akan tetapi tidak seutuhnya benar. Dengan adanya blogroll banyak sekali manfaat yang kita dapatkan, antara lain yaitu mempererat tali silaturahmi atau tali persaudaraan diantara pemilik blog/website. selain itu semakin banyak blog kita di link oleh blog lain maka semakin baik pula posisi rangking blog kita pada Search Engine semacam Google, Yahoo, Msn serta teman-temannya. Tentu saja sama-sama kita ketahui bahwa setiap pemilik blog/website berkeinginan bahwa blog/website miliknya mempunyai rangking yang baik pada search engine. Makanya budayakan tukeran link jangan pelit, karena kalau kita pelit memberi link ya tentu saja tidak akan ada yang mau pasang link addres milik kita pada blog mereka.

Mungkin bagi sobat yang baru saja bikin blog, dan link temen baru sedikit kayanya gak masalah deh, tapi kalu link teman kita udah beratus, hingga ribuan!!!! ini akan jadi masalah kesenjangan sosial!!! LHOOHH. maksudnya akan berdampak pada tampilan yang tidak sedap dipandang mata, karena terlalu panjang. NHAAA kenapa tidak kita pendekin aja??? YA THOOO!!! sebagai alternatif dari blogroll asli blogger.

Terus terpikir kenapa enggak pake javascript aja, biar nanti kalo dibackup tinggal copy aja ke template yang baru??? "good idea slam".


$$ Blogroll dengan marquee

yang paling banyak di gunakan oleh para blogger untuk menghemat space pada blog adalah dengan menggunakan perintah marquee.

Contoh membuat blogroll dengan perintah marquee :

<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="up" width="100%" height="200" >

<a href="http://aaslamdunk.blogspot.com" target="_blank">aaSlamDunK</a>
<br/><br/>
<a href="http://cah-pasar.blogspot.com" target="_blank">Cah Pasar</a>
<br/><br/>
<a href="http://kolom-tutorial.blogspot.com" target="_blank">Kang Rohman</a>
<br/><br/>
<a href="http://www.facebook.com/slams.riyadi" target="_blank">Slamet Riyadi</a>
<br/><br/>
<a href="http://contoh-blog.blogspot.com/" target="_blank">Blog D'Tree</a>
<br/><br/>

</marquee>


Maka nanti yang akan tampil pada blog kita adalah seperti ini :



aaSlamDunK

Cah Pasar

Kang Rohman

Itik Balis




Ada Sedikit clue biar agak jelas. Kode diatas tidak baku harus di tuliskan persis seperti di atas, tapi bisa di sesuaikan dengan kondisi dan keinginan sobat. Kode yang bisa di rubah adalah :

scrollamount="2" --> angka "2" adalah menunjukan kecepatan gerakan, jika ingin lebih cepat silahkan ganti nilainya dengan yang lebih tinggi. Misal : scrollamount="3" ,scrollamount="4" , scrollamount="5"

direction="up" --> tulisan "up" menunjukan arah gerakan keatas, kalau ingin di rubah tinggal ganti kata "up" menjadi "down,left,right" . Misal : direction="down" , direction="left" , direction="right" .

width="50%" --> tulisan "50%" menunjukan lebar dari marquee sebesar "50%" dari tempat dimana perintah ini ditempatkan, jika ingin di rubah tinggal ganti dengan nilai yang di inginkan. contoh : width="30%" , width="70%" , width="100%"

height="200" --> tulisan "200" menunjukan tinggi dari marquee sebesar 200px, jika ingin di ganti tinggal di rubah nilai angkanya. Misal : height="100" , height="300" , height="400" , height="250" .


Ada variasi lain, yaitu dengan memakai tabel, contoh :
<table border="3" width="155" height="130" cellpadding="2">
<tr>
<td align="left">
<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="up" width="100%" height="200" >


<a href="http://aaslamdunk.blogspot.com" target="_blank">aaSlamDunK</a>
<br/><br/>
<a href="http://cah-pasar.blogspot.com" target="_blank">Cah Pasar</a>
<br/><br/>
<a href="http://kolom-tutorial.blogspot.com" target="_blank">Kang Rohman</a>
<br/><br/>
<a href="http://www.facebook.com/slams.riyadi" target="_blank">Slamet Riyadi</a>
<br/><br/>
<a href="http://contoh-blog.blogspot.com/" target="_blank">Blog D'Tree</a>
<br/><br/>

</marquee> </td> </tr> </table>


Maka hasilnya akan seperti di bawah ini :










aaSlamDunK

Cah Pasar

Kang Rohman

Itik Balis





$$ Blogroll dengan menu dropdown

Untuk membuat blogroll pada menu dropdown, silahkan lihat contoh di bawah :

<form>

<select name="menu" onchange="window.open(this.options[this.selectedIndex].value,'_blank')"size=1 name=menu>

<option> - Blogroll - </option>
<option value="
http://aaslamdunk.blogspot.com">aaSlamDunK</option&gt;
<option value="
http://cah-pasar.blogspot.com">Cah Pasar</option>
<option value="
http://kolom-tutorial.blogspot.com">Kang Rohman</option>
<option value="
http://itikbalis.blogspot.com">Itik Balis</option>
<option value="
http://contoh-blog.blogspot.com/">Blog D'tree</option>
</select>

</form>

Hasilnya akan seperti ini, silahkan klik pada menu dropdownnya :



Contoh variasi lainnya :

<h3> Blogroll </h3>

<div align="left">
<select style size=5="font-weight: normal; font-size: 13px; width="135"; font-family: Verdana,Tahoma,Arial; background-color: rgb(229, 229, 229);" onchange="window.open(this.options[this.selectedIndex].value,'_blank')" size="1" name="menu">

<option style="font-weight: normal; font-size: 11px; color: rgb(204, 204, 204); font-family: Verdana,Tahoma,Arial;" value="" selected="selected">--Teman-temanku--</option>
<option value="http://aaslamdunk.blogspot.com">aaSlamDunK</option>
<option value="http://cah-pasar.blogspot.com">Cah Pasar</option>
<option value="http://kolom-tutorial.blogspot.com">Kang Rohman</option>
<option value="http://itikbalis.blogspot.com">Itik Balis</option>
<option value="http://o-omcom/" target="_blank">O-om</option>

</select>

</form>
</div>

Hasilnya akan seperti ini :

Blogroll


Sedikit clue, kata left yang berada pada kode <div align="left"> menunjukan bahwa menu ini akan di simpan di sebelah kiri, jika mau di rubah tinggal ganti saja dengan kata "center" atau "right".


masih ada satu lagi, hasil editan slam sendiri beserta link sobat-sobat slam, yang mungkin sobat suka

masukan kode dibawah ini :

<div align="left">
<form>
<select onchange="window.open(this.options[this.selectedIndex].value,'_blank')" style="size:10; font-weight:normal; font-size:14px; font-color:blue; width:300; font-family:Verdana,Tahoma,Arial; background-color:transparet;" name="menu" size="10">

<option selected="selected" style="font-weight: normal; font-size: 11px; color: rgb(204, 204, 204); font-family: Verdana,Tahoma,Arial;" value=""/>-------Teman-temanku--------

<option value="http://ayastasliwiguna.blogspot.com" target="_blank"/>Blog AYAS
<option value="http://cebongipiet.blogspot.com/" target="_blank"/>Cebong ipiet
<option value="http://christiantjacqueline.blogspot.com" target="_blank"/>Christiant Jacqueline
<option value="http://dapurpunyaku.blogspot.com/" target="_blank"/>Dapur Punyaku
<option value="http://emsholy.blogspot.com/" target="_blank"/>Emsholi design
<option value="http://genigunungpati.wordpress.com/" target="_blank"/>Genigunungpati
<option value="http://indraone.blogspot.com/" target="_blank"/>Genius de Young
<option value="http://ichtiya.wordpress.com/" target="_blank"/>Ichtiya's Journey
<option value="http://itikbalis.blogspot.com/" target="_blank"/>Itik Bali's
<option value="http://laskarpelangi1.blogspot.com/" target="_blank"/>Laskar Pelangi
<option value="http://kolom-tutorial.blogspot.com/" target="_blank"/>Kang Rohman
<option value="http://kweklina.wordpress.com/" target="_blank"/>Kweklina
<option value="http://mainbasket.wordpress.com" target="_blank"/>Main Basket
<option value="http://www.o-om.com" target="_blank"/>O-Om
<option value="http://seputarduniaanak.blogspot.com/" target="_blank"/>SeputarDunia Anak
<option value="http://www.supernovatar.co.cc/" target="_blank"/>Tea vatar
<option value="http://yessipratiwi.blogspot.com//" target="_blank"/>Yessi Pratiwi
<option value="http://yolistiayu.blogspot.com/" target="_blank"/>yolistiayu
<!-- dst -->

</select>

</form> </div>

Maka hasilnya akan seperti ini :



untuk mengeditnya dengan mengganti link dan nama yang berwarna merah diawah ini :
<option value="http://cah-pasar.blogspot.com/" target="_blank"/>Cah Pasar
dengan nama sahabat-sahabat kamu.

wah mungkin masih ada banyak cara lagi untuk membuat blogroll semacam ini, tapi slam dah lumayan pusing nih bikinnya urek-urek sana sini....
dicoba dulu ya!!!! semoga bermanfaat!!!! ALHAMDULILLAHHH!!

Komentar :

ada 0 komentar ke “Blogroll Alternatif”

Posting Komentar

Jangan lupa komentarnya ya!!!
Dipilih dipilihhh Gratiss heheee