Skip to main content

Set Up and Configure Mosaic — Masonry Gallery & Cards

Open the Zenpo Mosaic — Masonry Gallery & Cards property pane and work through Data, Content mapping, Card layout, Appearance, and Behavior & motion. The License group is documented on Register the Suite and Start Your Trial.

Shared list rules are on How Zenpo Web Parts Use Your SharePoint Data. One exception applies here: changing the View re-auto-maps bindings, because the view's columns feed the content bindings. Most other list-bound products keep your mappings when only the view changes.

Data​

  1. Choose Data source (list or library).
  2. Choose View. The pane hint is: The View's columns feed the content bindings.
  3. Optionally set Filter by (choice or text column). Accepts a Choice column or a single-line text column. For a text column, the filter tabs come from the column's distinct values: blanks are skipped, case variants are merged, and the tabs are sorted alphabetically. Every distinct value becomes a tab. Filter by also feeds More like this in the details dialog.
  4. Optionally turn on Archives (browse by date). Off by default. Then choose the Archive date column (preset to Modified). See Archives (browse by date).
  5. Set Cache duration (default 5 minutes).

If your Filter by column has more than 20 distinct values, an info note appears in edit mode saying the filter row runs long and fewer categories scan better. Nothing is hidden or blocked. Readers never see the note.

Changing the data source resets the view, card style, and bindings, then re-auto-maps. Changing the view re-auto-maps bindings.

Archives (browse by date)​

When Archives (browse by date) is on, readers get one button in the toolbar next to View order. It opens a panel with All dates at the top, then the years, newest first. Opening a year shows All of followed by the year (for example All of 2014) plus that year's months, newest first. Picking a period filters the grid and closes the panel. All dates clears it.

  • The button is named after the Archive date column's display name and shows the chosen period: Hire Date, then Hire Date: 2014, then Hire Date: June 2014. The name is taken exactly as SharePoint has it. To change it, rename the column in List settings. There is no separate naming setting in the web part.
  • Only years and months that contain items are listed. No item counts are shown.
  • Dates use the site's regional settings (timezone), the same as SharePoint's own list views.
  • The periods follow the bound View's filter. Folders are not counted. The year and month lists do not change when a reader uses the search box or the filter tabs.
  • On a source with more than 5,000 items, the chosen date column must be indexed in List settings or the button does not appear. Past 5,000 items the panel lists every period between the oldest and newest item, and an empty period shows the normal empty state.
  • If Archives cannot answer correctly (for example, the site timezone cannot be read), the button is hidden for that visit. The grid is not emptied and no error is shown. Your setting is kept.

Content mapping​

Slots vary by card style.

Image tiles

  • Title (caption)
  • Image / thumbnail
  • Link (URL column)

Images uploaded directly into a list's Image column render on cards, the same as images referenced from a library.

Content cards

  • Image / thumbnail
  • Header
  • Title
  • Description
  • Footer
  • Link (URL column)

Avatar

  • Avatar / photo
  • Name
  • Subtitle
  • Meta chip
  • Link (URL column)

Card layout​

  • Card style: Content cards (default). Picture or asset libraries seed Image tiles. The third style is Avatar.
  • Content order: Media first (default), Text first, or Compact (title + footer). Content cards only.
  • Round avatars: on by default. Avatar only.
  • Corner radius: 0–24, default 10
  • Card spacing: 4–32, default 16

Appearance​

Color vibe, Accent color (six colors), and Tile size (Comfortable or Compact default). Appearance applies to the web part only. See Appearance Settings: Color Vibe, Accent Color, and Corner Radius.

Behavior and motion​

  • Click behavior: Show details (dialog) (default), Open link — new tab, Open link — same tab, or No action. The pane hint is: "The 'Open link' options go straight to the item's target: the bound Link column when set, otherwise the file or list item itself — never a dead click."
  • Hover effect: None, Lift (default), Zoom, or Zoom + Overlay
  • Zoom amount: 102–115, default 106. Zoom hovers only.
  • Loading mode: Infinite scroll or Paginated (default)
  • Items per batch: 6–48, default 24. Infinite scroll only.
  • Page size: 12, 24 (default), or 48 per page. Paginated only.
  • Pager style: Numbered (default) or Prev / Next
  • Animate on filter (FLIP): on by default
  • Staggered entrance: on by default

Empty state: Nothing matches your filters / Clear the search, switch the filter, or bind a different source in the property pane.

Last updated on