Join the Soledad Facebook Users Group here
for Share, assistance, discussion, and Updates related to Soledad WordPress Theme.

If you can't create a new ticket - you can send us an email via our contact form and we will get back to you.

Okay
  Public Ticket #2533629
YouTube Video not responsive?
Closed

Comments

  • LetsCook89 started the conversation
    September 9, 2020 at 10:08am

    Hey guys,

    i do have a problem with the responsiveness of my YouTube videos. 

    For some reason on mobile it is shown as 9:16 instead of the normal 16:9 format that is the default for web. 

    Where can i change this to make it 16:9 (like a normal embedded YouTube video)? 

    Thanks for your help,

    Julian

  •  2,699
    PenciDesign replied
    September 9, 2020 at 2:54pm

    Hi,

    Please try add more this code to Customize > Custom CSS to fixed this issue:

    .wp-block-embed-youtube .wp-block-embed__wrapper {
    padding-bottom: 56.25%;
    position: relative;
}
.wp-block-embed-youtube .wp-block-embed__wrapper iframe {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
}

    Best Regards,

    PenciDesign

  • LetsCook89 replied
    September 10, 2020 at 9:24am

    Thanks for your answer.

    i copy/pasted the code to Customizer -> Custom CSS and published it. 

    The problem is still there though, see attachment

  •  2,699
    PenciDesign replied
    September 10, 2020 at 12:17pm

    Hi,

    Hmm, ok please try replace the code I sent to this code:

    .wp-block-embed-youtube .wp-block-embed__wrapper {
    padding-bottom: 56.25%;
    position: relative;
}
.wp-block-embed-youtube .wp-block-embed__wrapper iframe {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

    And check it again.


    Best Regards,

    PenciDesign

  • LetsCook89 replied
    September 11, 2020 at 8:25am

    Thanks you, this has fixed the problem

  • FatHummus replied
    August 9, 2021 at 7:14am

    Same issue here.

    I see that this is helping (different padding for mobile ad desktop?)

    .wp-block-embed-youtube .wp-block-embed__wrapper {    padding-bottom: 56.25%;    position: relative;
}

    But, perhaps the issue is different for me. the preview is not 16:9. 

    4294965745.png

    only after play it's change to 16:9


    5933434411.png



  •  2,699
    PenciDesign replied
    August 9, 2021 at 10:56am

    Hi @FatHummus,

    Please create a new ticket and give me more detail about this and we will check it to help you. Please don't put a reply to the tickets of other people because they will get a notification email from your reply.


    Best Regards,

    PenciDesign