To display YouTube videos use shortcodes.
Video
The video shortcode will display a single video with it's info.
To use it you just need the Video ID, to find it just check a normal YouTube url:
https://www.youtube.com/watch?v=oxgnlSbYLSc
In this case the Video ID is oxgnlSbYLSc, and the shortcode is:
[mx_youtuber type="video" id="Video ID"]
Playlist
To print videos from a selected playlist you'll need the Playlist ID, to obtain it you have to check the url on YouTube again, so for example:
https://www.youtube.com/playlist?list=PLivjPDlt6ApQ8vBgHkeEjeRJjzqUGv9dV
This is the url of the one of National Geographic playlists, and the playlist ID is PLivjPDlt6ApQ8vBgHkeEjeRJjzqUGv9dV.
So the shortcode goes like this:
[mx_youtuber type="playlist" id="Playlist ID"]
Channel
The channel shortcode will display all the channel info & videos.
To use it you just need the Channel ID, to obtain it you have to check the url on YouTube again, so for example:
https://www.youtube.com/channel/UCpVm7bg6pXKo1Pr6k5kxG9A
This is the url of the National Geographic channel, and the Channel ID is UCpVm7bg6pXKo1Pr6k5kxG9A.
So the shortcode goes like this:
[mx_youtuber type="channel" id="Channel ID"]
Shortcode parameters
Using these parameters in YouTubeR shortcodes allows you to customize how videos and galleries will look like (some parameters are not available in the single video shortcode).
| Parameter | Possible values | Description |
|---|---|---|
| id | - | YouTube video/playlist/channel ID |
| type | video / playlist / channel | Type of content to display. In dependency with id |
| videos | - | Video IDs separated by comma, if you want to display specific videos as a playlist. Valid only for playlists |
| display | header,title,date,channel,description,meta,duration | Keys of elements sepparated by commas of the parts of the video to show, set to none to only display the video thumbnail |
| mode | lightbox / embed / link | Type of embeding the video |
| theme | Check the themes section | The template which will be applied. |
| size | default / medium / high / maxres / standard | The size of the video thumbnail |
| width | number | The width of the video (can be in %). Valid only for "embed" mode |
| height | number | The height of the video (can be in %). Valid only for "embed" mode |
| cols | number | Number of columns of the video list in playlist or channel |
| rows | number | Number of rows of the video list in playlist or channel |
| responsive_limit | lg / md / sm / xs | The size of the user device screen on which columns will collapse into one column to be responsive. Respectively: large, medium, small, extra-small |
| load_more | true / false | Show or hide "Load more" button to load more videos from the specific playlist or channel |
| load_more_text | Load more | Text for the "Load more" button |
| infinite_scroll | true / false | Turns on automatic "Load more" videos on scrolling down to the end of the video list |
| max_words | number | Limit the maximum number of words to show in the video description. Valid only for "flipcards" theme |
| suggested_videos | true / false | Show suggested videos when the video finishes |
| ytp_params | Check Google Developers website | YouTube player parameters. Example: autoplay=1&loop=1 Valid only for "embed" mode |
| playlist_id 1.31+ | - | Default playlist ID to show. Valid only for channels |
Themes
YouTubeR comes with some pretty cool templates. These are the themes for playlists:
- default
- dark
- flipcards
- circles1
- circles2
Single videos and channels have only "default" and "dark" themes.
You can create your own custom theme for YouTubeR, to do so let's say you set the parameter theme to custom.
[mx_youtuber theme="custom"]
Then you can add your own styles to the gallery with the base class mxYouTubeR_theme_custom.
If you need to customize/overwrite the code of the template you can create a folder html/plg_system_youtuber inside your website theme and another folder inside it with the name of the theme you want, in this case custom.
Copy the original files from media/plg_system_youtuber/themes/default inside the plugin's folder into the html/plg_system_youtuber/custom inside your website theme, you just need to copy the files you want to customize.
The logic of the plugin when searching for a file of the template custom template is as it follows:
- The plugin will look for the file inside the website theme folder
/templates/_WEBSITE_THEME_/html/plg_system_youtuber/_THEME_/ - The plugin will look for the file inside the media folder
/media/plg_system_youtuber/themes/_THEME_/ - The plugin will load the default theme file
/media/plg_system_youtuber/themes/default/