Hinzufügen einer Textüberlagerung zu einem Video

In diesem Thema erfahren Sie, wie Sie einem Video ein Text-Overlay hinzufügen können.

Brightcove Interactivity Studio bietet die Möglichkeit, verschiedene Arten von interaktiven Overlays zu Videos hinzuzufügen. Während der Videowiedergabe können Text- und Bildüberlagerungen auf Videos angezeigt werden. Mit Overlays kann beispielsweise zusätzlicher Text oder ein Firmenlogo in einem Video angezeigt werden. Overlays können auch anklickbar sein und bei Bedarf weitere Webseiten öffnen.

Bevor du anfängst

Bevor Sie einem Player Interaktivität hinzufügen können, benötigen Sie einen HapYak-aktivierten Brightcove-Player, und Sie müssen sicherstellen, dass ein Brightcove-Interaktivitätsprojekt erstellt wurde. Informationen dazu finden Sie unter Erste Schritte mit der Interaktivität.

Hinzufügen eines Text-Overlays

Textüberlagerungen werden verwendet, um während der Wiedergabe Text in einem Video anzuzeigen. Das Overlay kann auch anklickbar sein und beim Anklicken eine andere Browserseite öffnen. Im folgenden Beispiel erscheint das Text-Overlay bei 75 % des Videos und wird bis zum Ende des Videos angezeigt. Wenn Sie auf das Overlay klicken, wird ein Link in einer neuen Browser-Registerkarte geöffnet und das Video angehalten.


Gehen Sie folgendermaßen vor, um einem Projekt ein Text-Overlay hinzuzufügen:

  1. Melden Sie sich bei Brightcove Interactivity Studio(https://www.hapyak.com/login) an.
  2. Klicken Sie in der linken Navigation auf Verwalten.
  3. Klicken Sie auf ein Projekt, um es zu öffnen.
  4. Klicken Sie in der unteren Symbolleiste auf die Schaltfläche Textüberlagerung.
  5. Klicken Sie im Menü auf den Link Editor .
  6. Geben Sie den Text für das Overlay ein und klicken Sie auf Senden.
  7. Klicken Sie auf die Überlagerung und ziehen Sie sie an die Stelle, an der sie im Video erscheinen soll.
  8. Klicken Sie auf das Menü Startzeit .
  9. Geben Sie eine Startzeit in Sekunden, als Prozentsatz oder im Zeitformat ein. In diesem Beispiel wird die Startzeit auf den 75%-Punkt des Videos gesetzt. Klicken Sie auf SUBMIT.
  10. Klicken Sie auf das Uhrensymbol, um die Dauer des Overlays einzustellen. Klicken Sie auf SUBMIT.
  11. Klicken Sie auf das Menü Link .
  12. Geben Sie eine URL ein, zu der weitergeleitet werden soll, wenn das Overlay angeklickt wird.
  13. (Optional) Klicken Sie auf die Registerkarte VERHALTEN und legen Sie fest, dass das Video bei einem Videoklick pausiert. Klicken Sie auf SUBMIT.
  14. Klicken Getan.

Veröffentlichen Sie das Video mit dem Medienmodul und überprüfen Sie, ob das Overlay erscheint.

Tipps

Standardmäßig ist der Text mittig ausgerichtet, und die Größe des Rahmens um den Text passt sich während der Eingabe an. Es ist auch möglich, den Text links- oder rechtsbündig auszurichten. Folgen Sie diesen Schritten:

  1. Kopieren Sie die URL in diese CSS-Datei:
    https://interactivity.support.brightcove.com/assets/css/hapyak-css-text-align.css
  2. Bearbeiten Sie das Projekt und klicken Sie auf EINSTELLUNGEN.
  3. Fügen Sie die URL in das Feld Custom Annotation CSS (URL) ein.
  4. Klicken Sie auf SUBMIT.

Dadurch wird die Standardausrichtung auf links gesetzt.  Um eine bestimmte Anmerkung rechtsbündig oder zentriert auszurichten, klicken Sie auf die Anmerkung Bearbeiten > Mehr... > Klasse hinzufügen und dann tippen Text rechts oder Textzentrum  im Klassen Feld.