Das brauchst du
HubSpot-gehostete Inhalte auf einer verbundenen Domain und die Berechtigung Website-Einstellungen. Die Bearbeitungsoptionen für Footer-HTML hängen laut HubSpot von Abo und Inhaltstyp ab. Lege in Accessonaut zuerst ein Projekt mit deiner tatsächlichen Website-Domain an und öffne im Projekt die Einbauseite.
Schritt für Schritt
- Klicke in deinem HubSpot-Account auf das Zahnradsymbol und öffne in der linken Seitenleiste Content → Seiten.
- Wähle im Dropdown die Domain deiner Website. Die Standardeinstellungen für alle Domains gelten für alle HubSpot-gehosteten Inhalte.
- Klicke im Bereich Website-Footer-HTML auf „Standardeinstellungen überschreiben“, wenn du eine einzelne Domain bearbeitest. Füge den unveränderten Einbaucode einmal ein und klicke auf Speichern.
- Öffne Website-Seiten, Landingpages und Blogbeiträge der Domain in einem privaten Fenster. Das Widget erscheint genau einmal.
So sieht die Einbindung aus
Verwende den fertigen Code aus deinem Projekt. Das Beispiel benötigt deine echte Projekt-ID und die öffentlich erreichbare Service-Adresse.
<script src="https://accessonaut.com/widget.js"
data-project-id="DEINE_PROJEKT_ID"
data-language="de" defer></script>Das Design an deine Website anpassen
Öffne im Accessonaut-Projekt „Lesehilfen-Widget“. Fünf Vorlagen und eine Live-Vorschau helfen dir beim Gestalten: Farben, Schriften, Menübreite, Ecken, Schatten, Symbol oder beschrifteter Öffner sowie eigene Texte. Position und Randabstände lassen sich für Desktop und Smartphone abstimmen. Nach dem Speichern übernimmt dein vorhandener Einbaucode das Projektdesign automatisch; die öffentliche Konfiguration wird bis zu einer Minute zwischengespeichert.
Im WordPress-Plugin kannst du stattdessen lokale Einstellungen wählen. Diese haben Vorrang vor dem Projektdesign. Die Gestaltung ist in allen Tarifen verfügbar. Im Free-Tarif bleibt der Accessonaut-Hinweis sichtbar. Persönliche Leseeinstellungen deiner Besuchenden haben Vorrang vor Designvorgaben.
Darauf achten
Nach dem Überschreiben gilt der Code aus den Standardeinstellungen nicht mehr für diese Domain. Übernimm dort vorhandene Snippets bei Bedarf. Footer-HTML für alle Domains erscheint auch auf Angeboten. Eigene Templates müssen {{ standard_footer_includes }} direkt vor dem schließenden body-Tag ausgeben. Seiten außerhalb von HubSpot brauchen einen eigenen Einbau.
Häufige Fragen zu HubSpot CMS
Blockiert das HubSpot-Cookie-Banner das Widget?
Nicht automatisch. HubSpot erklärt, dass es Cookies aus Scripts von Drittanbietern nicht steuern kann. Das Widget setzt keine Cookies und speichert Leseeinstellungen lokal im Browser. Ob es erst nach einer Einwilligung laden soll, entscheidest du nach deiner Datenschutzprüfung.
Was gilt für mehrsprachige Inhalte?
Drag-and-drop-Templates setzen die Seitensprache automatisch. Eigene Templates brauchen <html lang="{{ html_lang }}" {{ html_lang_dir }}>. Mit data-language="auto" folgt das Widget dann der Sprache der Seite.
Ich betreibe mehrere Domains in HubSpot.
Footer-HTML legst du für alle Domains oder je Domain fest. Hat jede Domain ein eigenes Accessonaut-Projekt, überschreibe die Standardeinstellungen je Domain und füge dort den passenden Einbaucode ein. Lass ihn dann aus den Standardeinstellungen für alle Domains heraus.
Erscheint das Widget auch auf Angeboten?
Ja, wenn der Code in den Standardeinstellungen für alle Domains oder in den Einstellungen der Angebotsdomain steht. HubSpot gibt dieses Footer-HTML auch auf Angeboten aus. Willst du das nicht, trage den Code nur für die Domains deiner Website ein.
Wie entferne ich das Widget wieder?
Lösche den Einbaucode im Website-Footer-HTML und speichere. Prüfe die Standardeinstellungen und alle Domains mit überschriebenen Einstellungen.
Wenn etwas nicht klappt
In einem eigenen Template fehlt das Widget.
Ursache: Das Template gibt {{ standard_footer_includes }} nicht aus. HubSpot zählt diese Variable zu den erforderlichen Template-Variablen.
Lösung: Ergänze sie direkt vor dem schließenden body-Tag.
Nach dem Überschreiben fehlen andere Snippets.
Ursache: Für eine überschriebene Domain gilt der Code aus den Standardeinstellungen nicht mehr.
Lösung: Übernimm benötigte Snippets in die Einstellungen der Domain.
Auf einer weiteren Domain zeigt das Widget das Standarddesign mit Accessonaut-Hinweis.
Ursache: Die Projektkonfiguration gilt nur für die Domain im Accessonaut-Projekt.
Lösung: Lege für jede Domain ein eigenes Projekt an und trage dessen Einbaucode in den Einstellungen dieser Domain ein.
Einbau prüfen
- Öffne die öffentliche Website in einem privaten Fenster. Das Widget wird genau einmal angezeigt.
- Erreiche den Button mit der Tastatur. Öffne das Panel, ändere die Textgröße und schließe es wieder.
- Prüfe Startseite, Unterseite, Formular und mobile Ansicht. Das Widget darf keine wichtigen Bedienelemente verdecken.
- Prüfe im Netzwerk-Tab, dass widget.js und die Projektkonfiguration von deiner Service-Adresse geladen werden. Bei Fehlern kontrolliere Domain, Projekt-ID und CSP.
- Bei Free-Projekten bleibt der sichtbare Accessonaut-Hinweis Bestandteil des Widgets. Berechtigungen kommen aus deinem Projekt.
Datenschutz und Grenzen
Beim Laden ruft der Besucherbrowser das Script und die Projektkonfiguration vom Accessonaut-Dienst ab. Dabei fallen IP-Adresse, Browser-Anfragedaten und Website-Hostname an. Darstellungswünsche werden lokal im Browser gespeichert. Berücksichtige die Einbindung in deinen Datenschutzhinweisen und prüfe deine konkrete Konfiguration.
Die Lesehilfen erzeugen keine Konformitätsgarantie. Prüfe Barrieren im Quellcode und vollständige Nutzerabläufe zusätzlich automatisch und manuell.