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

    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,700
    PenciDesign replied

    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

    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,700
    PenciDesign replied

    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

    Thanks you, this has fixed the problem

  • FatHummus replied

    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,700
    PenciDesign replied

    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