Gutenberg support#

The “Video Embed (ARVE)” Gutenberg block support all the ARVE settings for individual videos in the sidebar. Be sure to set the defaults on the settings page to there is no need to set everything for each video, only what is needed.

The default “embed/YouTube/Vimeo/…” blocks also work but without support for per video settings. You can also use the “Shortcode” block.

Embedding Videos via URL (Classic Editor)#

This is the WordPress way to embed videos. If you not want to be ‘locked in’ and only care about providers WordPress already supports (not responsively and without any customization options) then you can simply enable this plugin and see your videos magically become responsive. If you keep to providers WordPress also supports this means you are not getting ‘locked in’ by ARVE and may at any time delete the plugin and still have your Videos in place (basic unresponsive of course). Any special options and parameters will then be ignored.

To embed a video into a post or page, place its URL into the content area. Make sure the URL is on its own line and not hyper-linked (click-able when viewing the post).

For example:

Check out this cool video:

-http://www.youtube.com/watch?v=dQw4w9WgXcQ

That was a cool video.

Shortcode Attributes (Options selected in the ‘Embed Video Dialog’) always override settings on the ARVE settings page. It is recommended that you set the the options Mode, Maximal Video Width, Autoplay … in a way that you want most (if not all) Videos appear on your site. You should only use attributes for settings that are also present on the settings page if you want some videos appear different then general ones rather then declaring this attributes for every single video.

For example if you have set Mode to Normal and Maximal Video Width to 500 the plugins options page, then URLs and Shortcodes will use that options to embed your videos. You can then decide to have a specific videos displayed differently by applying attributes to URLs or Shortcodes.

Embedding via Shortcodes#

Press the Embed Video button in your post editor in WordPress and paste the URL or embed code into the field, optionally select options and press Update. You can of course manually write Shortcodes. They have the advantage of being easier to read then URLs and you also can place them everywhere without the need for them to be on their own line, this becomes useful when aligning videos to text. You can also use them inside text widgets to, for example, put videos in your sidebar.

How to manually write shortcodes:

You pick video URL from YouTube or another supported host and then.

[*arve url="https://www.youtube.com/watch?v=Z7g8-GxLTSc" /]

For parameters, you can look below.

If the host is not listed or listed as not supported with URL you need to use the src from a iframe embed code a video host may give out.

[*arve url="https://example.com/iframe-src-url-here" /]

SEO ready Shortcode would be:

[*arve url="https://youtu.be/Z7g8-GxLTSc" title="Your SEO Title" description="Your SEO Description" upload_date="2016-09-14" /]

One thing is a little tricky without a UI: If you need a ID for the thumbnail parameter you can get if from the WP Media Gallery by clicking on the image and looking at the address bar ../wp-admin/upload.php?item=1234 the number on the end is the ID. So a video with this image as responsive custom thumbnail would be:

[*arve url="https://youtu.be/Z7g8-GxLTSc" thumbnail="1234" /]

Do not confuse providers URL-parameters with shortcode attributes when writing Shortcodes.

[*arve url="https://vimeo.com/136395742" aspect_ratio="3:1" title="0" byline="1" portrait="0" loop="1" /]
[*arve url="https://vimeo.com/136395742" aspect_ratio="3:1" parameters="title=0&byline=0&portrait=0&loop=1" /]

Except autoplay all parameters that control the providers’ player need to be inside the parameters attribute. These parameters are different based on the provider options. Youtube Parameters, Dailymotion Parameters, Vimeo Parameters. For the actual shortcode attributes that control ARVE look below.

The old style shortcodes like [*vimeo id="136395742" /] are still supported for backwards compatibility, but not recommended to use.

Supported Attributes#

Note that this table is generated from the plugins code for the shortcode UI dialog and Gutenberg Block sidebar, so you have that exact same descriptions inside your WordPress admin

Parameter

Function

url

Post the URL of the video here. For Brightcove, Comedy Central, IMDB, Mail.ru, ooyala, VK and any unlisted video hosts paste their iframe embed codes.

loop

Note not all video hosts provide this feature.

muted

Note not all video hosts provide this feature.

controls

Options: true, false
Note that not all video hosts provide this feature.

title

Used for SEO, is visible on top of thumbnails in Lazyload/Lightbox modes, is used as link text in link-lightbox mode. ARVE Pro is able to get them from Dailymotion, Rumble.com, TED Talks, Viddler, Vimeo, Yahoo, YouTube automatically.

