Created
June 4, 2026 15:22
-
-
Save vapvarun/0d886bea28db41de6f80d51d6ca81218 to your computer and use it in GitHub Desktop.
BuddyBoss theme: fix WooCommerce product gallery thumbnails hidden by Slick init race condition
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * BuddyBoss Theme - WooCommerce product gallery thumbnails fix | |
| * | |
| * Problem: BuddyBoss hides .flex-control-thumbs via CSS and only shows them | |
| * once its Slick carousel adds .slick-initialized. The theme runs that Slick | |
| * init a single time on document ready + setTimeout(0), which can fire BEFORE | |
| * WooCommerce's FlexSlider has created the thumbnail list on script-heavy | |
| * pages. Result: the thumbnail strip below the product image never appears. | |
| * | |
| * Fix: re-run the theme's own Slick init at the moment WooCommerce finishes | |
| * building the gallery, with a window-load safety net. The | |
| * .not('.slick-initialized') guard makes it a no-op when the theme's init won. | |
| * | |
| * Usage: add via "Simple Custom CSS and JS" (Add JS Code, footer) or enqueue | |
| * from the child theme. | |
| */ | |
| (function ($) { | |
| 'use strict'; | |
| function bbFixGalleryThumbs() { | |
| var $thumbs = $('.woocommerce-product-gallery .flex-control-thumbs').not('.slick-initialized'); | |
| if (!$thumbs.length || !$.fn.slick) { | |
| return; | |
| } | |
| $thumbs.slick({ | |
| infinite: false, | |
| slidesToShow: 3, | |
| slidesToScroll: 1, | |
| adaptiveHeight: true, | |
| arrows: true, | |
| prevArrow: '<span class="bb-slide-prev"><i class="bb-icon-angle-right"></i></span>', | |
| nextArrow: '<span class="bb-slide-next"><i class="bb-icon-angle-right"></i></span>' | |
| }); | |
| } | |
| // Fires when WooCommerce finishes building the gallery (the reliable moment). | |
| $(document.body).on('wc-product-gallery-after-init', bbFixGalleryThumbs); | |
| // Safety net for galleries initialized before the listener attached. | |
| $(window).on('load', bbFixGalleryThumbs); | |
| })(jQuery); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment