THEOWEB.DEV

WhatsappBot, BrowserAutomation, TelegramBot, JabberBot, IBankingBot, custom software developer, internet marketing

Membuat Kotak Pencarian Blogger Sendiri

Membuat Kotak Pencarian Blogger Sendiri

Membuat Kotak Pencarian Blogger Sendiri

Tambahkan kode berikut ini ke dalam tema/widget Blogger Anda.


<style>
#search-box {position: relative;width: 100%;margin: 0;}
#search-form {height: 40px;border: 1px solid #999;-webkit-border-radius: 5px;
-moz-border-radius: 5px;border-radius: 5px;background-color: #fff;overflow: hidden;}
#search-text {font-size: 14px;color: #ddd; border-width: 0;background: transparent;}
#search-box input[type="text"]
{width: 90%; padding: 11px 0 12px 1em; color: #333; outline: none;}
#search-button {position: absolute;top: 0;right: 0;height: 42px;
width: 80px;font-size: 14px;color: #fff;text-align: center;
line-height: 42px;border-width: 0;background-color: #1a7db7;
-webkit-border-radius: 0px 5px 5px 0px;
-moz-border-radius: 0px 5px 5px 0px;
border-radius: 0px 5px 5px 0px;
cursor: pointer;}
</style>

<div id="search-box">
<form action="/search" class="form-wrapper" id="search-form" itemprop="potentialAction" itemscope="itemscope" itemtype="http://schema.org/SearchAction" method="get" target="_blank">
<meta content="/search?q={q}" itemprop="target"/>
<input autocomplete="off" id="search-text" name="q" placeholder="SEARCH THIS BLOG" required="required" type="text"/>
<button id="search-button" type="submit">SEARCH</button>
</form>  
</div>

Selamat mencoba

Posting Komentar

Protected By Copyscape