Isotope.js Errors - smartresize() function, possibly due to v2 upgrade

Hi there, I have JavaScript errors on several pages in X Theme using isotope.js.

I am trying to use the smartresize() function, but after doing some research, I have learned that smartresize() has been removed from isotope v2, which I assume has now been installed when X theme was updated.

Here is the script that is making the call:

  jQuery(document).ready(function($) {
    var $container   = $('#x-iso-container');
    $container.before('<span id="x-isotope-loading"><span>');
    $(window).load(function() {
      $container.isotope({
        itemSelector   : '.x-iso-container > .hentry',
        resizable      : true,
        filter         : '*',
                containerStyle : {
          overflow : 'hidden',
          position : 'relative'
        }
      });
      $('#x-isotope-loading').stop(true,true).fadeOut(300);
      $('#x-iso-container > .hentry').each(function(i) {
        $(this).delay(i * 150).animate({'opacity' : 1},500);
      });
    });
    $(window).smartresize(function() {
      $container.isotope({  });
    });
  });

How do I go about changing that code to work without the smartresize function. Right now, the page is broken and the elements are not displaying or resizing properly.

Thanks!

Hi @kbisk,

Thanks for reaching out.

It’s now xsmartresize() like from here

    $(window).xsmartresize(function() {
      $container.xIsotope({  });
    });

And the reason your site is still using the old code is that the theme is not updated while cornerstone is updated to 3.3.8, hence, scripts incompatibility. Please update your theme too and test it again.

Thanks!

Hey there, I have updated X to the latest version but am still having the same issue.

Hi There,

Please clear all your caching features (plugin, server-side, CDN, and browser’s cache) after updating so that the code from the latest release is always in use. This will help you to avoid any potential errors.

Also, please do a testing for a plugin conflict. You can do this by deactivating all third-party plugins, and seeing if the problem remains. If it’s fixed, you’ll know a plugin caused the problem, and you can narrow down which one by reactivating them one at a time.

Hope it helps,
Cheers!

Hi,

I checked the page and it seems to be working now.

Please let us know if this is still an issue in your end.

Thanks

Hi there, yes, it is working again, but with a couple of concerns.

With X and Cornerstone updated, these errors are present on each page in the console:

Source map error: request failed with status 404
Resource URL: /wp-content/plugins/cornerstone/assets/dist/js/site/cs-body.js?ver=3.3.8
Source Map URL: cs-body.js.map

Source map error: request failed with status 404
Resource URL: /wp-content/plugins/cornerstone/assets/dist/js/site/cs-head.js?ver=3.3.8
Source Map URL: cs-head.js.map

Source map error: request failed with status 404
Resource URL: /wp-content/themes/x/framework/dist/js/site/x.js?ver=6.3.8
Source Map URL: x.js.map

Hi There,

You can ignore those error as they aren’t actually errors. It’s just looking for source map for debugging since you opened your dev tools. The source maps are usually used by developers so you can ignore them as the provided files aren’t meant to be edited by users.

Please check this https://www.sitepoint.com/using-source-maps-debug-sass-chrome/ as a sample of source map (but for CSS and SASS instead of javascript)

You can also check your browser’s knowledge base to see how you can turn off the source map checking. But I don’t think you can turn off that in Safari.

Thanks!

Ok, that has been resolved. Thank you. I do now have an additional issue, not sure if they were related.

Each page has two sets of head and body tags and I cannot figure out how this is happening within the theme template files.

It may have something to do with the Google Tag Manager but I am unsure at this point.

Hello @kbisk,

Thanks for updating in! Did you change the username and password? It is no longer working for us. We need to check because a duplicate <body> tag will only happen if you are using a legacy child theme. You may have inserted or place a template file incorrectly. We need to check it.

Please post your credentials again in a secure note in your next reply.

Regards.

Sorry about that, should work for you now.

Hello @kbisk,

Thanks for updating the thread.

Can you please assign full administrator level access to the account you have created? Currently the permission is limited and I am not able to see the source code of the theme files.

Thanks.

Done - the permission level is now administrator.

Hello @kbisk,

Thanks for the updates. I have successfully logged in to your site now. Just as I suspected, you are using a legacy child theme. To resolve this, please relocate the following files:

  • framework/views/global/_header.php should be relocated to framework/legacy/cranium/headers/views/global/_header.php
  • framework/views/global/_landmark-header.php should be relocated to framework/legacy/cranium/headers/views/ethos/_landmark-header.php
  • framework/views/ethos/wp-footer.php should be relocated to framework/legacy/cranium/footers/views/ethos/wp-footer.php

You will need to create the folder path since it does not exist in your child theme yet.

Please let us know how it goes.

Thanks, this has taken care of the duplicate body and head tags.

How did this happen? When I updated the theme, I was not prompted about this issue or that further action was required. Additionally, that update was suggested (and executed) in this thread with no mention that the current configuration on the site would be an issue.

Hi @kbisk,

Anything you add in the child theme is a custom one and the system has no way to detect any compatibility issue between the update and your custom codes. Please note that any custom codes and templates are only good to the versions and time when it’s given or applied. It doesn’t guarantee future compatibility since the features changes while custom codes remain static.

Any transition from very old versions (legacy) along with its custom codes to the latest versions is considered maintenance and maintenance should be performed and tested on clone but the separate site.

Thanks!

Ok, thanks for all your help!

You’re most welcome!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.