A Cahya Legawa's Les pèlerins au-dessus des nuages

Saat saya mengganti tema blog dengan “The Erudite”, saya pun menyadari sesuatu yang tidak biasa pada tema ini. Ternyata setiap kata (singkatan) yang menggunakan elemen ABBR tidak memiliki tanda kasat mata, dengan kata lain dalam sekali pandang tidak dapat diketahui apakah kata itu mengandung elemen tersebut atau tidak. Kalau di tema yang lama, akan ada titik-titik kecil di bawahnya (yang membedakannya dengan pranala/inline links).

Saya bukanlah pengguna yang baik sehingga bisa melakukan “Penulisan Elemen ABBR yang Aksesibel” sebagaimana ditulis oleh Dani Iswara. Tapi rasanya tanpa style sheet yang tepat rasanya, tidak pas juga memandangnya. Jadi saya pun berniat melakukan sedikit pengubahan.

Sayangnya saya tidak memiliki pengetahuan apa pun tentang bagaimana mengedit CSS dalam tema wordpress. Terakhir kali mengedit tema, saya mendapatkan mimpi buruk selama seminggu. Ingin hati meminta bantuan pada pemilik Unessential Weblog, tapi apa daya karena sudah terbayang jawabannya akan penuh dengan pranala belajar mandiri ke sana ke mari, saya mengurungkan niat saya daripada mimpi buruk saya bertambah seminggu lagi.

Hal pertama yang saya lakukan adalah mempelajari “Styling abbreviations and acronyms”. Jadi saya tahu jika ingin mendapatkan gaya visual tertentu, kode minimal apa yang mesti saya sisipkan.

Saya pun memilih menyisipkan kode:


abbr, acronym
{
	border-bottom: .1em dotted;
}

Nah, sekarang saya sudah mendapatkan kode CSS yang saya inginkan, pertanyaannya, ke mana saya harus menyisipkannya?

Saya membuka berkas CSS di CPanel pada bagian tema terkait, hasilnya ada beberapa berkas terpisah, terutama berkas CSS untuk peramban lain seperti Internet Explorer berbagai versi. Ah…, tiba-tiba kepala saya berdenyut kencang, kalau ini salah sedikit saja, habislah sudah riwayat blog ini. Mana langit hujan bergemuruh dengan gelegar petir menyambar-nyambar, rasanya mirip suasana film trailer saja.

Saya kemudian teringat, jika saya memiliki plugin WP-Typography di blog saya. Pengaya ini memberikan banyak manfaat, lalu saya coba-coba membuka di bagian setelannya, ah! ternyata di sana ada bagian “add CSS hooks”, dan saya pun memasukkan kode di atas pada kolom “Styling for CSS Hooks”.

Input Code for CSS Hooks

Setidaknya sementara saya memiliki pertolongan untuk ini, dan sekarang elemen ABBR bisa dibedakan secara visual. Yah, beginilah nasib orang yang selalu newbie di bidang blog, untuk mengedit tema-pun mesti berkeringan dingin.

Peringatan: tidak disarankan mengikuti langkah-langkah yang ngawur ini 😆 – karena bisa menyesatkan!

Artikel Baru Terbit

  • Cyclospora: Parasit Mikroskopis yang Mengintai di Balik Sayuran dan Buah Segar
    Wabah cyclosporiasis melanda ratusan warga Amerika Serikat pada musim panas 2026, disebabkan parasit mikroskopis Cyclospora cayetanensis yang mencemari sayur dan buah segar. Artikel ini mengulas biologi parasit, gejala diare “meledak-ledak”, tantangan diagnosis laboratorium, terapi TMP-SMX, hingga relevansinya bagi keamanan pangan dan kewaspadaan klinis di Indonesia.
  • Ngopi Pagi di Sragen, Otot Lebih Padat: Apa Kata Riset Terbaru soal Kopi dan Komposisi Tubuh?
    Studi kohort Finlandia menemukan bahwa peminum kopi rutin memiliki lemak viseral lebih rendah dan massa otot lebih tinggi meskipun indeks massa tubuh serupa dibanding peminum kopi jarang. Pada pria, konsumsi kopi juga terkait dengan profil testosteron dan SHBG yang lebih baik, namun studi ini bersifat observasional dan tidak membuktikan hubungan sebab-akibat.
  • Faktor Kesuburan Pria: Sisi yang Sering Terlewat dalam Pencarian Momongan
    Faktor pria berkontribusi pada sekitar separuh kasus infertilitas pasangan, namun sering luput dari pemeriksaan awal. Artikel ini mengulas standar analisis sperma terbaru WHO edisi keenam serta bukti terkini mengenai pengaruh rokok, alkohol, berat badan, paparan panas, dan konsumsi gula terhadap kualitas dan integritas DNA sperma.
  • Ketika Muntah Datang Seperti Badai yang Terjadwal: Mengenal Cyclic Vomiting Syndrome
    Muntah hebat yang datang berulang lalu hilang seolah tak pernah terjadi—inilah wajah cyclic vomiting syndrome, gangguan interaksi otak-usus yang sering disalahpahami sebagai gastroenteritis biasa. Artikel ini mengulas patofisiologi, kriteria diagnosis Rome IV, pembaruan pedoman NASPGHAN 2025, serta tata laksana berbasis bukti terkini bagi klinisi di layanan primer maupun rujukan.
  • Demo Besar 27 Agustus 2026: Apa yang Perlu Dicermati Pelaku Bursa Saham dalam Jangka Pendek
    Besok, 27 Agustus 2026, Jakarta akan menggadakan unjuk rasa besar oleh berbagai aliansi. Tuntutan termasuk pengesahan RUU Perampasan Aset dan hukuman mati bagi koruptor. Polda Metro Jaya telah menyiapkan pengamanan. Aksi ini dapat mempengaruhi IHSG dan rupiah, dengan proyeksi pergerakan cenderung sideways dalam beberapa hari ke depan.

