SharePoint Editorial Card helps your content look amazing. It displays information in a single, eye-catching card that instantly draws attention.
For example, you can use an Editorial Card to highlight a featured news article, an employee spotlight, or an upcoming event, such as a Training & development announcement. It works just like one of the tiles in the Hero web part, but you don’t need to use the full Hero layout, just the card itself.
If you want to make an announcement or showcase something important in a simple, stylish way, you can choose the SharePoint Editorial Card web part.
In this article, I will explain what is Editorial card web part in SharePoint and how to use it along with its properties.
SharePoint Editorial Card Web Part
We can use this SharePoint Editorial card web part for highlighting important content or topics like announcements, news, or featured updates, to get noticed. It shows information in a clear and attractive way, making the page look modern and neatly arranged.
Refer to the image below to see how it looks in the SharePoint page:

Add & Configure Editorial Card Web Part in SharePoint Page
Follow the instructions below to add a SharePoint Editorial Card web part to a SharePoint page:
- Edit the specific SharePoint site page where you want to add the editorial card.
- Click on the + icon -> search and add the Editorial card web part.

- Once the card is added, it will appear as shown in the image below. Here, there will be four fields:
- Add section or category name
- Add a headline
- Describe what your story is about
- Learn more

- Once I fill in all the content below, the editorial card will look like the screenshot below:
| Options | Values |
|---|---|
| Add section or category name | Simple navigation, smarter collaboration |
| Add a headline | TSinfo Launches New Intranet Experience! |
| Describe what your story is about | The new SharePoint intranet is now live. Explore your department site, access resources easily, and stay connected with the latest updates. |
| Learn more | Explore more. This acts as a call-to-action button. I described how to use it in the properties section below. |

Next, we will see how to work with its properties.
SharePoint Editorial Card Properties
We can view this web part’s properties by clicking Edit properties.
Layout
There are three different layouts. Such as:
| Layout Options | How it looks |
|---|---|
| Image overlay | ![]() |
| Color block | ![]() |
| Split | ![]() |
Content alignment & Animation
- There are a total of 7 alignment options, such as Align left, Align centre, Align right, etc. You can choose based on your needs.
- Animation helps add depth as you browse the page. You can preview or publish to view animations.

Background
We can set the background colour of the editorial card web part to our choice. Here, under the Background section, there will be three options:
- Background theme color and image: Select the theme color for this editorial web part. You can also change the background image by clicking the Change image button, then choosing a photo from your computer, web browser, stock images, or other available sources.
- Overlay color: A transparent overlay is added to make the text easier to read. If you change its colour or transparency, the text might become hard to see.
- Overlay opacity: You can set the overlay opacity to your needs. You can see the changes once you drag the handle.

Content
Under this Content section, you will find all the header options that you are seeing inside the editorial card, like Preheader, Headline, Description, etc. If you do not want to display any header section, then you can disable it.
Call to action: This is the most essential option, where the user can click a button or icon to navigate directly to the specific web URL to view the event details. This contains the options below:
- Type: Select what type of button you want, like Button, Icon, Text or Entire card.
- Link: Specify the link that you want the user to open to get more details.
- Open link in a new tab: Helps to navigate and open the link in a new tab.
- Display text: Provide the text that you want to display on the button (for example, Explore more). It will take only up to 40 characters.
NOTE:
The button will only appear after the page is published and all the button actions mentioned above have been configured.

These are all about the properties of the Editorial card web part in SharePoint.
I hope you found this article helpful. In this SharePoint tutorial, I have shown you how to use the SharePoint Editorial card web part and its properties with various examples.
Also, you may like some more SharePoint articles:
- Create a New SharePoint List By Creating a Form
- Set Alert Policies in Microsoft Defender Portal
- Create Site Retention Policies in SharePoint
- Set SharePoint Pages Read-Only for Members
- Update SharePoint Columns Without Version Change

Hey! I’m Bijay Kumar, founder of SPGuides.com and a Microsoft Business Applications MVP (Power Automate, Power Apps). I launched this site in 2020 because I truly enjoy working with SharePoint, Power Platform, and SharePoint Framework (SPFx), and wanted to share that passion through step-by-step tutorials, guides, and training videos. My mission is to help you learn these technologies so you can utilize SharePoint, enhance productivity, and potentially build business solutions along the way.


