Skip to content

downloadmyyoutube.com

  • Home
  • Blog
  • Other

How To Optimize YouTube Videos For Mobile Viewing On WordPress

If you’re not optimizing your YouTube video for mobile users you’re missing out on a large portion of your audience. This could result in lost sales or subscribers.

Here are some facts that may surprise you…

  • 40% of YouTube’s traffic now comes from mobile users.
  • About 50 million people in the U.S. now
    watch video on their mobile phones.
  • Fifteen percent of online video hours globally are
    watched on smartphones and tablets. 

Did you know that when you grab the YouTube embed code or the YouTube URL and place it in your WordPress web page it doesn’t display correctly for mobile users. The dimensions of the video go off the screen when I view it on my iPhone.

Here are the steps to optimize YouTube
videos for Mobile Viewing On WordPress:

  1. Add this CSS code to your style sheet and save it.

    .videoWrapper {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    padding-top: 25px;
    height: 0;
    }
    .videoWrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    }
  2. Upload your CSS file to the server using Filezilla or your main FTP software
  3. Grab the embed code from YouTube and insert it into your WordPress web page. Add the html code below to the YouTube embed code. Make sure you’re in text mode instead of the visual editor.


    <div class='videoWrapper'>
        <!-- Copy & Pasted from YouTube -->
        
    </div>

  4. Save and publish the post.
  5. View the post on your smart phone to see if it’s mobile responsive. Mobile responsive means that it will display correctly across all mobile devices.
  6. Repeat this process for every YouTube video you add to WordPress

Here’s an important tip for you..

Make sure you use a responsive theme for your WordPress website. This will allow all your web pages and posts to display correctly across all mobile devices.

That’s it!

Resources

helps build responsive embed codes for embedding rich third-party media into responsive web pages.

And now I’d like to invite you to subscribe to my Free e-course
““

Next post

Converting youtube to mp4 to fastfrom.com free

Last one
Converting youtube to mp4 to fastfrom.com free
How To Quickly Find Your YouTube Video Using The Advanced Search Feature In Video Manager
YouTube Creator Studio App Tutorial and Review
How To Find The Video Manager On YouTube
How To Comment On YouTube Videos And Increase Visibility
Copyright © 2022
downloadmyyoutube.com