Using the Brightcove Player in Accelerated Mobile Pages
This page is an example of an AMP HTML page containing a Brightcove Player.
AMP HTML includes an
amp-brightcove component which allows publishers to embed Brightcove Players within AMP HTML documents.
First, add this scpript tag to the head of the AMP HTML document.
<script async custom-element="amp-brightcove" src="https://cdn.ampproject.org/v0/amp-brightcove-0.1.js"></script>
Then add the
amp-brightcove element to the page. It takes the same
data-video-id attributes as the regular in-page (advanced) embed code.
<amp-brightcove data-account="906043040001" data-video-id="1401169490001" data-player="14034c56-aa15-49f8-b644-2a01edec6d50" layout="responsive" width="16" height="9"> </amp-brightcove>
Advertising including prerolls works in players used in AMP.
The ad plugin and its configuration just need to be included in the player's configuration. If you need to include article-specific values in your ad server calls, you can pass custom data through to a player plugin as described below.
You may want to pass additional information through to your player for your plugins to access. You can do this by adding extra attributes on the
amp-brightcove element named
* is the name of your property.
The parameters are passed through as camel cased attribute names appended to the player URL. Keys and values are URL encoded. For example:
Note that this requires Chrome 56, which is currently beta on Android but soon to be released.
When viewed on mobile in landscape mode a typical 16:9 video would cover the page. The CSS rule above will only apply to portrait aspect ratios to avoid this.
The player must be configured with the amp support plugin. See the Support docs for more information.
Read the AMP Project documentation for