• First of all here the example. Ignore the first two images since are done by columns and focus on the 3 column grid:

    http://dodo-coco.com/index.php/collections/springsummer-2014/

    In a normal screen works very well, however, when decreasing window size it won’t work.

    I had to stop using the easy gallery [gallery] short code because I needed to access to each and every picture to be able to add a couple of pieces of code so as I could have a change of picture on hover. Right now if you see, every time you hover a pic it will display another one.

    Normal wordpress gallery didn’t allow me to alter the img class or to add other pieces of code so I had to analyse the gallery with Firebug, get the code and copy straight to text editor. Unfortunately, this broke the “liquid” masonry approach and I have no idea where to start fixing it.

    P.S: A normal page with a normal gallery works perfectly like in this one: http://dodo-coco.com/index.php/collections/fallwinter-2013-14/?lang=en
    The problem is when I hardcode all the gallery into the text editor that loses this adaptive approach because I guess the JS stops working.

    https://ww.wp.xz.cn/plugins/jquery-masonry-image-gallery/

Viewing 15 replies - 1 through 15 (of 17 total)
  • Plugin Author phoenixMagoo

    (@phoenixmagoo)

    Ah I see! You would need to manually add in the code if you aren’t not using the gallery shortcode. You could follow my tutorial here. It’s not very hard to do.

    I think you just need to follow Steps 1 and 2.

    Let me know how it works out!

    Thread Starter jmiqueleiz

    (@jmiqueleiz)

    Hi phoenixMagoo thanks for your answer but when you say “follow my tutorial here” where does “here” exactly mean?I looked in Support, FAQ and so on but nothing that resembles a tutorial 🙂

    Plugin Author phoenixMagoo

    (@phoenixmagoo)

    Thread Starter jmiqueleiz

    (@jmiqueleiz)

    Hmm should I pick the first code and create a .js file? If so, which name and where to put it?

    Then for the second thing to add to functions.php any place is ok? I put it in the end but crashed my site 😛

    Plugin Author phoenixMagoo

    (@phoenixmagoo)

    Are you using a child theme?

    Thread Starter jmiqueleiz

    (@jmiqueleiz)

    Nop, keeping it simple.

    Plugin Author phoenixMagoo

    (@phoenixmagoo)

    Alright. Copy all the code in step 1 and paste it into a new .js file. Name that .js file jmig.js and save it in the theme’s directory. Then put this in the theme’s functions.php file:

    function jmig_js() {
         wp_register_script('masonryInit',
         get_template_directory_uri() . 'jmig.js',
         array('masonry'),
         '2.1.6',
         true);
    
         wp_enqueue_script('masonryInit');
    
    }
    
         add_action( 'wp_enqueue_scripts', 'jmig_js');

    Give that a shot and let me know what happens!

    Thread Starter jmiqueleiz

    (@jmiqueleiz)

    When I alter the functions it seem to crash :S:

    Fatal error: Cannot redeclare jmig_js() (previously declared in D:\wwwroot\dodococo\wwwroot\wp-content\plugins\jquery-masonry-image-gallery\functions\three-dot-nine.php:84) in D:\wwwroot\dodococo\wwwroot\wp-content\themes\barber-shop\functions.php on line 76

    Plugin Author phoenixMagoo

    (@phoenixmagoo)

    Is the jQuery Masonry Image Gallery plugin still turned on?

    Thread Starter jmiqueleiz

    (@jmiqueleiz)

    It is yeah, columns have same behaviour as before.

    I’m creating the jmig.js file here: wp-content/themes/barber-shop/_/_js
    which is where the other .js of the files were uploaded.

    But whenever I alter the functions is when it crash. I have this code on it which may be causing a conflict?:

    // LOAD JQUERY SCRIPTS
        function tinktank_add_scripts() {
            wp_enqueue_script('jquery');
            wp_register_script( 'add-custom-js', get_template_directory_uri() . '/_/_js/custom-ck.js', array('jquery'),'',true  ); // TO FOOTER
            wp_enqueue_script( 'add-custom-js' );
        }
        add_action( 'wp_enqueue_scripts', 'tinktank_add_scripts' );
    Plugin Author phoenixMagoo

    (@phoenixmagoo)

    Try turning the plugin off.

    Thread Starter jmiqueleiz

    (@jmiqueleiz)

    Turning the plugin off breaks the arranging on the page that uses [gallery]: http://dodo-coco.com/index.php/collections/fallwinter-2013-14/?lang=en

    But the page I had problem resizing (the one with hard code) remains the same (http://dodo-coco.com/index.php/collections/springsummer-2014/?lang=en). The order, display and the way masonry works is ok. So now I’m doubting if the plugin has influence over this one or not :S

    Plugin Author phoenixMagoo

    (@phoenixmagoo)

    It looks like you are probably going to run into conflicts with both the plugin turned on and the hardcoded page. Try this real fast:

    Change:

    function jmig_js() {
         wp_register_script('masonryInit',
         get_template_directory_uri() . 'jmig.js',
         array('masonry'),
         '2.1.6',
         true);
    
         wp_enqueue_script('masonryInit');
    
    }
    
         add_action( 'wp_enqueue_scripts', 'jmig_js');

    to:

    function jmig_js() {
         wp_register_script('masonrytwo',
         get_template_directory_uri() . 'jmig.js',
         array('masonry'),
         '2.1.6',
         true);
    
         wp_enqueue_script('masonrytwo');
    
    }
    
         add_action( 'wp_enqueue_scripts', 'jmig_js');

    Also, please make sure the plugin is turned back on.

    Thread Starter jmiqueleiz

    (@jmiqueleiz)

    Nothing, keeps crashing, probably theme related :(. Need to sleep is 02:30 but will be back in a few hours, thank you very much for your help, I hope we can solve it tomorrow.

    Will try tomorrow in a different theme to see if it works ok.

    Plugin Author phoenixMagoo

    (@phoenixmagoo)

    Try this one when you wake up:

    Change:

    function jmig_js() {
         wp_register_script('masonryInit',
         get_template_directory_uri() . 'jmig.js',
         array('masonry'),
         '2.1.6',
         true);
    
         wp_enqueue_script('masonryInit');
    
    }
    
         add_action( 'wp_enqueue_scripts', 'jmig_js');

    to:

    function jmig_js2() {
         wp_register_script('masonrytwo',
         get_template_directory_uri() . 'jmig.js',
         array('masonry'),
         '2.1.6',
         true);
    
         wp_enqueue_script('masonrytwo');
    
    }
    
         add_action( 'wp_enqueue_scripts', 'jmig_js2');
Viewing 15 replies - 1 through 15 (of 17 total)

The topic ‘Plugin not resizing when window size change. Not using [gallery] but hard code’ is closed to new replies.