makfak supports this item


Popular questions for this item

How do I create a gallery?

If you’re used standard WP galleries:
  1. edit or create a post
  2. click the “Add Media” icon (above the text editor)
  3. upload the images that you want to appear in your gallery
  4. if you edited any of the info about your images – click “Save All Changes”
  5. close the “Add media” window
  6. add [photomosaic] to your post and your gallery will appear in that spot
If you’re using NextGen Galleries:
  1. go to Gallery > Add Gallery / Images
  2. select the “Add new gallery” tab
  3. create your gallery
  4. select the “Upload Images” tab (if you weren’t taken there automatically)
  5. select the images you want to upload and the select the gallery you want them added to
  6. go to Gallery > Manage Gallery and note the ID of your new gallery
  7. go to the post where you want to insert your gallery and add [photomosaic nggid="*"] (replacing the * with your gallery’s ID)

How do I put multiple mosaics on the same page (without using NextGen)?

Simply point PhotoMosaic at another post that has attached images:

[photomosaic id="1"]
[photomosaic id="2"]
[photomosaic id="3"]

If you’re running WPv3.5 you can use the Create Gallery flow to create a list of IDS that you can then give to PhotoMosaic:

-- Create Gallery generates this --
[gallery ids="1,2,3,4,5,6"]

-- replace 'gallery' with 'photomosaic' --
[photomosaic ids="1,2,3,4,5,6"]

You can do this as many times as you like on any page.

How do I reprocess my thumbnails?

If you’re using NextGen…

  1. go to the Options page (Gallery > Options)
  2. select the Thumbnails tab (at top of the page)
  3. I found these settings worked great:
  • Width x Height : 300×300
  • Set Fixed Dimension : unchecked
  • Thumbnail Quality : 100

If you’re using Wordpress’s Galleries…

  1. go to Settings > Media and adjust your Image Sizes (PhotoMosaic uses the Medium image size)
  2. I found these settings worked great:
  • 150×150 (checked)
  • 300×300
  • 1024×1024

Once you’ve changed your settings, you need to get WP to make new images. I recommend a plugin called “Regenerate Thumbnails”. It adds “Regenerate Thumbnails” options to the Media Library and creates a new Tool. It automatically regenerates images for every size (not just thumbnails).

How, in the mosaic, do I show the image caption on hover?

This can be accomplished by making two changes to the settings in your PhotoMosaic Admin > Global Settings.

Set onReady Callback to…

function($, $mosaic, $items){
    $items.each(function () {
        var $a = $(this);
        var $img = $a.find('img');
        var caption = $img.attr('title');
        if (caption) {
            var $caption_wrapper = $('<div class="photomosaic-caption-wrapper" />');
            var $caption = $('<div class="photomosaic-caption" />');
            $caption.text( caption );
            $img.attr('title', '');
            $a.attr('title', '');

Set Custom CSS to…

.photomosaic-item .photomosaic-caption-wrapper {
    position: relative;
    display: table;
    padding: 0.5em;
    height: 100%;
    width: 100%;
    box-sizing: border-box;
    font-size: 13px;
    background: rgba(0, 0, 0, 0.6);
    opacity: 0;
    transition: all 0.3s linear 0s;
    transform-origin: center center;

.photomosaic-item .photomosaic-caption {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    color: rgba(255, 255, 255, 0.9);

.photomosaic-item:hover .photomosaic-caption-wrapper {
    opacity: 1;

.photoMosaic .photomosaic-item:hover img {
    opacity: 1;

That should get you up and running. You can, of course, tweak the caption CSS to your liking.

What’s the deal with these “Lightbox Bridges” or “Supported Lightboxes” I’ve seen mentioned?

Some lightboxes aren’t plug-and-play. For the most popular handful of these, PhotoMosaic provides a “Support Plugin” (sometimes called a “bridge). Having, both, the Lightbox Plugin and the Support Plugin installed and activated will get things working.

  1. go to your PhotoMosaic Global Settings (WP-Admin > PhotoMosaic)
  2. scroll down to the Supported Lightbox Plugins table
  3. find the PhotoSwipe row and make sure you’ve installed and activated both the Lightbox and Support plugins (not only will checkmarks appear in each column but a check will also appear in the first column)
    • you can install the Lightbox Plugin directly by clicking the download icon in the “Installed” column and then clicking “Install Now” in the window that opens. You can either activate the plugin during installation or at any point in the future by visiting your WP-Admin > Plugins.
    • clicking the download icon in the Support Plugin’s “Installed” column will download the support plugin to your computer. You can then install it by visiting the WP-Admin > Plugins > Add New page and clicking the “Upload Plugin” button at the top of the page. You can activate this plugin during installation or on the WP-Admin > Plugins page.

I can’t get PhotoMosaic to work with “PhotoSwipe” or “Responsive Lightbox”!

Both are supported via Lightbox Bridges.

Show more

Contact the author

This author provides limited support for this item through this item's comments.

Item support includes:

  • Availability of the author to answer questions
  • Answering technical questions about item’s features
  • Assistance with reported bugs and issues
  • Help with included 3rd party assets

However, item support does not include:

  • Customization services
  • Installation services

View the item support policy