Cara Membuat Anak Panah di Sebelah Menu atau Sub Menu Blog

Tanky Street

Pada awalnya saya sempat menyangka bahwa tanda anak panah yang terdapat di sebelah kiri atau kanan sebuah menu utama situs web atau blog yang memiliki sub menu di dalamnya ( seperti yang tampak pada gambar di bawah ), adalah sebuah simbol atau lambang dari karakter (ASCII) tertentu. Namun ternyata prasangka tersebut adalah suatu hal yang keliru, karena sebenarnya tanda anak panah seperti yang tampak pada gambar di atas bukanlah terbentuk dari simbol atau lambang tertentu, melainkan tanda garis yang terbentuk dari penggunaan kode CSS.

Gambar tanda anak panah seperti yang tampak pada bilah menu di atas, pada umumnya dipakai untuk menandai bahwa menu yang dimaksud merupakan sebuah menu pull down yang memiliki sub atau tingkatan level yang berikutnya. Sehingga dengan adanya tanda tersebut maka akan memudahkan pengunjung dan atau pembaca dalam melakukan navigasi, karena terbantu dengan adanya tanda visual dalam bentuk lambang anak panah tersebut. Dan hal ini tentu saja akan berbeda apabila tidak ada tanda sama sekali pada menu pull down yang dimaksud. Dengan tidak adanya tanda (misal: dalam bentuk anak panah), maka pengunjung dan atau pembaca baru akan mengetahui kalau menu yang dimaksud merupakan sebuah pull down menu ketika yang bersangkutan meletakkan mouse pointer pada menu yang dimaksud, karena ketika mouse pointer diletakkan pada menu tersebut maka secara otomatis sub atau tingkatan menu yang berikutnya akan ditampilkan. Oke, sekarang kita langsung pada pokok pembahasan, yaitu mengenai cara menyisipkan tanda anak panah di sebelah menu pull down seperti yang tampak pada gambar di atas. Dimana untuk melakukannya, maka Anda dapat mengerjakan langkah-langkah berikut ini secara berurutan.
Buka editor template dengan cara mengklik menu ‘Template’ > ‘Edit HTML’ > ‘Lanjutkan’ > ‘Expand Template Widget’.

Cari kode ]]></b:skin> dan kemudian sisipkan rangkaian kode CSS berikut ini tepat di atasnya ( tanpa tanda  " ).

" <a href="#">Tentang<span class="lambang-panah" style="border-color: #000000 transparent transparent; border-width: 5px 5px 0px;"></span></a> "

Nah, berdasarkan kode di atas dapat dilihat bahwa selain ditambahkan <span class="lambang-panah">, di dalamnya juga ditambahkan style="border-color: #000000 transparent transparent; border-width: 5px 5px 0px; yang fungsinya adalah untuk mengubah warna garis menjadi hitam dengan ukuran yang lebih besar yaitu 5 piksel. Berbeda dengan kode CSS sebelumnya yang menggunakan garis warna putih dengan ukuran 4 piksel.
Begitulah kira kira cara untuk membuat anak panah di sebelah menu atau sub menu blog.
Semoga cara yang saya bagikan ini bermanfaat bagi anda sekalian...

Read Also

Share this post

Get Link Facebook Messenger Whatsapp Whatsapp Twitter Telegram Linkedin Tumblr Pinterest

KLIK

DONASI VIA PAYPAL Bantu berikan donasi jika artikelnya dirasa bermanfaat. Donasi akan digunakan untuk memperpanjang domain https://tankystreet.blogspot.com/. Terima kasih.