Home>Support>Unable to view YouTube videos in iPhone

Unable to view YouTube videos in iPhone

Hello,

I’m starting up an eCommerce site (www.4friendspets.com/test) and would like to be able to embed YouTube videos. Using Page Builder makes this process very easy. YouTube videos are viewable when using a PC or laptop but when I try to view them on my iPhone 5c, all I get is a static image of the video with the play button that’s not functional. I have tried using both the YouTube URL or the embed code () and get the same results, works great on a laptop, just a static image on the iPhone. I’m using the Visual Editor and selecting the YouTube icon to insert the URL or inserting the embed code into the HTML tab of the Visual Editor. Again the same results.

As a test, I deactivated PageBuilder plugin and inserted the embed code into the Text Tab of my WP editor and I can view videos on both the laptop and iPhone. As soon as I reactivate PageBuilder, mobile viewing quits working.

I’m using the Virtue Theme downloaded from WordPress.org and all updates are current. I’ve also tried to use the Embedded Video widget available with PageBuilder.

At this point, I’m looking for a path forward that includes using PageBuilder and being able to view videos in a mobile environment. Regardless of the outcome, I’ll drop the video capability in favor of keeping PageBuilder as it is a great tool. Any help would be greatly appreciated,

Thanks, Mark

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 7 years, 6 months ago Andrew Misplon Hi, I Work Here

    Hi Mark

    I had a look at this setup on my side and it looks ok. Can you perhaps send a link through to a problem page with a video and I’ll take a look.

  2. 7 years, 6 months ago Mark Rod

    Thanks for the fast reply. My temporary home page with a video is ( http://www.4friendspets.com/test ). My issue is with not being able to view that video on my iPhone 5c. When viewing on a laptop, all is well.

    Thanks,
    Mark

  3. 7 years, 6 months ago Andrew Misplon Hi, I Work Here

    You can see the same thing happen if you re-size your browser window. It’s basically a conflict with Page Builder and the theme’s stylesheet.

    Give this a try in any Custom CSS module or plugin:

    @media (min-width: 992px) {
    #content .main {
    	float: none !important;
    }
    }

    If it breaks something else in the theme let me know.

  4. 7 years, 6 months ago Mark Rod

    Andrew,
    Forgive my “newbieness”, but when you say “Give this a try in any Custom CSS module or plugin”, can I assume you mean to drop it into my child theme? Assuming that is the case, I added your code to my child-theme and the net result was to force the content portion of the screen to the left side of the page and the side-bar item to the bottom of the page. The video is still not viewable on the iPhone.

    One interesting note; when you mentioned re-sizing the browser window, I tried that on my laptop. I can shrink the browser about half way and the video plays fine. At a certain point (less than half the size), the video play button no longer responds.

    Thanks,
    Mark

  5. 7 years, 6 months ago Andrew Misplon Hi, I Work Here

    You can either drop it into a Custom CSS plugin or module OR into the style.css file of your child theme.

    There is a breakpoint where the theme’s stylesheet is clashing with Page Builder and preventing the video from playing.

    Please give this a try instead:

    @media screen and (max-width: 992px) {
    #content .main {
    	float: none !important;
    }
    }
  6. 7 years, 6 months ago Mark Rod

    Andrew,

    BINGO, You Are Da’ Man!!! That did the trick. It now works whether I use the Embed Video or Visual Editor feature. I really appreciate your help and if it was up to me, I would tell you to take the rest of the week off.

    Thanks again,
    Mark

  7. 7 years, 6 months ago Andrew Misplon Hi, I Work Here

    Super, really glad to hear that helped.

    Thanks for your positive feedback. All the best with your project.

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More