--- title: "Google CSE für die Suche auf einer statischen Website" description: "Erfahren Sie, wie Sie Google CSE (Custom Search Engine) nutzen, um Ihrer statischen Website kostenlos eine voll funktionsfähige Suchlösung hinzuzufügen." date: "2023-05-30T15:01:26+02:00" language: "de-DE" canonical_url: "https://simplystatic.de/tutorials/statische-website-mit-google-cse-durchsuchen/" source_url: "https://simplystatic.de/tutorials/statische-website-mit-google-cse-durchsuchen/" content_type: "text/markdown" --- # Suche auf einer statischen Website mit Google CSE aktivieren [Simply Static](https://simplystatic.de/tutorials/tag/simply-static-de/) 22/09/2026 Inhaltsverzeichnis In diesem Tutorial werfen wir einen genaueren Blick auf Google Custom Search Engine als Möglichkeit, eine Suchfunktion auf Ihrer statischen Website zu implementieren. Zu diesem Zweck habe ich eine einfache WordPress-Website erstellt, die auf der [Demo von Simply Static Pro](https://app.instawp.io/launch?t=simply-static&d=v1) basiert. **Simply Static wird automatisch vorinstalliert und für Sie konfiguriert, sodass Sie die nächsten Schritte nahtlos nachvollziehen können. ## Was ist Google CSE? Google bietet einen Dienst namens [Google Custom Search Engine](https://programmablesearchengine.google.com/about/) an, der eine anpassbare Suche auf Ihrer Website ermöglicht und dabei auf bei Google indexierten Ergebnissen basiert. Die Nutzung der Suche ist kostenlos, solange Sie die Anzeige von Google-Ads-Ergebnissen nicht deaktivieren möchten. Wenn Sie nur Ergebnisse von Ihrer eigenen Website ohne Werbung anzeigen möchten, müssen Sie 5 $ pro 1.000 Anfragen bezahlen. ### Wie richtet man Google CSE ein? Besuchen Sie die Google-CSE-Startseite [hier](https://programmablesearchengine.google.com/) und melden Sie sich mit Ihrem Google-Konto an. Sie gelangen zu Ihrem CSE-Dashboard, in dem Sie eine neue Suchmaschine erstellen können. Sie müssen einen Namen vergeben, der nur intern verwendet wird. Außerdem müssen Sie die Quelle festlegen (dies sollte die URL Ihrer statischen Website sein, nicht die Ihrer WordPress-Website). Lösen Sie das reCAPTCHA und klicken Sie auf *Create*. [![Suche auf einer statischen Website mit Google CSE aktivieren 10](https://simplystatic.de/wp-content/uploads/2023/05/google-cse-base-setup-1024x632.png)](https://simplystatic.de/wp-content/uploads/2023/05/google-cse-base-setup.png) Sie werden zur Projektübersicht weitergeleitet. Hier können Sie zahlreiche Details konfigurieren, worauf wir gleich noch eingehen werden. Kopieren und speichern Sie zunächst die *Search Engine ID*, da wir sie im nächsten Schritt benötigen. [![Suche auf einer statischen Website mit Google CSE aktivieren 11](https://simplystatic.de/wp-content/uploads/2023/05/copy-cse-id-1024x542.png)](https://simplystatic.de/wp-content/uploads/2023/05/copy-cse-id.png) ### Google CSE in WordPress Die Grundlagen im Google-CSE-Dashboard sind erledigt. Bereiten wir nun die Suche in WordPress vor. Es gibt ein hervorragendes kostenloses Plugin namens [WP Google Search](https://wordpress.org/plugins/wp-google-search/), das Sie direkt aus Ihrer WordPress-Installation heraus installieren können. [![Suche auf einer statischen Website mit Google CSE aktivieren 12](https://simplystatic.de/wp-content/uploads/2023/05/wp-cse-plugin-1024x632.png)](https://simplystatic.de/wp-content/uploads/2023/05/wp-cse-plugin.png) Gehen Sie nach der Installation zu Settings -> WP Google Search und fügen Sie Ihre Search Engine ID hinzu: [![Suche auf einer statischen Website mit Google CSE aktivieren 13](https://simplystatic.de/wp-content/uploads/2023/05/add-cs-id-1024x660.png)](https://simplystatic.de/wp-content/uploads/2023/05/add-cs-id.png) Ich empfehle außerdem, die Option *Support Overlay Display* zu aktivieren, da dadurch verhindert wird, dass Benutzer zur Suchergebnisseite in WordPress (und nicht auf der statischen Website) weitergeleitet werden. Ich habe v3 CSS (Use default corrections CSS v3) verwendet, da es am besten zum Stil meines Themes passte, aber das bleibt ganz Ihnen überlassen. Das war es schon mit der Konfiguration des Plugins. Nun können wir das Suchfeld zu unserer Website hinzufügen. ### Das Suchfeld in WordPress anzeigen Um das Google-CSE-Suchfeld auf Ihrer Website auszugeben, müssen Sie den Shortcode [wp_google_searchbox] in die gewünschte Seite bzw. den gewünschten Beitrag einfügen. Anschließend wird das Suchfeld für Sie dargestellt: [![Suche auf einer statischen Website mit Google CSE aktivieren 14](https://simplystatic.de/wp-content/uploads/2023/05/google-cse-output-1024x530.png)](https://simplystatic.de/wp-content/uploads/2023/05/google-cse-output.png) ## WordPress in eine statische Website umwandeln Nun können wir das kostenlose Simply-Static-Plugin verwenden, um eine statisch umgewandelte Version unserer WordPress-Website als ZIP-Datei zu erhalten. Unter Simply Static -> Settings -> Deployment habe ich Folgendes konfiguriert: [![Suche auf einer statischen Website mit Google CSE aktivieren 15](https://simplystatic.de/wp-content/uploads/2023/07/simply-static-export-zip-1024x643.png)](https://simplystatic.de/wp-content/uploads/2023/07/simply-static-export-zip.png) Wechseln Sie anschließend zu Simply Static -> Generate und klicken Sie auf die Schaltfläche „Generate Static Files“. Sobald der Vorgang abgeschlossen ist, können Sie die ZIP-Datei über den bereitgestellten Link herunterladen: [![Suche auf einer statischen Website mit Google CSE aktivieren 16](https://simplystatic.de/wp-content/uploads/2023/07/simply-static-generate-1024x640.png)](https://simplystatic.de/wp-content/uploads/2023/07/simply-static-generate.png) ### Die statische Website bereitstellen Bei der Bereitstellung Ihrer statischen Website stehen Ihnen zahlreiche verschiedene Optionen zur Verfügung. Um die Sache einfach zu halten, habe ich den [Drag & Drop uploader von Netlify](https://app.netlify.com/drop) verwendet, um meine Website schnell bereitzustellen: [![Suche auf einer statischen Website mit Google CSE aktivieren 17](https://simplystatic.de/wp-content/uploads/2023/05/netlify-drop-1024x627.png)](https://simplystatic.de/wp-content/uploads/2023/05/netlify-drop.png) Wir sind jetzt online! Großartig – allerdings werden Sie feststellen, dass das Suchfeld bei einer neuen Website nicht sofort Ergebnisse liefert: [![Suche auf einer statischen Website mit Google CSE aktivieren 18](https://simplystatic.de/wp-content/uploads/2023/05/cse-no-results-1024x625.png)](https://simplystatic.de/wp-content/uploads/2023/05/cse-no-results.png) Das liegt daran, dass unsere Test-Website derzeit nicht indexiert ist. Wenn es sich um eine bereits bestehende Website handelt, wird es problemlos funktionieren. Wenn du deine statische Website jedoch gerade zum ersten Mal bereitgestellt hast, wird es ein paar Tage dauern, bis Google deine Website indexiert und die Ergebnisse hier anzeigt. ## Zusammenfassung Wie du gesehen hast, ist das Hinzufügen einer Suchfunktion mit Google CSE zu deiner statischen Website ziemlich unkompliziert, bringt aber einige Nachteile mit sich: - Du wirst Anzeigen sehen, solange du nicht den Premium-API-Tarif verwendest - Das Suchfeld lässt sich im Vergleich zu anderen Lösungen nicht besonders gut anpassen - Du möchtest diese Daten möglicherweise nicht mit Google teilen Wenn du nach anderen Suchintegrationen suchst, sieh dir bitte meinen [Überblicksleitfaden](https://simplystatic.de/tutorials/suche-auf-einer-statischen-website/) an. Erwähnenswert ist außerdem, dass Simply Static Pro auch eine sofort einsatzbereite Implementierung von Fuse.js und Algolia bereitstellt, um die Suche auf deiner statischen Website zu ermöglichen. ### WordPress-Sicherheits-Workbook Registriere dich und erhalte unser praxisnahes WordPress-Sicherheits-Workbook** direkt als Download in dein Postfach. #### Vielen Dank! Du hast dich erfolgreich für unseren Newsletter angemeldet. Inhaltsverzeichnis