Google Search Configuration - Sample Site Content Type
ID: 169
Name: Google Search Configuration - Sample Site
Description: Add Google Programmable Search for site search
How to use:
- Add a Heading
- Add the Code, get this from the Google Programmable Search Engine admin panel under Look and feel > Layout
Ensure to add the queryparametername="q" attribute, this is required for the search bar in the header to work with the results page
e.g.
<script async src="https://cse.google.com/cse.js?cx=97966d58040704e93"></script>
<div class="gcse-search" queryparametername="q"></div> - Add any required Custom CSS, this is output in the <head> section in <style> tags. Note that the search will pick up styles from the main CSS file which may cause display issues with the default Google CSS. Prefix your CSS selectors with body to ensure the CSS added is picked up, e.g.,
body .gsc-control-cse {
padding: 0;
}
Content Element Details
| Name | Description | Size | Type | Required |
|---|---|---|---|---|
| Name | The Name element | 80 Characters | Plain Text | true |
| Heading | Add a Heading | 100 Characters | Plain Text | true |
| Code | Add the code for the Search Results page | 10000 Characters | Plain Text | true |
| Custom CSS | Add custom CSS code, this is output in the <head> in <style> tags | 10000 Characters | Plain Text | false |