Layout - Registerkarten

Verwenden Sie den Inhaltstyp Tabs, um eine Reihe von Registerkarten im Page Builder Arbeitsbereich hinzuzufügen. Wenn Sie den Platzhalter “Registerkarten” aus dem Bedienfeld auf den Arbeitsbereich ziehen, wird zunächst eine einzelne Standardregisterkarte angezeigt. Sie können bei Bedarf weitere Registerkarten hinzufügen, um einen vollständigen Satz zu erstellen. Die Breite des Registerkartensatzes wird durch die Breite des übergeordneten Containers und die Auffüllungseinstellungen bestimmt.

Satz von Registerkarten_

Werkzeugkästen

Wenn Sie mit dem Inhaltstyp Tabs arbeiten, fügen Sie einzelne Registerkarten und die Registerkarten-Container, die eine oder mehrere Registerkarten enthalten, hinzu und bearbeiten sie. Für jeden dieser Typen gibt es eine eigene Toolbox, die Sie für die Gestaltung von Registerkarten auf der Seite Page Builder verwenden.

Werkzeugkasten für einzelne Registerkarten

Tab-Werkzeugkasten

Werkzeug	Symbol	Beschreibung
Bewegen		Dieses Steuerelement neben der Registerkartenbeschriftung wird verwendet, um die einzelne Registerkarte an eine andere Position in der Registerkartengruppe zu verschieben.
Einstellungen		Öffnet die Seite Registerkarten bearbeiten, auf der Sie die Eigenschaften der einzelnen Registerkarten ändern können.
Duplizieren		Erzeugt eine Kopie der Registerkarte.
Entfernen		Löscht die Registerkarte aus dem Registersatz.

Werkzeugkasten für Registerkarten-Container

Tab container toolbox

Werkzeug	Symbol	Beschreibung
Bewegen		Verschiebt den Satz von Tabs an eine andere Position auf dem Raster im übergeordneten Container.
Hinzufügen		Fügt eine neue Registerkarte zum Registersatz hinzu.
(Beschriftung)	Registerkarten	Kennzeichnet den aktuellen Container als Registerkarten-Set. Bewegen Sie den Mauszeiger über den oberen Rand des Containers, um die Toolbox zu sehen.
Einstellungen		Öffnet die Seite “Registerkarte bearbeiten”, wo Sie die Eigenschaften des Containers ändern können.
Ausblenden		Blendet den Tab-Container aus.
Anzeigen		Zeigt den versteckten Tab-Container an.
Duplizieren		Erzeugt eine Kopie der aktuellen Registerkarte.
Entfernen		Löscht das aktuelle Tab-Set vom Arbeitsbereich.

Hinzufügen einer einzelnen Registerkarte

1. Ziehen Sie im Page Builder Panel unter Layout den Platzhalter Tabs direkt auf den Arbeitsbereich oder in eine Zeile oder Spalte auf dem Arbeitsbereich.

   Ziehen von Tabs in eine Zeile_

2. Klicken Sie auf die Beschriftung Registerkarte 1, um die Toolbox für einzelne Registerkarten anzuzeigen, und wählen Sie das Symbol Einstellungen ().

3. Geben Sie den Registerkartennamen ein, den Sie als Beschriftung verwenden möchten.

   Eingabe des Registerkartennamens

4. Geben Sie bei Bedarf die Mindesthöhe für die Registerkarte ein.

   Dieser Wert kann eine Zahl mit einer beliebigen gültigen CSS-Einheit (wie 100px, 50%, 50em, 100vh) oder eine Berechnung (wie 100vh - 237px) sein.

5. Wählen Sie die Einstellung Vertikale Ausrichtung, um alle Inhaltscontainer, die der Registerkarte hinzugefügt werden, auszurichten (Oben, Mitte oder Unten).

6. Legen Sie bei Bedarf die anderen Optionen fest, indem Sie die folgenden Abschnitte als Anleitung verwenden:

   • Hintergrund
   • [Erweitert][Erweitert]

