Merubah Kotak Asynchronous Google Adsense Custom Search

Jika saja saya tidak berhasil untuk menemukan bagaimana cara merubah kotak Asynchronous Google AdSense Custom Search, maka mungkin saya telah batal memasangnya di widget dan kembali kepada script aseli. Meskipun script-nya memblok penampilan saat halaman dibuka.

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:

  1. Buka style.css
  2. 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;}
  3. 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.

Share | Tweet | WA | Email | Print!
Home » Blog » AdSense » Merubah Kotak Asynchronous Google Adsense Custom Search

By Bambang Aroengbinang. BA lahir di Desa Mersi, Purwokerto, Jawa Tengah, sekarang tinggal di Jakarta. Seorang blogger dan pejalan musiman yang senang berkunjung ke situs, makam, dan tempat bersejarah. Menyukai pemandangan daratan subur dan pegunungan hijau ketimbang laut. Kontak BA. Subscribe via email for newly published posts. Updated on 17 Juni 2017. Tag:

Tulisan lainnya : 38 Tempat Wisata di Tapanuli Tengah | Makam Sunan Kedu Gribig Kudus | Hotel di Lubuk Basung | Surat Terbuka Kepada Jokowers | Curug Belot Rempoah Baturraden | Sop Buntut Bu Leman Pekalongan | Dukung Jokowi Jadi Presiden, Coblos No 4 | Hotel di Kisaran | Hotel di Purbalingga | Kuburan Batu Lemo Toraja |