[Support request] YouTube video ratio is a little crazy

Home Forums Support [Support request] YouTube video ratio is a little crazy

Home Forums Support YouTube video ratio is a little crazy

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #661108
    Danno

    Hi, I’m seeing YouTube videos show up as huge squares, not the expected, reasonably sized rectangles.

    I found this is in the help docs: https://docs.generatepress.com/article/responsive-videos/

    Every other theme I’ve used seems to handle YT videos right out of the box. Do I really have to add code to every single one to get them to show up a “normal” size?

    Thanks for any advice you can offer!

    GeneratePress 2.1.4
    #661273
    Leo
    Staff
    Customer Support

    Hi there,

    The site you linked isn’t using GP.

    The code provided in the should only be for responsive mode. The desktop should show up as those rectangle preview boxes by default.

    Also you only need to add the CSS once.

    Let me know if this helps 🙂

    #661380
    Danno

    Thanks for the quick reply. I had switched themes temporarily to observe the video behavior outside of GeneratePress and you must have snuck in in that little window!

    I guess I’m spoiled since I’m used to simply pasting in a YouTube share url and having it size correctly automatically.

    In GP, it looks like I have to add the full embed code, plus the code shown on your support page. Not a big deal, but it’s odd to have to go through the extra steps.

    In case you’re curious, on this page https://playitdailyukulele.com/the-mouse-the-cracker-and-the-ukulele/

    I’ve added the same video twice; once with your extra code, once with the straight YouTube url.

    So it DOES work correctly with your code, and incorrectly without (the narrow I make the page, the more awkwardly out of proportion the video becomes).

    Thanks.

    #661614
    Leo
    Staff
    Customer Support

    It’s not working without the code because you have this CSS added:

    .single .entry-content {
        max-width: 400px;
        margin-left: auto;
        margin-right: auto;
    }

    If you remove that CSS you should see that it shows up correctly.

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.