গুগল কাসটম সার্চবার ৷ HTML code for Google search page
আসসালামু আলাইকুম বন্ধরা
সবাই কেমন আছেন । সার্চবার একটি ওয়েবসাইটের জন্য অনেক গুরুত্বপুর্ন, সাইট ভিসিটের পর Viewer নিজের প্রয়োজন অনুযায়ী কোন ফাইল যাতে খুজতে পারে তাই Search Bar ব্যবহার করা হয়। আপনাদের সাথে আজ শেয়ার করবো Blogspot এর জন্য Search box HTML code. যারা নিজের সাইটে সুন্দর একটি সার্চবার এড করতে চান তাদের জন্য ২ টি Stylish search box in HTML.
কিভাবে এড করবেন | How to Add Google custom search in Blogger
Google search page এড করার জন্য আপনার Blogger এর Theme অপশন থেকে Edit HTM এ গিয়ে যেখানে আপনি সার্চবার Show করাতে চাচ্ছেন , নিচের Search box HTML code টি Past করে দিলেই হবে।
Google Search Bar Txt code STyle 1 | Free search bar for website
এটি Simple স্টাইলের গুগল সার্চবার । যা আপনার সাইটকে আকর্ষনীয় করে তুলবে। আপনার ইচ্ছামত কালার এডিট করে নিতে পারেন।
STyle 1
<code> <style><br /> #Search {<br /> display: block;<br /> clear: both;<br /> margin: 10px 0;<br /> }<br /> #Search #input {<br /> background color: transparent;<br /> padding: 7px 15px 7px 35px !important;<br /> color: #444;<br /> font-weight: bold;<br /> text-decoration: none;<br /> border: 1px solid #D3D3D3 !important;<br /> -webkit-border-radius: 4px;<br /> -moz-border-radius: 4px;<br /> border-radius: 4px;<br /> -webkit-box-shadow: 1px 1px 2px #CCC inset;<br /> -moz-box-shadow: 1px 1px 2px #CCC inset;<br /> box-shadow: 1px 1px 2px #CCC inset;<br /> width: 52%;<br /> }<br /> #Search #submit {<br /> color: #444;<br /> font-weight: bold;<br /> text-decoration: none;<br /> padding: 6px 15px;<br /> border: 1px solid #D3D3D3;<br /> cursor: pointer;<br /> -webkit-border-radius: 4px;<br /> -moz-border-radius: 4px;<br /> border-radius: 4px;<br /> background: #fbfbfb;<br /> background: -moz-linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);<br /> background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fbfbfb), colorstop(100%,#f4f4f4));<br /> background: -webkit-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);<br /> background: -o-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);<br /> background: -ms-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);<br /> filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FBFBFB', endColorstr='#F4F4F4',GradientType=0 );<br /> background: linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);<br /> }<br /> </style><br /> <div id="Search"><br />     <form action="/search/max-results=8"><br />         <input name="q" id="input" type="text" /><br />         <input value="Search" id="submit" type="submit" /><br />     </form><br /> </div> </code>
Google Search Bar Txt code STyle 2 | Search icon click open search box
কালারফুল স্টাইলের সুন্দর গুগলের একটি সার্চবার। আপনার ইচ্ছামত কালার এডিট করে নিতে পারেন। আশা করি আপনার পছন্দ হবে।
STyle 2
<style> #nbc-searchgreen1 { background: rgb(143,196,0); /* Old browsers */ background: -moz-linear-gradient(top, rgba(143,196,0,1) 0%, rgba(143,196,0,1) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(143,196,0,1)), color-stop(100%,rgba(143,196,0,1))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(143,196,0,1) 0%,rgba(143,196,0,1) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(143,196,0,1) 0%,rgba(143,196,0,1) 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, rgba(143,196,0,1) 0%,rgba(143,196,0,1) 100%); /* IE10+ */ background: linear-gradient(to bottom, rgba(143,196,0,1) 0%,rgba(143,196,0,1) 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8fc400', endColorstr='#8fc400',GradientType=0 ); /* IE6-9 */ border-radius:10px; width:290px; } #nbc-searchgreenbox1 { padding:10px; } #nbc-searchgreensubmit1 { border:1px solid green; background: green; padding:5px; color:#ffffff; font:14px verdana; } #nbc-searchgreeninput1 { -moz-border-radius: 10px; -khtml-border-radius: 10px; -webkit-border-radius: 10px; border:1px solid #ffffff; background:#ffffff; padding:5px; color:#888888; font:14px verdana; } </style> <div id='nbc-searchgreen1'> <form action='/search/max-results=8' method='get' id="nbc-searchgreenbox1"> <input name='q' id='nbc-searchgreeninput1' onblur='if (this.value == "") {this.value = "Search this site...";}' onfocus='if (this.value == "Search this site...") {this.value = ""}' type='text' value='Search this site...'/> <input id='nbc-searchgreensubmit1' type='submit' value='Search'/> </form> </div>
আজ এইটুকই! কোন সমস্যা ফেস করলে ,কমেন্টে অবশ্যই জানাবেন । টাটা আল্লাহ হাফেজ