Code

Discussion on Justified Image Grid - Premium WordPress Gallery

Discussion on Justified Image Grid - Premium WordPress Gallery

By
Cart 23,148 sales

Firsh supports this item

Supported

This author's response time can be up to 1 business day.

8471 comments found.

Hi Firsh,

I want to use a single image in the grid to open the lightbox with multiple images. I can see how to do that but I want to have the single image not appear in the lightbox gallery itself, so it just acts as an icon/image to open the gallery. I hope that makes sense.

thanks Peter

You need to use the custom link feature on an image if you wish to open a different image instead of it. The feature you need (opening a set of images by a single image) is only available through NextGEN. You need to setup custom links with the NGG Custom Fields plugin (more info in the documentation). If the opener picture links to another picture, and the target (custom link’s target setting in the shortcode) is set to lightbox then this should work.

Thanks, I will explore that.

Okay!

Hi Firsh,

Thank you for the latest support. I’m in the middle of getting JIG work in Post/Page excerpt. I tried template shortcode and the usual shortcode but can’t get it to work. Is there a way the JIG will work when added to the excerpt box?

Kind regards, Jonathan

I think shortcodes are usually stripped from most excepts, no? You can use your own function in the functions.php that creates the excerpt the way you want it, but that requires custom coding. I’m sure there are snippets out there for WP exceprts that allow shortcodes though. It’s usually disallowed because if a shortcode is lengthy and the cut-off point is in the middle of the shortcode then things will get funny and also the results of some shortcodes may look weird in the except if it’s not intentional.

Not sure I’m reading the instructions correctly, but how do you have a gallery of images, both horizontal and vertical, get sized to 200X200px? I have tried turning Tim Thumb on and setting the target row and height deviation to the same 200px, but no luck. I’m sure its something I’ve missed. Thanks for any help!

Set the aspect ratio setting to 1 (it’s on the general tab). Then set row height to 200, height deviation to 0. From that point you have 3 options:

If you wish to keep the auto-justified layout and the 200px height, the grid may crop some of the images’ width to make that happen.

If you are not happy with the cropping but want rectangles, even if they are smaller then 200px in height then you need to enable the ‘disable cropping’ setting.

If you must have the pictures 200×200 at all times, you need to disable the auto layout by using a custom width and setting the “width mode” to “fixed”. E.g. you need 3 columns, with 5px spacing between the images, you’ll need to set 610 as custom width (3×200 images, 2×5 spacing) and 5 as thumbnail spacing setting.

Hi,

I don’t see any explanation apart from generating static galleries.

I naturally want a dynamic gallery/display of my images as they are published. Just like on Flicker, for instance. 100% maintenance free.

I already have a “gallery” of images – namely the Media library – so how do I create an e.g. Flicker style gallery displaying my published images from the media library (and yes – I use WP newer than 3.5) – with my latest images first?

Regards

Morten ross

I’m looking forward to it! I’m happy to beta test, and have an off-line site to test on as well.

Do you think you’ll be able to have the modified version ready for testing this week?

Sorry I’ll attend your case, I’ve been busy lately.

Not sure what i am doing wrong – i have set the initial fetch to be 12 – yet is only loading 10 images..

[justified_image_grid preset=1 ids=292,293,294,295,296,297,298,299,300,301 thumbs_spacing=4 link_title_field=title prettyphoto_social=no download_link=alt caption=off mobile_caption=same lightbox_max_size=full last_row=normal aspect_ratio=4/3 disable_cropping=yes developer_link=hide load_more=click load_more_auto_width=off load_more_mobile=no load_more_limit=12]

The four rows is just a coincidence, you need to feed the shortcode more than 10-12 photos to have actually something to load more.

thanks – blind here! bc i copied and pasted – thought i got all 56 images…thanks for the QUICK response – i love that about you!!

No problem :)

Hello,

I’m using your plugin from 1 month. Very usefull. But, how could I mix radius with shadow ? I use the ”.justified-image-grid img” selector with my CSS for border radius on my image. But the “box-shadow” doesn’t work with this selector. I have to use the shadow parameter into the shortcode editor, but this is a “rectangular” shadow. Do you have a solution for this ?

That’s exactly why round corners are not supported, there are too many layers and other visual features that don’t sync well with round corners.

Try

.jig-imageContainer {
    border-radius: 20px;
}

Hi, I have had the plugin for a while and its fantastic. I was just wondering if there is a way of knowing when someone presses on of the social media buttons on a photo, like the FB like, G+ or twitter and so on. At least without going through them all and having a look at them individually.

Thanks for your help =)

Thanks! As far as I know no. Where do you think that information would be, google anayltics or Facebook admin area? I think there is something like that called Facebook insights but I don’t know how that works.

I think facebook has an insights thing but I’m not sure how to link it to the likes from the photos, thanks tho =)

No problem. I’ve read that you need a FB Page and ‘claim your domain’.

Firsh – how can i get the tile type of look? i am having difficulties