7. Klicken Sie in der oberen rechten Ecke auf Speichern, um die Einstellungen zu übernehmen und zum Arbeitsbereich Page Builder zurückzukehren.

Eine Reihe von Registerkarten hinzufügen

Die folgenden Schritte beginnen mit einer einzelnen Registerkarte und erstellen einen Satz von drei Registerkarten innerhalb eines Registerkarten-Containers. Wenn Sie noch keine einzelne Registerkarte haben, folgen Sie den vorherigen Anweisungen, um des Arbeitsbereich eine einzelne Registerkarte hinzuzufügen.

1. Bewegen Sie den Mauszeiger über den Registerkarten-Container, um die Toolbox anzuzeigen, und wählen Sie das Symbol Hinzufügen ().

2. Klicken Sie auf die Bezeichnung Registerkarte 2, um den Cursor anzuzeigen, und geben Sie eine eigene Bezeichnung für die Registerkarte ein.

3. Klicken Sie erneut auf die zweite Registerkarte auf dem Arbeitsbereich und wählen Sie das Symbol Duplizieren ().

4. Klicken Sie in die Beschriftung YourName Copy, um den Cursor anzuzeigen und geben Sie Ihre eigene Beschriftung für die dritte Registerkarte ein.

Tabulatorensatz mit Toolbox zusammenstellen

Verschieben einer Registerkarte innerhalb des Satzes

1. Klicken Sie auf die Registerkarte, die Sie verschieben möchten.

2. Wählen Sie das Symbol Verschieben (), das direkt vor dem Text der Registerkartenbeschriftung angezeigt wird, aus und ziehen Sie es an eine neue Position innerhalb der Registerkartengruppe.

Inhalt zu einer Registerkarte hinzufügen

Sie können jeden Inhaltstyp zu einer Registerkarte hinzufügen, genau wie zu einer Zeile. Die folgenden Schritte dienen als Beispiel für das Hinzufügen eines Textinhaltstyps.

1. Klicken Sie auf die Registerkarte, auf der Sie den Inhalt hinzufügen möchten.

2. Erweitern Sie im Bereich Page Builder Elemente und ziehen Sie einen Text-Platzhalter auf die Registerkarte.

3. Geben Sie einen Text ein oder fügen Sie ihn in den Editor ein und formatieren Sie ihn mithilfe der Editor-Symbolleiste nach Bedarf.

   Unter Elemente - Text finden Sie weitere Informationen zum Arbeiten mit dem Inhaltstyp tex.

   Bearbeiten von Textinhalten, die auf der Registerkarte hinzugefügt wurden

4. Klicken Sie in der oberen rechten Ecke auf Speichern.

Individuelle Einstellungen der Registerkarte ändern

1. Bewegen Sie den Mauszeiger über eine einzelne Registerkarte, um die Toolbox anzuzeigen, und wählen Sie das Symbol Settings ().

2. Ändern Sie bei Bedarf eine der Grundeinstellungen für die Registerkarte:

   • Registerkartenname - Geben Sie einen überarbeiteten Text für die Registerkartenbezeichnung ein. Sie können die Beschriftung auch direkt auf dem Arbeitsbereich ändern.

   • Mindesthöhe - Geben Sie als Pixel ein, wenn Sie die automatische Höhe außer Kraft setzen möchten. Sie können zum Beispiel die Mindesthöhe so einstellen, dass sie der Höhe eines Hintergrundbildes entspricht, um sicherzustellen, dass das gesamte Bild sichtbar ist.

   • Vertikale Ausrichtung - Wählen Sie die vertikale Position der Inhaltscontainer, die der Registerkarte hinzugefügt werden.

3. Ändern Sie die anderen Einstellungen nach Bedarf, indem Sie die folgenden Abschnitte für Details verwenden.

