Inhalt hinzufügen - Dynamischer Block

Verwenden Sie den Inhaltstyp Dynamischer Block , um einen vorhandenen dynamischen Block zur Page Builder Phase hinzuzufügen.

Dynamischer Block auf der Storefront {width="700" modal="regular"}

NOTE
Wenn Sie wesentliche Änderungen an Page Builder Inhalten vornehmen, wird empfohlen, die Admin-Sitzungslebensdauer) zu erhöhen um zu verhindern, dass die Sitzung während der Arbeit abläuft.

Toolbox für dynamische Blöcke

Tool
Symbol
Beschreibung
Verschieben
move icon {width="25"}
Verschiebt den Block-Container und dessen Inhalt an eine andere Position auf der Bühne.
Einstellungen
Einstellungssymbol {width="25"}
Öffnet die Seite Block bearbeiten auf der Sie den Block auswählen und die Eigenschaften des Containers ändern können.
Ausblenden
Symbol ausblenden {width="25"}
Blendet den aktuellen Block-Container und dessen Inhalt aus.
Anzeigen
Symbol anzeigen {width="25"}
Zeigt den ausgeblendeten Block-Container und dessen Inhalt an.
Duplikat
Symbol „Duplizieren“ {width="25"}
Erstellt eine Kopie des Block-Containers und seines Inhalts.
entfernen
Symbol entfernen {width="25"}
Löscht den Block-Container und seinen Inhalt aus der Phase .
NOTE
Ausgeblendete Elemente werden in der Datenbank gespeichert und sind für Kunden unsichtbar. Diese Elemente sind jedoch für Suchmaschinen und andere Bots sichtbar, die Ihre Site durchsuchen. Sie werden auch als Teil des Inhalts zurückgegeben, wenn sie über einen API-Aufruf mit dem Attribut „unsichtbar“ angefordert werden, es sei denn, Sie entfernen sie aus dem Schritt.

