{"id":212,"date":"2018-03-13T15:33:08","date_gmt":"2018-03-13T10:03:08","guid":{"rendered":"http:\/\/holithemes.com\/blog\/?p=212"},"modified":"2018-03-13T15:33:08","modified_gmt":"2018-03-13T10:03:08","slug":"add-custom-search-engine-in-your-website-using-google-custom-search-engine-cse","status":"publish","type":"post","link":"https:\/\/holithemes.com\/blog\/add-custom-search-engine-in-your-website-using-google-custom-search-engine-cse\/","title":{"rendered":"Add Custom Search Engine in your Website using Google Custom Search Engine ( CSE )"},"content":{"rendered":"\n<p>Create Custom Search Engine using Google Custom Search Engine ( CSE ) and Add that search engine in your website<\/p>\n\n\n\n<p>Google Custom Search Engine ( CSE ) is a tool to implement search engine on your website, or to a separate URL created by google.<\/p>\n\n\n\n<p>Set your own settings. like which pages to search, What Domains to include, Exclude, Include page, look and feel, Image Search, Speech Input,\u00a0synonyms keywords, Language and much more<\/p>\n\n\n\n<p>Can add other website to you custom search engine. even that website is not owned by you. No need to verify any domain name, to add in Google Custom Search Engine.<\/p>\n\n\n\n<p>First we will see how to setup Google Custom Search Engine, later we will setup some additional features<\/p>\n\n\n\n<p>And we will check what the other things have to do When google Custom search Engine is Setup, later &#8211; Tricks \/ Hacks ..<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" width=\"1280\" height=\"720\" src=\"https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/social-mediaManagement-3-1-1.png\" alt=\"add google custom search engine on  website\" class=\"wp-image-1175\" srcset=\"https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/social-mediaManagement-3-1-1.png 1280w, https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/social-mediaManagement-3-1-1-300x169.png 300w, https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/social-mediaManagement-3-1-1-1024x576.png 1024w, https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/social-mediaManagement-3-1-1-768x432.png 768w\" sizes=\"(max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Create Google Custom Search Engine<\/h2>\n\n\n\n<p>Navigate to\u00a0<a rel=\"nofollow noopener\" href=\"https:\/\/cse.google.com\/cse\/\">https:\/\/cse.google.com\/cse\/<\/a><\/p>\n\n\n\n<p>It will navigate to show already created Search Engine list.<\/p>\n\n\n\n<p>But if this is the first one to create<\/p>\n\n\n\n<p>Click on &quot;Create a Custom Search Engine&quot;\u00a0 if not, to create a new Search Engine Click on &quot;Add&quot; or click on &quot;New Search Engine&quot; from the left side menu.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" width=\"928\" height=\"694\" src=\"https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/google_custom_search_-_Add_New_Site.png\" alt=\"\" class=\"wp-image-330\" srcset=\"https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/google_custom_search_-_Add_New_Site.png 928w, https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/google_custom_search_-_Add_New_Site-300x224.png 300w, https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/google_custom_search_-_Add_New_Site-768x574.png 768w\" sizes=\"(max-width: 928px) 100vw, 928px\" \/><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\">Sites to Search<\/h4>\n\n\n\n<p>Enter the sites name to search, Can add multiple domain names. can Add domains that even if you are not owned that we.<\/p>\n\n\n\n<p><strong>Individual pages<\/strong>: To search only on some Individual pages &#8211; can that page URL e.g. www.example.com\/about.html<\/p>\n\n\n\n<p><strong>Entire Site<\/strong>:\u00a0 To Add Entire Site\u00a0 e.g. www.example.com or www.example.com\/* but this is not including all sub domains, search on all pages with in www.example.com. To search on Sub pages add like sub.example.com or sub.example.com\/*<\/p>\n\n\n\n\n\n<p><strong>Entire Domain<\/strong>: to search on entire domain &#8211; all webpages that include sub folder, sub domains *.example.com<\/p>\n\n\n\n<p><strong>parts of site \/ sub folders<\/strong>:\u00a0 www.example.com\/blog\/ or www.example.com\/blog\/*<\/p>\n\n\n\n<p><a rel=\"nofollow noopener\" href=\"https:\/\/support.google.com\/customsearch\/answer\/71826\">URL Patterns &#8211; Google Custom Search<\/a><\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Languages<\/h4>\n\n\n\n<p>Add the desired language, Language for search engine Messages to display messages<\/p>\n\n\n\n<p>( this is not the language of what your search result is, or what your website content is. )<\/p>\n\n\n\n<p>This is useful to set the language to display search box. like the search box placeholder &#8211; text, sort by &#8211; text, powered by google custom search &#8211; text\u00a0 and similar messages.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Name of the SearchEngine<\/h4>\n\n\n\n<p>Give a name to your Custom Search Engine,<\/p>\n\n\n\n<p>If you are using Custom Search Engine public URL ( will check about that in this page ) This name shown at the top of that page just like an heading.<\/p>\n\n\n\n<p>Click on <strong>Create <\/strong>to create a Custom Search Engine<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" width=\"651\" height=\"262\" src=\"https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/image-10.png\" alt=\"cse - success message\" class=\"wp-image-412\" srcset=\"https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/image-10.png 651w, https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/image-10-300x121.png 300w\" sizes=\"(max-width: 651px) 100vw, 651px\" \/><\/figure>\n\n\n\n<p>on Success you will get the page which provide links to &quot;Get Code&quot;, &quot;Public URL&quot;, &quot;Control Panel&quot;<\/p>\n\n\n\n<p>At Any Time to get this information<\/p>\n\n\n\n<p>Click on &quot;Edit Search Engine&quot; &#8211; from the left menu. And then click on &quot;Setup&quot; &#8211; This is Control Panel &#8211; for Search Engine<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" width=\"912\" height=\"859\" src=\"https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/image-11.png\" alt=\"cse  - admin - setup \" class=\"wp-image-434\" srcset=\"https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/image-11.png 912w, https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/image-11-300x283.png 300w, https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/image-11-768x723.png 768w\" sizes=\"(max-width: 912px) 100vw, 912px\" \/><\/figure>\n\n\n\n<p>To get the Code &#8211; from &quot;Setup&quot;\u00a0 click on &quot;Get Code&quot;<\/p>\n\n\n\n<p>To get, enable, disable the public URL click on &quot;Public URL&quot;.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" width=\"643\" height=\"418\" src=\"https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/image-13.png\" alt=\"\" class=\"wp-image-446\" srcset=\"https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/image-13.png 643w, https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/image-13-300x195.png 300w\" sizes=\"(max-width: 643px) 100vw, 643px\" \/><\/figure>\n\n\n\n<p>Copy the code and paste it where you like to display the search box, search result.<\/p>\n\n\n\n<p>e.g\u00a0 if you like to add search box in Sidebar, If you are using WordPress and have your Theme provide to add content on Sidebar using Widgets.<\/p>\n\n\n\n<p>Then form wp-admin &#8211; Dashboard -&gt; Appearance -&gt; Widgets<\/p>\n\n\n\n<p>Select &quot;Custom HTML&quot; Widget and place that widget where you want &#8211; sidebar, footer, header ..<\/p>\n\n\n\n<p>and add the code in that widget and save.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter\"><img decoding=\"async\" width=\"440\" height=\"623\" src=\"https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/added_Google_Custom_Search_in_Sidebar_-_using_custom_HTML_Widgets.png\" alt=\"Google Custom Search in Sidebar - using custom HTML Widget\" class=\"wp-image-508\" srcset=\"https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/added_Google_Custom_Search_in_Sidebar_-_using_custom_HTML_Widgets.png 440w, https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/added_Google_Custom_Search_in_Sidebar_-_using_custom_HTML_Widgets-212x300.png 212w\" sizes=\"(max-width: 440px) 100vw, 440px\" \/><\/figure>\n\n\n\n<p>We can arrange things like\u00a0 &#8211; Display only Search result or Search box or Seach box at one place and Search result at one place.<\/p>\n\n\n\n<p>To do this &#8211; Click on &quot;Look and feel&quot; from the left navigation.<\/p>\n\n\n\n<p>or you change the last line of the code by your self<\/p>\n\n\n\n<p><strong>&lt;gcse:search&gt;<\/strong>\u00a0 \u00a0&#8211;\u00a0 To display Search box, Search Result<\/p>\n\n\n\n<p><strong>&lt;gcse:searchbox&gt;<\/strong>, <strong>&lt;gcse:searchresults&gt;<\/strong> &#8211; Two Colums &#8211; To Display Search box, Search result on two columns with in same page.<\/p>\n\n\n\n<p><strong>&lt;gcse:searchbox-only&gt;<\/strong>\u00a0 &#8211;\u00a0 To Display only Search Box<\/p>\n\n\n\n<p><strong>&lt;gcse:searchresults-only&gt;<\/strong>\u00a0 \u00a0&#8211;\u00a0 To Display only Search Result<\/p>\n\n\n\n<p>Instead of manually editing this code, Google will generate this code by changing the settings at &quot;Look and feel&quot;<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" width=\"857\" height=\"769\" src=\"https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/change_look_and_feel.png\" alt=\"change look and feel - cse\" class=\"wp-image-632\" srcset=\"https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/change_look_and_feel.png 857w, https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/change_look_and_feel-300x269.png 300w, https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/change_look_and_feel-768x689.png 768w\" sizes=\"(max-width: 857px) 100vw, 857px\" \/><\/figure>\n\n\n\n<p>Customize the color of the link, text, buttons, by navigate to Customize tab, or can change the look and feel using themes.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Synonyms<\/h2>\n\n\n\n<p>Add Variations for search terms<\/p>\n\n\n\n<p>e.g. in your website you may use term like\u00a0&quot;New York City&quot; but user may search for different term like &quot;NYC&quot;<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" width=\"860\" height=\"343\" src=\"https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/synonyms_001.png\" alt=\"Add synonyms\" class=\"wp-image-781\" srcset=\"https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/synonyms_001.png 860w, https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/synonyms_001-300x120.png 300w, https:\/\/holithemes.com\/blog\/wp-content\/uploads\/2018\/03\/synonyms_001-768x306.png 768w\" sizes=\"(max-width: 860px) 100vw, 860px\" \/><\/figure>\n\n\n\n<p>Now if search query is &quot;NYC&quot; Search Engine will show results that are related to\u00a0&quot;New York City&quot;<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Things May need \ufeffto do<\/h2>\n\n\n\n<p>Make Google Custom Search or Google Search Engine know your Website, Web pages.\u00a0Add your Site at\u00a0<a rel=\"nofollow noopener\" href=\"https:\/\/www.google.com\/webmasters\/tools\/\">Google Search console<\/a>\u00a0and add sitemap.\u00a0<br\/>So that Google know what the pages, Content exist on your site and what the result have to display based on the search query.<\/p>\n\n\n\n<p>If you are using Google Analytics &#8211; You may be already Added Search Query String in filter &quot;S&quot;, CSE default Query String is &quot;q&quot;. Make sure you added &quot;q&quot; also. or change the Default Query String. ( in all case you don&#x27;t need, use this in cases where your URL changes and adds &quot;?q&quot; string\u00a0 before the search query )<\/p>\n\n\n\n<p>At &quot;Statistics and Logs&quot;\u00a0 -&gt; Google Analytics. Select a profile to view Analytics.<\/p>\n\n\n\n<p>Don&#x27;t Enable\u00a0 &#8211;\u00a0Results Browsing History &#8211; just back to previous search result. ( by default disabled )<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Tips \/ Hacks<\/h2>\n\n\n\n<p>Instead of adding Google Search Engine Script on all pages,<\/p>\n\n\n\n<p>Just add the custom search box on all pages i.e. create your own search form which is less wait &#8211; just an input field, submit button inside form, and When user submit that form make sure to navigate to a page where you added Google Custom Search Engine script. ( have to extend the URL with query string, query text )<\/p>\n\n\n\n<p>or<\/p>\n\n\n\n<p>Instead of creating a new search form, you can use WordPress \/ theme <strong>default Search form<\/strong>, but one issue here\u00a0 &#8211; WordPress search Query String is &quot;s&quot; where default CSE query String is &quot;q&quot;. either one have to change to match.<\/p>\n\n\n\n<p>or<\/p>\n\n\n\n<p>In menu add one more item like &quot;search&quot; and make that link to navigate to page where Google Custom Search Engine Script is added. or add a search bar in menu<\/p>\n\n\n\n<hr class=\"wp-block-separator\" \/>\n\n\n\n<h2 class=\"wp-block-heading\">What about Google Site Search ( GSE ) ?<\/h2>\n\n\n\n<p>GSE vs CSE<\/p>\n\n\n\n<p>Google Site Search ( GSE ), is discontinued<\/p>\n\n\n\n<p>GSE is more Enterprise Edition of Google custom Search, can remove Google Branding, can remove Ads. Its not free. ( any how now its discontinued )<\/p>\n\n\n\n<hr class=\"wp-block-separator\" \/>\n\n\n\n<p><a href=\"https:\/\/holithemes.com\/blog\/alternative-to-google-custom-search-engine-cse\/\">Alternative to Google Custom Search Engine ( CSE )<\/a><\/p>\n\n\n\n<p><a href=\"https:\/\/holithemes.com\/blog\/wordpress-search-form-as-google-custom-search-engine-search-box\/\">Make WordPress Search Form as Google Custom Search Engine &#8211; Search box<\/a><\/p>\n\n\n\n<p><a href=\"https:\/\/holithemes.com\/blog\/add-search-box-in-wordpress-menu\/\">Add Search box in WordPress Menu<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Create Custom Search Engine using Google Custom Search Engine ( CSE ) and Add that search engine in your website Google Custom Search Engine ( CSE ) is a tool to implement search engine on your website, or to a separate URL created by google. Set your own settings. like which pages to search, What [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"categories":[15],"tags":[14],"class_list":["post-212","post","type-post","status-publish","format-standard","hentry","category-google-custom-search-engine","tag-cse"],"_links":{"self":[{"href":"https:\/\/holithemes.com\/blog\/wp-json\/wp\/v2\/posts\/212","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/holithemes.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/holithemes.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/holithemes.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/holithemes.com\/blog\/wp-json\/wp\/v2\/comments?post=212"}],"version-history":[{"count":0,"href":"https:\/\/holithemes.com\/blog\/wp-json\/wp\/v2\/posts\/212\/revisions"}],"wp:attachment":[{"href":"https:\/\/holithemes.com\/blog\/wp-json\/wp\/v2\/media?parent=212"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/holithemes.com\/blog\/wp-json\/wp\/v2\/categories?post=212"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/holithemes.com\/blog\/wp-json\/wp\/v2\/tags?post=212"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}