Cara Membuat Tanda Anak Panah Di Sebelah Menu Utama

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 berikutnya.

Langsung saja kita ke pokok pembahasannya, yaitu mengenai Cara Membuat Tanda Anak Panah Di Sebelah Menu Utama.

1. Buka Edit Template dengan cara mengklik menu Template > Edit HTML > Lanjutkan > Expand Widget Template

2.    cari kode ]]></b:skin> dan kemudian sisipkan kode CSS berikut tepat di atasnya kode ]]></b:skin>

.lambang-panah {
  position: relative;
  top: -1px;
  font-size: 0px;
  height: 0px;
  line-height: 0;
  widht: 0px;
  border-widht: 4px 4px 0px;
  padding-top: 1px;
  left: 4px;
  border-style: solid dashed dashed;
  border-right: 4px dashed transparent;
  border-color: #ffffff transparent transparent;
}

3. Cari kode HTML dari menu yang akan ditambahkan dengan tanda anak panah di sebelahnya kemudian tambahkan kode <span class="lambang-panah"></span> dalam kode yang dimaksud. Sebagai contoh misalnya perhatikan kode HTML untuk menu 'Android' di bawah ini.

<a href="#">Android</a> 

Kode HTML di atas hanya akan menghasilkan menu dalam bentuk tautan teks bertuliskan 'Android'. Nah, agar muncul tanda anak panah, maka tambahkan kode <span class="lambang-panah"></span> didalamnya sehingga menjadi seperti kode HTML dibawah ini

  <a href="#">Android<span class="lambang-panah"></span></a> 

Sehingga akhirnya kode tersebut akan menghasilkan tautan teks dengan tanda anak panah berwarna putih di sebelah kanan menu, seperti yang tampak pada gambar dibawah ini

4. Simpan Template

Semoga berguna dan bermanfaat :)