We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 19872
    • 1,078 Posts
    Attempting to build a popup image gallery using foundation 5 block grid for the thumbs and then Magnific Pop Up for the popup gallery. I'm putting a snippet together to load cs, js and the initialization code to include when my chunk containing the thumbs and gallery code gets loaded.

    And of course... I'm getting an error that I do not understand.

    My first hunch is that it has something to do with the initialization code.

    $(document).ready(function() {
      $('.image-link').magnificPopup({type:'image'});
    });


    I already have another script on the template that is (document).ready (function)... that does another trick on the page.

    Would having two document .ready scripts on the same page cause a problem?

    Clearly I am beyond lost with this.

    Here is my snippet code. I've escaped the single quotes in the script.

    <?php
    /**
     * add Magific Popup Snippet
     *
     * DESCRIPTION
     *
     * This Snippet add the magnific-popup.js and css to the head of the page as well as the initialization script that
     * targets which div to run the script on. Script gets inserted at the bottom
     */
    
    /*loads magnific css file in the head*/
    $modx->regClientCSS('assets/css/magnific-popup.css');
    
    /*loads the magnific js in the head*/
    $modx->regClientStartupScript('assets/js/jquery.magnific-popup.min.js');
    
    $myMagnificPopUp='<script>
    $(document).ready(function() {
      $(\'.image-link\').magnificPopup({type:\'image\'});
    });
    </script>'
    $modx->regClientScript($myMagnificPopUp);

    This question has been answered by Jako. See the first response.

    • discuss.answer
      • 13428 ☆ A M B ☆
      • 1,031 Posts
      Line 21 misses a semicolon. That could cause a PHP error in the snippet.

      You have to call jquery script in the template too. If jQuery is included in the template at the end of the body, you should call jquery.magnific-popup.min.js there too with $modx->regClientScript. Otherwise there could occur a Javascript error ($ is not defined).
        • 19872
        • 1,078 Posts
        I get a php error about something on line 22. After reviewing my post, I see the item on line 22 may be what the error is referencing. I've limited experience with writing snippets, and now cannot remember why I structured it this way. Basically, I want that script to appearing at the end near the closing body tag.

        Time for me tp review snippet construction 101.

          • 19872
          • 1,078 Posts
          Hi Jako:

          JQuery is already called as part of the Foundation 5 framework. The error I got was a php error.
          Parse error: syntax error, unexpected '$modx' (T_VARIABLE) in /............../core/cache/includes/elements/modsnippet/36.include.cache.php on line 22

          I'm not sure why I structured my script in the snippet that way. When I look at the last line, that looks like it will load a script that is stored in a chunk. I think maybe when I was first building some snippets a few weeks back, I started with the scripts in chunks before I learned that I could put them in snippets which get included in the chunk.
            • 19872
            • 1,078 Posts
            Quote from: Jako at Jan 05, 2015, 06:32 PM
            Line 21 misses a semicolon. That could cause a PHP error in the snippet.

            You have to call jquery script in the template too. If jQuery is included in the template at the end of the body, you should call jquery.magnific-popup.min.js there too with $modx->regClientScript. Otherwise there could occur a Javascript error ($ is not defined).

            The missing semi-colon did the trick. No more php error. Good eye mate!

            Now, onward to see if I can get a gallery to load. I'm pretty sure at this point, I'm biting off more than I can chew!