Magento Open Source 2.1.x

Adding Product Video

To add product video, you must first obtain an APIApplication Program Interface: A software interface that lets third-party applications read and write to a system using programming language constructs or statements. Key from your Google account, and enter it in the configuration of your store. Then, you can link to the video from the product.

Step 1: Get Your YouTube API Key

Log in to your Google account, and visit the Google Developers Console. Then, do the following:

Under Use Google APIs, click Enable and manage APIs.

In the panel on the left choose Credentials. Expand the Add Credentials menu, and choose API key.

When prompted to create a new key, choose Server key. Enter a name for the key, and tap Create.

Wait a few moments while the key is generated. Then, copy the key to the clipboard.

In the next step, you will paste the key into your store’s configuration.

Step 2: Configure Magento

On the Admin sidebar, tap Stores. Then under Settings, choose Configuration.

In the panel on the left under Catalog, choose Catalog.

Expand the Product Video section. Then, paste your YouTube API key.


Product Video

When complete, click Save Config.

When prompted, refresh the cache.

Step 3: Link to the Video

Open a product in edit mode.  Then in the Images and Video section, tap Add Video.

If you haven’t yet entered your YouTube API key, tap OK to continue. You won’t be able to link to a YouTube video, but you can go through the process.


Add Video

Enter the URL of the YouTube or Vimeo video.

Enter the Title and Description of the video.

To upload a Preview Image, browse to the image and select the file.

If you prefer to use the video meta data, tap Get Video Information.

To determine how the video is used in the store, mark the checkbox of each Role that applies:

  • Base Image
  • Small Image
  • Swatch Image
  • Thumbnail
  • Hide from Product Page

When complete, tap Save.


New Video
  • Field Descriptions

    Field

    Description

    URL

    The URL of the associated video.

    Title

    The video title.

    Description

    The video description.

    Preview Image

    An uploaded image that is used as a preview of the video in your store.

    Get Video Information

    Retrieves the video meta data that is stored on the host server. You can use the original data, or update it as needed.

    Role

    Determines how the preview image is used in your store. Options:

    Base Image

    Small Image

    Thumbnail

    Swatch Image

    Hide from Product Page