Carousel with Expanding Links

Make your homepage modern with a website-like, full-width slider and quick links.

Immersive mode (where carousel image fuses with the top navigation)
(available Dec 29, 2025)
immersive mode

Setting up the web part

On the page where you need the web part, add a Full-Width section:

Then add this web part:

Adding a news post

In web part properties, click the Add/Remove News Posts button
image

When you add at least 2 news posts, the carousel will rotate them but you can turn auto rotation off
image

You can populate news titles and links to pages either in SharePoint or elsewhere

If you’d like to use the currently logged-in user name anywhere in your Title or Description, type in

  • {firstname} to show current user’s first name
  • {lastname} to the last name
  • {fullname} to show the full name
Adding/ removing quick links

You can choose quick links that will show under the news posts.
For that, open the web part properties and click Add/Remove Quick Links button:
image

Here you can add links, update display order and more:

Updating carousel styles

You can change a number of style options for your carousel, including the color of the panel where quick links appear and the color of the links.
Here are all of the available options:

The Color Settings

The Font Settings

You can also change the height of the whole carousel:
image

If the image you’re using for the carousel is too bright for the text to be seen properly, you can add a tint with this option:
image
It’ll make the image a bit darker without you having to edit it.

If you’d like to hide links panel, you can do that by toggling this option:
image

Immersive mode

Immersive mode lets you expand your carousel image all the way to Origami Top Navigation creating beautiful magazine-like page cover.
As slides rotate, they will seamlessly rotate in your Origami Top Navigation as well.

.

Prerequisites needed to make this work:

  • You need to use Origami Top Navigation (this effect doesn’t work with out of the box SharePoint navigation)
  • Turn off SharePoint out-of-the-box navigation, so it doesn’t interrupt the page flow.
  • Have Carousel with Expanding Links version dated at least Dec 29, 2025

Set up Immersive Mode

  • Go to your Carousel web part properties and turn on Immersive mode as shown below
  • Pick a color for your top navigation menu items so they look visible over your carousel images (we recommend white for most images). This color will override color setting in Origami Top Navigation.
  • You can also optionally change the logo that is used in Immersive mode, for example while logo on transparent background PNG will look better on images:

    Here is how to upload alt logo in web part properties:

NOTE: As soon as the user scrolls down the page even a little bit, the Origami Top Navigation color and default logo settings will used so navigation retains prominence:

NOTE: As author or someone who can edit the page, you will still be able to see Microsoft page author tools. This is not an error. Users who have read-only permissions will not see this toolbar.

What image resolution is best for carousel images?

See this guidance on what images are best for the carousel: Why images in carousels look different depending on screen resolution?