إضافة محرك بحث إحترافي الشكل 2 - CyberGeek

إضافة محرك بحث منبثق , إحترافي الشكل , بخلفية شفافة تظهر محتوى المدونة , لون الخلفية متدرج من الأزرق إلى البنفسجي , محرك البحث لا يظهر إلا عند النقر على زر البحث فيظهر معك محرك البحث , و عند الضغط على علامة X يختفي .
طريقة التركيب

أولا إلصق هذا الكود فوق وسم من قالب موقعك

<style>a.fas.fa-search {color: white;float: left; font-size: 26px;margin: 20px 0px 0px 20px;} #searchbar{background-image:linear-gradient(17deg,#a32fb7ab,#474778eb); position:fixed; bottom:0px; left:0px; top:0; right:0; z-index:7; display:none} #searchform{top:50%; left:0; position:absolute; right:0} .search-input{height:60px; width:50%; font-family:'El Messiri',sans-serif; font-size:x-large; border-radius:10px} #searchbar i.fa.fa-times{font-size:40px; right:17px; position:absolute; color:white} .search-icon{height:60px; width:60px; color:white; font-size:19px; background-image:linear-gradient(17deg,#a32fb7,#474778); border-radius:50%; border:3px solid white} @media screen and (max-width:480px){.search-input{ font-size:18px}} </style><script type='text/javascript'>function myFunction() { var x = document.getElementById("searchbar"); if (x.style.display === "block") { x.style.display = "none"; } else { x.style.display = "block"; } } </script>

ثانيا إلصق هذا الكود فوق وسم من قالب موقعك

<div id="searchbar"><ul><li><a href="javascript:void(0);" onclick="myFunction()"><i class="fa fa-times"></i></a></li></ul><form action="/search" id="searchform" method="get" role="search"><input class="search-input" id="s" name="q" placeholder="إبحث في الموقع…" type="text" value=""><button class="search-icon" id="searchsubmit" type="submit"><i class="fa fa-search"></i></button></form></div>

ثالثا هذا الكود هو كود علامة البحث بلون أبيض بحيث إذا نقرت عليه يظهر لك محرك البحث

إلصقه في المكان الذي تريد ظهوره

<a class="fas fa-search" href="javascript:void(0);" onclick="myFunction()"></a>

إذا لم تظهر لك علامة زر البحث فالصق الكود التالي فوق وسم مباشرة

<link crossorigin='anonymous' href='https://use.fontawesome.com/releases/v5.7.0/css/all.css' integrity='sha384-lZN37f5QGtY3VHgisS14W3ExzMWZxybE1SJSEsQp9S+oqd12jhcu+A56Ebc1zFSJ' rel='stylesheet'/>

• روابط التحميل والمشاهدة، الروابط المباشرة للتحميل من هنا

---------------------------------------------------------------

شاهد هذا الفيديو القصير لطريقة التحميل البسيطة من هنا

منتدى مدونات بلوجر جاهزة بآلاف المواضيع والمشاركات

كيف تحصل على مدونة جاهزة بآلاف المواضيع والمشاركات من هنا شاهد قناة منتدى مدونات بلوجر جاهزة بألاف المواضيع والمشاركات على اليوتيوب لمزيد من الشرح من هنا رابط مدونة منتدى مدونات بلوجر جاهزة بآلاف المواضيع والمشاركات في أي وقت حــــتى لو تم حذفها من هنا شاهد صفحة منتدى مدونات بلوجر جاهزة بألاف المواضيع والمشاركات على الفيس بوك لمزيد من الشرح من هنا تعرف على ترتيب مواضيع منتدى مدونات بلوجر جاهزة بآلاف المواضيع والمشاركات (حتى لا تختلط عليك الامور) من هنا

ملاحظة هامة: كل عمليات تنزيل، رفع، وتعديل المواضيع الجاهزة تتم بطريقة آلية، ونعتذر عن اي موضوع مخالف او مخل بالحياء مرفوع بالمدونات الجاهزة بآلاف المواضيع والمشاركات، ولكم ان تقوموا بحذف هذه المواضيع والمشاركات والطريقة بسيطة وسهلة. ــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــسلامـ.

https://livre-liver.blogspot.com/p/1.html
https://livre-liver.blogspot.com/p/2.html
https://livre-liver.blogspot.com/p/3.html