Jede Seite deiner Website ist ein Stapel aus Blöcken. Oben ein Cover, darunter ein Suchformular, dann eine Liste mit Stellen, ganz unten ein Formular. Jeder dieser Blöcke ist ein Seitenelement. Du füllst es einmal, gibst ihm die passende Form und setzt es danach auf so viele Seiten, wie du willst.
Unten siehst du eine Seite mit drei Seitenelementen, in der Reihenfolge, in der sie auf der Seite stehen: eine Kategorieübersicht (orange markiert), ein einfaches Suchformular für Stellen (grau) und eine Stellenliste (grün).
Das Ziel dieses Artikels: Du baust deine Seiten aus Elementen, die du einmal füllst und überall wiederverwendest, und du weißt bei jeder Änderung, auf welchen Seiten sie landet.
Nach diesem Artikel kannst du ein Seitenelement anlegen oder kopieren, den Inhalt pro Sprache ausfüllen, Abstände, Breite und Sichtbarkeit einstellen, ein Element zeitlich planen und deine Elemente wiederfinden und aufräumen. Du findest den Bildschirm über Menu → Content → Page elements. Wie du ein Element danach auf eine Seite setzt, steht in Seiten.
Bevor du anfängst
- Du brauchst Zugriff auf Content → Page elements. Welche Rolle was darf, steht in Users: Zugriff geben, Rollen wählen und über dein ATS einloggen. Siehst du oben die Meldung This section is deactivated for your account, dann kannst du mit deinem Benutzer hier nicht arbeiten.
- Bei der Übergabe hat Booston deine Seiten und Elemente schon eingerichtet. Du passt sie also vor allem an. Fang mit einer Kopie an, wenn du etwas Großes umbauen willst, dann bleibt das Original erhalten. Was du nach der Übergabe noch selbst ausfüllst, steht in Selbst einrichten nach der Übergabe.
- Bilder und Videos in einem Element kommen aus deinem File Browser. Wie du sie dort ablegst, liest du in Bilder und Dateien: hochladen, optimieren und wiederverwenden.
- Die Farben, Schriften und Standardabstände deiner ganzen Website stehen unter Settings → Design. Ein Seitenelement folgt diesen Einstellungen, es sei denn, du wählst pro Element etwas anderes.
So funktionieren Seitenelemente
Jedes Seitenelement basiert auf einem Template: einer festen Form wie Paragraph, Cover element, Jobs, Job form oder FAQ. Das Template bestimmt, welche Felder du ausfüllst und welche Designoptionen du bekommst. Die Form eines Templates kannst du nicht selbst ändern, wohl aber den Inhalt und das Design jedes Elements, das du darauf aufbaust.
In der Übersicht heißt jedes Element nach seinem Template, gefolgt von der Beschreibung, die du selbst vergibst. Wähle eine Beschreibung, die sagt, wofür das Element da ist, zum Beispiel "Bewerbungsformular Initiativbewerbung". Dann weißt du auch in einem halben Jahr noch, welches du brauchst.
Ein Element kann auf mehreren Seiten stehen. Änderst du es, ändert es sich auf all diesen Seiten gleichzeitig. Eine Seite kann auch eine eigene Version eines Elements haben, mit Inhalt, der nur für diese Seite gilt. Diese Version ändert sich nicht mit. Welche Seiten welche Version nutzen, siehst du unten im Tab Content, siehe Der Tab Content.
Es gibt zwei Arten von Elementen:
- Static: die Navigation bar, der Footer und Social media. Sie stehen auf jeder Seite deiner Website. Du kannst sie bearbeiten und kopieren, aber nicht löschen.
- Dynamic: alle anderen Elemente. Die setzt du selbst auf die Seiten, auf denen du sie haben willst.
Einige dynamische Elemente füllen sich selbst, zum Beispiel Job description, Job attributes und Recruiter description. Sie zeigen die Daten der Stelle, des Recruiters, des Standorts, der Story oder des Blogs der Seite, auf der sie stehen. Was in Job attributes erscheint, regelst du also nicht im Element, sondern bei deinen Attributwerten, siehe Attribute für Stellen und Kandidaten verwalten. In der Übersicht erkennst du diese Elemente an einem Würfelsymbol.
Für das Suchformular und die Stellenliste gilt etwas Ähnliches: Welche Filter und Suchfelder ein Besucher bekommt, stellst du größtenteils außerhalb des Elements ein. Das steht in Suchen auf deiner Stellenseite: die Suchleiste, die Filter und was du selbst einstellst.
Ein Seitenelement anlegen
- Gehe zu Content → Page elements und klicke oben rechts auf Create.
- Schalte auf einer mehrsprachigen Website Version für jede Sprache ein, in der das Element erscheinen soll.
- Wähle bei Template name die Art des Elements.
- Klicke auf Continue. Der Bearbeitungsbildschirm öffnet sich, mit den Tabs Content, Design und einem Tab mit einem Schraubenschlüssel.
- Gib bei Description einen gut erkennbaren Namen ein und fülle den Inhalt aus.
- Klicke auf Save.
Ein Element, das schon passt, kopierst du mit dem Kopiersymbol in der Übersicht. Du bekommst dann ein neues Element mit demselben Inhalt, demselben Design und denselben Einstellungen. Praktisch für eine zweite Variante, etwa ein Bewerbungsformular für Initiativbewerbungen neben einem für Stellen.
Der Tab Content
Jedes Seitenelement hat drei Tabs: Content für den Inhalt, Design für die Gestaltung und den Tab mit dem Schraubenschlüssel für Veröffentlichung und Messung. Der Tab Content besteht aus einem festen Block und einigen Blöcken, die nur erscheinen, wenn das Template sie nutzt.
Element preview
Diesen Block hat jedes Element. Hier wählst du die Template version, schaltest pro Sprache die Version ein oder aus und füllst die Description aus. Oben rechts steht pro Sprache ein Augensymbol, mit dem du das Element so siehst, wie ein Besucher es sieht.
Ein Template hat oft mehr als eine Version: einen anderen Aufbau derselben Art von Element. Unten siehst du dieselbe Kategorieübersicht in zwei Versionen.
Wechselst du die Version, prüfe das Element danach noch einmal mit dem Augensymbol. Nicht jede Version nutzt dieselben Felder.
Main Settings
Hier stehen die Einstellungen, die für alle Sprachen gleichzeitig gelten. Bei einem Bewerbungsformular wählst du zum Beispiel, welche Felder Pflicht oder sichtbar sind, und bei Application type, mit welcher Stelle das Formular die Bewerbung verknüpft.
Main Content
Das ist der Inhalt selbst: Texte, Buttons, Bilder und Videos. Jedes Feld steht pro Sprache da, mit dem Sprachkürzel hinter dem Label. So füllst du den niederländischen und den englischen Text nebeneinander aus.
Follow up
Hier legst du fest, was passiert, nachdem ein Besucher etwas tut, zum Beispiel nach dem Absenden eines Formulars. Der Besucher kommt dann auf eine andere Seite, zu einem anderen Seitenelement oder auf eine eigene URL, etwa eine externe Website.
Element usage und Template usage with custom content
Ganz unten siehst du, wo das Element genutzt wird, mit einem Link pro Seite zur Seite auf deiner Website und zur Seite im Admin:
- Element usage: die Seiten, die dieses Element nutzen. Eine Änderung hier siehst du auf all diesen Seiten.
- Template usage with custom content: die Seiten, die dasselbe Template mit eigenem Inhalt nutzen. Sie ändern sich nicht mit. Bearbeite sie über die Seite selbst, siehe Seiten.
Der Tab Design
Der Tab Design bestimmt, wie das Element aussieht: den Abstand drumherum, die Breite, auf welchem Gerät es erscheint und wie es ins Bild kommt. Der Inhalt aus dem Tab Content ändert sich dadurch nicht. Der Tab hat zwei Blöcke: Page element, der bei jedem Element gleich ist, und Content, mit den Designoptionen dieses Templates.
Abstand: Padding und Margin
Abstände gibst du in rem ein, zum Beispiel 4rem. Steht ein Wert zwischen doppelten eckigen Klammern, etwa [[page_el_margin__top]], folgt das Element dem Standardabstand aus deinem Design. Änderst du diesen Standard, ziehen alle Elemente mit diesem Wert mit. Über Click here for design variables oben im Block siehst du, welche Variablen es gibt.
Padding top und Padding bottom regeln den Raum innerhalb der Ränder des Elements. Das siehst du vor allem bei einem Element mit eigener Hintergrundfarbe.
Der graue Hintergrund des Elements wächst mit dem Padding mit. Mehr Padding heißt also eine größere graue Fläche.
Margin top und Margin bottom regeln den Abstand zwischen zwei Elementen. Unten steht der Abstand auf 0 rem, sodass ein Element direkt in den schwarzen Hintergrund des nächsten übergeht. Setzt du einen Abstand dazwischen, siehst du dort die Hintergrundfarbe der Seite.
Breite: Element Width
Mit Element Width bestimmst du, wie breit das Element ist. Es gibt vier Optionen:
- Shrink: schmaler als die normale Spalte.
- In Column (Normal View): passt genau in die Spalte, wie der Rest deines Textes.
- Expand: etwas breiter als die Spalte.
- Full Page: füllt die ganze Breite des Bildschirms.
Unten dasselbe Element zuerst auf Shrink und dann auf Expand.
Bearbeitest du ein Element von einer Seite aus und steht es dort in einer Seitenspalte, siehst du diese Auswahl nicht. Dort bestimmt die Seitenspalte die Breite.
Sichtbarkeit und Animation
Mit Element visibility wählst du, auf welchem Gerät das Element erscheint: Show on desktop and mobile, Show only on desktop oder Show only on mobile. So zeigst du zum Beispiel eine breite Tabelle nur auf dem Desktop und eine kurze Version nur auf dem Handy.
Mit Element Animation gibst du dem Element eine Animation, mit der es ins Bild kommt, etwa Fade In from Bottom oder Slide In Left. Standard ist None. Wähle für deine ganze Website ein oder zwei ruhige Animationen. Wenn jedes Element anders animiert ist, lenkt das von deinen Stellen ab.
Content
Der zweite Block hat pro Template eigene Optionen, zum Beispiel Hintergrundfarben, Textfarben und den Stil der Buttons. Auch hier gilt: Ein Wert zwischen doppelten eckigen Klammern kommt aus Settings → Design und ändert sich mit, wenn du dein Design anpasst.
Der Tab mit dem Schraubenschlüssel: Veröffentlichung und Datalayer
Der dritte Tab hat keinen Namen, nur einen Schraubenschlüssel. Für die tägliche Arbeit brauchst du ihn meistens nicht.
Publication
Mit Publication start date und Publication end date planst du ein Element ein. Es erscheint ab dem Startdatum und bleibt bis einschließlich zum Enddatum stehen. Praktisch für ein Banner zu einem Tag der offenen Tür oder eine befristete Aktion: Du bereitest es vorher vor, und es verschwindet von selbst. In der Übersicht steht der Zeitraum in der Spalte Publication date, in Orange, wenn es ein Enddatum gibt.
Datalayer
Ein Element mit einem Formular, etwa ein Bewerbungs-, Kontakt- oder Newsletterformular, hat einen Block Datalayer. Darin steht ein Skript, das beim Absenden des Formulars ein Ereignis an den Google Tag Manager weitergibt, damit du zum Beispiel in Google Analytics siehst, wie viele Besucher sich bewerben. Das brauchst du nur für deine eigenen Messungen. Welcher Kanal dir Bewerber bringt, siehst du in Booston auch ohne Skript, siehe Analytics: sehen, welcher Kanal dir Bewerber bringt.
Unter dem Skript stehen die Available variables, etwa {page_title} und {job_id}, und die Runtime variables, etwa application_id. Klicke auf eine Variable, um sie dem Skript hinzuzufügen. Das Standardskript pro Art von Element steht unter Settings → Marketing & Data. Änderst du es hier, gilt das nur für dieses Element. Mit dem grünen Recycling-Symbol setzt du es auf den Standard zurück.
Deine Seitenelemente wiederfinden und verwalten
Unter Content → Page elements stehen alle deine Elemente in zwei Listen: Static page elements overview und Dynamic page elements overview. Mit der Suchleiste oben rechts suchst du nach Beschreibung und nach Template.
Pro Element siehst du:
| Spalte | Was sie dir sagt |
|---|---|
| Status | Schalter, um das Element ein- oder auszuschalten. Ist er aus, verschwindet das Element von jeder Seite, auf der es steht. |
| Title and description | Der Name des Templates, gefolgt von deiner eigenen Beschreibung. Klicke darauf, um das Element zu bearbeiten. |
| Author | Wer das Element angelegt hat. |
| Template | Das Template, auf dem das Element aufgebaut ist. |
| Publication date | Das Startdatum und, falls vorhanden, das Enddatum. |
| Visibility | Auf welchem Gerät das Element erscheint: Desktop, Handy oder beides. |
| Pro Sprache | Ein Augensymbol für eine schnelle Vorschau in dieser Sprache. |
| Manage | Bearbeiten, kopieren und bei dynamischen Elementen löschen mit dem Papierkorb. |
Ein Element, das noch auf einer Seite steht, kannst du nicht löschen. Du bekommst dann das Fenster Element usage mit den Seiten, auf denen es steht. Nimm es dort zuerst herunter und lösche es danach. Unsicher, ob ein Element noch irgendwo gebraucht wird? Schalte es dann zuerst mit Status aus.
Probleme lösen
Mein Element steht nicht auf der Website
Prüfe vier Dinge. Ist Status eingeschaltet? Liegt heute zwischen Publication start date und Publication end date? Ist Version für die Sprache eingeschaltet, die du dir ansiehst? Und schaust du auf dem Gerät, das zu Element visibility passt? Stimmt das alles, prüfe unter Element usage, ob das Element wirklich auf dieser Seite steht.
Meine Änderung ist auf einer Seite nicht zu sehen
Diese Seite nutzt eine eigene Version des Elements. Du findest sie unter Template usage with custom content. Passe das Element dort über die Seite an.
Ich kann ein Element nicht löschen
Es steht noch auf einer oder mehreren Seiten, oder es ist ein statisches Element wie die Navigation oder der Footer. Statische Elemente bleiben immer bestehen. Ein dynamisches Element nimmst du zuerst von den Seiten im Fenster Element usage.
Ich sehe die Elemente meiner Kollegen nicht
Dann ist dein Benutzer so eingestellt, dass er nur eigene Inhalte sieht. Das wird pro Benutzer geregelt, siehe Users: Zugriff geben, Rollen wählen und über dein ATS einloggen.
Häufig gestellte Fragen
Kann ich ein Element in jeder Sprache anders füllen?
Ja, für den Inhalt. Die Felder unter Main Content stehen pro Sprache da. Main Settings, das Design und die Veröffentlichungsdaten gelten für alle Sprachen gleichzeitig.
Kann ich selbst eine neue Art von Element anlegen?
Nein. Du wählst aus den vorhandenen Templates und gibst ihnen deinen eigenen Inhalt und dein eigenes Design. Fehlt dir eine Form für deine Website, melde dich bei uns.
Was ist der Unterschied zwischen Ausschalten und Löschen?
Ausschalten mit Status nimmt das Element von deiner Website, aber es bleibt bestehen und steht weiter auf denselben Seiten. Schaltest du es wieder ein, ist alles wieder da. Löschen geht erst, wenn das Element auf keiner Seite mehr steht.
Hilfe nötig?
Kommst du nicht weiter, oder bist du unsicher, wie du eine Seite am besten aufbaust? Schreib an support@booston.io oder ruf an unter 085 0044 215 und nenne:
- den Namen deiner Umgebung;
- was du erreichen willst;
- die Meldung, die du siehst, wenn es eine Fehlermeldung gibt.
Willst du lieber gemeinsam durch die Einstellungen gehen? Buche eine kostenlose Onlinedemo von 30 Minuten, dann gehen wir es zusammen durch. Job Done!
