To embed vertical videos in WordPress, you can follow these steps:
- Get the embed code for the video you want to embed from the video hosting platform (YouTube, Vimeo, etc.)
- In the WordPress editor, switch to the Text (HTML) view.
- Paste the embed code where you want the video to appear.
- Wrap the embed code in a
div
element and set its width and height to 100%. - Add CSS to make the div element responsive, such as:
cssCopy code.video-wrap {
position: relative;
padding-bottom: 56.25%; /* 16:9 aspect ratio */
padding-top: 25px;
height: 0;
}
.video-wrap iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
This way, the video will adjust its size based on the size of its container and maintain its aspect ratio.
Example:
phpCopy code<div class="video-wrap">
<iframe src="https://www.youtube.com/embed/... " frameborder="0" allowfullscreen></iframe>
</div>
(Visited 1 times, 1 visits today)
Was this article helpful?
YesNo
Last modified: March 3, 2023