Page 1 of 1

Google search Box

Posted: Tue Nov 09, 2021 12:16 pm
by Jerry
I know this is not a question regarding WB but I know you guys are a smart bunch and I thought maybe you could help me with this.

here is a temporary link: https://www.edesignsplans.ca/temp/6-plex_2008435.html



I have a Google search box on my site and I want to make it smaller in height within the html code as shown here:
I can make it narrower but not in height.

Any help would be appreciated..



<script>

(function() {

var cx = '017071073968778486342:x2nqae7ewoc';

var gcse = document.createElement('script');

gcse.type = 'text/javascript';

gcse.async = true;

gcse.src = 'https://cse.google.com/cse.js?cx=' + cx;

var s = document.getElementsByTagName('script')[0];

s.parentNode.insertBefore(gcse, s);

})();

</script>

<gcse:searchbox-only></gcse:searchbox-only>

Page URL:
https://www.edesignsplans.ca/temp/6-plex_2008435.html

Re: Google search Box

Posted: Tue Nov 09, 2021 1:09 pm
by crispy68
So obviously the script is what's dictating the height of the text box.

In looking at the code, the font-size is what's controlling the height. Does it give you an option to select the font size? If not, then you can try to add the following CSS code to the <head> tag:

Code: Select all

<style>
.gsc-input{font-size:12px;}
</style>
The current font size is set to 16px so you will need to make it less than that to get smaller.