4. Wenn Sie fertig sind, klicken Sie auf Speichern, um die Einstellungen zu übernehmen und zum Arbeitsbereich Page Builder zurückzukehren.

Hintergrund

• Hintergrundfarbe - Geben Sie die Hintergrundfarbe an, indem Sie ein Farbfeld auswählen, auf den Farbwähler klicken oder einen gültigen Farbnamen oder einen entsprechenden Hexadezimalwert eingeben. Damit wird die Hintergrundfarbe der Zeile festgelegt. Sie können auch die Deckkraft der Farbe einstellen.

  Keine Farbe (Standard)

  Sie können einen Wert auf drei Arten eingeben:

  • Einen vordefinierten Farbnamen, z. B. Weiß

  • Der hexadezimale Farbwert für die Farbe, z. B. #ffffff

  • Der rgba-Wert für die Farbe mit Deckkraft in Prozent, z. B. rgba(255, 255, 255, 0.75)

  Wenn Sie eine Farbe auswählen möchten, klicken Sie auf das Feld links neben dem Feld Keine Farbe.

  Auswählen eines Farbfelds

  Wenn Sie auf das Farbfeld klicken, um den Farbwähler erneut zu öffnen, zeigt das Feld unter dem Slider die aktuellen Rot-, Grün-, Blau- und Alphawerte (rgba) an. Die letzte Zahl gibt die aktuelle Deckkraft in Prozent als Dezimalzahl an. Sie können den Slider verwenden, um die Deckkraft anzupassen, oder den gewünschten Dezimalwert eingeben.

  Deckkraft einstellen

  Page Builder unterstützt auch eine Transparenzebene oder einen Alpha-Kanal in Hintergrundbildern, der verwendet werden kann, um Hintergründe mit unterschiedlichen Deckungsgraden zu erstellen.

• Hintergrundbild - Verwenden Sie bei Bedarf die bereitgestellten Werkzeuge, um ein Hintergrundbild für die Registerkarte auszuwählen:

  Hochladen	Lädt eine Bilddatei von Ihrem lokalen Computer in die Galerie hoch und wendet sie dann als Hintergrundbild für die Registerkarte an.
  Aus Galerie auswählen	Fordert Sie auf, ein vorhandenes Bild aus der Galerie als Hintergrundbild für die Registerkarte auszuwählen.
  	Ermöglicht es Ihnen, das Bild entweder auf die Kamerakachel zu ziehen oder das Bild in Ihrem lokalen Dateisystem zu suchen.

• Hintergrundbild für Mobilgeräte - Verwenden Sie bei Bedarf die gleichen Werkzeuge, um ein anderes Hintergrundbild für die Anzeige auf Mobilgeräten auszuwählen.

• Hintergrundgröße - Legen Sie mit dieser Option fest, wie das Hintergrundbild im Verhältnis zur Breite der Registerkarte skaliert werden soll:

  Abdeckung	Das Hintergrundbild deckt die gesamte Breite der Registerkarte ab.
  Umfassen	Das Hintergrundbild ist auf die Breite des Registerkartenbereichs begrenzt.
  Automatisch	Wendet die Größe aus der aktuellen Stilvorlage an.

• Hintergrundposition - Legen Sie mit dieser Option fest, wie das Hintergrundbild im Verhältnis zur Registerkarte verankert werden soll: Oben links / Oben Mitte / Oben rechts / Mitte links / Mitte / Mitte rechts / Unten links / Unten Mitte / Unten rechts

• Hintergrundbefestigung - Legen Sie den Befestigungstyp fest, um zu bestimmen, wie sich das Hintergrundbild im Verhältnis zur scrollenden Seite bewegt:

  Scrollen	Das angehängte Hintergrundbild wird synchronisiert, um sich beim Scrollen der Seite nach unten zu bewegen.
  Fixiert	(Nicht verfügbar für Mobilgeräte) Das Hintergrundbild bewegt sich nicht, wenn der Container über das Bild scrollt und bleibt an der angegebenen Hintergrundposition fixiert.

