Google Custom Search Engine: verschil tussen versies

Uit MediaWikiGids
Ga naar: navigatie, zoeken
(Voorbeeld 2 - Bootstrap styling)
Regel 34: Regel 34:
 
</html>
 
</html>
  
== Voorbeeld 2 - Bootstrap styling ==  
+
== Meer voorbeelden - Bootstrap styling ==  
 +
* [[Google Custom Search Engine/Voorbeeld met Bootstrap styling]]
 +
* [[Google Custom Search Engine/Voorbeeld 3 met 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>
 
<gcse:searchresults-only></gcse:searchresults-only>
 
 
<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">
 
 
    <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>
 
</html>
 
  
 
== Zie ook ==
 
== Zie ook ==
  
 
* [https://www.mediawiki.org/wiki/Extension:GoogleSiteSearch Extensie:GoogleSiteSearch], een extensie met vergelijkbare functionaliteit, Tevens volledige vervanging van de eigen MediaWiki-zoekmachine.
 
* [https://www.mediawiki.org/wiki/Extension:GoogleSiteSearch Extensie:GoogleSiteSearch], een extensie met vergelijkbare functionaliteit, Tevens volledige vervanging van de eigen MediaWiki-zoekmachine.

Versie van 26 mrt 2019 om 11:44

Met behulp van GCSE (Google Custom Search Element of - Engine) - voorheen Google Site Search - biedt de mogelijkheid om met de Google zoekmachine de eigen website te doorzoeken. Tevens integreert en presenteert de zoekmachine de zoekresultaten binnen de omgeving van de eigen website.

Voorbeeld

Dit is een voorbeeld van een gas-element dat zoek in de wiki van theaterencyclopedie.nl:

<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>
<gcse:search></gcse:search>

Het resultaat hiervan ziet er zo uit:

Meer voorbeelden - Bootstrap styling


Zie ook

  • Extensie:GoogleSiteSearch, een extensie met vergelijkbare functionaliteit, Tevens volledige vervanging van de eigen MediaWiki-zoekmachine.