السلام عليكم و رحمة الله و بركاته
#F9690E
صندوق البحث من أهم الاشياء التي يجب ان تتواجد في كل مدونة ناجحة لأهميته الكبيرة , الزائر في كثير من الاحيان يختصر على نفسه الوقت بالبحث في المدونة بدلاَ من تصفح المواضيع واحداَ خلف واحد , وصناديق البحث كثيرة في الانترنت لاكن اليوم حبيت اضع لكم صندوق من تصميمي وهو يعمل بكفائه على مدونات بلوجر , طبعا الخط مدمج مع الاضافة.
ايضا انبه ان محرك البحث متجاوب , اي انه سيتمدد ويتقلص حسب المكان الموضوع فيه.
صورة :
مثال مباشر : من هنا
طريقة التركيب :
- ادخل قالب مدونتك او التخطيط .
- ضع كود محرك البحث في المكان الذي تريد :
<link async='' href='//jetara.googlecode.com/svn/trunk/7lolblogger-fonty.css' rel='stylesheet'/>
<div id='wc-searchblack1'><form action='/search' id='wc-searchblackbox1' method='get'><input id='wc-searchblackinput1' name='q' onblur='if (this.value == "") {this.value = "بحث في الموقع...";}' onfocus='if (this.value == "بحث في الموقع...") {this.value = ""}' type='text' value='أبحث في الموقع ...'/><div id='bl-pp0'><input id='wc-searchblacksubmit1' type='submit' value='أبحث'/><a href='http://blog.7lolblogger.com/'></a></div><style>div#wc-searchblack1{padding:0;width:95%;display:block;margin:2px auto}form#wc-searchblackbox1{padding:0;margin:0 auto;width:100%;text-align:right;direction:rtl}input#wc-searchblackinput1{width:70%;padding:8px;padding-left:15px;margin:0;font:12px lolblogger;color:#999;border:1px solid #eee;background:rgba(255,255,255,1);background:-webkit-gradient(left top,left bottom,color-stop(0,rgba(255,255,255,1)),color-stop(47%,rgba(255,255,255,1)),color-stop(100%,rgba(247,247,247,1)));background:-webkit-linear-gradient(top,rgba(255,255,255,1) 0,rgba(255,255,255,1) 47%,rgba(247,247,247,1) 100%);background:linear-gradient(to bottom,rgba(255,255,255,1) 0,rgba(255,255,255,1) 47%,rgba(247,247,247,1) 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff',endColorstr='#f7f7f7',GradientType=0)}input#wc-searchblacksubmit1{width:20%;max-width:70px;padding:8px;margin:0;font:12px lolblogger;color:#FFF;border:1px solid transparent;background:#f9690e}div#bl-pp0{display:inline;position:relative;right:-9px}div#bl-pp0:before{display:inline-block;content:'';position:absolute;top:11px;right:-15px;margin-top:0;height:0;width:0;border:8px solid transparent;border-left-color:#f9690e}input#wc-searchblacksubmit1:hover{cursor:pointer}</style></form></div>
- لتغير اللون البرتقالي : ابحث عن هذا الكود وغيره :
#F9690E