In
Step 1 of the tutorial I shared, you will notice a screenshot that shows where you can choose between "Open Results on Google in the same window" or "Open results within my own site". I chose the later.
#1. I went to my site, created a WordPress "Page" titled "Search Results (slug is search-results)
#2. I followed the instructions in the tutorial I linked to earlier.
#3. I inserted the following Google code into a "Text Widget" in my sidebar:
Code:
<form action="http://www.mattsaffiliatejourney.com/search-results/" id="cse-search-box">
<div>
<input type="hidden" name="cx" value="partner-pub-<code removed here>" />
<input type="hidden" name="cof" value="FORID:10" />
<input type="hidden" name="ie" value="UTF-8" />
<input type="text" name="q" size="25" />
<input type="submit" name="sa" value="Go" />
</div>
</form>
<script type="text/javascript" src="http://www.google.com/cse/brand?form=cse-search-box&lang=en"></script>
#4. I inserted the following code and text into my search-results page:
Code:
<strong>Note:</strong> To see the search results from my site, please read below the Google ads! Cheers!<br />
<div id="cse-search-results"></div>
<script type="text/javascript">
var googleSearchIframeName = "cse-search-results";
var googleSearchFormName = "cse-search-box";
var googleSearchFrameWidth = 800;
var googleSearchDomain = "www.google.com";
var googleSearchPath = "/cse";
</script>
<script type="text/javascript" src="http://www.google.com/afsonline/show_afs_search.js"></script>
Note: Do NOT use the exact code I listed above in step #3, because it will search my site! You MUST use the code that Google provides for you so that it will have your unique "Partner ID" in the code. I have provided this code so that you would be able to see an example of what the code looks like.
#5. Also make sure you choose the "iframe" option on Google. This will make the "two page search results" option work properly.
Note: Google says that the iframe option has been deprecated, but it still works for now. I was unable to get the new "V1" or "V2" code for the "two page results" settings to work. Just stick to the tutorial (exactly step for step) for now, and if something changes or the search box with an iframe option stops working, I will come back here and update this thread with any changes that may need to be made.
You can see the Google Custom Search box in action here:
Matt's Affiliate Journey