> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://doc.ecomx.co/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Blum Content Collage

# About Content Collage Section

The Content Collage section is a versatile display tool that allows you to create engaging visual arrangements on your website. It enables the combination of different content types, including collections, products, and custom headings, ideal for:

* Showcasing featured products
* Highlighting new collections
* Creating visual story narratives
* Promoting seasonal campaigns
* Building brand-focused displays

The section stands out for its ability to display multiple content types in a single, cohesive layout while maintaining full customization control for both item sizing and positioning.

[![](https://saleshunterthemes-3030d0343deb.intercom-attachments-1.com/i/o/h9w3pjg7/1902807891/a71e95368bead2d64bb708081db0/AD_4nXdA6klX7tPuhlkNO2luIp_ibgr4Mn7S7Cpn5J5DsSBNDrkQElJ-BVVZvAWNqGH2nfJ4GyL3GW14D-Ch_FIfGZC5-TH1X5P-d1vAyHfqr-b8qo2JliebTZcZbHD8Ctkt40YkeyhegszGm-7dK-fsueaL-SPmei.png?expires=1792401300&signature=5faa442947b9408d35e93ebb3c126f36f54e60cb6893babd2f53cb7d1926292d&req=dSknFMF%2BmolWWPMW1HO4zQacPaWBhheFm%2FGzVs9yr89XWACdrwwNpLQ81C11%0A9vIFLlL%2BRiH%2FzyPnBPE%3D%0A)](https://storage.crisp.chat/users/helpdesk/website/-/3/8/a/0/38a07bc4b14bb400/6eeca10a-5601-46e1-b810-283917_40eyb.png)

# How to Access Content Collage Section

* In your Shopify Admin, go to Online Store > Themes > Customize.
* In the sidebar from any page in your Normcore Admin Dashboard, click the "Add section" button
* Search for "Content Collage" and click to add it to your page.

[![](https://saleshunterthemes-3030d0343deb.intercom-attachments-1.com/i/o/h9w3pjg7/1902807910/d7fbc4b5a609695e4c3e9a24755d/AD_4nXcpqG-KAnsU959_5FNTo81pZSYLCQFNrgZ2qVfYKSlf-65fYHlfV5jzMg_nntXbbAjMKieFecp0an_MROQ75Gnxvc9cQuJyedK-avuF-qVtIgorrMEYGyfaCDJIEllwrSUkeyhegszGm-7dK-fsueaL-SPmei.png?expires=1792401300&signature=05531e200aa321ff970a06c3a11e86ec81dc4ead65dee906fb30572e866b5229&req=dSknFMF%2BmoheWfMW1HO4zeJov9GwZnBcYsiTazsLkL2PCP9TSikQrKnbungK%0ASCobv%2BtKsR0w%2BiOvgJI%3D%0A)](https://storage.crisp.chat/users/helpdesk/website/-/7/d/9/e/7d9e36585992c400/dffba10d-a7fe-4e50-9e1d-20b449_1ff6s26.png)

After adding the Content Collage section, customize its appearance and functionality using the available settings.

| Setting | What it is & How it helps |
| --- | --- |
| Color scheme | Controls the background and text colors for the entire section. Use this to make the section pop or blend in with your store's branding​. |
| Section heading/subheading | Adds a title and a smaller subtitle above the collage. This is perfect for introducing a "New Arrivals" or "Summer Sale" collection​. |
| Collage width | Choose between Wide (full screen) or Compacted (contained within margins). Compacted is often better for a cleaner, more focused look​. |
| Items ordering | Controls the grid layout. Main item first makes the first block larger, while Equal gives all items the same size​. |
| Remove padding top/bottom | Toggles that eliminate the space above or below the section. Use these if you want two sections to touch without any gap​. |
| Enable content max-width | Ensures your collage doesn't stretch too wide on very large monitors, maintaining a professional look |

# How to Configure Content Collage Section

Each Content Collage section setting includes:

* General Settings
* Layout
* Items
* Prominent Badge
* Blocks

You can see these options in the section menu:

To begin customizing, click the "**Content Collage**" section to access its settings.

[![](https://saleshunterthemes-3030d0343deb.intercom-attachments-1.com/i/o/h9w3pjg7/1902807931/6c487d62925f3929f2dd330e56c7/BLUM-CONTENT-COLLAGE.png?expires=1792401300&signature=e1fd2ea890f53aa07f642d8e120c4e8dd3a690f13c0815ecfa1457459ee561a2&req=dSknFMF%2BmohcWPMW1HO4zb0raY%2FwkEmFGobRDAdFm0uC8qjdGx6Sq0NtHmzH%0AxahOm6hb8j%2FvczbKw%2FU%3D%0A)](https://storage.crisp.chat/users/helpdesk/website/-/7/a/6/b/7a6bcd45badd7800/f81de287-5ce6-4c9e-a495-2df30c_z2uueu.png)

## General

Within the General settings, you can:

* Change the color scheme
* Add Section subheading
* Add Section heading
* Add Section description

## Layout

In the Layout settings, you can adjust:

* Collage width on desktop (options: Wide or Compacted): _Wide stretches the collage edge-to-edge; Compacted adds breathing room on the sides. Use Compacted for a more refined look on desktop._

* Content alignment (options: Left or Center)
* Items ordering (dropdown with Equal, Main item first or main item last): _Controls the grid layout and visual hierarchy. "Main item first" draws attention to your lead product or collection._
* Enable stacked layout. (Not applicable with equal ordering)
* Remove padding top
* Remove padding bottom

## Items

For Items settings, you can configure:

* Image ratio (options: Square or Portrait). Not applicable if full-width is enabled full-width
* Show item button: It shows all buttons on each block. Links are still available without the button. This is a Toggle ON/OFF to display a visible "Call-to-Action" button on each block. When ON, buttons like "View Product" or "Shop Collection" are always visible. When OFF, the link still works but buttons aren't shown—cleaner look.

## Prominent Badge

The Prominent Badge is a small, decorative element that highlights important information like "New," "Sale," or "Hot Item."

The Prominent Badge of this section has the same setting as the [Icon With Text section](https://docs.saleshunterthemes.com/manual/blum-icon-with-text/%23edit-prominent-badge).

* Text: Enter the badge text (e.g., "New," "Sale," "Limited Edition").
* Hide badge if empty: Toggle ON/OFF. When ON, the badge only shows if text is entered.
* Accent scheme: Choose Main (matches your brand primary color) or Extra (uses an accent color).
* Position: Choose Left or Right to position the badge on the block.
* Shape: Choose from Star, Flower, Diamond, Circle, Square, and other preset shapes.

# How to Configure Content Collage Block

You can add up to 3 blocks to your collage:

* Product Block: Features a single product with its title and price. You can also show the product rating.
* Collection Block: Highlights a specific collection and can display the number of products inside.
* Image Block: (Formerly Heading Block) Allows you to upload a custom image with a text overlay and a call-to-action button. Use this for storytelling or promotional banners

[![](https://saleshunterthemes-3030d0343deb.intercom-attachments-1.com/i/o/h9w3pjg7/1902807952/6dffc07845a773478224963f3abf/AD_4nXdU40x5dUKCmRstl6PuluGlKbcxMv1VT0TZF9TzRnJzboaBkGodYnNCwUDPN-pvN_bADGgzwJdPdUS0b_btTjvmcdCvqFnJz5N1_lNG4GqYa5QxpcTQetUPbFJJsE3DaQkeyhegszGm-7dK-fsueaL-SPmei.png?expires=1792401300&signature=3b3fadcaafe8512d5757dcb77421ce1b94c9ac9ee0914b10e26e0cb0479a54af&req=dSknFMF%2BmohaW%2FMW1HO4zWTqRCkmNfUU2vh918I5HnK1QVrvCZOun6tLGwLn%0A0%2FPry3rOIL27nse%2FBPk%3D%0A)](https://storage.crisp.chat/users/helpdesk/website/-/1/1/a/0/11a0f85ed432bb00/eb85bcda-bb80-4893-9885-8ec3f6_x31x4d.png)

## Product Block

When adding a Product block, click on the block to customize its appearance:

Within the Product block settings, you can:

* **Select a specific product** – Choose which product to showcase
* **Show/hide rating** – Toggle the star rating on/off (configure rating visibility in Theme Settings > Product Information)
* **Adjust mask overlay opacity** – Control how dark/light the overlay is (0-100%)
* **Customize mask overlay color** – Choose the color that darkens the product image
* **Set text overlay color** – Choose the color for the product title and price text
* **Configure star rating color** – If ratings are shown, set their color

The mask overlay setting overrides the collage item mask overlay, while the text overlay setting overrides the collage item text overlay.

## Collection Block

When adding a Collection block, you can:

* **Select a specific collection** – Choose which collection to highlight
* **Enable option to show number of products** – Toggle to display "15 products" or similar text
* **Adjust mask overlay opacity** – Control overlay darkness
* **Customize mask overlay color** – Choose overlay color
* **Set text overlay color** – Choose color for collection name text

## Image Block

For the Image block, you can:

* **Upload a custom image** – Choose any image from your media library
* **Adjust mask overlay opacity** – Control how dark the overlay is
* **Customize mask overlay and text overlay colors** – Set colors for the image and text
* **Set up heading text** – Add a headline in the "Content" tab (e.g., "Summer Sale")
* **Configure button text and button link** – Add button label (e.g., "Shop Now") and where it links to in the "Button" tab

# Common Cases and FAQs

**1. How to create a visually balanced collage?**

For the most visually appealing collage, use images with similar color tones or themes. When using the "Equal" layout, select images with similar aspect ratios for consistent sizing.

**2. When should I use a stacked layout?**

Use a stacked layout when:

* You want one item to stand out as the focal point
* You're mixing different content types (products, collections, images)
* Your store design benefits from asymmetrical arrangements (modern, trendy aesthetic)

**3. How should I customize overlay colors for better readability?**

Adjust mask overlay opacity to ensure text remains readable against your background images. Use contrasting text colors against your overlay to improve visibility. For example, use white text (#FFFFFF) on dark overlays and dark text on light overlays.  
​