http://haridhamnj.org/harinew/iphone-wallpapers/

here is my shortcode: [justified_image_grid preset=1 ids=292,293,294,295,296,297,298,299,300,301 link_title_field=title prettyphoto_social=no caption=off mobile_caption=same load_more=click load_more_limit=10]

Only thing I’d add to that is last_row=match

i added the last_row=match – and it did nothing…am i missing something? i want it to look like the new wordpress tile type effect

It actually did, the last incomplete row has thumbs that equal in width and size like the first one. Can you show me what is the wordpress tile type effect? If there is an effect like that out there already why don’t you use that, assuming it’s what you need. JIG doesn’t have other layouts besides rows and fixed aspect ratio looks. There are no 2 images placed vertically above each other in a row or split rows.

Hello, I love what I am seeing.

However I have a small question. If I buy the plugin I don’t want to use lightbox or open the image alone in the browser.

I prefer it to open in a Wordpress page .

I guess that if I modify it to direct to the image attachment page, I can modify the template for changing the look of how the page looks.

Let me know if this will work as intended. The gallery shows. The user clicks on the image. A attachment wordpress page opens showing the image.

2nd question: If question 1 is possible, is there a way to upload text to each attachment image page?

(btw, my username is “banned”)

Hello banned :) What you need is already a feature built-in, you can choose “Attachment page” for the “Lightbox type” setting. http://justifiedgrid.com/wp-content/uploads/2013/10/Lightboxes.jpg

“The gallery shows. The user clicks on the image. A attachment wordpress page opens showing the image.” Yes this is exactly what it does. This concludes what you can do with JIG in this regard, everything else would be some custom code.

You can already add text to the images in WP, there are 4 fields. I’m not sure if these texts show up on the attachment pages, they should. I think it depends on your theme, and if they don’t show you could most likely easily add them with a few lines of code to the attachment page template PHP. Yes you can modify that page and make it look like you want it to. It’s been asked months before and you are not the only one who likes to show the image on its own and not in a lightbox. Since then it’s been added to the plugin as a ‘lightbox’ option.

how do you get rid of the filename of the image. because I clicked on an image, it pops up with a filename.

That text is from the WP image field called “title” that gets its value from the filename. If you don’t wish to rewrite those to meaningful names nor show them, you can go to the Lightboxes tab and set “link title” and “img alt” settings to “off”. It’ll make no text appear in the lightbox at all. If you need the same thing for the thumbnails on mouse over then go to the Captions tab and set under “what text to show”... “title field” and “caption field” to “off” – or just the “caption style” setting to “off”.

Hello – What a great plugin! Quick question, the plugin seems to disregard the Thumbnails that we have set in NextGen and just use the full image. Is there a way to override this or fix it to make sure the thumbs that we define through NextGen are used? Thanks.

Brainblaze

NextGEN settings regarding thumbnail size and similar are not taken over to JIG at all. What do you mean by using the “full image”, and where? You need to define thumbnail dimensions or looks through JIG, the corresponsing settings are: row height, row height deviation, disable cropping, aspect ratio, quality + retina ready and mobile only settings. JIG (and timthumb or jetpack photon) uses the original NextGEN image as a source for the thumbnail creation process and creates them with a size defined by the row height + deviation. Then it displays them according to the available space in your page.

Hello,

I have a problem with a lot of pictures in the gallery and the browser Google Chrome:

http://www.photoroi.com/portfolio/daniela-e-13082011/

If you go to the page and scroll down, after a number of pictures the upper thumbnails disappear and if you scroll back up, some thumbnails appear and some don’t.

There is no problem with other browsers, I tried IE and FF too.

Kind regards,

Klaus

Sorry I don’t know what’s wrong with that it’s not possible to debug it as it’s seems a rendering error in chrome. What happens if you show less images at once or enable load more in JIG?

Hello, ok, I tried “Load More”. It works with “Click” and “Infinite scroll”! Thank you! Kind regards, Klaus

Great!

Hello, I have a probleme with the lightbox on iphone. It dosen’t work at all (black screen then a white screen). Can you help me please ? Thanks

Hi, please send me a link to the page where you experience this so I can check. It’s likely due to PhotoSwipe lightbox. If you set Lightboxes-> mobile lightbox setting to “same as desktop” does it work? It may not be ideal so switch it back, I was just curious if it’s only with PhotoSwipe.

Hi Firsh

Im using this pluging to load images from facebook to my site. At the moment the images are loading very big. Is it possible to set them to a size? Thumbnail? What’s the shortcode?

Kind regards,

David

What i mean is: Can i set the showing images (without clicking) to a maximum size? like 100×100 pixels? thnx

So you mean the thumbnail sizes and not the lightbox size, right? For the thumbnails, the control is the “row height” and the “row height deviation”. If you’d like them to be 100×100 max and cropped to squares you can enter 100 to “row height”, enable the “disable cropping” settings and enter the number 1 to the “aspect ratio setting”. Otherwise there is no way to limit the maximum size like the way you want it. If you set 100 row height and you got a landscape panorama, it’ll be wide but only 100px tall.

