Adding a custom script for having vimeo videos responsive

generare

Hello,

anybody could tell what is wrong with the below footer code where I'm trying to add a custom script in order to make vimeo videos responsive?

<?php
expTheme::foot(array("unique"=>"customtheme_c","src"=>THEME_RELATIVE . "js/fluidvids.min.js"));
?>

This has been added to custom theme folder, inside index.php . Exponent is version 2.3.3.


View article...

dleffler

Looking at https://github.com/toddmotto/fluidvids and http://toddmotto.com/fluid-and-responsive-youtube-and-vimeo-videos-with-fluidvids-js/, you not only need to load the script, but initialize it with some code (apparently it used to initialize itself?). You'd need to build a string variable, and pass that code string to the foot() method as 'content' also...something like




<?php $code = "fluidvids.init({
selector: ['iframe', 'object'], // runs querySelectorAll()
players: ['www.youtube.com', 'player.vimeo.com'] // players to support
});"; expTheme::foot(array("unique"=>"customtheme_c","src"=>THEME_RELATIVE . "js/fluidvids.min.js","content"=>$code)); ?>





View article...

generare

Hello,
I got the solution:
I made a custom view based on text module's single view, and I added on it this code below, in the beginning of the template code.

{script unique="videoframe" src="`$smarty.const.THEME_RELATIVE`/js/fluidvids.min.js"}
{literal}
$(document).ready(function() {
fluidvids.init({
selector: ['iframe'],
players: ['www.youtube.com', 'player.vimeo.com']
});
} );
{/literal}
{/script}

And of course I have the file "fluidvids.min.js" indeed located in my custom theme and there in the folder "js".
This seems to work fine!




View article...