Print this page

Is it possible to include a Google Search Widget on a VF page?

Knowledge Article Number 000170682
Description Customer is looking to have some consistency across our web pages, and would like to include a Google widget on the VF pages that they have hosted on their Sites. 
Resolution For including Google Search Widget in VF Page, you have to follow below mentioned Steps:

Step 1: Generate a Valid Search Engine ID from Google

Note: While creating the Search Engine ID in the last step, you will get the Script but you cannot use that Script in Visualforce Page as it contains <gcse:search></gcse:search> component and Salesforce compiler will try to find this component and raise error.

"Unknown component gcse:search"

The workaround for this is using Google API in Step 3 below:

Step 2: Copy the Unique ID from the Search Engine from Custom Search element code in Google and paste in the Script in VF page mentioned in Step 3

Step 3: Create a VF page

<apex:page > 
		<meta http-equiv="content-type" content="text/html; charset=utf-8"/> 
		<title>Google Custom Search Element API Example</title> 
		<script src=""></script> 
		<script type="text/javascript"> 
			google.load('search', '1'); 

			new'===Search engine unique ID===').draw('cse'); 
			}, true); 
	<body style="font-family: Arial;border: 0 none;"> 
		<div id="cse" style="width:100%;">Loading...</div> 


promote demote