أضافة محرك بحث احترافي وبتقنية Jquery من حمزه ويب

السلام عليكم ورحمه الله وبركاته اللهم صلى على سيدنا محمد وعلى ال محمد

اهلا بكم متابعي مدونة حمزه ويب وزوارة الكرام في هذه تدوينة جديدة وحصرية

على مدونة حمزه ويب

راح نقدم لكم اضافة احترافية ورائعة للمدونات جميعا وبتقنية jquery

وهي عبارة عن محرك بحث احترافي وجميل من تكويدي وانشاءي 

اضافة احترافي جدا

معاينة اضافة

للمعاينة اضافة اضغط هنا

 شرح طريقة تركيب

1. لوحة تحكم
2. قالب
3. تحرير HTML
4. ابحث عن هذا كود ]]></b:skin>
5. واضف هذا كود فوقة

/*-------------Search-----------------*/
#searcharea{margin: 0 0 10px;}.searchbox{background: #f8f8f8 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjt2F-JULJNEBHkcantpAWy4UVaGoMnQLl9btP2LNzLqqRklpmDmgCEIGvSmqlXHLynz_l50jg-k8oGSoHalQoWTNNAGUl2bXg3wmPQ7yOqVQP_Zg86fVDq6OMvjW1Ob0DfJWrSjV2HVVc/s1600/search-gr.png) no-repeat 95% 50%;font-family: tahoma;color: #888;margin: 0;border: 1px solid #888;padding: 13px 36px 14px 10px;border-right: 4px solid #888;width: 198px;}.searchbox:focus{border: 1px solid #aaa;border-right: 4px solid #aaa;}.searchbtn {background: #aaa;border: 1px solid #888;color: #FFF;font: normal 14px GESSTwoMediumRegular, tahoma;padding: 10px 20px;margin: 0 -4px 0;}.searchbtn:hover {background: #888;}

ثم اذهب الى تخطيط اضافة اداه
 اختار Html/JavaScript واضف هذا كود

<div id="searcharea"><form action="/search" method="get" style="display: inline;"><input class="searchbox" maxlength="250" name="q" onblur="if (this.value == &quot;&quot;) {this.value = &quot;ابحث عن موضوع...&quot;;}" onfocus="if (this.value == &quot;ابحث عن موضوع...&quot;) {this.value = &quot;&quot;;}" type="text" value="ابحث عن موضوع..."><input class="searchbtn" type="submit" value="بحث"></form></div>

 واحفظ 

وانتهى موضوعنا

وانتظروا كل جديد وحصري من حمزه ويب 

في امان الله