Changelog

Vimeo App Installation Guide

Vimeo is a video-sharing platform that lets you upload, share, and view high-quality videos. It focuses on providing a creative community for filmmakers, artists, and professionals to showcase their work. Vimeo offers various tools and features to help creators manage and distribute content while maintaining a visually appealing and ad-free environment.

Contentstack Marketplace lets you install the Vimeo application and use it within your stack to fetch and display videos from the Vimeo account within your entries.

Voraussetzungen

Vimeo account
Contentstack -Konto
Zugriff auf die Contentstack Organisation/Stack als Eigentümer/ Admin

Let's follow this step-by-step guide to install and configure the Vimeo app within your stack.

Schritte zur Ausführung

Retrieve the Access Token from the Vimeo Account

To get the access token for Vimeo, follow the steps given below:
1. Log in to the Vimeo account using your Vimeo account credentials.
  
  Note: To add videos to your Vimeo account, click the Upload button. Then, on the next screen, you can drag-and-drop the videos, or click the Choose files button, select the videos, and add them to your account.
2. Now, go to Vimeo’s developer page and click the + Create an app button at the top right corner.
3. Geben Sie die ein App Name und ein Brief description of your app. Please note that these are mandatory fields. Then, choose who can access your app, accept the terms and conditions, and click Create App.
  The app gets created successfully.
4. Now, open your newly created app. Click the Authentifizierung tab in the left navigation panel and select Generate Access Token.
  To get the access token, select the Authenticated (you) option. Under the Scopes Abschnitt auswählen Privat und klicken Sie auf Generieren Taste.
  
  The access token is now generated. Copy the Vimeo Access Token to your clipboard to use in Schritt 2.
  
  Additional Resource: To learn more about access tokens in Vimeo, refer to the Generate an access token documentation.
Install and Configure the Vimeo app in Contentstack Marketplace

Befolgen Sie die unten aufgeführten Schritte, um die Anwendung in Contentstack zu installieren.
1. Melden Sie sich bei Ihrem Contentstack Konto an .
2. Klicken Sie in der primären Navigation auf der linken Seite auf Marktplatz Symbol, um zum Marktplatz zu gelangen.
3. Klicken Sie im linken Bereich auf Apps .
4. Im Marketplace können Sie alle verfügbaren Apps sehen. Bewegen Sie den Mauszeiger über das Vimeo App und klicken Sie Installieren.
5. In the pop-up window, select the stack where you want to install the Vimeo app, accept the terms and conditions, and click the Install button.
6. Auf der Configuration Geben Sie auf dem Bildschirm die folgenden Details ein:
  1. Vimeo Access Token: Enter the Vimeo Access Token retrieved from your Vimeo Account in Step 1.
  2. Folder Settings: Folder settings allows you to fetch videos directly from specific folders. To enable the Folder settings option, click the toggle button. You will see the Get Folders button. Click on it to fetch all folders and then select them in the dropdown.
    
    Note: Enabling the Folder settings will not impact the videos already stored in the entry.
  3. Choose the Vimeo Keys to Save in Entry: Choose how to save the data fetched from the Vimeo account in Contentstack entries.
    1. Wenn Sie die Option „Alle Felder“ auswählen, können Sie im Eintrag nur eine begrenzte Anzahl von Videos auswählen.
    2. For Custom Fields, you can search and add specific Vimeo Keys you want to save in entries.
    Warning: When you change the settings from All Fields to Custom Fields, and vice versa, any existing assets will follow the old configuration settings, whereas newly added assets in the entry will store the data according to the updated configuration settings. This is applicable on Custom and JSON RTE fields.
    
    If you select Benutzerdefiniert Felder then the Vimeo Keys dropdown appears. By default, uri, Name, Verknüpfung, pictures.base_link, und Beschreibung options are already selected inside the dropdown. If you want to create a new key, click the + New Key Field Möglichkeit.
    
    In the Add Key Path modal, enter the Vimeo Key Path and click the Create or Create and Apply button to create a new key.
7. On the UI Locations tab, you can see the predefined app locations. You can use the toggle button corresponding to each UI location to enable or disable it based on your requirements.
8. Klicken Sie auf die Schaltfläche Speichern .
9. Wenn der Webhook für Ihre App aktiviert ist, können Sie die Webhook-Protokolle unter dem Webhook Tab.
  
  Zusätzliche Ressource: Weitere Informationen zum UI-Standort und zu Webhooks finden Sie im Leitfaden „Installierte Apps“ .
