حصريا اضافة محرك بحث للمدونة بلوجر باشكال جميله

السلام عليكم ورحمة الله وبركاته,,,, حصريا  اضافة محرك بحث للمدونة بلوجر باشكال جميله

كودات الاشكال من محركات البحث بالوان مختلفة طريقة التطبيق

سجل دخول الى لوحة تحكم مدونتك -> ثم الى تصميم عناصر الصفحه->  .
 اختر اداه جديده في المكان الذى تود وضع مربع البحث فيه.اختر الاداه الجديده من هذا النوع جافا سكربت  HTML/JavaScript
مافي الاسفل عباره عن 6 اشكال لمحرك البحث الذي ستقوم بوضعه في مدونة بلوجر
قم بنسخ الكود المصاحب للصوره فقط قم باختيار واحد منهم وضع الكود الخاص به في الاداه الجديده وقم بحفظ الاداه

ستايل 1

<style type="text/css">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSeEQFyO5qcfgoSrTv-PajyvcAKgHi221L4vGPFlByW2XVb0eKt7g1-B7WF6FT3TCwPZj1fhwmImZZ4-JSI4olqZxJnhrhSGSNNV917rQ9o49Kt87-9oLbWQEvbUWQ5KGpfM1Lhs2Rm25B/) 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>

ستايل 2

<style type="text/css">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPqG1EXccLS5cb3DtJ9orokoxJmDWuDZx17MAZfJa76pEUKYk4rz0UR0IqfavHP-3S7kYq-ngTG1JAwhgEM2DADwQNHHHT20j3tAO-1R6aBdPoL5vvePwG3h0TO7rS8pwROqhvF65Sj2sx/) 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>

ستايل 3

<style type="text/css">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKukYmRPxuIjp5txYl5u4RCnlJxxulffElAlhWRzimMRiZaruyQoeTRuf7tubyklzN5YU6MrNfj6ko_-uq-EFVo6zjkA81IZSq603jHMn_7Ui6SWs9MhoyBc2i0XYuQ-Y_ZoKgHzDqjCTe/) 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>

ستايل 4

<style type="text/css">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKuliEcJrIKLNbL3vTlXtweGZCY6DVGEdlW6xXfZq5DeDDhQlgNlbJyukYxHN7O0yhijLrZNpUDGktzQbMCU6PhfSQAWDjxu7Cf1RxsLN-4VCxxoQbayyGxqefj1qL58q9oPeE1U_JtyaT/) 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>

ستايل 5

<style type="text/css">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSTDlkqF73cXlAvCSY5l4gzx2EB6q16Kss_sFIsLUpOOP84qGU4QusWng0fh_rvHg0NBDTgLmL0ckj262AyXYhYNNAzCEPu-Ys3ZEXW6Nw6fUppw3TvAvyS-hKiuKrKfb6go7cxXn29-4-/) 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>

ستايل 6

<style type="text/css">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzpGhyphenhyphenYUuJa80jdVlSj30fUNSS0Ys_EUtzf-yoLTa6gTHCGL6PsedVRDkxERj_M-wqx8EWUWqsqtWOE2Eds1nlj0P5VEjTPOodf8gC21iE25sI59-ktcld8s9IiaApYLISvImw3OV5olmU/) 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>

شكــــــــــــــــــــــــــرا لتتبعكـــــــــــــــم 

حصريا فى sos blogger 

عالق على موضوع "حصريا  اضافة محرك بحث للمدونة بلوجر باشكال جميله"