How to add Google Site Search form in Blogger
M.Muzammil

How to add Google Site Search form in Blogger

By M.Muzammil | February 03, 2023

How to add Google Site Search form in Blogger

Google Site Search is a service that allows you to embed a search engine on your website. It allows your website visitors to search for specific content on your site.

You can customize the search results to prioritize certain pages or documents, and you can also customize the appearance of the search box and search results to match the look and feel of your website.

Some websites like w3schools.com they are having a search form which searches for the term that you enter in Google search results and show the Google search results.

This is the extremely best method to get traffic and rank your posts high in Google if you have SEO knowledge then you will also know that CTR matters CTR means click-through rate which means how many clicks your post gets in Google search results.

By default the search system is provided by the blogger and your posts are searched on your blog but you can also customise that searching system and make a Google site search from your blogger blog.

This Google site search form will work as when someone enters any keyword in that form then the search will be made by the Google search engine and posts are shown as Google results and the user can enter your post through Google reference.

So if you want a Google site search form for your blogger blog just follow the steps provided below its very simple to do that.

If you want to see the demo go to w3schools.com

Steps to add Google Site Search form in Blogger:

  • Go To blogger.com
  • Then, click Layout
  • Click Add New Widget Button
  • Select HTML / Javascript widget
  • Copy the code provided below and paste it as widget content.
  • <div itemprop="mainEntity" itemscope="itemscope" itemtype="http://schema.org/WebSite">
        <link href="https://softwebtuts.com" itemprop="url" />
        <form action="https://www.google.com/search" id="search-wrapper" itemprop="potentialAction" itemscope="itemscope" itemtype="http://schema.org/SearchAction" method="get" target="_blank">
            <meta content="https://www.google.com/search?q={q}" itemprop="target" />
            <input name="cof" type="hidden" value="FORID:10 " />
            <input name="ie" type="hidden" value="ISO-8859-1" />
            <input class="search-form" itemprop="query-input " name="q" placeholder="Search here" required="required" type="search" />
            <input value="https://softwebtuts.com" name="as_sitesearch" type="hidden" />
            <button class="search-button" title="Search" type="submit">SEARCH</button>
        </form>
    </div>
    
    Replace https://softwebtuts.com in the above code, with your website URL.
  • Save Widget and you are done!

Conclusion:

Now go and see your site. If you have followed all the steps as they are listed, then everything will be ok.

Tags :

Related Posts

M.Muzammil
M.Muzammil

I am a web Designer & Graphics Designer. I love to program and design. Sharing knowledge is my passion & Programming is my Hobby. Want Help? Contact Me its free.!

Be The First To Comment