1

I am converting my existing project to AMP, which contains HTML, CSS, Bootstrap and Masonry grid. I need to apply masonry java script library for my AMP project. I have tried in many ways and but Masonry grid is not working well. 

<script async src="https://unpkg.com/masonry-layout@4/dist/masonry.pkgd.min.js"></script>

<script type="application/javascript"> 
   // init Masonry
    var $grid = $('.grid').masonry({
      itemSelector: '.grid-item',
      percentPosition: true,
      columnWidth: '.grid-sizer'
    });
    // layout Masonry after each image loads
    $grid.imagesLoaded().progress( function() {
      $grid.masonry();
    });  
</script>

I have used below method also.

<script async src="https://unpkg.com/masonry-layout@4/dist/masonry.pkgd.min.js"></script>

<script amp-custom>
   // init Masonry
    var $grid = $('.grid').masonry({
      itemSelector: '.grid-item',
      percentPosition: true,
      columnWidth: '.grid-sizer'
    });
    // layout Masonry after each image loads
    $grid.imagesLoaded().progress( function() {
      $grid.masonry();
    });  
</script>

But both are not working...

Is there any alternative methods for achieving this ???

Thanks

Bachcha Singh
  • 3,850
  • 3
  • 24
  • 38
VSM
  • 1,765
  • 8
  • 18
  • As far as I know it is not possible to add javascript to an AMP page. Please take a look at: https://stackoverflow.com/questions/43748634/add-javascript-in-amp-pages – Marlon Barcarol Aug 06 '18 at 09:43
  • @ Marlon Barcarol, I read it, but the thing is, there are tools , which generating our existing projects to Amp. How they do that ? There should be at least one solution. – VSM Aug 06 '18 at 10:19
  • @VSM AMP does not support external javascript https://stackoverflow.com/a/48394533/5635098 This may be help you : https://stackoverflow.com/a/48570405/5635098 – Bachcha Singh Aug 06 '18 at 13:21
  • Possible duplicate of [Running JavaScript in AMP](https://stackoverflow.com/questions/40237295/running-javascript-in-amp) – Stephen Ostermiller Aug 23 '18 at 11:06

0 Answers0