CODEWITHSUNDEEP
javascript
Julian P
Julian P

Reputation: 11

Google Searchbox not Validating as HTML5

I have added the Google searchbox to my HTML5 site. When I go to the W3C validator I get an error: element gcse:search not allowed as child of element div in this context. I was instructed by Google to put the script in a div, and cannot get the searchbox to work without it. Can anyone help at all? I imagine it is a problem which must arise all the time. My code is below. Many thanks!

<div id="searchbox">    
    <script>
       (function() {    
            var cx = '014531685129972083622:vk5kxnojpx0';    
            var gcse = document.createElement('script');    
            gcse.type = 'text/javascript';    
            gcse.async = true;    
            gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') + '//www.google.com/cse/cse.js?cx=' + cx;

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

            s.parentNode.insertBefore(gcse, s);

        })();

    </script>    
    <gcse:search> </gcse:search>    
 </div>

Upvotes: 1

Views: 344

Answers (1)

C3roe
C3roe

Reputation: 96151

I imagine it is a problem which must arise all the time

Might that be the reason, perhaps, they covered this in their official documentation …?

https://developers.google.com/custom-search/docs/element#html5:

HTML5-valid div tags

You can use HTML5-valid div tags as long as you observe these guidelines:

  • The class attribute must be set to gcse-XXX
  • Any attributes must be prefixed with data-.

For example:

<div class="gcse-searchbox" data-resultsUrl="http://www.example.com" data-newWindow="true" data-queryParameterName="search" >

Upvotes: 2

Related Questions