Get Even More Visitors To Your Blog, Upgrade To A Business Listing >>

Testing YouTube Video Player Styles for Vertical and Square Videos Embedded on a Webpage

Vertical Video on YouTube

It’s the end of 2020, and I’m just getting into creating more and more vertical and square videos for people. So I decided it was time for me to explore deeper into how clients can take their newly minted vertical or square video, upload them to YouTube for the exposure benefits, and utilize the YouTube embed code for placing the video onto their website page or blog post. As I progress and find out more, I’ll update this post periodically. I’m sure there are plugins to do this, but sometimes plugins cause havoc or don’t play well with other things. Here I go down the rabbit hole…

Text. Here is some text and a vertical video that is centered using the align center for the paragraph. Grabbed the embed code from youtube and changed the iframe from the default width=”560″ height=”315″ to be width=”315″ height=”560″. Next I’d like to see how I can get the text to wrap next to a video that is not centered. I had to switch to the HTML view of the page/post.


This is My Header Text.

Here is some text and now a square video, not centered. Grabbed the embed code from youtube and changed the iframe from the default width=”560″ height=”315″ to be width=”315″ height=”315″. For wrapping the text next to the video I used the example from https://community.canvaslms.com/t5/Question-Forum/Wrap-text-around-a-video/td-p/389843. I added padding between the video and text by including “padding: 30px; right before the float parameter in the iframe code. When not viewed on a mobile phone, this puts the text on the right and the video on the left. While this code example did the trick, it’s not elegant or super simple, and will probably scare away the average WordPress user from trying it out when they embed their vertical and square YouTube videos onto their own website, unless they have a plugin to do this for them. Just my opinion. I could be wrong. Now I’ll add plenty of extra text to see how the text wraps around the video, Blah Blah blah. Now I’ll add plenty of extra text to see how the text wraps around the video, blah blah blah. Now I’ll add plenty of extra text to see how the text wraps around the video, blah blah blah. Now I’ll add plenty of extra text to see how the text wraps around the video, blah blah blah.Now I’ll add plenty of extra text to see how the text wraps around the video, blah blah blah.Now I’ll add plenty of extra text to see how the text wraps around the video, blah blah blah.

——





This is My Header Text.

Same code as above, but changed the float parameter to right, just to test it out. When not viewed on a mobile phone, this puts the text on the left and the video on the right.


The post Testing YouTube Video Player Styles for Vertical and Square Videos Embedded on a Webpage appeared first on Video Design and Editing Services for Professionals and Entrepreneurs.



This post first appeared on Blog -, please read the originial post: here

Share the post

Testing YouTube Video Player Styles for Vertical and Square Videos Embedded on a Webpage

×

Subscribe to Blog -

Get updates delivered right to your inbox!

Thank you for your subscription

×