DokumentationCommercePage Builder

Medien - Video

Last update: Wed Dec 18 2024 00:00:00 GMT+0000 (Coordinated Universal Time)
  • Themen:

Erstellt für:

  • Einsteiger
  • Fortgeschrittener
  • Benutzende

Verwenden Sie den Video-Inhaltstyp, um ein Video, das auf YouTube oder Vimeo gehostet wird, zur Page Builder hinzuzufügen. Es ist einfach, Videos in eine Seite oder einen Block oder in Produkt- und Kategoriebeschreibungen einzubetten.

Video auf der Startseite 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.

Video-Toolbox

Video-Toolbox {width="600" modal="regular"}

Tool
Symbol
Beschreibung
Verschieben
move icon {width="25"}
Verschiebt das Video an eine andere Position auf der Bühne.
(Bezeichnung)
Video
Identifiziert den aktuellen Inhalts-Container als Video. Bewegen Sie den Mauszeiger über den Bild-Container, um die Toolbox anzuzeigen.
Einstellungen
Einstellungssymbol {width="25"}
Öffnet die Seite Edit Video, auf der Sie die Eigenschaften des Videos und des Containers ändern können.
Ausblenden
Symbol ausblenden {width="25"}
Blendet das aktuelle Video aus.
Anzeigen
Symbol anzeigen {width="25"}
Zeigt das ausgeblendete Video an.
Duplikat
Symbol „Duplizieren“ {width="25"}
Erstellt eine Kopie des Videos.
entfernen
Symbol entfernen {width="25"}
Löscht das Video 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.

Video hinzufügen

  1. Bevor Sie beginnen, navigieren Sie zum YouTube- oder Vimeo-Video, das Sie einbetten möchten, und kopieren Sie den Link.

    Alternativ können Sie auch einen direkten Link in eine gültige Videodatei kopieren. Gültige finden Sie unter " Videoeinstellungen“.

  2. Kehren Sie in der Commerce Admin zu dem Arbeitsbereich Page Builder zurück, in dem Sie das Video hinzufügen möchten.

  3. Erweitern Sie im Page Builder Bedienfeld Media und ziehen Sie einen Video Platzhalter auf das Bühnenbild.

    Ziehen eines Video-Platzhalters auf die Bühne {width="600" modal="regular"}

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

  5. Fügen Sie Video URL die URL des kopierten Videos ein.

    Die URL des in diesem Beispiel verwendeten Page Builder-Videos lautet: https://www.youtube.com/watch?v=Y0KNS7C5dZA.

  6. Um die Maximum Width des Videos zu begrenzen, geben Sie die maximale Breite in Pixel ein.

    Wenn es leer ist, wird das Video so breit wie vom Container erlaubt, wobei Ränder und Abstände berücksichtigt werden.

  7. Klicken Sie oben rechts auf Save , um die Einstellungen anzuwenden und zum Arbeitsbereich Page Builder zurückzukehren.

Videoeinstellungen ändern

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

  2. Ändern Sie die Einstellungen gemäß den folgenden Abschnitten:

  3. Klicken Sie oben rechts auf Save , um die Einstellungen anzuwenden und zum Arbeitsbereich Page Builder zurückzukehren.

Grundlegende Videoeinstellungen

  1. Um das aktuelle Video zu ändern, aktualisieren Sie die Video URL.

    Geben Sie eine gültige Video-URL ein. Gültige Video-URLs können Links sein zu:

    • Videos zu YouTube: https://youtu.be/CoDhMRUUjeI
    • Videos zu Vimeo: https://vimeo.com/190156113
    • Gültige Videodateien (.mp4 wird empfohlen): https://myvideos.com/spiral.mp4

  2. Um die zulässige Breite für das Video in der Storefront zu ändern, geben Sie die neue Maximum Width in Pixel ein.

    Wenn dieses Feld leer ist, erweitert das Video die gesamte Breite des Containers, wobei Ränder und Abstände weniger berücksichtigt werden.

  3. Um das Video nach dem Laden der Seite automatisch zu starten, setzen Sie Autoplay auf Yes.

    Wenn die automatische Wiedergabe auf Yes festgelegt ist, wird das Video bei der Wiedergabe gemäß Richtlinie stummgeschaltet. Aber auch mit dieser Einstellung können Mobilgeräte Ihre Videos nicht automatisch abspielen. Weitere Informationen zu diesen Richtlinien finden Sie in den folgenden Entwicklerressourcen:

    Wenn die automatische Wiedergabe auf No eingestellt ist, wird das Video nur auf Benutzerwunsch wiedergegeben.

Advanced

  1. Um die horizontale Positionierung des Videos innerhalb des Containers zu steuern, wählen Sie eine 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 den Inhalt am linken Rand des Video-Containers aus, wobei ein etwaiger Abstand berücksichtigt wird.
    Center Richtet den Inhalt in der Mitte des Video-Containers aus, wobei der angegebene Abstand berücksichtigt wird.
    Right Richtet den Inhalt am rechten Rand des Video-Containers aus, wobei ein etwaiger Abstand berücksichtigt wird.

  • Legen Sie den Border fest, der auf alle vier Seiten des Video-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.

  • Wenn Sie einen anderen Rahmenstil als None festlegen, müssen Sie die Anzeigeoptionen für den Rahmen vervollständigen:

    Rahmenfarbe {width="600" modal="regular"}

    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.

  • (Optional) Geben Sie die Namen der CSS classes aus dem aktuellen Stylesheet an, die auf den Video-Container angewendet werden sollen.

    Trennen Sie mehrere Klassennamen durch ein Leerzeichen.

  • Geben Sie Werte in Pixeln für die Margins and Padding ein, um die äußeren Ränder und den inneren Abstand des Video-Containers anzugeben.

    Geben Sie jeden entsprechenden Wert im Video-Container-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.
    Padding Die Menge des Leerraums, der auf die Innenkante aller Seiten des Containers angewendet wird.

Video verschieben

  1. Bewegen Sie den Mauszeiger über den Video-Container, um die Toolbox anzuzeigen, und wählen Sie Symbol „Verschieben ( Symbol Verschieben {width="20"} ) aus.

    Verschieben eines Videos {width="500" modal="regular"}

  2. Wählen Sie das Video aus und ziehen Sie es an die neue Position, direkt unter der roten Richtlinie.

    Verwenden der roten Richtlinie zum Platzieren des Videos {width="500" modal="regular"}

Entfernen eines Videos aus der Bühne

  1. Bewegen Sie den Mauszeiger über den Video-Container, um die Toolbox anzuzeigen, und wählen Sie Symbol „Entfernen ( Symbol entfernen ) aus.

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

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