Customized Google Search box to your site

Lihat dan hitung, seberapa banyak aplikasi Android yang Anda instal di smartphone Anda?

Pernahkah terbersit di benak Anda bagaimana cara membuat aplikasi-aplikasi tersebut?

Apakah Anda Saat Ini Ingin Sekali Bisa Bikin Aplikasi Android Sendiri? Seperti aplikasi game edukasi, media pembelajaran, aplikasi berbasis sensor, aplikasi multimedia, dan lain sebagainya?

Tetapi

1. Tidak Ngerti Coding

2. Tidak Tahu Computer Programming

3. Tidak Paham Bahasa Pemrograman Android

4. Dan Sama Sekali Bukan Lulusan IT?

Jangan Khawatir ...

Ternyata, bikin aplikasi Android itu SANGAT MUDAH, bahkan bagi Pemula sekalipun.

Sekarang Anda bisa bikin aplikasi Android dengan Cepat, bahkan TANPA HARUS CODING.

Tak peduli apapun latar belakang Anda, bikin aplikasi Android itu MUDAH, semudah bermain Puzzle.

Anda Hanya Perlu 4 Langkah berikut ini :

1. Drag & drop komponen-komponen yang dibutuhkan

2. Percantik tampilan aplikasi dengan mengatur layout dan desain tampilan

3. Susun blok-blok kode programnya, dan

4. Build aplikasi Anda jadi file instalasi *.APK

Lantas, Bagimana Cara Memulainya?

Mudah kok, karena sudah hadir untuk Anda Di Sini :

"Video Tutorial Android Tanpa Coding untuk Pemula"

Video tutorial yang membahas cara membuat aplikasi Android dengan sangat MUDAH, CEPAT, & TANPA CODING menggunakan tools App Inventor 2.

Today i'm gonna nice widget for you.It is a custom Google Search box.I have customized this Google site search box using CSS styling language.Now you can add Google search box in to your blog or website easily.Results of Google search will be opened in a new tab.This Google search box display only global search results like websites,blogs.I have given the live demos of each search box styles.You can test them by searching any desired phrase from this page.

Add Google Search boxes to Blogger Blogs..

1.) Sign in to your blogger account.

2.) Go to Layout (Page Element) >>Click on Add a Gadget >> Select on "HTML/JavaScript".

3.) Now Paste one of Below codes in HTML/JavaScript.

Style 1

Preview

Search Google

Get this

Code

