magnific Popup funktioniert nicht in Shopify

Question

Ich arbeite an benutzerdefinierten magnific Popup mit Shopify site.In meine header.liquid Datei bin mit dem magnific Popup-Inhalt aufrufen.

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

Hier habe ich das Skript in hinzugefügt theme.js.liquid

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

aber es zeigt die folgende Fehler

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

Wenn jemand bitte sagen Sie mir, wenn ich bin vermisse etwas wie js Bibliotheksdateien.

Vielen Dank im Voraus.

Answer 1

Ich bin das eigentliche Problem für dieses Problem gefunden. Einige der Themen mit Standard-Magnific Pop-up-Bibliothek in theme.js.liquid-Datei.

Mein neues Thema Brooklyn hatte bereits eine großartige Pop-Up-Bibliothek. Es funktionierte jetzt gut.

So überprüfen Sie mit theme.js.liquid Datei mit magnific Popup-Bibliothek vorhanden oder nicht.

Answer 2

Sind Sie sicher, dass jQuery enthalten ist? wenn ja, wird es vor magnificPopup importiert?