While creating or editing a product in Magento 2, we add images for the product on the Product page. You can also add videos while editing or creating a product from external resources (Vimeo and YouTube). In this article, you will learn how to add a YouTube video to the Product page.
To add a YouTube video on the Product page, follow these steps:
For adding a video from YouTube on the Product page, you first need to add a YouTube API key in the configuration.
Step 1: Get your YouTube API key
1. Firstly, open the Google Developers Console. If you are opening it for the first time then, you must accept the Terms of Services and continue.
2. Click the New Project button from the page canvas and fill in the required fields with the correct data and then click Create.
3. From the left panel, select Credentials and then, click the “+CREATE CREDENTIALS” button just below the search bar and select API key.
4. Now, copy the API key and close the dialog box.
5. Then from the Enabled APIs & services, click the “+ENABLE APIS AND SERVICES” button and search for “Youtube” in the search box.
6. Finally, select YouTube Data API v3 and enable it.
Step 2: Add the YouTube API key in Store Configuration
1. On the Admin sidebar of your Store, navigate to Stores > Settings > Configuration.
2. Then, expand Catalog and select Catalog underneath.
3. Thereafter, expand the Product Video section and paste your API key in the YouTube API key field.
4. When completed, click Save Config.
Step 3: Add Video to the Product
1. Navigate to Catalog > Products and select a product to open it in edit mode.
2. Now, scroll to and Images and Videos section and expand it.
3. Thereafter, click the Add Video button.
4. Then, enter the URL of the YouTube or Vimeo video in the URL field and click outside the field.
5. Clicking outside the field will automatically populate the Title, Description, and Preview image according to the video information. If it does not fill populate the field then, fill in the details of the fields manually.
6. Then, select the check boxes that you want to apply Roles for the video and save the video.
7. Finally, click the Save button to save the product.
Now, the video appears on the Product page of your storefront in different roles that you have selected while adding the video to the product. You can add the video from Vimeo by just adding the video link in the URL field. You do not need to configure any API for using Vimeo video.
Please contact us at manish@bay20.com or call us at +91-8800519180 for any support related to Magento 2. You can also visit the Magento2 development page to check the services we offer.