Itu lantaran kotak pencariannya terlihat gemuk, sehingga tak elok dipandang. Mungkin karena lebar widget yang kecil. Jika widgetnya cukup besar, yang memungkinkannya lebih panjang, maka saya tidak repot untuk bagaimana membuat tampilan kotak pencarian itu lebih enak dilihat.
Namun mencari informasi di web untuk informasi semacam ini kadang tidak begitu mudah. Sering pemilihan kata kunci yang tidak tepat membuat hasil pencarian tidak memuaskan, dan tidak membawa hasil apa-apa. Sama halnya dengan pencarian informasi untuk memecahkan masalah saya itu: nihil hasilnya. Tak satu pun hasil pencarian yang bisa menjawab kebutuhan saya.
Mencoba menggunakan GTmetrix untuk mengetahui CSS yang mengatur lebar kotak Kotak Asynchronous Google AdSense Custom Search juga tak membuahkan hasil. Tidak pula saya temukan pilihan untuk mengatur nilai padding kotak pada halaman Custom Search Google.
Setelah berkutat lama dan akhirnya menyerah untuk mencari pemecahan lewat Google, secara coba-coba saya menggunakan Style Editor Firefox, dan alangkah gembiranya saya karena dapat menemukan CSS yang mengatur penampilan kotak custom search Google itu.
Namun masalah belum berakhir. Saya harus melakukan serangkaian coba salah, sebelum akhirnya menemukan cara untuk merubah lebar kotak sesuai dengan yang saya inginkan.
Berikut adalah langkah untuk merubah lebar Kotak Asynchronous Google AdSense Custom Search:
- Buka style.css
- Copy css berikut ini dan pastye ke style.css Anda
.gsc-search-box-tools .gsc-search-box .gsc-input {padding: 0 !important;}
.cse .gsc-search-button input.gsc-search-button-v2,
input.gsc-search-button-v2 {padding: 6px 10px !important;margin-top: 0 !important;}
.gsc-control-cse {padding: 7px 3px 3px 9px !important;}
.gsc-input-box {border-radius:2px;-moz-border-radius:2px;-webkit-border-radius:2px;height: 25px !important;}
input.gsc-input { font-size: 11px !important;}
- Sesuaikan nilai pixel dengan selera Anda. Save
Anda mungkin perlu terlebih dahulu untuk menyesuaikan warna kotak dan pilihan lainnya di halaman Custom Search Google. Semoga bermanfaat.Diubah: Oktober 26, 2017.
Label: AdSense, Inspirasi, Tutorial
Bagikan ke: WhatsApp, Email. Print!.
