> For the complete documentation index, see [llms.txt](https://docs.scaleflex.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.scaleflex.com/portals/building-a-portal/sections/moodboard.md).

# Moodboard

Show a collection as a wall of images that visitors search and explore.

A **Moodboard** section turns a set of images from your asset library into something a visitor explores rather than scrolls past. The images are pulled live from the DAM, the same way a [Gallery](/portals/building-a-portal/sections/gallery.md) pulls them — but they are laid out as a wall of prints. Hovering one lifts and enlarges it; typing in the search re-ranks the whole wall around the words used.

Reach for it where the point is the character of a collection rather than finding one particular file — a campaign's photography, a season's imagery, the opening of a brand portal.

## Add a moodboard

1. In the builder, open the **Sections** panel and select **Add section**.
2. Choose **Moodboard**, pick a variant, and select **Add section**.
3. With the section selected on the canvas, use **Connect source** to choose which images it shows.

A new moodboard arrives already connected to your project's asset library — images only, newest first, a hundred of them — so it has something to show while you set it up.

## The two variants

| Variant                 | What it does                                                                                                                                              |
| ----------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **A — Scattered wall**  | Images fill the stage like pinned prints. A search gathers the matches together in the middle of the wall and fades the rest.                             |
| **B — Infinite canvas** | The wall never ends — drag it in any direction and it keeps going. A search flies the matches to you and dims the rest; clearing it lets them drift back. |

Switch between them from the section's toolbar, as with any other section.

## Connect source

**Connect source** opens the connect dialog, locked to images. From it you choose:

| Setting    | What it does                                            |
| ---------- | ------------------------------------------------------- |
| **Source** | The collection, folder or label the images come from.   |
| **Limit**  | How many images to load — 50, 100, 150, 200 or 300.     |
| **Sort**   | The order they load in — newest first on a new section. |

Until a source is set, the section reads **Connect a collection, folder or label with “Connect source”.** If the source matches nothing, it reads **No images match this source yet — adjust it with “Connect source”.**

{% hint style="info" %}
A moodboard shows at most **300** images on a computer and **60** on a phone, whatever the limit is set to. It is a wall to browse, not a catalogue to search exhaustively — for that, use a [Gallery](/portals/building-a-portal/sections/gallery.md).
{% endhint %}

## Search

The **Search** button on the section's toolbar holds the two settings that decide how the wall responds to what a visitor types.

### Search mode

| Mode                | What it does                                                                                                    |
| ------------------- | --------------------------------------------------------------------------------------------------------------- |
| **Keyword ranking** | Instant, in the browser — matches names, tags and metadata.                                                     |
| **AI search**       | Ranks by meaning through Scaleflex AI search. Falls back to keyword ranking when the library does not allow it. |

The fallback is silent: if AI search is unavailable the wall goes on ranking by keyword and the visitor sees no error.

### Suggestions under the search

The words offered under the search box, to show a visitor what the collection is about.

| Option        | What it does                                                     |
| ------------- | ---------------------------------------------------------------- |
| **Automatic** | The most frequent tags and metadata values of the loaded images. |
| **Custom**    | Your own words, shown in this order.                             |
| **Hidden**    | Only the search field, no suggestions.                           |

With **Custom**, build the list yourself — **Pick from the collection's words or type your own** — and **Clear all** empties it.

## What a visitor can do

The search box reads **Type to rank the collection**, and the wall responds on every keystroke rather than on a button.

Hovering a print — or tapping it, on a touch screen — lifts it, enlarges it, and brings up its actions:

| Action           | What it does                                                   |
| ---------------- | -------------------------------------------------------------- |
| **Preview**      | Opens the image, with the rest of the results to page through. |
| **Download**     | Downloads it, in the size or format you pick.                  |
| **Add to cart**  | Puts it in the Portal's download cart.                         |
| **File details** | Shows the image's name, size and metadata.                     |

**About this wall** opens the section's title and intro over the wall; **Hide description** closes it again.

### On the infinite canvas

Variant B adds the canvas itself. A visitor clicks or taps the wall to take hold of it, then drags to pan, pinches or holds ⌘/Ctrl and scrolls to zoom, and has **Zoom in**, **Zoom out** and **Reset view** to hand. Clicking a print zooms it to fill the stage; **Back to the wall** or `Esc` returns.

Leaving is deliberate, so the canvas never traps the page: **Done exploring** or `Esc` hands the page back, and scrolling steadily down does too — the canvas says **Keep scrolling to leave the canvas** while you do.

{% hint style="info" %}
**Download** and **Add to cart** are always offered on a moodboard — unlike a gallery, it has no switch to turn them off. The cart is the Portal's one download cart, so a visitor can fill it from a moodboard and a gallery on the same page.
{% endhint %}