I would make my embedded videos from youtube are responsive could help me with this please ?. Cheers

Mauricio Huayta
2 Posts
Mauricio Huayta posted this 29 August 2015

I would make my embedded videos from youtube are responsive could help me with this please ?. Cheers

I would make my embedded videos from youtube are responsive could help me with this please ?. Cheers
Vote to pay developers attention to this features or issue.
6 Comments
Order By: Standard | Newest
Stagger Lee
1818 Posts
Stagger Lee posted this 29 August 2015

Responsive means huge iframe videos ?

  • Settings - Additional CMS Code:

<pre>
add_filter('embed_oembed_html', 'my_embed_oembed_html', 99, 4);
function my_embed_oembed_html($html, $url, $attr, $post_id) {
return '&lt;div class=&quot;video-container&quot;&gt;' . $html . '&lt;/div&gt;';
}
</pre>

  • Settings - Additional CSS code:

    .video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
    }

    .video-container iframe,
    .video-container object,
    .video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    }

Responsive means huge iframe videos ? - Settings - Additional CMS Code: &lt;pre&gt; add_filter(&#39;embed_oembed_html&#39;, &#39;my_embed_oembed_html&#39;, 99, 4); function my_embed_oembed_html($html, $url, $attr, $post_id) { return &#39;&amp;lt;div class=&amp;quot;video-container&amp;quot;&amp;gt;&#39; . $html . &#39;&amp;lt;/div&amp;gt;&#39;; } &lt;/pre&gt; - Settings - Additional CSS code: .video-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; } .video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
Stagger Lee
1818 Posts
Stagger Lee posted this 29 August 2015

You can try this. I did not tested it but should work. Bootstrap native responsive embed, already exist in Themler. Or it should.
No need for CSS part.
http://getbootstrap.com/components/#responsive-embed

<pre>
function bootstrap_wrap_oembed( $html ){
$html = preg_replace( '/(width|height)=&quot;d*&quot;s/', &quot;&quot;, $html ); // Strip width and height #1
return'&lt;div class=&quot;embed-responsive embed-responsive-16by9&quot;&gt;'.$html.'&lt;/div&gt;'; // Wrap in div element and return #3 and #4
}
add_filter( 'embed_oembed_html','bootstrap_wrap_oembed',10,1);
</pre>

You can try this. I did not tested it but should work. Bootstrap native responsive embed, already exist in Themler. Or it should. No need for CSS part. [http://getbootstrap.com/components/#responsive-embed][1] &lt;pre&gt; function bootstrap_wrap_oembed( $html ){ $html = preg_replace( &#39;/(width|height)=&amp;quot;d*&amp;quot;s/&#39;, &amp;quot;&amp;quot;, $html ); // Strip width and height #1 return&#39;&amp;lt;div class=&amp;quot;embed-responsive embed-responsive-16by9&amp;quot;&amp;gt;&#39;.$html.&#39;&amp;lt;/div&amp;gt;&#39;; // Wrap in div element and return #3 and #4 } add_filter( &#39;embed_oembed_html&#39;,&#39;bootstrap_wrap_oembed&#39;,10,1); &lt;/pre&gt; [1]: http://getbootstrap.com/components/#responsive-embed
Stagger Lee
1818 Posts
Stagger Lee posted this 29 August 2015

As a matter of fact it should be nice and appealing option in Themler.

Edit: It works nice. Better snippet than first one, much better.

As a matter of fact it should be nice and appealing option in Themler. Edit: It works nice. Better snippet than first one, much better.
Support Team
Support Team posted this 01 September 2015

Hello

I would make my embedded videos from youtube are responsive could help me with this please ?

Actually, if you added video using Themler's Video control the video will be responsive.
The only thing is that if you add a fixed width for the control it will will not be responsive.

video1.png

video2.png

Thank you,
Olivia

Hello > I would make my embedded videos from youtube are responsive could help me with this please ? Actually, if you added video using Themler's **Video** control the video will be responsive. The only thing is that if you add a fixed width for the control it will will not be responsive. !video1.png! !video2.png! Thank you, Olivia
Corona
6 Posts
Corona posted this 02 March 2017

Hi,

The themler's video control only works in pages, but in Blog posts, themler doesn't let you edit contents. Are there other ways in themler can make the video responsive?

Thank you.

Hello

I would make my embedded videos from youtube are responsive could help me with this please ?

Actually, if you added video using Themler's Video control the video will be responsive.
The only thing is that if you add a fixed width for the control it will will not be responsive.

Thank you,
Olivia

Hi, The themler's video control only works in pages, but in Blog posts, themler doesn't let you edit contents. Are there other ways in themler can make the video responsive? Thank you. > Hello > > > I would make my embedded videos from youtube are responsive could help me with this please ? > > Actually, if you added video using Themler's **Video** control the video will be responsive. > The only thing is that if you add a fixed width for the control it will will not be responsive. > > ![](http://attachments.answers.billiondigital.com/782/4782/video1.png) > > ![](http://attachments.answers.billiondigital.com/783/4783/video2.png) > > Thank you, > Olivia
Support Team
Support Team posted this 02 March 2017

Hi,

The Blog page shows the post excerpts, each post content should be edited on that post page. There you can edit the video settings.

Sincerely,
Hella

Hi, The Blog page shows the post excerpts, each post content should be edited on that post page. There you can edit the video settings. Sincerely, Hella
You must log in or register to leave comments