Bu sitedeki her şey ile kodlanmıştır.

Kategori Listesini Göster

Blogger için Responsive Arama Kutusu Yapımı


Blogger için Responsive Arama Kutusu YapımıGünümüzde Responsive (mobil uyumlu) tasarım oldukça önem arz ediyor. Ben de bu sıralar bu kavram ile yakından ilgiliyim. Bu yüzden sizlerle Responsive olarak hazırladığım, düzenlediğim ne varsa paylaşmaya çalışıyorum. Gelelim konumuza. Blogger için geliştirilen birçok arama kutusu eklentisi var. Ancak eğer temanız Responsive ise, arama kutusu da Responsive olabilir. Aşağıdaki kodları sitenize ekleyerek, siteniz için %100 Responsive uyumlu bir arama kutusu elde edebilirsiniz.

AYRICA: Blogger Otomatik Devamını Oku (Eklentisiz)

Blogger için Responsive Arama Kutusu Yapımı

<style>
#search{}
input.gsc-input {
border:1px solid #ddd;height:40px;padding-left:10px;padding-right:10px;vertical-align:top;width:100%;color:#444;box-sizing:border-box;
margin-bottom:10px;
}
input.gsc-input:hover {
border:1px solid #ccc;
}
input.gsc-input:focus {
border:1px solid #ccc;outline:none
}
input.gsc-search-button {
background-color:#EF6950;background-image:url('http://4.bp.blogspot.com/-uIGyPX4c5lI/WaAG1_UStQI/AAAAAAAAPy0/WGHYHIJAwkosId_Fwaa9cyGEOCIOBjkVgCK4BGAYYCw/s1600/alt-arama.png');background-position:center;background-repeat:no-repeat;border:1px solid #EF6950;color:transparent;font-size:11px;font-weight:bold;height:44px;text-align:center;float:right;width:100%;cursor: pointer;
}
input.gsc-search-button:focus{outline:none}
input.gsc-search-button:hover {
background-color:#666;border:1px solid #666;color:transparent
}
</style>
<form action='/search' id='search' method='get'>
<input autocomplete="off" type="text" size="10" class="gsc-input" name="q" title="Ne aramak istiyorsunuz?" />
<input type="submit" value="" class="gsc-search-button" title="Ara" />
</form>

Görünüm

Blogger için Responsive Arama Kutusu Yapımı
  1. Yorum bulunmamaktadır.

Bu yazıya yorum göndermek ister misiniz?

Dikkat: Her yorum gönderen kişi, kendi gönderdiği yorumdan sorumlu olmaktadır.
Not: Yazı ile herhangi bir ilgisi bulunmayan yorumların onaylanmadığını belirtmek isteriz.