Dynamic placeholders inSitecore XM Cloud with Next.jsare used when a rendering can have multiple instances on a page, each needing auniqueplaceholder name to avoid conflicts.

To configure a rendering withdynamic placeholders, the following steps are required:

(A) Include theIDynamicPlaceholderbase template in the Rendering Parameters template

Sitecore provides theIDynamicPlaceholderbase template to enable dynamic placeholders.

When definingRendering Parameters, this template must beincludedto allow dynamic placeholder configuration.

This ensures Sitecore recognizes the placeholders as dynamic rather than static.

(B) Link the placeholder settings item to the rendering item

In Sitecore,placeholder settingsdefine the allowed components for a placeholder.

The rendering item should reference aPlaceholder Settings item, ensuring that only the allowed components can be added dynamically.

This step is crucial to avoid runtime issues when rendering dynamic placeholders.

(C) Define the placeholder key using a question mark (?) in the placeholder settings item → Incorrect

Placeholder settingsdo notuse a question mark (?) to define a dynamic placeholder key.

The?syntax was used in older Sitecore versions for dynamic placeholders, but inXM Cloud with Next.js, placeholders are handled differently usingGUID-based namingfor uniqueness.

(D) In the component TSX file, set a unique placeholder key value that has not yet been defined → Incorrect

Next.jsdoes not requiremanually setting a unique key.

Instead, Sitecoreautomatically generatesa unique key for each dynamic placeholder instance usingGUID-based naming.

In aNext.js JSS component, placeholders are defined using:

✅Correct Answers:❌Incorrect Answers:How Dynamic Placeholders Work in XM Cloud with Next.js:import { Placeholder } from '@sitecore-jss/sitecore-jss-nextjs';

const DynamicComponent = ({ rendering }) => {

return (

);

};

export default DynamicComponent;

The{rendering.uid}ensures each placeholder instance has aunique name, avoiding conflicts.

Sitecore XM Cloud Dynamic Placeholders– Using Dynamic Placeholders

Next.js with Sitecore JSS– Placeholder Configuration

Sitecore Headless Development– Best Practices for Rendering Placeholders

References:1.