If you meant the lightbox image size for Facebook then find this setting on the Facebook tab: Image size in the lightbox facebook_image_size

In a gallery, When I click on an image – it opens it up to see the larger version, on which shows a “button” on the top-right corner to open it to original big size.

Ok, how do I get it to open directly to the original size image when I click on any image in the gallery?

Where do I set this up to eliminate the “middle sized image” and go straight to the big original one?

Thanks!

Go to JIG settings, lightboxes tab, prettyPhoto JS settings and add this line at the end:

allow_resize: false

and add one comma to the end of the previous line.

HI, I have a huge probleme with the lightboxes,they are not working, or only few, rare times (and yes, it has worked few times)...when I click on the thumbnails, the image is oppened in the browser…problably a conflict with my theme, even though I’ve desactivated all the other plugins, and some css stuff that could, according to me, have caused some troubles, but nothing have changed…still not working, it’s probably a stupid thing, but I can’t find what…I’ve send you an e-mail few days ago with the link of the page…

Thanks for your help !

Replied!

And thanks !

Just for those who have the same problem than me:

I just uninstalled the plugin and re-installed it and now it works !

PS: I feel stupid now

I think you also updated to the minor latest version while you were at it and this fixed it (from the changelog):

Bugfix: The lightbox would not activate when the grid is resized due to scrollbar appearing

If you had no sidebar and not much content around JIG, and JIG caused scrollbars to activate (due to increase in length of the page) this might have been the case. The window size and different pages only add to the randomness. I was just trying to understand that it’s not a miracle but having a cause behind is a peace of mind and you don’t need to feel stupid lol :)

Hello… Since I’m using both JIG and Social Gallery, I’m not sure who to turn to… Maybe you’ll tell me…

Here is an article featuring a JIG using a Flickr set. JIG displays correctly (beautifuly actually) but, when I click on an image, after an ephemeral shadow of a Social Gallery popup, I get a direct link to the Flickr image.

I followed the instructions for integrating JIG & Social Gallery. I also tried choosing the ‘Social Gallery’ lightbox type, but it does not change anything.

Is there anything else that I forgot ? More information I could dig up to better express the situation ?

Also, why does JIG insist on such a huge margin between my text and the gallery I inserted right under it ?

Thanks in advance for any hints – I’m a bit lost…

Problem solved: the ‘Social Sharing Toolkit’ plugin was incompatible with ‘Social Gallery’.

So my secondary question still stands: why does JIG insist on such a huge margin between my text and the gallery I inserted right under it ? Example here.

Ok on the first.

On the second: I checked and it’s come kind of CSS bug, not sure why it happens but this will likely solve it:
#jig1.justified-image-grid {
    clear: none !important;
}

Add it to the Custom CSS setting on the General tab of JIG. It’ll be pretty close to the text after this.

@Firsh

How can I default the images to desaturated and then have them fade to saturated during hover? I have not been able to achieve this somehow with the shortcode builder. Please assist.

Set special effect behavior setting to ‘others’ instead of ‘hovered’.

Hi, I want to be able to display recent blog posts in a sidebar from other sites that have joined up to my news network via an RSS Feed with the featured image and title automatically showing. Can this plugin do this at all? I’ll need to install the plugin on every site joined up to the network so that every site is advertising one another. Provide em with as much information as possible. Thanks.

If the RSS output is set up in a way that it displays the blog posts’ images then yes. Most likely it does. If you can send me a sample RSS feed URL I can tell you. Seems like you have a good idea. You can combine multiple feeds together by the way.

Hello,

I installed JIG and have the newest version of social gallery installed too.

But when I choose “Social Gallery” in “Lightboxes” – settings, there is no social-gallery-lightbox. It opens just die image directly.

http://www.photoroi.com/portfolio/michaela-t-01042012/

Kind regards,

Klaus

Hello,

sent you the mail from your profile.

Kind regards,

Klaus

Okay I’ll send that to you.

I sent it. If it still doesn’t work then a JS error is breaking other scripts such as lightboxes from execution on the page. Please try the other free built in lightboxes to see if any of them is not working (prettyphoto, colorbox).

I see these errors:

SyntaxError: syntax error <!DOCTYPE html> ?ver=1.10.2 (line 1)

Error: useless setTimeout call (missing quotes around argument?) ...ntage);},_scrollReflowContent:function(){var self=this,o=this.options,el=this.el… ?f=wp-...-min.js (line 165)

The latter is more interesting as it’s a BWP minify call that puts together all your scripts. Some plugins or JS scripts may not be compatible with this. Anyhow, in order to possibly remove this JS error you’d need to disable BWP minify plugin to have JS files load separately. That alone may fix the problem, but if it doesn’t at least we can tell which file has that “useless setTimeout call”.

by
by
by
by
by
by

Tell us what you think!

We'd like to ask you a few questions to help improve CodeCanyon.

Sure, take me to the survey