10. Click Open Stack to start using the Vimeo application.
Use the Vimeo app within your Stack Entry
Hinweis: Before using the Vimeo application, you will need the following browser settings:
- Pop-ups should be enabled.
- Third-party cookies should be enabled.
To use the Vimeo application within an entry of your stack, follow the steps given below:
1. Los zu Ihrem Stapel, klicken Sie im linken Navigationsbereich auf das Symbol „Inhalt “ und dann auf die Schaltfläche „+ Neu Inhalt “ .
2. Create a content type by adding relevant details as displayed below:
There are two ways to use the Vimeo application in your entry:
1. Benutzerdefiniert Feld
2. JSON-Rich- Text Editor-Feld
Steps to use the Vimeo application using a Custom field
1. In the Content Type Builder page, add a Custom field in your content type by clicking the Insert a field link represented by a + sign.
2. Unter Auswählen Erweiterung/App, wählen Vimeo, und klicken Sie auf Fortfahren Taste.
  
  Change the Name of the custom field to your choice, for example, Vimeo Custom Field. Optionally, you can add Hilfe _ und Wert for your custom field. This adds the Vimeo app in the custom field.
3. Nachdem Sie die App in einem benutzerdefinierten Feld hinzugefügt haben, klicken Sie auf Speichern oder Speichern und Schließen, um Ihre Änderungen zu speichern.
4. To use the Vimeo app, create an entry for this newly created content type. To do this, in the left navigation panel, navigate to the Einträge Seite, klicken Sie + Neu Eintrag um einen neuen Eintrag erstellen für den oben genannten Inhaltstyp und klicken Sie dann auf Fortfahren.
  You can see the Vimeo app’s custom field on your entry page as shown below:
5. Drücke den + Choose Video(s) Taste.
6. Select the video(s) from your Vimeo selector page and click the Videos Hinzufügen Klicken Sie auf die Schaltfläche, um sie Ihrem Eintrag hinzuzufügen.
  
  Hinweis: Sie können mehrere Videos auf einmal hinzufügen.
  
  You can filter videos based on folders. By default, the folders configured at the time of installation in Schritt 2 are selected.
  You can search for videos on the Vimeo selector page.
  
  Also, you can view the videos in a Comfortable oder Compact view. By default, the Comfortable view is selected.
  Hover over the video on the Vimeo selector page. You will see the Open in Vimeo option to view the video directly in the Vimeo platform.
  
  The videos you insert get referenced within your entry in the thumbnail view, by default.
  
  To change the default view, select List from the drop-down menu as shown in the following screenshot:
  
  The videos you insert get referenced within your entry in the list view.
7. Hover over the video to access these features:
  1. Click the Reorder icon to drag and reorder the video.
  2. Click the Open in Vimeo icon to open the video on the Vimeo platform.
  3. Click the Remove icon to remove the video.
  Anzeigen
  
  Liste _
8. Nachdem Sie die Videos hinzugefügt haben, Speichern und Veröffentlichen Ihren Eintrag.
Steps to use the Vimeo application using a JSON Rich Text Editor field:
1. In the Content Type Builder page, add a JSON Rich Text Editor field in your content type by clicking the Insert a field link represented by a + sign.
2. Unter JSON-RTE-Plugin(s) Auswählen, wählen Vimeo, und klicken Sie dann Plugin(s) Hinzufügen.
  
  This adds Vimeo in the JSON Rich Text Editor field.
3. Nachdem Sie die App in einem JSON-Rich- Text Editor-Feld hinzugefügt haben, klicken Sie auf Speichern oder Speichern und Schließen, um Ihre Änderungen zu speichern.
4. To use the Vimeo app as a JSON RTE plugin, create an entry for this content type. You will see the Vimeo app icon inside the JSON RTE field in your entry page as shown below:
5. Drücke den Vimeo App-Symbol.
6. Select the video(s) from your Vimeo selector page and click the Videos Hinzufügen Klicken Sie auf die Schaltfläche, um sie Ihrem Eintrag hinzuzufügen.
  
  Hinweis: Sie können mehrere Videos auf einmal hinzufügen.
  
  You can filter videos based on folders. By default, the folders configured at the time of installation in Schritt 2 are selected.
  
  You can search for videos on the Vimeo selector page.
  Also, you can view the videos in a Comfortable oder Compact view. By default, the Comfortable view is selected.
  Hover over the video on the Vimeo selector page, and you can see the Open in Vimeo option to go directly to the Vimeo platform.
  The videos you selected get referenced within your entry:
7. To resize the video, drag the corner and adjust the size as required. Hover over the video to access these features:
  1. Click the Open in Vimeo icon to preview the video on the Vimeo platform.
  2. Klicken Sie auf das Symbol Bearbeiten, um das Video zu bearbeiten.
  3. Click the Remove icon to remove the video.
  Additional Resource: You can use alignment and inline asset features to edit the video placement within the JSON Rich Text Editor field.
8. Nachdem Sie die Videos hinzugefügt haben, Speichern und Veröffentlichen Ihren Eintrag.

War dieser Artikel hilfreich?

Mehr Artikel in „Video“

Brightcove

JW-Spieler

YouTube