The YouTube custom field gives you the ability to display a YouTube video at your frontend just by filling out the URL or just the ID of the YouTube video. It also provides a variety of settings that lets you modify the player as you desire. More info on these settings below.
- How to add a YouTube Custom Field to Joomla! Articles
- Field Usage
- Field Frontend Display
- How do I make my video responsive?
- Can I set a start and end time for my video?
- Can I set my video to autoplay?
- Can I prevent my video from going fullscreen?
- Frequently Asked Questions
How to add a YouTube Custom Field to Joomla! Articles
The YouTube custom field provides you all of the customization options of the player which will display the video at your frontend.
After choosing the correct Type, you can customize your player as you desire. The customization options are seen below and are all of the options that YouTube provides for embedding videos into your website.
Let's see what each option does.
| Name | Description |
|---|---|
| Name | The name will be used to identify the field. Leave this blank and Joomla will fill in a default value from the title. |
| Label | The label of the field to display. |
| Description | A description of the field that will be displayed in the label tooltip. |
| Required | Is this a mandatory field? |
| Video Size | Set the size of the embedded video. Fixed: The video will be embedded at a fixed size. Responsive: The video will be embedded responsively, so it will adapt to the height and width of its container. |
| Video Width | The video's width in pixels. If you prefer to use percentage you have to type the percentage sign '%' at the end of your value like so, 90%. |
| Video Height | The video's height in pixels. You can also use a percentage here the same way as you do with the width. |
Pro Only
| Name | Description |
|---|---|
| Autoplay | Choose if you want the video to start playing when the page finishes loading. |
| Closed Captions | Setting this optin to 'Yes' forces the video to use available closed captions even if the user has a user preference of not wanting to see them by default. |
| Color | You can choose between two themes. Red and White. This color applies to the video's progress bar. |
| Disable keyboard shortcuts | Choose if you want to disable the keyboard shortcuts bound to the player. |
| Start Time | Type in the amount of seconds that you want the video to start playing. This option is particularly useful if you want to display videos which have a particular intro and you'd like to skip it. |
| End Time | Type in the amount of seconds that you want the video to stop playing, counting from the end of the video. This means that if you want to use a video which has an outro scene of 10 seconds and you want to skip it then you should type in the number 10 in this option. |
| Fullscreen | Choose if you want to display the fullscreen button of the player. |
| Interface Language | Choose from your currently installed content languages which one you would like to be used as an interface language for the player. |
| Video Annotations | Choose if you want the video annotations to be displayed. |
| Loop | Choose if you want the video to start playing from the beginning once it finishes. |
| Modest Branding | Choose if you want the YouTube logo to be displayed in the player's controls. |
| Related Videos | Choose if you want to display related videos at the end of the playback inside the player. |
| Show Info | Choose if you want to show information like the video title or the uploader before the video starts playing. |
Usage
Once you are in your Article's Edit screen, choose the "Fields" Tab to see the YouTube custom field as you can see in the screenshot below.
In this textbox you can type in the full URL or just the ID of the YouTube video that you are interested in.
Frontend Display
Take a look at the screenshot below to see how it could be displayed in your frontend.
Frequently Asked Questions
How do I make my video responsive?
By default, the video will have a Fixed video size. Meaning the width and height of the video can be set in the Video Width and Video Height settings.
If you desire to make the video responsive which will make it auto resize in mobile devices, select the option Responsive in the setting Video Size. This will remove the settings Video Width and Video Height and make it's width the same as the parents (full width). This way you will get the best experience in mobile devices.
Can I set a start and end time for my video?
You can set the start time as well as the end time for your video in the Field Settings by changing the Start Time and End Time options. The values must be in seconds. So if you want to start your video 1 minute and 30 seconds in, you should set the Start Time to 90 seconds. The same applies for the End Time option.
Can I set my video to autoplay?
If you want to make your video autoplay, you simply toggle the setting named Autoplay and this will make sure you video starts as soon as it finishes loading.
Can I prevent my video from going fullscreen?
If you don't want your users to view a video in fullscreen, all you have to do is toggle the setting Fullscreen and it will prevent them from doing so.
Can I use Privacy-Enhanced mode to load my video?
Privacy-Ehanced mode when enabled will not allow YouTube to store information about your visitors on pages where a YouTube video is loaded unless your users interact and play the video.
To set the video to load in Privacy-Ehanced mode, simply enable the setting named "Privacy-Enhanced Mode".