Hinzufügen eines vorhandenen dynamischen Blocks zum Schritt

  1. Navigieren Sie zum Arbeitsbereich Page Builder auf der Zielseite, dem Block, dem Produkt oder der Kategorie.

  2. Erweitern Sie im Page Builder Bedienfeld Add Content und ziehen Sie einen Dynamic Block Platzhalter auf das Bühnenbild.

    Ziehen eines Platzhalters für einen dynamischen Block auf den Schritt {width="600" modal="regular"}

  3. Bewegen Sie den Mauszeiger über den leeren dynamischen Block-Container, um die Toolbox anzuzeigen, und wählen Sie Symbol Einstellungen ( ( {width="20"}) aus.

    Toolbox für dynamische Blöcke {width="600" modal="regular"}

  4. Klicken Sie auf der Dynamischen Block bearbeiten auf Select Dynamic Block und wählen Sie den Block mithilfe der Liste aus.

    Dynamischen Block auswählen {width="600" modal="regular"}

    Suchen Sie in der Liste den dynamischen Block, den Sie einfügen möchten, und klicken Sie auf Select. Klicken Sie dann auf Add Selected.

    Dynamischen Block in der Liste auswählen {width="600" modal="regular"}

    Eine Zusammenfassung der Informationen zu dynamischen Blöcken wird unten angezeigt.

    Dynamische Blockzusammenfassung {width="600" modal="regular"}

  5. Legen Sie Template auf eine der folgenden Einstellungen fest:

    table 0-row-2 1-row-2 2-row-2 layout-auto
    Option Beschreibung
    Dynamic Block Block Template Fügt einen eigenständigen Block hinzu.
    Dynamic Block Inline Template Fügt den Blockinhalt in Text ein.

    Dynamische Blockvorlage {width="200"}

  6. Füllen Sie die erweiterten Einstellungen nach Bedarf aus.

  7. Klicken Sie abschließend auf Save , um die Einstellungen anzuwenden und zum Arbeitsbereich Page Builder zurückzukehren.

Erweiterte Einstellungen

  1. Um die Positionierung des dynamischen Blocks innerhalb des übergeordneten Containers zu steuern, wählen Sie ein Alignment aus:

    table 0-row-2 1-row-2 2-row-2 3-row-2 4-row-2 layout-auto
    Option Beschreibung
    Default Wendet die Standardeinstellung für die Ausrichtung an, die im Stylesheet des aktuellen Designs angegeben ist.
    Left Richtet die Liste am linken Rand des übergeordneten Containers aus, wobei ein etwaiger Abstand berücksichtigt wird.
    Center Richtet die Liste in der Mitte des übergeordneten Containers aus, wobei der angegebene Abstand berücksichtigt wird.
    Right Richtet den Block am rechten Rand des übergeordneten Containers aus, wobei alle angegebenen Auffüllungen berücksichtigt werden.
  2. Legen Sie den Border fest, der auf alle vier Seiten des dynamischen Block-Containers angewendet wird:

    table 0-row-2 1-row-2 2-row-2 3-row-2 4-row-2 5-row-2 6-row-2 7-row-2 8-row-2 9-row-2 10-row-2 layout-auto
    Option Beschreibung
    Default Wendet die Standardformatvorlage für Rahmen an, die im zugehörigen Stylesheet angegeben ist.
    None Zeigt keine sichtbaren Begrenzungen des Containers an.
    Dotted Der Container-Rahmen wird als gepunktete Linie angezeigt.
    Dashed Der Container-Rahmen wird als gestrichelte Linie angezeigt.
    Solid Der Container-Rahmen wird als durchgezogene Linie angezeigt.
    Double Der Container-Rahmen wird als doppelte Linie angezeigt.
    Groove Der Container-Rahmen wird als gerillte Linie angezeigt.
    Ridge Der Container-Rahmen wird als geriffelte Linie angezeigt.
    Inset Der Container-Rahmen wird als Einfügelinie angezeigt.
    Outset Der Container-Rahmen wird als Ausgangslinie angezeigt.
  3. Wenn Sie einen anderen Rahmenstil als None festlegen, müssen Sie die Anzeigeoptionen für den Rahmen vervollständigen:

    table 0-row-2 1-row-2 2-row-2 3-row-2 layout-auto
    Option Beschreibung
    Border Color Geben Sie die Farbe an, indem Sie einen Musterabschnitt auswählen, auf die Farbauswahl klicken oder einen gültigen Farbnamen oder einen entsprechenden Hexadezimalwert eingeben.
    Border Width Geben Sie die Anzahl der Pixel für die Rahmenlinienbreite ein.
    Border Radius Geben Sie die Anzahl der Pixel ein, um die Größe des Radius festzulegen, mit dem jede Ecke des Rahmens gerundet werden soll.
  4. (Optional) Geben Sie die Namen der CSS classes aus dem aktuellen Stylesheet an, die auf den Container angewendet werden sollen.

    Trennen Sie mehrere Klassennamen durch ein Leerzeichen.

  5. Geben Sie Werte in Pixeln für den Margins and Padding ein, um die äußeren Ränder und den inneren Abstand des dynamischen Block-Containers zu bestimmen.

    Geben Sie die entsprechenden Werte in das Diagramm ein.

    table 0-row-2 1-row-2 2-row-2 layout-auto
    Container-Bereich Beschreibung
    Margins Die Menge des Leerraums, der auf die Außenkante aller Seiten des Containers angewendet wird. Optionen: Top / Right / Bottom / Left
    Padding Die Menge des Leerraums, der auf die Innenkante aller Seiten des Containers angewendet wird. Optionen: Top / Right / Bottom / Left

Bearbeiten der Einstellungen des dynamischen Block-Containers

  1. Bewegen Sie den Mauszeiger über den Container mit den dynamischen Blöcken, um die Toolbox anzuzeigen, und wählen Sie Symbol Einstellungen (Symbol {width="20"}) aus.

    Toolbox für dynamische Blöcke {width="500" modal="regular"}

  2. Ändern Sie bei Bedarf den dynamischen Block:

    • Klicken Sie auf Select Dynamic Block.

      Auswählen eines anderen dynamischen Blocks {width="20"}

    • Klicken Sie in der Liste der aktiven dynamischen Blöcke auf Select für den Block, den Sie hinzufügen möchten.

  3. Aktualisieren Sie die verbleibenden Einstellungen nach Bedarf.

  4. Klicken Sie abschließend auf Save , um die Einstellungen anzuwenden und zum Arbeitsbereich Page Builder zurückzukehren.

Dynamischen Block duplizieren

  1. Bewegen Sie den Mauszeiger über den Container mit den dynamischen Blöcken, um die Toolbox anzuzeigen, und wählen Sie das Symbol Duplizieren ( Duplizieren-Symbol {width="20"} ) aus.

    Das Duplikat wird direkt unter dem Original angezeigt.

    Dynamischen Block duplizieren {width="500" modal="regular"}

  2. Um den neuen dynamischen Block an eine andere Position zu verschieben, bewegen Sie den Mauszeiger über den Container und wählen Sie dann in der Toolbox Verschieben ( Symbol Verschieben {width="20"} ) aus.

  3. Wählen Sie den dynamischen Block aus und ziehen Sie ihn, bis die rote Richtlinie an der neuen Position angezeigt wird.

    Der obere und untere Rand jedes Containers werden während des Verschiebens des dynamischen Blocks als gestrichelte Linien angezeigt.

Entfernen eines dynamischen Blocks aus der Phase

  1. Bewegen Sie den Mauszeiger über den Container mit den dynamischen Blöcken, um die Toolbox anzuzeigen, und wählen das Symbol Entfernen aus (Symbol {width="20"} entfernen).

  2. Wenn Sie zum Bestätigen aufgefordert werden, klicken Sie auf OK.

recommendation-more-help
85b60248-86a4-4d5f-9933-5179643f608d