description

Needed for SEO ARVE Pro fills this automatically

upload_date

ARVE Pro fills this automatically.

mode

Options: normal, lazyload, lightbox, link-lightbox
For Lazyload, Lightbox and Link mode check out ARVE Pro. Only use normal when Pro is not installed!

thumbnail

Media library image ID or image URL for preview image for SEO and Lazyload modes. ARVE Pro is able to get them from Alugha, Dailymotion, Rumble.com, TED Talks, TikTok, Twitch, Viddler, Vimeo, Yahoo, YouTube, YouTube Playlist automatically, leave empty in this case unless you want use a different thumbnail. Type in featured to use the posts featured image.

hide_title

Options: true, false
Useful when the thumbnail image already displays the video title (Lazyload & Lightbox modes).

grow

Options: true, false
Expands video size after clicking the thumbnail (Lazyload Mode)

fullscreen

Options: enabled-exit, enabled-stick, disabled

play_icon_style

Options: youtube, youtube-red-diamond, vimeo, circle, none, custom

hover_effect

Options: darken, zoom, rectangle, none, custom

disable_links

Options: true, false
Prevent embeds to open new popups/tabs from links inside video embeds. Note: breaks functionality like sharing.

align

Options: none, left, right, center

arve_link

Options: true, false
Shows a small ‘ARVE’ link below the videos. Be the most awesome person and help promoting this plugin.

duration

`1H2M3S` for 1 hour, 2 minutes and 3 seconds. `5M` for 5 minutes.

autoplay

Options: true, false
Do not expect this to work! Browsers (especially mobile) or user settings prevent it, some video hosts do not support it at all. Only used in normal mode. ARVE will mute HTML5 video playback in case to make autoplay work for the broadest audience.

maxwidth

In pixels. If set to 0 (default) the $content_width value from your theme is used if present, otherwise the default is 900.

lightbox_maxwidth

default 1174

sticky

Options: true, false
Keep the video on the screen when scrolling.

sticky_on_mobile

Options: true, false
Stick the video to the top of screens below 768px width in portrait orientation. The Video will always be as wide as the screen ignoring the Stick Width and Stick Maxwidth settings.

sticky_position

Options: top-left, top-right, bottom-left, bottom-right
Corner the video gets pinned to on bigger screens.

aspect_ratio

E.g. 4:3, 21:9. ARVE is usually smart enough to figure this out on its own.

parameters

Provider specific player settings on iframe src. See documentation.

controlslist

controlsList attribute on <video> for example use nodownload nofullscreen noremoteplayback to hide the download and the fullscreen button on the chrome HTML5 video player and disable remote playback.

volume

Works with video files only.

random_video_url

Youtube Playlist or Vimeo showcase URL(Random Video Addon).

random_video_urls

Video URLs separated by commas. (Random Video Addon).

encrypted_media

Only needed in specific situations. Reduces privacy of the iframe embed. ‘Disable Links’ feature from ARVE Pro will not work with this.

lightbox_aspect_ratio

The aspect ratio of the lightbox. Leave empty to use the original video aspect ratio.

invidious

Options: true, false

Parameters#

The parameters attribute is used for provider specific url parameters added to the iframe src. These values can be used to alter video players. When set these values get merged with the global values on your ARVE settings page. See Youtube Parameters, Dailymotion Parameters, Vimeo Parameters.

Example for YouTube fs=0&start=30 will hide the fullscreen button, and make the video start at 30 seconds.

General Iframe Embedding#

Generally speaking ARVE’s embedding for unlisted providers should be pretty straight forward.

All you have to do is paste the iframe embed code a site gives you into the Gutenberg block or when using Classic Editor and Shortcode UI you can also just paste the iframe embed code and the src url and aspect ratio get extracted automatically.

When manually writing a shortcode all you need it the url from the src attribute. Optionally, you can use width and height linked with a colon as aspect ratio (default is 16:9 that is correct for most videos)

<iframe src="https://example.com/embed/1234" width="640" height="480"></iframe>
[*arve url="https://example.com/embed/1234" aspect_ratio="640:480" optional="foobar" optional2="foobar2" /]

ARVE assumes a URL is an iframe src if ARVE can’t detect it see the Provider Support Table to see what providers will need an embed code.

* You should remove the * character when copying these examples, they are used here to prevent the shortcodes from actually working on this page.