Home > Panduan > Link Warna Custom

Link Warna Custom

February 22nd, 2010 Leave a comment Go to comments

info : login terakhir jam lebih menit

Secara default, link yang kita buat dalam postingan warnanya beda dengan teks yang tanpa link sehingga memudahkan pembaca untuk mengidentifikasi mana teks biasa mana link.

Berikut adalah contoh teks link default saya yang warnanya biru.

Salah satu cara memecahkan masalah adalah jangan mempersoalkan bagaimana masalah itu terjadi, tetapi mulailah dengan bagaimana masalah tersebut dapat terselesaikan.

Permasalahan muncul manakala kita akan berkreasi dengan memasang background. Tak jarang warna link nggak sinkron atau malah tabrakan dengan warna background yang kita pilih.

Ini adalah link teks setelah postingan diberi background hitam. Link default yang berwarna biru akan kabur oleh warna hitam.

Salah satu cara memecahkan masalah adalah jangan mempersoalkan bagaimana masalah itu terjadi, tetapi mulailah dengan bagaimana masalah tersebut dapat terselesaikan.

Dengan pewarnaan teks biasa ternyata nggak banyak membantu untuk mengubah warna link. Ada juga teknik membuat link warna-warni kayak pelangi tapi malah nggilani. Untuk mensiasati hal tersebut kita bisa menambah kode html langsung pada tag linknya.
Dan ini adalah hasilnya setelah link diwarnai secara custom.

Salah satu cara memecahkan masalah adalah jangan mempersoalkan bagaimana masalah itu terjadi, tetapi mulailah dengan bagaimana masalah tersebut dapat terselesaikan.

Ini kodenya:

Biasanya :
<a href="alamat link">nama link</a>

Ditambah hingga seperti ini :
<a href="alamat link" style="color:#ffff00;">nama link</a>

Kodenya sangat simpel. Sesuaikan alamat url link, nama link dan warna link yang diinginkan. Semoga ini bisa membantu sahabat yang bermasalah dengan warna link bawaannya.

Kita memang bisa pula mengubah dari css nya, tapi warna linknya ya tetap monoton dan lebih beresiko, sehingga trik sederhana ini menjadi solusi aman bagi sahabat yang pengin ngganti warna link tanpa masuk ke struktur theme. Sepuluh link dengan sepuluh warnapun oke.

~ Grazie ~
Categories: Panduan
  1. JR
    February 22nd, 2010 at 23:27 | #1

    wakh keren nih om…..tipsnya…nanti aku langsung mencobanya

    [Reply]

    Mars Reply:

    Makasih Mas

    [Reply]

  2. February 23rd, 2010 at 00:06 | #2

    Pertamax kah…???

    [Reply]

    Mars Reply:

    Keduluan Mas… :D

    [Reply]

  3. February 23rd, 2010 at 00:07 | #3

    Waaduuuhhh … aki2 lagi galak … komentar dicegat terus ….

    [Reply]

  4. February 23rd, 2010 at 00:14 | #4

    Kalau saya lebih suka edit file style.css nya , kalau yg custom kadang2 aja makenya malah saya bikin sama dengan warna tulisan postingan untuk mengelabui yg suka kopas langsung dikira gak ada link padahal ada heeee… tapi kalau di kopi dulu ke notepad ya udah wassalam bablas ….. linknya ….

    [Reply]

    Mars Reply:

    Kalau edit file bisa, tapi ya warnanya tunggal. Semua link warnanya itu.
    Tapi kalau pakai edit di postingan, mau ada 10 link dengan 10 warna bisa ajah…

    [Reply]

    Arif Reply:

    bisa warna warni kayak pelangi ya pak.

    [Reply]

  5. February 23rd, 2010 at 04:27 | #5

    wah pak Mars sekarang layak disebut seniman html, karya karya sangat indah

    [Reply]

  6. riFFrizz
    February 23rd, 2010 at 06:55 | #6

    Tambah pengetahuan. Pak mars ternyata gak suka sama efek link pelangi !

    [Reply]

  7. February 23rd, 2010 at 07:16 | #7

    Indahnya Hidup penuh warna…,
    gak pernah pertamax,
    tapi lumayan masih top ten :D

    [Reply]

  8. yanti tukang kerupuk
    February 23rd, 2010 at 07:42 | #8

    Assalamualaikum.wr.wb. Slmt Pagi. Salam dari Yanti sekeluarga. Semoga pemilik blog ini dan seluruh narablog yang hadir selalu dalam lindunganNya dan sukses menyertainya.Tabik

    [Reply]

  9. yanti tukang kerupuk
    February 23rd, 2010 at 07:42 | #9

    wah, bisa langsung di editornya wordpress gak mas?

    [Reply]

    Mars Reply:

    Kalau di editornya kan kurang fleksibel mbak…
    Kalau yang ini kan disesuaikan dengan kondisi pada postingannya.

    Memang bisa lewat editor, tapi lagi2 warnanya ya 1 dowang itu. Kalau yg ini mau warna apapun untuk link yang berbeda bisa…
    Begitu…. :D

    [Reply]

  10. February 23rd, 2010 at 08:40 | #10

    manteb pakdhe…

    [Reply]

  11. Mamah Aline
    February 23rd, 2010 at 09:00 | #11

    siip pak mars, saya harus coba nih… :)

    [Reply]

  12. February 23rd, 2010 at 09:54 | #12

    hayya …ini nih langsung di copas saaj ya Pak Guru Mars :D
    terima kasih banya k .
    salam.

    [Reply]

  13. Anas
    February 23rd, 2010 at 10:11 | #13

    benar pak, kadang kala link Anas juga gak match dengan backgroundnya. Mungkin ini adalah solusinya.. terima kasih..

    [Reply]

  14. Blog Ijo
    February 23rd, 2010 at 10:19 | #14

    inti permasalahannya sih sebenarnya simple pak, soal HTML itu karena udah umum.
    namun yang bikin menarik ya soal deskripsinya itu..pak Mars banged.
    :p

    [Reply]

  15. February 23rd, 2010 at 10:36 | #15

    link peLangi, boLeh juga, Pak..

    gmn kL besok dijLentrehke cara dapetin #FF0000 dari mana ya Pak?
    trus kL #0000FF jadi warna apa #00FF00 jadi warna apa?

    [Reply]

    Mars Reply:

    Itu sudah saya update Mas… :D

    [Reply]

  16. oyen
    February 23rd, 2010 at 11:19 | #16

    wooo…getu yah, ternyata bisa di ubah toh, gak merah mulu…maturnuwun resep-e

    [Reply]

    Mars Reply:

    Abang nggilani… ;)

    [Reply]

  17. nakjaDimande
    February 23rd, 2010 at 11:42 | #17

    suatu saat coba hadirkan pelangi itu di Ladang Jiwa **sekarang ngantuk, jadinya belum mudeng

    [Reply]

  18. February 23rd, 2010 at 12:07 | #18

    solusi yang tepat, akan memberikan manfaat yang luar biasa :)

    [Reply]

  19. isnuansa
    February 23rd, 2010 at 14:07 | #19

    Pelangi kalo hanya satu kata saja nggak nggilani Pak, yang nggilani kalo seluruh postingan berwarna-warni bikin moto sepet. Terutama yang menerapka ilmu SEO yang biasanya baru mereka baca: di bold, di em, di besarin, di warnai, hihihihihi….

    [Reply]

  20. Badruz
    February 23rd, 2010 at 15:16 | #20

    Mantap Pak Mars, di copy dan besok langsung praktek…

    [Reply]

  21. ofaragilboy
    February 23rd, 2010 at 15:36 | #21

    pak ins mulai berbagi tutorial :D :D :D

    ok deh tak tunggu yang lainnya…

    terimakasih matur suwun

    [Reply]

  22. achmad sholeh
    February 23rd, 2010 at 15:56 | #22

    kalau urusan html pak mars emang jagonya

    [Reply]

  23. zenteguh
    February 23rd, 2010 at 16:58 | #23

    dan saya memang hanya bisa manggut-manggut kalo soal html.
    html:hebat tenan metamarsphose lakone :D

    [Reply]

  24. February 23rd, 2010 at 17:25 | #24

    lo hampir mirip dengan postingan saya
    tapi punya saya memanjang dan full postingan hehehe

    [Reply]

  25. Sigit
    February 23rd, 2010 at 18:30 | #25

    keren.. bisa belajar lebih banyak lagi nih aku disini..

    [Reply]

  26. February 23rd, 2010 at 19:14 | #26

    boleh dicoba nih bos.. trims ya, hehe.. :)

    [Reply]

  27. Jidat
    February 24th, 2010 at 08:59 | #27

    Sip deh pak. . . dijajal dulu

    [Reply]

  28. berita terbaru
    September 26th, 2010 at 10:32 | #28

    makasih bos tutornya, sangat bermanfaat :)


    Sama2 Mas…

    [Reply]

  29. December 18th, 2010 at 21:28 | #29

    aku izin nyoba ya Mas…


    Silakan Mas…
    Selamat mencoba

    [Reply]

  30. January 11th, 2011 at 22:43 | #30

    hmm.. cobain dulu ah .. bru tau soalnya :D

    ngomong2.. ini ada efek bwat SEO ny gak ?

    [Reply]

  31. January 14th, 2011 at 00:30 | #31

    info nya bagus, postingannya mirip dgn postingan saya

    [Reply]

  32. August 31st, 2011 at 05:16 | #32

    info menarik.. thanks yaa

    [Reply]

  33. November 13th, 2011 at 14:26 | #33

    wah. Ini masalah aku. Makasih bos

    [Reply]

  34. June 28th, 2015 at 21:25 | #34

    link warna skearang di word press ndak bisa yaa?

    [Reply]

  1. No trackbacks yet.

Current month ye@r day *

silakan buka katalog untuk melihat postingan lainnya
~ terima kasih ~