Commenting 101: “Be kind, and respect each other” // Bersikaplah baik, dan saling menghormati (Indonesian) // Soyez gentils et respectez-vous les uns les autres (French) // Sean amables y respétense mutuamente (Spanish) // 待人友善,互相尊重 (Chinese) // كونوا لطفاء واحترموا بعضكم البعض (Arabic) // Будьте добры и уважайте друг друга (Russian) // Seid freundlich und respektiert einander (German) // 親切にし、お互いを尊重し合いましょう (Japanese) // दयालु बनें, और एक दूसरे का सम्मान करें (Hindi) // Siate gentili e rispettatevi a vicenda (Italian)

19 tanggapan

  1. Avatar rismaka
    rismaka

    Menyisipkannya di file erudite.css mas

  2. Avatar iskandaria
    iskandaria

    Wah, sudah mulai berani utak-atik CSS ni yee 🙂 Harus belajar mas. Pelan-pelan aja. Kalo mau belajar CSS, ketik aja keyword "belajar css" di google. Banyak referensi kok.

    Saya malah belum mengkustom settingan CSS untuk abbr blog saya. Mau ubah ah, biar aksesibel kayak blog ini yang udah berhasil..hehehe
    .-= Artikel terakhir blog iskandaria: Banjir Komentar SPAM Berbahasa Cina di Blogspot Saya =-.

  3. Avatar Decy
    Decy

    ngga , dulu aku nyobanya bukan di WP, tapi di layanan Blog lain yg bisa diatur sendiri BG nya

    sayangnya ga terlalu ngerti , jadi acakadut…
    .-= Artikel terakhir blog Decy: 🙂 =-.

    1. Avatar Cahya

      Mbak Decy,

      Oh…, ya begitu ya 🙂

  4. Avatar Decy
    Decy

    nah.. aku sering salah menyisipkan kode2 di css

    sejujurnya saya cuma nyontek di om google

    dan hasilnya suka berantakan * pastiiii laahh heheheh 😛

    1. Avatar Cahya

      Mbak Decy,

      Oh Mbak pakai paket berbayar wordpress.com ya bisa mengedit kode CSS-nya?
      Saya belum pernah mencoba di wordpress.com, karena tidak bisa kalau hanya pakai paket blog gratisan 🙁

  5. Avatar Cahya

    Mas Is,

    Blog ini masih banyak kekurangan, yang baru saya benahi biasanya saya catat. Tapi paling-paling besok saya lupa lagi 🙂

    Soalnya memang bukan bakat dan minat saya di design web 😀

  6. Avatar Bidan Yuni

    wahhh bagi yang senang otak atik CSS dan tahu kode2 pasti akan sangat bermanfaat ilmu ini……..

    1. Avatar Cahya

      Bidan Yuni,

      Ah…, saya hanya menggunakan prinsip salin tempel 🙂

  7. Avatar elmoudy
    elmoudy

    saya termasuk yang sangat suka mengotak atik CSS… khususnya soal warna, font style..

    1. Avatar Cahya

      elmoudy,

      Masalahnya saya tunanetra di dunia CSS, makanya saya memanfaatkan CSS Hooks 😆 – jika tidak, saya tidak bisa bergerak kalau cuma meraba-raba di belantara CSS yang gelap gulita 😀

  8. Avatar Aldy

    OOT, kayaknya habis dari negeri layang-layang malah ganti kulit.

    Sudah mulai bermain dengan CSS ya mas ?

    1. Avatar Cahya

      Pak Aldy,

      Kemarin kebanyakan diedit, jadi tema-nya hancur…, udah sekalian ambil yang baru saja (alasan buat kabur).
      Bukan bermain dengan CSS, tadi Bli Dani saya tanyakan, malah disuruh Googling, cape deh…, mending saya buat catatan sendiri saya, kalau perlu saya bisa buka-buka lagi 😀

  9. Avatar ardianzzz

    hehe, iya tuh nggak kebaca.

    btw, apakah anda menggunakan syntax highlighter?

    Saya merasa kalau syntax highighter justru menyulitkan pengguna. Maksud kita baik ingin membagi source code tetapi justru lebih susah untuk dicopy…

    saya lebih suka menggunakan kode preformatted untuk menulskan code. sekedar referensi ada anyak online tools yang dapat digunakan untuk menggenerate code, salah satunya http://tohtml.com/

    1. Avatar Cahya

      Mas Ardianzzz,

      He he…, maaf, saya posting lewat <abbr title="Windows Live Writer">WLW</abbr> dengan plugin "insert code", eh pinginnya stylish tapi lupa kalau background sama warna font-nya serupa, hancur deh.

      Masalahnya saya malas belajar kode-kode-an, biasanya pas kopdar tanya langsung sama Bli Dani (manfaatkan kamus berjalan gratis) 😆

  10. Avatar Cahya

    Argh…, ternyata kodenya malah tidak terbaca di atas 😆

    Maksudnya..

    <pre>

    abbr, acronym

    {

    border-bottom: .1em dotted;

    }

    </pre>

Tinggalkan Balasan

Eksplorasi konten lain dari Bhyllabus l'énigme

Langganan sekarang agar bisa terus membaca dan mendapatkan akses ke semua arsip.

Lanjutkan membaca