How to add Google search in our website

Normally we do our all searching in Google search almost but if we want to add this search in our website then How will we do it. So No worries Google has provided a very simple way by which we can add Google search in our website  and the search result is come with in our website.we can add custom Google search for any type domain.

1. Main Domain Name like(maddyzone.com)

2. Sub Domain like(maddyzone.com)

Recentally i have added Custom Google search in my website, you can see on right top side.Try it with any search query (Type “JavaScript” for test) .Ok lets Come to the Point

> > #  Add google search in our website > >

**Step 1 **First Go to this link  https://www.google.co.in/cse/ then below screen will come

[caption id=”attachment_1673” align=”alignnone” width=”788”] How to add Google search in your website Step 1[/caption]

Now you can see above i have put my Sub-domain name maddyzone.com and you will see Search Engine Name Set According to your Domain Name .

Step-2 Now Click On Create Button then you will see below screen

[caption id=”attachment_1675” align=”alignnone” width=”788”] How to add Google search in our website step 2[/caption]

you see above your Custom Google Search code has set Hurray :) and you will see screen like below

Step-3  Custom Google Search code has set

[caption id=”attachment_1676” align=”alignnone” width=”788”] How to add Google search in our website step 3[/caption]

Step-4 Look And Feel in Custom Google Search Box and Result

Now click on Look and feel Tab on left side then you will see below screen

[caption id=”attachment_1679” align=”alignnone” width=”779”] How to add Google search in our website step 4[/caption]

here we decide That How our Google search will see in our website in right side  you will see below screen

Step-5  Set Theme in Custom Google Search Box and Result

Now  you can set theme in Google Search Box and results .For this click on Themes and you will see below screen and here you can choose your desired theme and see out put on right side screen as we Show above.

[caption id=”attachment_1684” align=”alignnone” width=”784”] set theme in google search button and results[/caption]

Step-6  Customisation in Custom Google Search Box and Result

Now click on Customise Tab and you will see below screen

[caption id=”attachment_1687” align=”alignnone” width=”778”] Customisation in Custom Google Search Box and Result[/caption]

In this we can customise many more things like

1. General

2. Search Box

3. Search Button

4. Refinement

5. Result

6. Result Title

7. And Many More things

Play with above things and see changes on Custom Google search.

> > ## **Note: **Many website use two-column Layout in this search box will come one place and result will come another place** ** > >

For two-column layout click on look and feel on left end side then choose two-column layout then below screen will come like below

[caption id=”attachment_1691” align=”alignnone” width=”779”] add custom google search two-column type pattern[/caption]

Now click on _Save & Code **_then below screen will come for Search Box code apply this code where you want to add only **search box

[caption id=”attachment_1692” align=”alignnone” width=”782”] add custom google search two-column type pattern for search box[/caption]

Then click on Obtain Code for Search results  for google result view.In this code result will show.Apply that code on that part where you want to show result. code look like below when you click on button

[caption id=”attachment_1693” align=”alignnone” width=”780”] add custom google search two-column type pattern for search results[/caption]

I have applied same type layout.For testing search in Google search at right top  side.

Please give your suggestion and comment.

Thanks…..