• Hintergrundwiederholung - Setzen Sie dies auf Ja um das Hintergrundbild zu wiederholen, um den verfügbaren Platz in der Registerkarte zu füllen.

Erweitert

• Wählen Sie eine Ausrichtung, um die horizontale Ausrichtung von Inhaltscontainern zu steuern, die der Registerkarte hinzugefügt werden.

  Standard	Wendet die Standardeinstellung der Ausrichtung an, die in der Stilvorlage des aktuellen Themas angegeben ist.
  Links	Richtet die Inhaltscontainer entlang des linken Randes des Tabs aus, unter Berücksichtigung der angegebenen Polsterung.
  Zentriert	Richtet den Inhaltscontainer in der Mitte der Registerkarte aus, unter Berücksichtigung der angegebenen Füllung.
  Rechts	Richtet den Inhaltscontainer entlang des rechten Randes der Registerkarte aus, unter Berücksichtigung der angegebenen Füllung.

• Legen Sie den Stil Rahmen fest, der auf alle vier Seiten des Registerkarten-Containers angewendet wird:

  Standard	Wendet den Standard-Rahmenstil an, der durch das zugehörige Stylesheet festgelegt ist.
  Keiner	Bietet keinen sichtbaren Hinweis auf die Containergrenzen.
  Gepunktet	Der Containerrand erscheint als gepunktete Linie.
  Gestrichelt	Der Containerrand erscheint als gestrichelte Linie.
  Durchgehend	Der Containerrand wird als durchgezogene Linie dargestellt.
  Doppelt	Der Containerrand wird als Doppellinie dargestellt.
  Rille	Der Containerrand erscheint als gerillte Linie.
  Steg	Der Containerrand erscheint als geriffelte Linie.
  Einzug	Die Umrandung des Containers erscheint als versenkte Linie.
  Außenlinie	Der Containerrand erscheint als Umrandungslinie.

• Wenn Sie einen anderen Rahmenstil als None einstellen, vervollständigen Sie die Rahmenanzeigeoptionen:

  • Rahmenfarbe - Geben Sie die Farbe an, indem Sie ein Farbfeld auswählen, auf den Farbwähler klicken oder einen gültigen Farbnamen oder einen entsprechenden Hexadezimalwert eingeben.

    Rahmenfarbe

  • Rahmenbreite - Geben Sie die Anzahl der Pixel für die Breite der Rahmenlinie ein.

  • Rahmenradius - Geben Sie die Anzahl der Pixel ein, um die Größe des Radius zu definieren, der verwendet wird, um jede Ecke des Rahmens abzurunden.

    Die Zeile im folgenden Beispiel hat einen Rahmenradius von 15.

    Zeile mit Rahmenradius von 15

• (Optional) Geben Sie die Namen der CSS-Klassen aus der aktuellen Stilvorlage an, die auf den Spaltencontainer angewendet werden sollen.

  Trennen Sie mehrere Klassennamen durch ein Leerzeichen.

• Geben Sie Werte in Pixeln für Margins und Padding ein, um die äußeren Ränder und die innere Auffüllung der Spalte anzugeben.

  Geben Sie die entsprechenden Werte in das Diagramm des Registerkarten-Containers ein.

  Ränder	Die Menge an Leerraum, die an der Außenkante aller Seiten des Containers angebracht wird. Optionen: Oben / Rechts / Unten / Links
  Auffüllung	Die Höhe des Leerraums, der auf die Innenkante aller Seiten des Containers angewendet wird. Optionen: Oben / Rechts / Unten / Links

Tabulatoreinstellungen ändern

1. Bewegen Sie den Mauszeiger über den oberen Rand des Registerkarten-Containers, um die Toolbox anzuzeigen, und wählen Sie das Symbol Settings ().

2. Ändern Sie bei Bedarf die Standardregisterkarte Aktiv.

   Wählen Sie die Registerkarte aus dem Satz, die beim Laden der Seite aktiv sein soll.

