Ada kalanya kita merasa tidak enak jika ingin menyisipkan banyak link di dalam sebuah artikel/posting blog yang akan kita publish. Di satu sisi, ada niat untuk membangun jejaring backlink agar posisi semakin kuat di SERP (pada keyword tertentu yang kita targetkan). Namun di sisi lain, kadang itu berbenturan dengan keinginan untuk mengutamakan kenyamanan pembaca.
Adakah solusi atau jalan tengah untuk itu?
Tentu saja ada. Caranya yaitu membuat link tersembunyi yang tidak kelihatan. Mengapa bisa tidak kelihatan? Sebab link tersebut tampak seperti teks biasa yang berwarna sama dengan warna teks utama paragraf dan sama sekali tidak bergaris bawah.
Konsepnya yaitu kita membuat sebuah ‘anchor-link’ dengan class (kelas) khusus yang disetting via CSS. Nanti ketika ingin digunakan, kita tinggal menambahkan keterangan berupa nama class khusus tersebut pada link tertentu yang ingin kita sembunyikan dari pengamatan pembaca.
Bagaimana cara membuat kode CSS-nya?
- Coba Anda cari tahu dulu kode HTML warna teks utama pada bagian body theme yang Anda gunakan. Saya beri contoh saja pada theme blog ini. Kode CSS yang mengatur warna teks utama konten blog ini yaitu berupa:
2. body {font-size:120%;
3. font-family:Verdana,Helvetica,Arial,sans-serif;
4. color:#444;
5. line-height:1.65em;
6. text-align:center;
7. background:#4b6e85 url("images/metal_texture.jpg")
}
Perhatikan kode berwarna merah! Itu adalah settingan kode CSS untuk mengatur tampilan warna teks utama konten blog ini. Ya, kode warnanya yaitu #444 (hitam lembut).
- Coba cari kode CSS yang mengatur tampilan link di dalam post-body. Kalau pada blog ini berupa:
div.post-body a:link{color:#071585;border-bottom:1px solid #666}
Kode di atas berarti bahwa untuk link di dalam tubuh konten utama (pada area posting) disetting berwarna biru (#071585) dan berbatas-bawah berupa garis solid berwarna abu-abu (#666) sebesar 1 pixel. Pada theme lainnya, secara umum link disetting bergaris-bawah dengan kode berupa a:link {text-decoration:underline} atau a {text-decoration:underline}.
Saya lebih memilih menggunakan batas bawah ketimbang garis bawah. Silakan baca tentang perbedaan antara underline dan border-bottom pada link.
- Saatnya membuat kode CSS khusus untuk menyembunyikan link. Kodenya yaitu berupa:
a.c8 {color:#444;border-bottom:none}
Kode di atas artinya kita membuat sebuah link khusus dengan nama class berupa “c8″, dengan warna teks #444 (hitam lembut) dan tidak berbatas-bawah.
Jika setelan link blog Anda menggunakan dekorasi garis bawah, maka ganti saja kode CSS-nya menjadi:
a.c8 {color:#444;text-decoration:none}
Tentu saja nama class-nya tidak harus c8. Anda bisa ganti sesuka Anda. Kode warnanya juga harus disesuaikan dengan kode warna HTML teks utama sesuai theme yang Anda gunakan. Lihat contohnya pada langkah pertama di atas ↑.
- Nah, coba tambahkan kode tersebut pada file CSS theme yang Anda gunakan. Kalau pada WordPress biasanya ada pada style.css. Jika pada blogspot, tinggal tambahkan pada menu edit HTML. Jangan lupa klik tombol setelah penambahan kode itu.
- Saatnya membuat link khusus yang tidak kelihatan pada posting. Caranya yaitu tinggal menyisipkan nama class link khusus tersebut pada kode HTML link yang mengapit keyword/frase tertentu pada postingan Anda. Tentunya harus dalam mode ‘edit HTML’.Kita misalkan saja, saya ingin menyisipkan link menuju URL http://kafegue.com/cara-mengganti-theme-wordpress/ pada teks berupa “cara mengganti theme wordpress” dalam salah satu paragraf posting yang akan saya publish. Maka kode HTML untuk link tersembunyi itu berupa:
<a class="c8" href="http://kafegue.com/cara-mengganti-theme-wordpress/">cara mengganti theme wordpress</a>
Kode berwarna merah adalah kode yang mengatur tampilan link tersebut agar tidak kelihatan. Soalnya sudah kita setting via CSS pada langkah ketiga sebelumnya ↑ (agar berwarna sama dengan teks biasa dan tidak bergaris-bawah). Itulah kode yang harus Anda tambahkan.
Sudah mengerti kan konsepnya?
Jadi, konsep umumnya begini:
- Cari tahu dulu kode warna HTML pada bagian body atau teks utama blog Anda.
- Cari tahu apakah settingan linknya bergaris-bawah atau tidak.
- Buat kode CSS yang isinya menyetting agar tampilan warna link sama dengan warna teks utama dan tidak bergaris-bawah.
- Masukkan nama class link khusus yang sudah dibuat pada keyword/frase tertentu yang ingin kita sisipkan link tersembunyi.