<script type="text/javascript">
</script>
<style>
legend { font-size:1em; color:#0005fb; font-weight:bold; }
fieldset {padding:0 3em 1em 1em; margin:0 90% 0 10%;}
small { font-size:7px;}
</style>
<br />
<fieldset>
<legend>Search Google</legend>
<br />
<div class="qw">
</div>
<form action="http://www.google.com/search" id="searchthis" method="get" style="display: inline;" target="new">

<img src="http://www.google.com/hostednews/img/small-google-logo.gif" />
<input id="b-query" maxlength="255" name="q" size="25" type="text" />
<input id="b-searchbtn" type="submit" value="Search" />
</form>
<br />
<small><em><a href="http://www.bestlodge.blogspot.com/">Get this</a></em></small>
</fieldset>

Style 2

Preview

Get this

code

<script type='text/javascript'>
</script>
<style>
#fieldset1 {padding:0 3em 1em 1em; margin:0 90% 0 10%;background-color:none;}
#g-query {color:blue;font-size:12px;background-color:#eee;}
#legend1 {color:red;}
#small1 {font-size:7px;color:aqua;text-align:right;}
</style>
<fieldset id='fieldset1'>
<legend id='legend1'><img src='http://scm-l3.technorati.com/11/08/04/48857/search.jpg?t=20110804085340'width='50px' height='40px' alt='Google search' title='Google search'/></legend>
<p class='qw'>
<form id="searchthis" action="http://www.google.com/search" style="display:inline;" method="get"target="new">

<img src='http://www.google.com/hostednews/img/small-google-logo.gif'/>
<input id="g-query" maxlength="255" name="q" size="25" type="text"/>
<input type="image" name="submitimage" src="http://3.bp.blogspot.com/-TBX_eLTGWdg/UUGbbrzLvyI/AAAAAAAAA5Q/RPWtORr9gRM/s320/Picture2d.png" width='70px' height='36px'/>
</form></p>
<small id='small1'><em><a href='http://www.bestlodge.blogspot.com'/>Get this</em></small>
</fieldset>

Style 3

preview

Get this

Code

<script type='text/javascript'>
</script>
<style>
.Blodgeb { border: solid;color:silver;margin:3px 17px 20px;}
.qw4 { text-align:center;color:blue;}
#b-searchbtn { background-color:#995522;color:red;}
#fieldset2 {padding:0 3em 1em 1em; margin:0 90% 0 10%;}
#go-query {color:blue;font-size:12px;background-color:#eeeeee;;}
#legend2 {color:red;}
#small2 {font-size:7px;color:aqua;text-align:right;}
#img2 { text-indent:1em;}
</style>
<fieldset id='fieldset2'>
<legend id='legend2'><img src='http://blog.afternic.com/wp-content/uploads/2013/02/Search1.jpg'width='60px' height='50px' alt='Google search' title='Google search'/></legend>
<p class='qw4'>
<form id="searchthis" action="http://www.google.com/search" style="display:inline;" method="get"target="new">
<img src='http://www.google.com/hostednews/img/small-google-logo.gif' />
<input id="go-query" maxlength="255" name="q" size="25" type="text"/>
<input type="image" name="submitimage" src="http://3.bp.blogspot.com/-pryKIgRel64/UUGojtl1r5I/AAAAAAAAA5g/K4YjLZr_qMw/s1600/Picture01.png" width='70px' height='33px'/>
</form></p>

<small id='small2'><em><a href='http://www.bestlodge.blogspot.com' title='get this widget'/>Get this</em></small>
</fieldset>

Style 4

preview

Get this

code

<script type='text/javascript'>
</script>
<style>
#qwp { text-align:center;color:blue;}
#fieldset4 {padding:0 3em 1em 1em; margin:0 90% 0 10%;}
#bestlodge-query {color:blue;font-size:12px;background-color:#eee;}
#legend4 {color:red;}
#dd { font-size:7px;color:#005fb;}
</style>
<fieldset id='fieldset4'>
<legend od='legend4'><img src='http://dev.ektron.com/uploadedimages/exchange/content/exchange_code/january_through_june_of_2010/global-search-icon.jpg'width='50px' height='40px' alt='Google search' title='Google search'/></legend>
<p id='qwp'>
<form id="searchthis" action="http://www.google.com/search" style="display:inline;" method="get"target="new">
<img src='http://www.google.com/hostednews/img/small-google-logo.gif'/>
<input id="bestlodge-query" maxlength="255" name="q" size="25" type="text"/>
<input type="image" name="submitimage" src="http://4.bp.blogspot.com/-3h67YrDo4cI/UUGVNJqMK8I/AAAAAAAAA5A/zpijgxs8pTw/s1600/Picture1.gif" width='70px' height='36px'/>

</form></p>
<small id='dd'><em><a href='http://www.bestlodge.blogspot.com' target='_blank'>Get this</a></em></small>
</fieldset>

4.) Now Save your HTML/JavaScript.

..................................................................................................................................
Need help ?
..................................................................................................................................

You might have any ideas or problems when adding Google site search box in to your blog.Ask me anything that you have in below.I will try to answer all of your questions.

Did you add Google Site search box in to your site ???

Pengelola Blog : ABDUL WAHAB

Judul : Customized Google Search box to your site
Ditulis oleh : Kejutan Internet pada hari
Rating Blog : 5 dari 5
Terima kasih Anda telah membaca artikel tentang Customized Google Search box to your site
Anda boleh menyebar luaskannya atau mengcopy paste-nya jika artikel ini sangat bermanfaat bagi Blog dan teman-teman anda.
Namun jangan lupa harap memberikan link aktif dofollow yang mengarah ke URL ini ya
https://kejutaninternet.blogspot.com/2013/03/customized-google-search-box-to-your.html

Dan Terima kasih sekali lagi atas kunjungan Anda.

Kritik dan saran atau apapun bisa anda sampaikan melalui kotak komentar.
Dan mohon maaf jika komentar atau pertanyaan tidak bisa cepat saya respon,
karena Saya tidak bisa selalu online selama 24 Jam.

Mau Di Buatkan Blog Siap Pakai Seperti Ini ?.