Description
A plugin for managing and displaying videos on your website. Creates a โVideosโ Custom post type allowing you to integrate youtube videos with WordPress to output custom titles, descriptions and image thumbnails to display videos on your website. Alternatively you can also output any youtube video directly via shortcodes, optimised for responsive devices with a variety of output options to best suit your page.
Includes a number of embed methods:
- Embed: These can be within the content,
- Modal: as a modal,
- Gallery: multiple videos in a gallery
Shortcode examples
Youtube video embed with a custom thumbnail and a title using a video custom post:
[video id="21" title="show" thumbnail="show"][/video]
Youtube video brought in by youtube_id displayed using a modal:
[video youtube_id="SW3o7rSn-TY" type="modal"][/video]
Video gallery using the thumbnail option:
[video id="21, 22, 23" type="gallery" gallery_options="thumbnails"][/video]
Video embed using a non-youtube video:
[video iframe_url="https://player.vimeo.com/video/197202895"][/video]
Shortcode options
One of these options must be set:
Output a video from a custom post
id='[video id]' (default: blank)
If the video has been added as a video custom post type, add the post id of the video to add it here. The ID can be found in the url of the post in WordPress. If you set the type
to gallery then you can add multiple comma separated ids.
Output a video from youtube
youtube_id="[youtube-video-id]" (default: blank)
This is the id of the youtube video you want to link to. This is the 11 digit code at the end of a youtube video’s url. https://www.youtube.com/watch?v= SW3o7rSn-TY
Output a video from another location
iframe_url="[non-youtube-url]" (default:blank)
If the video isn’t a youtube video then a the url gets added into a responsive iframe.
These options may also be set:
Dispay type
type="embed/modal/gallery" (default: "embed")
Changes how the video is output on the site:
- โembedโ outputs the video inline with the content and allows it to respond as the screen size changes.
- โmodalโ outputs the video thumbnail inline with the content. Clicking the thumbnail opens up a modal window ontop of the page where the video plays. Options for the modal can be set witht the
modal_options
attribute. This option doesn’t work with videos brought in using theiframe_url
attribute. - โgalleryโ outputs the videos in a gallery. One of the videos appears like the embed option. The options for the gallery can be set using the
gallery_options
attribute. This option doesn’t work with videos brought in using theiframe_url
attribute.
Show or hide the title
title="show/hide" (default: "show")
Whether to show or hide the video’s title (only works with videos added as a custom post).
Add custom styles to the title
title_style="[css-class]" (default: blank)
css class that gets added to the title to apply multiple custom styles. Can be used for styling the title. โOverlaidโ is built in, which makes the title absolutely positioned in the bottom left hand corner of the video.
Show or hide the thumbnail
thumbnail="show/hide" (default: "show")
Shows or hides the custom thumbnail. If the video is brought in using the youtube_id
attribute, or the video post has no featured image, then the youtube default image will be used. No thumbnail image will be shown when using the iframe_url
attribute.
Display options for Modals
modal_options="[options]" (default: empty)
Only used when the type is set to modal. Adds buttons types that close the modal. Multiple options can be selected, add them as a comma separated list.
- โcrossโ : adds a cross in the top right of the modal.
- โbuttonโ : adds a button beneath the modal to close it.
Clicking the background will always close the modal.
Display options for Galleries
gallery_options="[options]" (default: empty)
Only used when the type is set to gallery. Adds different carousel control options. Multiple options can be selected, add them as a comma separated list.
- โarrowsโ : adds arrows that sit on top of the video.
- โthumbnailsโ : adds a row of thumbnail images below that can be used to select a different video.
- โindicatorsโ : indicator buttons underneath the video.
See the full documentation here
This plugin uses modal and gallery js taken from Bootstrap 3.
Help us improve this plugin
If you have any feedback or require any support using this plugin, get in touch with us by email at support@redballoon.io
Screenshots
Installation
- Download the zip file from the github page
- Upload the unzipped folder to the
/wp-content/plugins/
directory of your wordpress site - Activate the plugin through the โPluginsโ menu in WordPress
- Add the
[video]
shortcode where you want the video to be output - Use the shortcode options to customise how the video gets displayed
FAQ
- Installation Instructions
-
- Download the zip file from the github page
- Upload the unzipped folder to the
/wp-content/plugins/
directory of your wordpress site - Activate the plugin through the โPluginsโ menu in WordPress
- Add the
[video]
shortcode where you want the video to be output - Use the shortcode options to customise how the video gets displayed
- Does this work with other video hosts?
-
This plugin is primarily designed to work with youtube videos, but it can work with any iframe content.
Reviews
There are no reviews for this plugin.
Contributors & Developers
“RB Responsive Video Output” is open source software. The following people have contributed to this plugin.
ContributorsTranslate “RB Responsive Video Output” into your language.
Interested in development?
Browse the code, check out the SVN repository, or subscribe to the development log by RSS.
Changelog
1.2.2
- Updated how files are included
1.2.1
- Added ID column to the admin pages to make finding the video ids easier.
1.2
- Public launch version.
- Updated the plugin to include modal and gallery code from bootstrap
1.1
- Updated the javascript to use the youtube api version 3
- Added the gallery option for videos
1.0
- Added video post type, Modals and controlling the videos using the youtube api