3. Geben Sie die Mindesthöhe in Pixeln ein, wenn Sie die automatische Höhe für das Registerkartenset außer Kraft setzen möchten.

4. Wählen Sie die Ausrichtung der Registerkartennavigation, um die Navigationsregisterkarten am oberen Rand des Registerkartensatzes zu positionieren (links, mittig oder rechts).

   Rechts ausgerichtete Navigationsregisterkarten

5. Legen Sie die erweiterten Optionen für das Registerkarten-Set fest:

   • Wählen Sie eine Ausrichtung, um die Positionierung des Registerkartensatzes innerhalb des übergeordneten Containers zu steuern:

     Standard	Wendet die Standardeinstellung der Ausrichtung an, die in der Stilvorlage des aktuellen Themas angegeben ist.
     Links	Richtet den Tabulator-Satz entlang des linken Randes des übergeordneten Containers aus, unter Berücksichtigung der angegebenen Polsterung.
     Zentriert	Richtet die Registerkarte in der Mitte des übergeordneten Containers aus, unter Berücksichtigung der angegebenen Füllung.
     Rechts	Richtet die Registerkarte entlang des rechten Randes des übergeordneten Containers aus, unter Berücksichtigung der angegebenen Füllung.

   • Legen Sie den Stil Rahmen fest, der auf alle vier Seiten des Registerkarten-Containers angewendet wird:

     Standard	Wendet den Standard-Rahmenstil an, der durch das zugehörige Stylesheet festgelegt ist.
     Keiner	Bietet keinen sichtbaren Hinweis auf die Containergrenzen.
     Gepunktet	Der Containerrand erscheint als gepunktete Linie.
     Gestrichelt	Der Containerrand erscheint als gestrichelte Linie.
     Durchgehend	Der Containerrand wird als durchgezogene Linie dargestellt.
     Doppelt	Der Containerrand wird als Doppellinie dargestellt.
     Rille	Der Containerrand erscheint als gerillte Linie.
     Steg	Der Containerrand erscheint als geriffelte Linie.
     Einzug	Die Umrandung des Containers erscheint als versenkte Linie.
     Außenlinie	Der Containerrand erscheint als Umrandungslinie.

   • Wenn Sie einen anderen Rahmenstil als None einstellen, vervollständigen Sie die Rahmenanzeigeoptionen:

     • Rahmenfarbe - Geben Sie die Farbe an, indem Sie ein Farbfeld auswählen, auf den Farbwähler klicken oder einen gültigen Farbnamen oder einen entsprechenden Hexadezimalwert eingeben.

     • Rahmenbreite - Geben Sie die Anzahl der Pixel für die Breite der Rahmenlinie ein.

     • Rahmenradius - Geben Sie die Anzahl der Pixel ein, um die Größe des Radius zu definieren, der verwendet wird, um jede Ecke des Rahmens abzurunden.

   • (Optional) Geben Sie die Namen der CSS-Klassen aus der aktuellen Stilvorlage an, die auf den Tabs-Container angewendet werden sollen.

     Trennen Sie mehrere Klassennamen durch ein Leerzeichen.

   • Geben Sie Werte in Pixeln für Margins und Padding ein, um die äußeren Ränder und die innere Auffüllung des Tabs-Containers zu bestimmen.

     Geben Sie die entsprechenden Werte in das Diagramm des Tabs-Containers ein.

     Ränder	Die Menge an Leerraum, die an der Außenkante aller Seiten des Containers angebracht wird. Optionen: Oben / Rechts / Unten / Links
     Auffüllung	Die Höhe des Leerraums, der auf die Innenkante aller Seiten des Containers angewendet wird. Optionen: Oben / Rechts / Unten / Links

6. Klicken Sie abschließend auf Speichern, um die Einstellungen zu übernehmen und zum Arbeitsbereich Page Builder zurückzukehren.