Membuat link tampak rapi di sidebar dengan marque

Dalam perjalanan blogwalking pada suatu malam, gw sempat terdampar di blognya Lookj dan disini gw dapat sedikit tips untuk membuat link tampak agar rapi, nach dari sini gw Thinking out The box ( meminjam istilah kang Mochal - Kalau di Indonesiakan Berpikir keluar kotak...yang maksudnya bahwa setelah kita menimba ilmu/tips dari satu blog atau blognya kang Mochal bagaimana caranya ilmu/tips tersebut kita kembangkan...begitu ya kira...? salut dech pada Om Subagya ). Nach setelah gw dapat tips tadi dari Om Lookj, Tips tersebut gw kembangkan dari membuat link tampak agar rapi menjadi Membuat link di blogspoot tampil rapi dengan Marque.

Disini sobat bisa melihat contohnya disidebar Aceh Blogging selain tampak rapi kita bisa menampilkan semua link serta sangat menghemat tempat.dan satu lagi bukan hanya untuk link saja tapi bisa berfungsi juga untuk marque widget yang lain seperti yang sobat juga lihat disidebar sya ( bisa untuk Top komentator,iklan,Feedjit dll)

Nach kita mulai saja sobat untuk menghemat waktu, disini saya coba dengan 2 cara dan 1 cara bonus:
1. Membuat link atau widget lain tampak rapi dengan marque
2. Membuat link tampak rapi dengan scrolroll
3. Menampilkan widget lebih hemat tempat dengan marque ( BONUS )

1. MEMBUAT LINK TAMPAK RAPI DENGAN MARQUE

<marquee direction="up" width="100%" scrollamount="3" height="200" align="left">
01.<a href="Alamat link1" target="new">Nama Link1</a><br/>
-----------------------------------------------------------------------<br/>
02.<a href="Alamat link2" target="new">Nama Link2</a><br/>
-----------------------------------------------------------------------<br/>
03.<a href="Alamat link3" target="new">Nama Link3</a><br/>
-----------------------------------------------------------------------<br/>
04.<a href="Alamat link4" target="new">Nama Link4</a><br/>
-----------------------------------------------------------------------<br/>
05.<a href="Alamat link5" target="new">Nama Link5</a><br/>
-----------------------------------------------------------------------<br/>
</marquee>


Nanti hasilnya seperti dibawah ini


01.Nama Link1

-----------------------------------------------------------------------

02.Nama Link2

-----------------------------------------------------------------------

03.Nama Link3

-----------------------------------------------------------------------

04.Nama Link4

-----------------------------------------------------------------------

05.Nama Link5

-----------------------------------------------------------------------




Catatan :
- height="200" adalah lebar kolom, sobat tinggal mengganti aja berapaka ukuran kolom yang sobat inginkan.
- Alamat link adalah contohnya http://aneukagamaceh.blogspot.com/2009/01/cut-meutia.html
- Nama Link adalah contohnya CUT MEUTIA
- <br/> adalah jarak baris
- ---------------------------adalah tanda - ( min )yang disambung seperti------, untuk tanda min sobat boleh mengganti ...... ( titik ) atau lain-lain

Kalau contoh lebih jelas seperti dibawah ini

<marquee direction="up" width="100%" scrollamount="3" height="200" align="left">
01.<a href="http://aneukagamaceh.blogspot.com/2009/01/cut-meutia.html" target="new"&gt;CUT MEUTIA</a><br/>

-----------------------------------------------------------------------<br/>

02.<a href="http://aneukagamaceh.blogspot.com/2009/01/teuku-umar.html" target="new">TEUKU UMAR</a><br/>
-----------------------------------------------------------------------<br/>

</marquee>


Nanti hasilnya seperti dibawah ini


01.CUT MEUTIA


-----------------------------------------------------------------------


02.TEUKU UMAR

-----------------------------------------------------------------------






2. MEMBUAT LINK TAMPAK RAPI DENGAN SCROLROLL

<center><div style="border: 1px solid rgb(238, 238, 238); padding: 10px; overflow: auto; width: 300px; height: 200px;">
<div align="justify">
1. <a href="Alamat link1">Nama link1</a><br/>
-----------------------------------------------------------------------<br/>
2. <a href="Alamat link2 ">Nama link2</a><br/>
-----------------------------------------------------------------------<br/>
3. <a href="Alamat link3">Nama link3</a><br/>
-----------------------------------------------------------------------<br/>
4. <a href="Alamat link4">Nama link4</a><br/>
-----------------------------------------------------------------------<br/>
5. <a href="Alamat link5">Nama link5</a><br/>
-----------------------------------------------------------------------<br/>
</div>
</div></center>

Nanti hasilnya seperti dibawah ini

1. Nama link 1

-----------------------------------------------------------------------

2. Nama link2

-----------------------------------------------------------------------

3. Nama link3

-----------------------------------------------------------------------

4. Nama link4

-----------------------------------------------------------------------

5. Nama link5

-----------------------------------------------------------------------

Catatan :
- width:300px adalah lebar kolom
- height="200" adalah tinggi kolom
- padding:10px adalah jarak dari border ke barisan huruf/angka
- border:1px solid #eee ( 1 px adalahketebalan border #eee adalah warna )
- Alamat link adalah contohnya http://aneukagamaceh.blogspot.com/2009/01/cut-meutia.html
- Nama Link adalah contohnya CUT MEUTIA

Kalau contoh lebih jelas seperti dibawah ini

<center><div style="border: 1px solid rgb(238, 238, 238); padding: 10px; overflow: auto; width: 300px; height: 200px;">
<div align="justify">
1. <a href="http://aneukagamaceh.blogspot.com/2009/01/cut-meutia.html">CUT MEUTIA</a><br/>
-----------------------------------------------------------------------<br/>
2. <a href="http://aneukagamaceh.blogspot.com/2009/01/teuku-umar.html">TEUKU UMAR</a><br/>
-----------------------------------------------------------------------<br/>
</div>
</div></center>

Nanti hasilnya seperti dibawah ini

1. CUT MEUTIA

-----------------------------------------------------------------------

2. TEUKU UMAR

-----------------------------------------------------------------------

3.MENAMPILKAN WIDGET LAIN LEBIH HEMAT TEMPAT DENGAN MARQUE( BONUS )

Saya ambil contoh Feedjeet saya

<script src="http://feedjit.com/serve/?bc=FFFFFF&amp;tc=494949&amp;brd1=336699&amp;lnk=494949&amp;hc=336699&amp;ww=100" type="text/javascript"></script><noscript><a href="http://feedjit.com/">Feedjit Live Blog Stats</a></noscript>

Lalu kita beri marque
<marquee direction="up" width="100%" scrollamount="3" height="300" align="left"><script src="http://feedjit.com/serve/?bc=FFFFFF&amp;tc=494949&amp;brd1=336699&amp;lnk=494949&amp;hc=336699&amp;ww=100" type="text/javascript"></script><noscript><a href="http://feedjit.com/">Feedjit Live Blog Stats</a></noscript></marquee>

Nanti hasilnya seperti ini



Huh...capek juga ya...semoga bermamfaat dan Happy blogging

Related Posts by Categories