Ad

Magnific Popup Not Working In Shopify

I am working on custom magnific popup with shopify site.In my header.liquid file am calling the magnific popup content.

<button id="open-popup" >Open popup</button>
<div id="my-popup" class="mfp-hide">
  popup  content here.
</div>

Here i have added the script in theme.js.liquid

$('#open-popup').magnificPopup({
  items: [
    {
      src: '#my-popup',
      type: 'inline'
    }
  ],
  gallery: {
    enabled: true
  },
  type: 'image'
});

But It shows the following error

TypeError: $(...).magnificPopup is not a function

If anyone please tell me if am i miss something like js library files.

Thanks in advance.

Ad

Answer

I am found the actual problem for this issue.Some of the themes having default magnific pop-up library in theme.js.liquid file.

My new theme brooklyn was having magnific pop-up library already.So it was working fine now.

So check with theme.js.liquid file having magnific popup library present or not.

Ad
source: stackoverflow.com
Ad