• Home
  • Blog
  • Showcase
  • Setup Docs
    • Sunshine Help
    • Flex Help
  • Support
    • Support Area
    • Contact us
    • Feedback
  • Connect
    • Newsletter
    • Twitter
    • Facebook
  • My Account
  • Flex
  • Sunshine
Support : Simple Pro Themes

Support : Simple Pro Themes

[Resolved] Responsive YouTube

If you have purchased a product, please enter the email address that you used to register at time of purchase.
Log In
Lost Password

Create an Account
  • Your username must be unique, and cannot be changed later.
  • We use your email address to email you a secure password and verify your account.

Support › Forums › Flex Theme › Responsive YouTube

  • This topic has 3 replies, 2 voices, and was last updated 5 years, 4 months ago by Davinder Singh Kanith.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • September 8, 2015 at 2:39 am #529
    Joseph
    Participant

    Hi support,
    Can you make the theme support YouTube video responsive by default? Right now, it is showing as this: http://imgur.com/vYS3VWc I can figure out to be YouTube responsive, but I prefer if the theme can support it.

    Regards,

    September 8, 2015 at 3:08 am #530
    Davinder Singh Kanith
    Moderator

    You can explore two options:

    1. Use this plugin – https://wordpress.org/plugins/responsive-video-embeds/

    2. Or use CSS implementation. Add following code to style.css file

    .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%;
    }

    and then embed video using this code format

    <div class="videoWrapper">
        <!-- Copy & Pasted from YouTube -->
        <iframe width="560" height="349" src="http://www.youtube.com/embed/n_dZNLr2cME?rel=0&hd=1" frameborder="0" allowfullscreen></iframe>
    </div>

    Source – https://css-tricks.com/NetMag/FluidWidthVideo/Article-FluidWidthVideo.php

    P.S. Plugin method is recommended as it is automatic.

    September 8, 2015 at 3:22 am #534
    Joseph
    Participant

    Hi Davinder,
    I am just curious if Flex theme can support by default as I’ve seen most of the Genesis theme doesn’t. In fact, I am using the code from here https://github.com/davatron5000/FitVids.js

    September 8, 2015 at 3:24 am #535
    Davinder Singh Kanith
    Moderator

    Hi Jospeh

    The plugin mentioned above uses similar JS script file as FitVid. We did not include such script file by default as this would make code heavy since majority users do not embed videos.

    However, we have taken note of your suggestion – we may add this in future update. Thanks.

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

Copyright © 2021 · Simple PRO Themes for Genesis Framework · About · FAQs · Contact · Affiliates