Issue between Envira, Bootstrap and jQuery

  • I’m using WP 4.9.1, Envira Lite 1.6.2 and Bootstrap 4.0.0 Beta 2.
    The URL in question: https://www.finedining.dreamhosters.com

    This is the situation:

    – When NO jQuery is manually loaded, Envira gallery works perfectly but Bootstrap functionality that requires jQuery does not (such as the Navbar-Toggler button used to show Mobile menu).

    – If I deregister, register and enqueue jQuery via functions.php file, Bootstrap works but Envira does not (properly) work: It can open an image via Lightbox but there are no controls for swiping or exiting the images/lightbox. It becomes impossible to exit the lightbox without refreshing the whole page.

    This is the code:

    if (!is_admin()) add_action("wp_enqueue_scripts", "my_jquery_enqueue", 11);
function my_jquery_enqueue() {
   wp_deregister_script('jquery');
   wp_register_script('jquery', "http" . ($_SERVER['SERVER_PORT'] == 443 ? "s" : "") . "://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js", false, null); 
   wp_enqueue_script('jquery');
}

    Interestingly, if I use older jQuery 1.7.1 (same code as above) Envira works but Bootstrap becomes buggy (I can expand the navbar in mobile but not collapse it).

    I’ve also tried to enqueue WP’s default jQuery with the following code:

    function insert_jquery(){
   wp_enqueue_script('jquery');
}
add_filter('wp_head','insert_jquery');

    In this case Envira works but Bootstrap’ JS functionality again does not.

    I really like Envira gallery and I’d like to continue using it (possible upgrade) but I need help with this.

    The page I need help with: [log in to see the link]

Viewing 6 replies - 1 through 6 (of 6 total)

  • Hi ??

    Can you please open up a ticket with our support? Just click on the Basic Question and we can assist you further! ??

    Thanks

    Thread Starter 3rror

    (@3rror)

    Hi,

    I just sent the basic support ticket.

    Thanks,

    Anes

    Hi 3rror and akyusa01 –
    I’m having a similar issue. Have you found a fix for this?
    Thanks in advance!
    Matt

    Thread Starter 3rror

    (@3rror)

    Hi, yes.

    I fixed it by enqueuing the latest Bootstrap bundle with jQuery as dependency:

    function pwwp_enqueue_my_scripts() {
    // jQuery is stated as a dependancy of bootstrap-js - it will be loaded by WordPress before the BS scripts
    wp_enqueue_script( 'bootstrap-js', '//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.bundle.min.js', array('jquery'), true); // all the bootstrap javascript goodness
}
add_action('wp_enqueue_scripts', 'pwwp_enqueue_my_scripts');
    Thread Starter 3rror

    (@3rror)

    Hi, yes.

    I fixed it by enqueuing the latest Bootstrap bundle with jQuery as dependency, in functions.php:

    function pwwp_enqueue_my_scripts() {
    // jQuery is stated as a dependancy of bootstrap-js - it will be loaded by WordPress before the BS scripts
    wp_enqueue_script( 'bootstrap-js', '//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.bundle.min.js', array('jquery'), true); // all the bootstrap javascript goodness
}
add_action('wp_enqueue_scripts', 'pwwp_enqueue_my_scripts');

    Got it, it works!

    Thanks, 3rror!

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Issue between Envira, Bootstrap and jQuery’ is closed to new replies.