Resize your browser or turn your device to see the responsive gallery in action
- <a href="https://justifiedgrid.com/wp-content/gallery/life/people/103763447.jpg" title="with soft light coming from the background - Woman, Sexy">
Hair and shoulder of a model
with soft light coming from the background - Woman, Sexy - <a href="https://justifiedgrid.com/wp-content/gallery/life/people/122290774.jpg" title="bedroom fashion portrait - Woman, Lingerie, Fashion, Sexy">
Brunette girl
bedroom fashion portrait - Woman, Lingerie, Fashion, Sexy - <a href="https://justifiedgrid.com/wp-content/gallery/life/people/129230165.jpg" title="could be coffee or just tea - Woman">
Girl with her hot cup
could be coffee or just tea - Woman - <a href="https://justifiedgrid.com/wp-content/gallery/life/people/129551231.jpg" title="romantic kiss in sunshine - Woman, Couple, Kiss, Man">
Couple in love
romantic kiss in sunshine - Woman, Couple, Kiss, Man - <a href="https://justifiedgrid.com/wp-content/gallery/life/people/144938992.jpg" title="she reminds me of Hanna from Pretty Little Liars - Woman">
Woman with a playful smile
she reminds me of Hanna from Pretty Little Liars - Woman - <a href="https://justifiedgrid.com/wp-content/gallery/life/people/165191600.jpg" title="on the beach in the hot sun - Woman, Bikini, Fashion, Sexy">
Young woman in red
on the beach in the hot sun - Woman, Bikini, Fashion, Sexy - <a href="https://justifiedgrid.com/wp-content/gallery/life/people/166193831.jpg" title="at sunset among the islands of the Philippines - Woman">
Woman traveling by boat
at sunset among the islands of the Philippines - Woman
The above example uses the following, generated shortcode (how to use):[$justified_image_grid preset=5 row_height=225 height_deviation=50 ng_pics=255,268,278,280,300,429,430]
What does responsive gallery mean? Do I need one? Is it important?
Discover an entire a gallery on a mobile device without panning around or pinch zooming. This is achieved by adjusting the content to your screen's width. You need a responsive gallery to show content on all devices nicely - without compromise.
- It means your galleries will look good and resized proportionally on all devices and resolutions.
- A native app look can easily be achieved so your visitors will have a good time and find it easy to view.
- This responsive gallery will fit to the width that is available for it, controlled by your theme.
- How much gets cropped from the thumbnails depends on your preferences.
- Having dynamic row height with a generous height deviation reduces cropping.
- A quick setting enables you to turn off any cropping whatsoever.
- If your site is not responsive this adaptation doesn't happen.
- Read more about responsive web design on Wikipedia.
How does it work in tabs?
Justified Image Grid has excellent tabs support. Instances in tabs communicate with their hidden neighbors. Galleries in initially hidden tabs also follow the responsive gallery concept as you'd expect. It has been tested in various tab solutions including theme shortcodes.
- <a href="https://justifiedgrid.com/wp-content/gallery/life/animals/124414684.jpg" title="of an Arabian bay horse - Horse">
The beautiful eye
of an Arabian bay horse - Horse - <a href="https://justifiedgrid.com/wp-content/gallery/life/animals/136615955.jpg" title="together at sunset in summer - Dog, Horse">
Red border collie and horse
together at sunset in summer - Dog, Horse - <a href="https://justifiedgrid.com/wp-content/gallery/life/animals/148131185.jpg" title="young rider on her horse in the evening - Woman, Horse, Human Animal Connection">
Horseback ride
young rider on her horse in the evening - Woman, Horse, Human Animal Connection - <a href="https://justifiedgrid.com/wp-content/gallery/life/animals/176829317.jpg" title="infinitely complex relations to other organic beings and to external nature - Horse">
Portrait of a brown horse
infinitely complex relations to other organic beings and to external nature - Horse - <a href="https://justifiedgrid.com/wp-content/gallery/life/animals/176982827.jpg" title="in the field on a sunny summer day - Child, Girl, Horse, Human Animal Connection">
Girl in jockey boots caressing her pony
in the field on a sunny summer day - Child, Girl, Horse, Human Animal Connection - <a href="https://justifiedgrid.com/wp-content/gallery/life/animals/184137740.jpg" title="in black on horseback - Woman, Horse, Human Animal Connection">
Portrait of a beautiful girl
in black on horseback - Woman, Horse, Human Animal Connection - <a href="https://justifiedgrid.com/wp-content/gallery/life/animals/64158199.jpg" title="looks into the eye of a white horse - Woman, Horse, Human Animal Connection">
Young girl
looks into the eye of a white horse - Woman, Horse, Human Animal Connection - <a href="https://justifiedgrid.com/wp-content/gallery/life/animals/81400378.jpg" title="with her bay horse - Woman, Horse, Human Animal Connection">
Young girl on a ranch
with her bay horse - Woman, Horse, Human Animal Connection
- <a href="https://justifiedgrid.com/wp-content/gallery/life/animals/136615955.jpg" title="together at sunset in summer - Dog, Horse">
Red border collie and horse
together at sunset in summer - Dog, Horse - <a href="https://justifiedgrid.com/wp-content/gallery/life/animals/103149680.jpg" title="as they sit in a meadow looking at the scenery - Woman, Dog, Human Animal Connection">
Young woman hugs her dog
as they sit in a meadow looking at the scenery - Woman, Dog, Human Animal Connection - <a href="https://justifiedgrid.com/wp-content/gallery/life/animals/158966063.jpg" title="in a green field with wild flowers - Woman, Dog, Human Animal Connection">
Happy young girl with Beagle
in a green field with wild flowers - Woman, Dog, Human Animal Connection - <a href="https://justifiedgrid.com/wp-content/gallery/life/animals/168763262.jpg" title="in hospital, heart-warming - Woman, Dog, Human Animal Connection">
Dog visits young woman
in hospital, heart-warming - Woman, Dog, Human Animal Connection - <a href="https://justifiedgrid.com/wp-content/gallery/life/animals/169018520.jpg" title="sitting with a girl in an autumn scene - Woman, Dog, Human Animal Connection">
Golden retriever
sitting with a girl in an autumn scene - Woman, Dog, Human Animal Connection - <a href="https://justifiedgrid.com/wp-content/gallery/life/animals/179815028.jpg" title="portrait of three friends - Cat, Child, Dog, Girl, Human Animal Connection">
Child hugging a cat and a dog
portrait of three friends - Cat, Child, Dog, Girl, Human Animal Connection
- <a href="https://justifiedgrid.com/wp-content/gallery/life/animals/153362015.jpg" title="young girl gazes at cat - Cat, Child, Girl, Human Animal Connection">
Mind reading
young girl gazes at cat - Cat, Child, Girl, Human Animal Connection - <a href="https://justifiedgrid.com/wp-content/gallery/life/animals/104558888.jpg" title="curled up sleeping, close-up - Cat">
Peaceful orange red tabby
curled up sleeping, close-up - Cat - <a href="https://justifiedgrid.com/wp-content/gallery/life/animals/144532799.jpg" title="of the small kitten with child resting on a soft sofa - Cat, Child, Girl, Human Animal Connection, White">
That facial expression
of the small kitten with child resting on a soft sofa - Cat, Child, Girl, Human Animal Connection, White - <a href="https://justifiedgrid.com/wp-content/gallery/life/animals/144532802.jpg" title="with small kitten - Cat, Child, Girl, Human Animal Connection, Red">
Adorable child
with small kitten - Cat, Child, Girl, Human Animal Connection, Red - <a href="https://justifiedgrid.com/wp-content/gallery/life/animals/153362027.jpg" title="on a cat, performed by little girl - Cat, Child, Girl, Human Animal Connection, Orange">
Professional whisker adjustment
on a cat, performed by little girl - Cat, Child, Girl, Human Animal Connection, Orange - <a href="https://justifiedgrid.com/wp-content/gallery/life/animals/154696313.jpg" title="as she sleeps - Woman, Cat, Human Animal Connection">
Young girl hugs cat
as she sleeps - Woman, Cat, Human Animal Connection - <a href="https://justifiedgrid.com/wp-content/gallery/life/animals/165066023.jpg" title="cheerful portrait of their friendship - Cat, Human Animal Connection, Man">
Smiling man with cat
cheerful portrait of their friendship - Cat, Human Animal Connection, Man - <a href="https://justifiedgrid.com/wp-content/gallery/life/animals/179815028.jpg" title="portrait of three friends - Cat, Child, Dog, Girl, Human Animal Connection">
Child hugging a cat and a dog
portrait of three friends - Cat, Child, Dog, Girl, Human Animal Connection - <a href="https://justifiedgrid.com/wp-content/gallery/life/animals/179977856.jpg" title="and hugging her cat - Cat, Child, Girl, Human Animal Connection">
Little girl smiling
and hugging her cat - Cat, Child, Girl, Human Animal Connection - <a href="https://justifiedgrid.com/wp-content/gallery/life/animals/89335327.jpg" title="and a white pillow - Woman, Cat, Human Animal Connection">
Girl with cat
and a white pillow - Woman, Cat, Human Animal Connection
The above example uses the following, generated shortcode (how to use):[$justified_image_grid last_row=hide ng_tags_gallery=horse]
What mobile specific settings are available?
Several settings with the most important visual impact have a mobile counterpart. Desktop compositions may not look the same on mobiles and it makes sense to fine tune them for small screens. Mobile devices lack a mouse, therefore roll over animations are less useful - a setting can disable every mouse controlled animation for mobile devices.
- Change the row heights to serve thumbnails at a different size.
- Use a different lightbox, or none at all because images are well-displayed anyway.
- Single tap may act as mouse over but you can disable any mouse controlled interaction.
- Display captions on thumbnails differently.
- Apply color overlays and icon on thumbnails in another way.
- Generate special effects like desaturation without mouse interaction.
- In other words show all the bells and whistles on desktop but show a lighter version on mobile devices.
- Disable retina ready, high resolution thumbnails or change their quality.
- Different load more behavior.
- Have something else in mind? Change just about ANY setting exclusively for mobiles, using presets. Serve a bespoke look to devices.