ដាក់ប្រអប់ Search ក្នុង blogspot

សរសេរដោយ Unknown នៅ 16 August 2013 | 4:28 PM




 

សព្វថ្ងៃនេះមានការពេញនិយមពីការបង្កើត blogger/blogspot ដូចច្នេះដើម្បីងាយស្រួលក្នុងការ ស្វែងរកគេត្រូវការ Search ។ខាងក្រោមនេះជាកូដ
របៀបធ្វើ

  1. Login to Blogger Dashboard -> Layout tab
  2. ចុចលើពាក្យ Add a Gadget នៅកន្លែងណាក៏បានស្រេចតែយើងចង់ដាក់.
  3. ជ្រើសយក HTML/JavaScript ពីតារាង
  4. ចម្លង Code Search Box ដែលអ្នកពេញចិត្ត ដាក់ក្នុងតារាង HTML/JavaScript បន្ទាប់មកSave the Gadget.ជាការស្រេច

STYLE 1

search box style1
<style type="text/css">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_M21feiO4zcpskHL3QDlzqjA-1WMaVRr8aiulvrEBBZws0TpmAAhJ15EP0_8JW99V41f6sLeZ3iBLShELEqGMU4-uOOFOshisS78CcYBZ_HAuTRKCY7q05wBpaF3xGmVIyyytSGCOnQaf/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;}
form#w2b-searchform{display: block;padding: 10px 12px;margin:0;}
form#w2b-searchform #s{padding: 6px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;}
form#w2b-searchform #sbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;}
</style>
<div id="w2b-searchbox">
<form id="w2b-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...";}'/>
    <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton" />
</form>
</div>

STYLE 2

search box style2
<style type="text/css">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh32ZBmEXKthQnXEvwMoq6-mInXySpyvGt8MFMIOH9hCF7y5W7ZhXpWBeNdEKmHSH_PkfgdoIm_j6aZUEzuxHbwMv957z6xd912fRnatXCo-bnBeKgw83AU-K8unCjydX9JAYWd6Rtq47VX/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;}
form#w2b-searchform{display: block;padding: 10px 12px;margin:0;}
form#w2b-searchform #s{padding: 6px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;}
form#w2b-searchform #sbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;}
</style>
<div id="w2b-searchbox">
<form id="w2b-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...";}'/>
    <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton" />
</form>
</div>

STYLE 3

search box style3
<style type="text/css">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRebAyPhQ-HoEiRYXnYQ9jm3RtEjkVasDj-N2L4x6yeW48MFW7e25r4IZOnDLUxNkpxqkPrlATP0sVDvombkthqUN6o4mUbgaHFpeM7ZufM_LYbtOHvLIoGwBK0zyaVG0CC05CcXSHlKx3/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;}
form#w2b-searchform{display: block;padding: 10px 12px;margin:0;}
form#w2b-searchform #s{padding: 6px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;}
form#w2b-searchform #sbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;}
</style>
<div id="w2b-searchbox">
<form id="w2b-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...";}'/>
    <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton" />
</form>
</div>

STYLE 4HHGHG

search box style4
<style type="text/css">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNwStL0yxZ1MQ8f3TInMBL_yXCpOcF4g7kw_wsEYEFm6AttBOXWtBOAWNgs-x7oB7h147_J7qZZoz52hZTpiVGTzTskF8oo36Raibdk3avDmGVRxp-hlM2tLAJHD0RbWJ3cNO-Lhdv7DC4/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;}
form#w2b-searchform{display: block;padding: 12px;margin:0;}
form#w2b-searchform #s{padding: 6px 6px 6px 26px;margin:0;width: 215px;font-size:14px;vertical-align: top;border:none;background:transparent;}
form#w2b-searchform #sbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;}
</style>
<div id="w2b-searchbox">
<form id="w2b-searchform" action="/search" method="get">
    <input type="text" id="s" name="q" value=""/>
    <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton" />
</form>
</div>

STYLE 5

search box style5
<style type="text/css">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhj2MdtG5TTqNStKgnB_zQQC2EaL78Lv_aEG4kYjHgo6__LeodajNuyhIcvUNes-kGk-JvAhiZuavCeMEet5u1oDo_4bm5RN7T3ZxuOi2_Q9YnLxwFA4StoLru0yqj916pg12yuVyszWf_O/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;}
form#w2b-searchform{display: block;padding: 12px;margin:0;}
form#w2b-searchform #s{padding: 6px 6px 6px 26px;margin:0;width: 215px;font-size:14px;vertical-align: top;border:none;background:transparent;}
form#w2b-searchform #sbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;}
</style>
<div id="w2b-searchbox">
<form id="w2b-searchform" action="/search" method="get">
    <input type="text" id="s" name="q" value=""/>
    <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton" />
</form>
</div>

STYLE 6

search box style6
<style type="text/css">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhB9u6EHzhg1TPizgXtSJ_ISm7OvQNzKy66iHDtu4EBmeLFaVSBQafqcvDfpkVoOkIuQEkKpGG8o-ClmKwsZn-Jpvn3xeiwGBzBPbjKi19q2xrh4hwB8nIDPBCPg09uzIdMMHGhWHsTxN-w/) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;}
form#w2b-searchform{display: block;padding: 12px;margin:0;}
form#w2b-searchform #s{padding: 6px 6px 6px 26px;margin:0;width: 215px;font-size:14px;vertical-align: top;border:none;background:transparent;}
form#w2b-searchform #sbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;}
</style>
<div id="w2b-searchbox">
<form id="w2b-searchform" action="/search" method="get">
    <input type="text" id="s" name="q" value=""/>
    <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton" />
</form>
</div>
Facebook Comments Plugin Enhanced by Share4khmer
ចែករំលែកអត្ថបទនេះ :
Blogger Tips and TricksLatest Tips And TricksBlogger Tricks

.

Share4khmer.com
 
Copyright © 2013. ចែករំលែកសម្រាប់កូនខ្មែរ - All Rights Reserved
Created by Yang Pisey Published by Share4Khmer.Com