WordPress.org

Indonesia

Forum

Mengatur Warna Link


  • acepsdr
    Anggota

    @acepsdr

    Bagaimana ya mengatur warna huruf dari link, misalkan saya ingin mengatur/merubah warna huruf dari the_category(',')

    Thanks,

Melihat 15 balasan - 1 sampai 15 (dari total 15)

  • Huda
    Kunci Utama (Keymaster)

    @hudatoriq

    Hmmm.. kalo ngatur/merubah warna ya sebaiknya diatur dengan stylesheet. Misalnya jika ingin memberi warna the_category(','), kita letakkan “template tag” tersebut di dalam elemen html tertentu dan diberi class.

    Contoh:

    <span class="category-label"><?php the_category(','); ?></span>

    Di contoh di atas, kita mengenakan class category-label kepada nama kategori sebuah tulisan. Kemudian di stylesheetnya, tambahkan entri style untuk category-label

    Contoh:

    .category-label { color: #00bb00; }


    acepsdr
    Anggota

    @acepsdr

    Saya sudah tambahkan seperti dapat dilihat pada script berikut, tapi warnahnya masih belum berubah:

    Back to <span class="lnk"><?php the_category(',') ?></span> category

    di stylesheetnya saya tambahkan dengan :

    .lnk {
    	color: #FFFFFF;
    }

    tulisan dari kategori masih berwarna default link, maunya berwarna putih.


    Rhama
    Anggota

    @rhama

    coba diganti div,bukan class


    Huda
    Kunci Utama (Keymaster)

    @hudatoriq

    Hmm.. CSS debugging emang rada tricky. Mesti liat keseluruhan struktur html, dan stylesheet yg saat ini diterapkan. Bukan penggalan phpnya.
    Bisa disediakan? Atau coba kasi liat qt halamanya.


    acepsdr
    Anggota

    @acepsdr

    Berikut ini penggalan yang di headernya :

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>>
    
    <head profile="http://gmpg.org/xfn/11">
    	<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
    
    	<title><?php bloginfo('name'); ?><?php wp_title(); ?></title>
    
    	<style type="text/css" media="screen">
    		@import url( <?php bloginfo('stylesheet_url'); ?> );
    	</style>
    
    	<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="<?php bloginfo('rss2_url'); ?>" />
    	<link rel="alternate" type="text/xml" title="RSS .92" href="<?php bloginfo('rss_url'); ?>" />
    	<link rel="alternate" type="application/atom+xml" title="Atom 1.0" href="<?php bloginfo('atom_url'); ?>" />
    
    	<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
    	<?php wp_get_archives('type=monthly&format=link'); ?>
    	<?php //comments_popup_script(); // off by default ?>
    	<?php wp_head(); ?>
    </head>

    Sementara ini adalah baris dari penempatan link tersebut:

    <tr>
              <td width="22%">&nbsp;<b><a href="http://www.siteku.com" target="_top"><font color="#FFFFFF" size="2" face="Arial, Helvetica, sans-serif">Home</font></a></b> | <span class="lnk"><?php wp_loginout(); ?></span></td>
              <td width="33%">&nbsp;</td>
              <td width="45%" align="right"><b><font color="#FFFFFF" size="2" face="Arial, Helvetica, sans-serif">Back to <span class="lnk"><?php the_category(',') ?></span> category &raquo;&raquo;</font></b>&nbsp;</td>
            </tr>

    Kira-kira dimana ya masalahnya ?


    acepsdr
    Anggota

    @acepsdr

    Oh iya, kelupaan. Dan ini adalah isi file style.css nya:

    /* Begin Typography & Colors */
    .grs {
    	border-bottom-width: 1px;
    	border-bottom-style: solid;
    }
    .jdl {
    	font-family: Arial, Helvetica, sans-serif;
    	font-size: 16px;
    }
    .lnk {
    	color: #FFFFFF;
    }

    daniiswara
    Anggota

    @daniiswara

    kenapa ngga dibuat pake css semua? yg inline css spt font dialihkan via css aja utk memudahkan kontrol..
    diatur jg biar ngga ‘konflik’ dgn div atau class sebelumnya
    lbh mudah lg jika divalidasi sekalian css-nya 😀


    Huda
    Kunci Utama (Keymaster)

    @hudatoriq

    Bisa kasih lihat ke kita halaman lengkapnya? Ditaruh di mana, gitu di web. Biar kita bisa buka pake browser trus tinggal didebug.


    acepsdr
    Anggota

    @acepsdr

    Ooo lokasi websitenya toh yang dimaksud. bapak bisa lihat disini nih
    http://member.acepsudrazat.com


    acepsdr
    Anggota

    @acepsdr

    Jadi gimana pak huda, apa sudah dilihat sourcenya? yang menjadi masalah adalah link “login” dan “uncategories”. Sementara link “home” itu adalah link biasa. Rencananya klo kasus ini tidak bisa, saya akan buatkan link secara manual (bukan menggunakan fungsi WP tersebut, tetapi seperti link “Home”)


    Huda
    Kunci Utama (Keymaster)

    @hudatoriq

    Oh iya.

    Coba

    .lnk {
    	color: #FFFFFF;
    }

    diganti dengan
    .lnk a {
    color: #FFFFFF;
    }

    Karena setiap elemen anchor () punya properti warna biru, sehingga merubah properti elemen induknya.

    Dan seperti yg dr daniiswara bilang, sebaiknya hindari penggunaan tag html yang memiliki unsur styling. Style dan struktur html sebaiknya dipisah :).

    btw, jangan panggil saya Pak, berasa udah tua aja 😀


    acepsdr
    Anggota

    @acepsdr

    Ok deh, sudah bekerja dengan baik. Hm…, saya kebetulan terbiasa menggabungkan style dan struktur html pak (atau manggilnya apa nih?!?). Jadi kadang kelupaan atau males ntuk pisahkan 🙂

    Tapi masukan dari rekan-rekan, terutama dari pak huda dan daniiswara sangat berharga buat saya dan saya coba nanti.

    Thanks,


    Huda
    Kunci Utama (Keymaster)

    @hudatoriq

    Sebaiknya (x)html hanya dipakai untuk pembungkus data Pak, sedangkan styling bisa dikendalikan secara penuh dari CSS :D. Karena dokumen tersebut tidak hanya dibaca manusia, tapi juga mesin. Oleh karena itu sebaiknya mempertimbangkan validitas juga.


    acepsdr
    Anggota

    @acepsdr

    Ya…, sepertinya metode yang pak huda katakan memang lebih baik. Semua aplikasi/template WP buatan orang saya lihat kalau di preview memang sepertinya bagus untuk dibaca oleh search engine, tetapi klo websitenya di buka enak untuk dibaca oleh manusia.

    Sayang sekali saya belum paham betul mengenai konsep yang pak huda katakan, soalnya sejak lama saya terbiasa menggabungkan seperti itu. Ada buku referensi yang cocok tidak ya pak untuk saya pelajari, terutama untuk keperluan WP ini. Klo bisa sih yang berbahasa indonesia (habis inggris saya masih pas2an soalnya nih)

    tetap semangat untuk menjadi yang lebih baek…gue dukung bro !
    emang kadang-kadang kita sering kurang memperhatikan hal-hal kecil…kadang suka nyepelein..kurang rapi dalam nge-program lah dsb…tp yang terpenting tetap semangat untuk menjadi yang lebih baek…gue dukung bro ! salam kenal..kapan-kapan gue kunjungi situs anda..n liat hasil semedi di sini..he..he..he..ingat waktu dulu pas masih di banyuwangi kerjaanya semedi di alas purwo 😉

Melihat 15 balasan - 1 sampai 15 (dari total 15)
  • Topik ‘Mengatur Warna Link’ ditutup untuk balasan baru.