Brontekst bekijken van Google Custom Search Engine/Voorbeeld met Bootstrap styling

== Voorbeeld 2 - Bootstrap styling == 

<html>
<script>
  (function() {
    var cx = '018439257105187159561:8ydlp_ajuk0';
    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>
<script>
  function executeQuery() {
    var input = document.getElementById('cse-search-input-box-id');
    var element = google.search.cse.element.getElement('searchresults-only0');
    if (input.value == '') {
      element.clearAllResults();
    } else {
      element.execute(input.value);
    }
    return false;
  }
</script>

<form class="navbar-form navbar-right" id="cse-search-box-form-id" onsubmit="return executeQuery();" role="search">
  <div class="input-group"> 
    <input type="text" class="form-control" id="cse-search-input-box-id" size="25" autocomplete="off">
    
    // MAKE SURE TO PUT THIS JS SCRIPT
    <script async type="text/javascript"
      src="//cse.google.com/cse/brand?form=cse-search-box-form-id&inputbox=cse-search-input-box-id">
    </script>
    
    <span class="input-group-btn">
      <button type="submit" class="btn btn-default">
        <span class="glyphicon glyphicon-search"></span>
      </button>
    </span>
  </div>
</form>

<gcse:searchresults-only></gcse:searchresults-only>
</html>