Image undefined

  • Hi there,

    Trying this plugin out but can’t get past the initial loading stage.

    My gallery is failing to load with the two errors below. As you can see instead of a correct image URL it’s trying to load ‘undefined’. The second error I presume has to do with the image never loading in the first place.

    GET https://localhost:8080/k/site/show/projects/undefined 404 (Not Found)

    jquery.finalTilesGallery.js?ver=3.3.30:714 Uncaught TypeError: Cannot read property 'width' of undefined
    at Plugin.add_to_final (jquery.finalTilesGallery.js?ver=3.3.30:714)
    at Plugin.add (jquery.finalTilesGallery.js?ver=3.3.30:639)
    at Plugin.nextTile (jquery.finalTilesGallery.js?ver=3.3.30:423)
    at Image.img.onerror (jquery.finalTilesGallery.js?ver=3.3.30:499)

    This is my markup:

    <div class="final-tiles-gallery">
    <div class="ftg-items">
      <div class="tile">
        <a class="tile-inner" href="https://localhost:8080/k/site/wp-content/uploads/2017/12/INESTABLES-1-500x281.jpg">
          <img class="item" src="https://localhost:8080/k/site/wp-content/uploads/2017/12/INESTABLES-1-500x281.jpg" data-src="https://localhost:8080/k/site/wp-content/uploads/2017/12/INESTABLES-1-500x281.jpg" />
      </a>
    </div>
  </div>
</div>
<script type="text/javascript" charset="utf-8">
  jQuery(document).ready(function() {
    jQuery('.final-tiles-gallery').finalTilesGallery({
      margin: 20,
      gridSize: 40,
      layout: 'final'
  });
});
</script>

    Any help much appreciated. Cheers!

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

  • Hi,

    are you able to publish this page online? There’s not much I can do. The url “https://localhost:8080/k/site/show/projects&#8221; it’s not even in the markup you posted.

    Cheers,
    Diego

    Thread Starter simooo

    (@simooo)

    Hi Diego! Thanks for getting back so quickly. I’m in the middle of building the site and am trying out different plugins, so unfortunately I only have my local version right now.

    Would you be able to give me any pointers for debugging the javascript in the meantime? Any ideas why the URL would resolve to just “undefined”?

    I wasn’t quite clear on what you meant by “it’s not even in the markup you posted” – do you mean that something is wrong or missing in the markup?

    Cheers!

    Thread Starter simooo

    (@simooo)

    Hi again,

    I’ve managed to get a temporary version of this online:
    https://kevinspeight.balthazaurus.com/show/projects

    As before there’s only 1 image in the gallery and the JS errors and the markup are the same as the ones I pasted earlier.

    I think I just understood the second part of your earlier reply – were you asking about the URL in the 404 Not Found error? It’s the URL of the gallery page with the word ‘undefined’ tagged on at the end. I think this is what the plugin tries to use as an image URL.

    Hope this helps!

    I don’t understand what you’re doing. Why did you statically/manually write the markup and the initialization code?

    Thread Starter simooo

    (@simooo)

    Hi there,

    What’s the confusing part? I’m following the example in the documentation here.
    https://www.final-tiles-gallery.com/documentation

    My markup is generated through PHP though. I’m using a standard WordPress loop in a category archive.

    Cheers

    No, I mean what did you do on your site. That markup it’s not the one you get when you use the shortcode [FinalTilesGallery id=”1″]

    Thread Starter simooo

    (@simooo)

    Sorry I just edited my previous reply to be clearer. I’m using a WordPress loop to generate the gallery.

    I’ve followed the documentation here:
    https://www.final-tiles-gallery.com/documentation

    the xdata-src it’s wrong, it should be data-src

    Thread Starter simooo

    (@simooo)

    Sorry, the X was just there to “disable” the data-src attribute, to see if the problem was that I had both src and data-src.

    I’ve just changed it to data-src and I’m getting the same error. The only difference is that the 404 is now for just ‘undefined’ instead of the longer URL.

    sorry it’s data-ftg-src

    you’re reading the jQuery version docs and using the WordPress version, is there a reason about it?

    Thread Starter simooo

    (@simooo)

    Oh ok! Yes, with the data-ftg-src attribute it’s loading.

    Are the versions running different JavaScript code? Am I better off using the jQuery version if I want to do this manually instead of through shortcodes?

    I haven’t ruled out doing it using shortcodes, it just seemed easier to do it manually since I had everything set up this way.

Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘Image undefined’ is closed to new replies.