Mosaic2 Setup

How to setup nanogallery2 for Mosaic2 example

Add new custom Field:

    "Mosaic2": {
        "type": "string",
        "placeholder": "Gallery name",
        "label": "Mosaic2"
    }

At Custom fields parser:

<div id="Mosaic" data-nanogallery2='{
  "kind": "nano_photos_provider2",
  "dataProvider":   "bl-plugins/nano_photos/nano_photos_provider2.php",
      "album": "{{ value }}",
      "galleryMosaic" :   [
        { "w": 16, "h": 18, "c": 1,  "r": 1  },
        { "w": 8,  "h": 9,  "c": 21, "r": 5  },
        { "w": 4,  "h": 6,  "c": 28, "r": 2  },
        { "w": 4,  "h": 6,  "c": 19, "r": 11 },
        { "w": 6,  "h": 8,  "c": 27, "r": 10 }
      ],
      "galleryMosaicXS" : [
         { "w": 6, "h": 9, "c": 1,  "r": 1  },
         { "w": 4,  "h": 4,  "c": 9, "r": 3  },
         { "w": 2,  "h": 3,  "c": 12, "r": 1  },
         { "w": 2,  "h": 3,  "c": 8, "r": 5 },
         { "w": 3,  "h": 4,  "c": 12, "r": 6 }
      ],
      "galleryMosaicSM" : [
         { "w": 6, "h": 9, "c": 1,  "r": 1  },
         { "w": 4,  "h": 4,  "c": 9, "r": 3  },
         { "w": 2,  "h": 3,  "c": 12, "r": 1  },
         { "w": 2,  "h": 3,  "c": 8, "r": 5 },
         { "w": 3,  "h": 4,  "c": 12, "r": 6 }
      ],
      "galleryMaxRows": 1,
      "galleryDisplayMode": "rows",
      "gallerySorting": "random",
      "thumbnailDisplayOrder": "random",
      "thumbnailAlignment": "scaled",
      "thumbnailHeight": "100",
      "thumbnailWidth": "100",
      "thumbnailGutterWidth": "0",
      "thumbnailGutterHeight": "0",
      "thumbnailBorderHorizontal": "0",
      "thumbnailBorderVertical": "0",
      "thumbnailToolbarImage": null,
      "thumbnailToolbarAlbum": null,
      "thumbnailLabel": { "display": false },
      "thumbnailDisplayTransition": "scaleUp",
      "thumbnailDisplayInterval": "30",
       "thumbnailHoverEffect2": "image_scale_1.00_1.15_500_bounce|image_rotateZ_0deg_05deg",
       "touchAnimation": true,
       "touchAutoOpenDelay": "500",
       "viewerToolbar": { "display": true, "standard": "label", "minimized": "label" },
       "viewerTools": {"topLeft": "", "topRight":  "rotateLeft, rotateRight, fullscreenButton, closeButton"},
       "locationHash": "false",
        "album": "{{ value }}"
    }'></div>

Your Reaction to this Post?

Currently there are no comments, so be the first!