5 thanh tìm kiếm tuyệt đẹp cho blogger
Hẳn là ai cũng đã biết được tầm quan trọng của các ô tìm kiếm trong các blog hay website. Nếu bạn đang phân vân hay chưa biết phải chèn thanh tìm kiếm vào blog của mình như thế nào thì các bạn cũng đừng nên quá lo lắng , vì hôm nay mình sẽ chia sẻ với các bạn đến 5 thanh tìm kiếm và tất cả đều rất đẹp.
Các bạn lần lượt làm theo các bước sau đây:
Bước 1 : Đăng nhập vào Blogger : Dashboard => Design tab => Page Elements
Bước 2 : Click chọn Add a Gadget nơi mà bạn muốn đặt ô tìm kiếm
Bước 3 : Chọn HTML/JavaScript từ danh sách
Bước 4 : Bây giờ là phần thú vị nhất, các bạn chỉ cần chọn 1 trong 5 đoạn code sau đây và dán (paste) vào cho blog của mình
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
| <style type="text/css">#abt-searchbox{border-radius:5px;background:URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJPkA3WlgZaeo1v8kVjcAJLwij7WWSQFmHTIofNLlLLPf5FAkYrp03Yk8vcRZFVVIPr5AR5xjNJPeeXRppMxpFAn0iCM9mrnbvieF6Swz6eh7jRIMKWf48sXlQKc6hSlGT282YpBJOw9M/s1600/black.png) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;}form#abt-searchform{display: block;padding: 10px 12px;margin:0;}form#abt-searchform #s{padding-left:16px !important; padding:7.5px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;}form#abt-searchform#sbutton{margin:0;padding:0;height:40px; width:44px;vertical-align: top;border:none;background:transparent;}</style><div id="abt-searchbox"><form id="abt-searchform" action="/search" method="get"><input type="text" id="s" name="q" value="Search..." onfocus='if (this.value == "Search...") {this.value = ""}' onblur='if (this.value == "") {this.value = "Search...";}'/></form></div> |
Style 2
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
| <style type="text/css">#abt-searchbox{border-radius:5px;background:URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPAduMyGCsqLwdSDF_lIM9bCbxsT5K2x1gYE6bvlbWejxgdlXIGYFIZJc9Cd_hZZQXXIYsCUlhikj2X2cEgKW__GPqL-nYEg5enjsYWPOcqG4RERDFRkdxhDBGZfZMiv9kqIAfYFoDJsg/s400/whitez+by+abt.png) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;}form#abt-searchform{display: block;padding: 10px 12px;margin:0;}form#abt-searchform #s{padding-left:16px !important; padding:7.5px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;}form#abt-searchform#sbutton{margin:0;padding:0;height:40px; width:44px;vertical-align: top;border:none;background:transparent;}</style><div id="abt-searchbox"><form id="abt-searchform" action="/search" method="get"><input type="text" id="s" name="q" value="Search..." onfocus='if (this.value == "Search...") {this.value = ""}' onblur='if (this.value == "") {this.value = "Search...";}'/></form></div> |
Style 3
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
| <style type="text/css">#abt-searchbox{border-radius:5px;background:URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrnu06WxPRxCBlwYK8sjijpovlDjonJvu5zwo7klzj7iClQ3fU9FR1GT4g1LQ2DVmneyWLdNgrcUp-VFnZcEfGjA37rSVd5-93pDScKx9h80qBLCBGbongC4Uqe4uQwdp1WGCdv4dZFro/s400/bluez+by+allbloggingtips.png) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;}form#abt-searchform{display: block;padding: 10px 12px;margin:0;}form#abt-searchform #s{padding-left:16px !important; padding:7.5px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;}form#abt-searchform#sbutton{margin:0;padding:0;height:40px; width:44px;vertical-align: top;border:none;background:transparent;}</style><div id="abt-searchbox"><form id="abt-searchform" action="/search" method="get"><input type="text" id="s" name="q" value="Search..." onfocus='if (this.value == "Search...") {this.value = ""}' onblur='if (this.value == "") {this.value = "Search...";}'/></form></div> |
Style 4
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
| <style type="text/css">#abt-searchbox{border-radius:5px;background:URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdqmtEeWA5Ht7TxbetVJCxd_DOK84DgWpc_39xaa04yFRNqaZ6zNfXT5M3P4VSPlqzn_oe1YvxtonCTdLb2xM1PUyLJlWEE0b17ZYtSBoCrpL_IQD3hyovWYSUfG7CbUWeHHgjcpPmMfU/s400/transparent+by+allbloggingtips.png) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;}form#abt-searchform{display: block;padding: 10px 12px;margin:0;}form#abt-searchform #s{padding-left:16px !important; padding:7.5px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;}form#abt-searchform#sbutton{margin:0;padding:0;height:40px; width:44px;vertical-align: top;border:none;background:transparent;}</style><div id="abt-searchbox"><form id="abt-searchform" action="/search" method="get"><input type="text" id="s" name="q" value="Search..." onfocus='if (this.value == "Search...") {this.value = ""}' onblur='if (this.value == "") {this.value = "Search...";}'/></form></div> |
Style 5
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
| <style type="text/css">#abt-searchbox{border-radius:5px;background:URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi-6-bkEr_VGlDuxtMqdVUuyXesuyviO-YMGL2gCwyu1q9bKEu-PmgME0aQqaTkUWSZ_OlpgsF_SQ4GVOYbbTWzrnf5sZFFpQv7wuMbwdEZEL2-CqFHoHkX58ZT-0JkcXlUJ6Bt5WOsaI/s400/pinkz.png) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;}form#abt-searchform{display: block;padding: 10px 12px;margin:0;}form#abt-searchform #s{padding-left:16px !important; padding:7.5px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;}form#abt-searchform#sbutton{margin:0;padding:0;height:40px; width:44px;vertical-align: top;border:none;background:transparent;}</style><div id="abt-searchbox"><form id="abt-searchform" action="/search" method="get"><input type="text" id="s" name="q" value="Search..." onfocus='if (this.value == "Search...") {this.value = ""}' onblur='if (this.value == "") {this.value = "Search...";}'/></form></div> |
Chúc các bạn thành công !
Không có nhận xét nào: