Deneme Yayını 2

 

Harika bir detay yakaladınız! Arama çubuğunun solundaki o büyüteç simgesi, temanın orijinal kodlarında sadece görsel bir nesne (<span> etiketi) olarak eklenmiş. Bu yüzden üzerine tıklandığında hiçbir tepki vermiyor ve hatta altındaki metin kutusuna tıklamanızı bile engelliyor.

Onu işlevsel, gerçek bir "Arama Butonuna" dönüştürmek için XML kodunda ufak bir değişiklik yapacağız.

Blogger XML editörünüzü açın ve şu kod bloğunu aratın: id='searchSubmit'

Aşağıdaki gibi bir kod göreceksiniz:

XML

<b:includable id='searchSubmit'>
  <span class='sb'><b:include name='search-icon'/></span>
</b:includable>

Bu bloğu tamamen silin ve yerine şu kodu yapıştırın:

XML

<b:includable id='searchSubmit'>
  <button class='sb' type='submit' aria-label='Ara' style='cursor: pointer;'>
    <b:include name='search-icon'/>
  </button>
</b:includable>

Ne Değişti?

• İşlevsiz olan <span> etiketini sildik ve yerine gerçek bir <button> (buton) etiketi koyduk.

• type='submit' özelliğini ekleyerek, bu butona tıklandığında yazılan kelimenin doğrudan aranmasını sağladık.

• style='cursor: pointer;' ekleyerek, fare ile üzerine geldiğinizde imlecin "tıklanabilir el" (pointer) simgesine dönüşmesini sağladık, böylece kullanıcılar oranın bir buton olduğunu anlayacak.

Bu değişikliği kaydedip sitenizi yenilediğinizde büyüteç simgesinin tam aktif bir butona dönüştüğünü göreceksiniz!