Gallery not loading anymore (html5-boilerplate)

@tgoeg:

First of all, sorry for the hassle.

Second, unfortunately I have not updated this theme in some time…

The reason, however, seems to be that jQuery is being loaded after some of your other JS has started loading; please see this image:
https://aarontgrogg.com/lab/tgoeg-error-1.png

I am not sure of the best solution, but you could try preventing the theme’s jQuery, and letting WP’s jQuery load. You should be able to do this via the theme’s settings page.

Let me know if you continue to have trouble and I can try to help.

Cheers,
Atg

Do you have some kind of scraper that looks where your products are referenced? That was blazingly fast! (or are you part of 10web?)

However, thanks for the fast response!

Deactivating jquery in the HTML5 boilerplate settings actually fixes it, but how do I make WP load its own version of jquery? The reason I ask: It does not do it ootb. I.e. other functionalities are missing when I deactivate it.
Sorry – I am just a linux sysadmin, no WP pro..

I thought that pulling up site specific JS to the head might also solve it, but that hasn’t worked out, either.

Ha, thanks, yes, anytime my themes/plugins get mentioned I get an email. ??

If you no longer use the theme’s jQuery trigger, then WP’s jQuery should just automatically load… Will have to take a look.

Be back to you ASAP.

Atg

@tgoeg:

Well, I have dug into the theme (to remind myself how it all works), and everything appears to be working as it should… except that, when I uncheck the theme’s jQuery option, WP’s jQuery should load as usual, but it is not…

While I can verify this problem, I have no explanation for it.

You could try manually enqueuing jQuery (https://css-tricks.com/snippets/wordpress/include-jquery-in-wordpress-theme/).

I should also mention that, at this point, most of what my theme set out to do, is no longer necessary; WP has caught up with the world, and HTML5 is now an integral part of the Core and most themes out there…

So, another option would be to stop using my theme as the Parent theme, and start using another theme… I know that must sound drastic, but I just wanted to point it out.

Sorry I couldn’t be of more help, and am happy to help with anything else if I can,
Atg

Hi!
Manually enqueuing does indeed load jquery in the head, which is before the photo gallery gets loaded. Still no joy, however. I also explicitly tried jquery 1.10.2.

Also, looking at firefox’ console does not reveal any (more) errors, than the setup without working gallery does.

The basic problem is (at least) the hamburger menu (mobile view) does not work. It’s a dead simple .slideDown() and the toggle of a CSS class, so I don’t understand why that does not work with jquery being included as stated above.

We are going to switch theme soon, yes, still we should fix this issue if possible. I’ll see whether I can debug further..

Hi everyone,

@tgoeg, please keep us posted whether changing the website theme helps to fix the problem on your gallery. If not, we will be happy to have a closer look.

Cheers!

@tgoeg:

It appears that WP’s jQuery is being added to the page (in the head), but unfortunately after your site’s script is being added:
https://aarontgrogg.com/lab/tgoeg-error-2.png

And it appears that the theme’s jQuery is being added to the page (at the end):
https://aarontgrogg.com/lab/tgoeg-error-3.png

Two instances of jQuery definitely can cause conflict like this…

It seems like the theme is wreaking havoc here, apologies…

Atg

Hi again,
I dug a little deeper and now configured it as follows:

– HTML5 Boilerplate options: jquery deactivated
– functions.php: wp_register_script() for the js/script.js (needed for the hamburger etc.) deactivated, as this is unnecessary. HTML5 Boilerplate includes it anyway, when the respective checkbox is checked. No clue why the web design agency included this manually.
– I also included jquery-migrate as that is included when the gallery works with another theme (bonus question: Is jquery-migrate necessary for photo gallery?)

Now the order seems correct to me:
In the head:
jquery
jquery-migrate
In the body:
gallery using jquery calls
In the footer:
js/script.js

No double loading of any JS.

The hamburger button and other site-specific JS still works after lots of restructuring trial and error now. The gallery still does not. I am somehow at my wits end..

@tgoeg: Fantastic work!

The error I see in the Dev Console says:
“Uncaught TypeError: $(…).matchHeight is not a function”
Which points to line 34 in your scripts.js file:
$('.matchHeight').matchHeight();

The problem seems to be that matchHeight is not a jQuery function…
https://plugins.jquery.com/?s=matchHeight
And no function by that name is being added anywhere else…

Any idea where this should be coming from?

I do see this plugin:
https://plugins.jquery.com/matchHeight/
Not sure if adding it would fix the problem of not…

Atg

PS: “I am somehow at my wits end”… Welcome to the wonderful world of web development! And then when something suddenly starts working, all that pain disappears and the world will be wonderful again… ??

Nailed it!
Thank you so much!

Could have used the console myself, though ..
I thought I’d have to search for something gallery related, if this is the part that does not work, not the theme itself ?

Deactivating jquery loading in HTML5 Boilerplate also deactivated loading of plugins.js, that’s were matchHeight comes from.

So to summarize:
Make sure the order of JS files included is correct. The third parameter of wp_register_script() can hold an array of dependencies.
e.g.:

if (!is_admin()) add_action("wp_enqueue_scripts", "my_plugins_enqueue", 11);
function my_plugins_enqueue() {
          wp_register_script('plugins', get_stylesheet_directory_uri() . '/js/plugins.js', array('jquery'), false, null);
          wp_enqueue_script('plugins');
}

Photo gallery needs jquery, jquery-migrate is not necessary.
If your theme also includes JS/jquery, make sure nothing is included twice but everything your theme needs is included.

Re the wonderful world of web development: Can’t agree more. I am a scientific guy and it always freaks me out when this whole field is just trial and error.