[Resolved] Regarding Modals, Bootstrap and Venobox…

Home Forums Support Regarding Modals, Bootstrap and Venobox…

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #113563
    Roberto Enrique

    Hi Tom!
    The other day you suggested me to use the “Bootstrap Modal” plug-in.
    I followed your suggestion and it actually worked pretty nice.

    But the way you load the pop-ups for your videos in this website was so nice that I couldn’t resist to try that Venobox JQuery Script.

    Now, looking at the “Bootstrap Modal” plug-in code I realized that it actually was doing pretty easy stuff, it just enqueue the css and js files and that’s it!

    (Note: I don’t know JS or PHP at all, I’m roughly a CSS amateur)

    I tried to do similar with Venobox but it needs to be initialized…

    My intuition drove me to the conclusion that adding this to wp_footer hook could do the trick:

    
    <script>
    jQuery(document).ready(function(){
        jQuery('.venobox').venobox(); 
    });
    </script>
    

    And it actually does…

    This is the first time I do a plug-in. 🙂

    * * * * * * *

    Now I would like to know how to add that <script>…</script> stuff to the footer automatically with the plugin so it can work no matter if you have “hooks” add-on or not.

    Can you give me a little help with this.

    The pseudo-beta plug-in can be found here:

    http://expirebox.com/files/e4ed73e58b2df5bbc4d027ac6a2c3f70.zip

    I hope not to be too Off Topic

    Thanks in advance

    #113648
    Tom
    Lead Developer
    Lead Developer

    There’s a couple ways 🙂

    1. You can put your jQuery in a new file and name it something like scripts.js (no <script></script> tags) – then upload it to your child theme.

    Now you can enqueue the file using a function like this:

    add_action( 'wp_enqueue_scripts', 'my_custom_scripts' );
    function my_custom_scripts() {
    
    	wp_enqueue_script( 'my-scripts', get_stylesheet_directory_uri() . '/js/scripts.js', array(), '1.0', true );
    
    }

    The above assumes you uploaded your scripts.js file to a /js/ directory in your child theme.

    2. Another way is to place it directly in the footer:

    add_action( 'wp_footer','my_custom_footer_scripts' );
    function my_custom_footer_scripts()
    { ?>
          <script>
                jQuery(document).ready(function(){
                      jQuery('.venobox').venobox(); 
                });
          </script>
    <?php }

    Hope this helps 🙂

Viewing 2 posts - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.