- Open the video of your choice on YouTube
- Below the video click on Share
- Click on Embed and copy the code displayed there
- In the phpMyFAQ editor, click on <> for Source code
- Paste the copied code at the desired location and save the post.
- Check if the video appears as expected.
Auto display the most recent video of a YT channel
First you need the channel ID of the YouTube channel of your choice. There are 2 Options to find this ID:
Option-1 to get the Channel-ID
Open the desired YouTube channel in your browser. To display the source code, right-click on an empty spot on the website and select Show source code from the context menu (there are slight differences depending on the browser used). Search for https://www.youtube.com/channel/ in the source code of the page.
You will find a URL similar to the following: https://www.youtube.com/channel/UCs9uLD ... l6sjDZ46Kw
The cryptic character string starting with UC is the channel ID.
Option-2 to get the Channel-ID
Open the the YouTube channel site of your coice (not just a single video) and copy the URL from the address bar of your browser.
The URL displayed there looks something like this: https://www.youtube.com/@handle
In this URL, https://www.youtube.com/ is followed by the handle, starting with an @ sign.
Next, we need a YouTube Channel ID Finder, several such tools can be found quickly on Google.
(e.g. https://www.tunepocket.com/youtube-channel-id-finder/).
You enter the handle there and the result is the channel ID starting with UC. Write this down in a text file.
Change the first two characters of the channel ID from UC to UU, e.g.: UUs9uLDjzE0A28l6sjDZ46Kw
In the following code, replace PLACE-THE-ID-HERE with the ID starting with UU:
Code: Select all
<iframe src="https://www.youtube.com/embed?listType=playlist&list=PLACE-THE-ID-HERE"></iframe>This will display the most recent video from the YT channel of your choice. As soon as a new video appears on this channel, it will be displayed automatically.
With a small addition we can also display the PREVIOUS video. Just add the following code to the end of the URL you are currently using: &index=2
The result will end something like this: PLACE-THE-ID-HERE&index=2
The PREVIOUS video will then be displayed using this URL. Enter 3 instead of 2 to go back one MORE video, etc.
To display the video in full width and responsive, you can use the following CSS code:
Code: Select all
.videoWrapper {
position: relative;
padding-bottom: 56.25%; /* 16:9 */
height: 0;
}
.videoWrapper iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}- Before the video code add: <div class="videoWrapper">
- After the video code add: </div>
Code: Select all
<div class="videoWrapper"><iframe src="https://www.youtube.com/embed?listType=playlist&list=PLACE-THE-ID-HERE"></iframe></div>