Cara memodifikasi bentuk link pada blogspot - E-Learning With Blog
Headlines News :
Home » » Cara memodifikasi bentuk link pada blogspot

Cara memodifikasi bentuk link pada blogspot

Written By Ahmad Nurhakim on Sabtu, 07 Januari 2012 | 21.51

Cara merubah atau memodifikasi bentuk link pada blogspot itu sangat mudah, kita cuma harus tahu sediki tentang kode CSS, gak banyak kok.
Modifikasi disini mengartikan tentang cara mengubah warna link, cara mengubah bentuk link, mau di kasih variasi seperti apa sesuka kamu, tentunya tergantung kebutuhan masing-masing dong.
Okelah gak usah lama, karena akan membuat basi.
Untuk kode dasar link pada blog yakni » »

a:link { . . . . . . . . . . .
. . . . . . . . . .
. . . . . . . . . }


Dimana titik-titik di atas adalah untuk di tempati kode variasi yang kita inginkan, tentunya dalam bentuk kode CSS.Kita langsung bahas satu persatu biar lebih jelas dan mudah di mengerti.

  1. Membuat link menjadi berwarna yang sesuai keinginan kita.
    a:link { color:#BB0000;
    . . . . . . . . . . . . . . .}

    Ini akan membuat link menjadi berwarna merah (sesuaikan kode warnanya)

  2. Membuat link menjadi lebih tebal, kodenya.
    a:link { font-weight: bold;
    . . . . . . . . . . . . . . .}

    Ini akan membuat link menjadi tebal dari tulisan di sekitarnya.

  3. Membuat link bergaris bawah.
    a:link { text-decoration: underline;
    . . . . . . . . . . . . . . .}

    Ini akan membuat link menjadi bergaris bawah.

  4. Membuat link menjadi teks besar semua.
    a:link { text-transform: uppercase;
    . . . . . . . . . . . . . . .}

    Ini akan membuat link menjadi teks-y besar semua (TEKS BESAR SEMUA).

  5. Membuat link menjadi lebih besar atau lebih kecil.
    a:link { font-size: 14px;
    . . . . . . . . . . . . . . .}

    Ini tergantung dari besar kecilnya pixel, dari contoh diatas blogtegal memakai 14px. Ini bisa di ubah sesuai kebutuhan kamu.

  6. Membuat link menjadi ber-background warna (latar belakang).
    a:link { background:#DDDDDD;
    . . . . . . . . . . . . . . .}

    Ini akan membuat link menjadi ber-backround berwarna.
Untuk kode-kode warna bisa di lihat pada artikel blogtegal tentang Kode-kode warna HTML
Kamu pun bisa mem-variasikan link dg menggabungkan semua kode-kode diatas, dengan catatan harus di dalam kode default CSS, yakni di antara kode ( { ) dan kode ( } )
Misal untuk contohnya jika ingin menggabungkan beberapa kode CSS:
a:link { color:#BB0000; fon-weight:bold; text-transform:uppercase; text-decoration:underline; font-size: 14px; }
Ini akan membuat link menjadi berwarna merah, lebih tebal, tulisan menjadi besar semua (capital) dan berukuran 14px.Oh ya satu tambahan lagi, biasanya kode link berbarengan dg kode variasi yang lain yakni:
a:hover { . . . . . . . . . . . . . . .}
Ini akan membuat link yang apabila pointer mouse membayangi diatasnya akan berubah menjadi bentuk lain sesuai pengaturan kode CSS-nya. Untuk kode CSS-nya sama dg kode diatas. Satu kode lagi yakni:
a:visited { . . . . . . . . . . . . . . .}
Ini akan membuat link menjadi bentuk lain sesudah link tersebut di klik atau setelah link tersebut di kunjungi, tentunya sesuai dg pengaturan.Biasanya para blogger menggunakan link menjadi berwarna atau link bergaris bawah, itu pada umum-nya. Namun tidak ada salahnya jika kamu ingin memvariasikan dalam bentuk-bentuk yang lain.
Untuk penempatan kode-kode variasi link diatas berada pada kode CSS di dalam template blogspot kamu.
  • masuk ke dashboard blogspot kamu.
  • pilih Rancangan » » Edit HTML
  • tempatkan kode-kode link diatas di antara kode <b:skin><![CDATA[ dan kode ]]></b:skin>
  • kemudian save template
Apa ada yang belum berhasil? Silahkan tanya saja melalui kotak komentar, key
Share this article :

0 comments:

Speak up your mind

Tell us what you're thinking... !

SubScriber

Masukan alamat Email kamu disini untuk mendapatkan artikel terbaru..!

Add to Google Reader or Homepage

Join Member

 
Support : Creating Website | Johny Template | Mas Template
Proudly powered by Blogger
Copyright © 2011. E-Learning With Blog - All Rights Reserved
Template Design by Creating Website Published by Mas Template