SharePoint Page Checker – browser extension

SharePoint Page Checker – browser extension

SharePoint Page Checker
SharePoint Page Checker
SharePoint Page Checker

SharePoint Page Checker

A comprehensive Chrome extension for intranet authors and site owners to scan SharePoint (and compatible Office 365) pages for broken links, accessibility issues, and performance problems. Designed to help organizations maintain high-quality, compliant, and user-friendly intranet content.

What It Does
SharePoint Page Checker performs a complete scan of any SharePoint page and identifies:

Broken Links: Detects links that are inaccessible, return errors, or are misconfigured (including mailto: links and document links).
Accessibility Issues: Checks for WCAG compliance problems, including missing alt text, non-descriptive links, missing labels, heading structure, and more.
Performance Issues: Flags large images, slow-loading web parts, unoptimized formats, and other optimization opportunities.

How to Use

Navigate to any SharePoint (or compatible) page in your browser.
Click the SharePoint Page Checker extension icon in your toolbar.
Click “Scan Current Page”.
Wait for the scan to complete (typically 10–30 seconds).
Review your overall quality score and detailed results in the extension panel.

Understanding the Results
Overall Quality Score (0–100)

100 points: Perfect page (no issues found)
Deductions:

–5 points per broken link
–10 points per critical accessibility issue
–3 points per important accessibility issue
–2 points per performance warning
–1 point per performance info

 

Summary Dashboard

Total Links: Number of links found on the page
Broken Links: Links with errors or timeouts
Accessibility: Total accessibility issues found
Performance: Total performance issues detected

Link Status Types
Broken Links (Red Section):

HTTP 404: Page doesn’t exist
HTTP 403: Access denied
HTTP 500: Server-side error
TIMEOUT: Link didn’t respond within the configured timeout
ERROR: Network or connection problem
Status badge displayed on each card; clickable URLs for manual verification

Working Links (Green Section):

HTTP 200–299: Link is accessible and working
CORS: Cross-origin link (may still work)
Status badge displayed; clickable URLs for reference

Accessibility Issues
🚨 Critical Issues (Red):

Missing Alt Text on images
Input Without Label (forms)
Empty Headings
Missing Page Title
Missing Language attribute
Button Without Text

⚠️ Important Issues (Orange):

Non-Descriptive Links (“click here”, “read more”, etc.)
Skipped Heading Levels (e.g., H1→H3 without H2)
Table Without Headers
Document/External Links Without New Tab

Each issue includes:

Description of the problem
WCAG guideline reference
💡 Recommended fix
Hover to highlight the element on the page

Performance Issues
⚡ Performance Warnings (Orange):

Oversized Images: Images with excessive dimensions (shows actual vs. display size, wasted pixels, filename, and “View Image” link)
Large Image Files: Images estimated over 200KB (shows estimated size, filename, and link)
Unoptimized Image Formats: BMP or TIFF files (recommends conversion to JPG, PNG, or WebP)
Too Many Images: Pages with 20+ images

ℹ️ Performance Info (Blue):

External Embeds: YouTube, Vimeo, Power BI, Forms, etc.
Slow Web Parts: List, Document, Stream, News web parts
Impact description and optimization suggestions

Interactive Features
Hover Highlighting

Hover over any issue card to see it highlighted on the page
Red border: Broken links and critical issues
Orange border: Important issues and performance warnings
Green border: Working links
Blue border: Performance info
Dark overlay dims the rest of the page
Auto-scrolls to show the element
Works for links, accessibility issues, and performance problems

Clickable Elements

All URLs are clickable – Test links directly from results
“View Image” links – For performance issues with images
“Test Link” buttons – For external/document link issues

Export & Share Options
After scanning, you have three ways to save or share your results:
📧 Email Results

Opens your default email client
Pre-formatted comprehensive report including:

Page title and URL
Scan date and summary statistics
All broken links with HTTP status codes
Images missing alt text (with placeholder for suggestions)
Critical and important accessibility issues
Performance issues with filenames and URLs

Best for: Sharing with content owners or accessibility teams

📋 Copy to Clipboard

Copies as rich HTML with formatted tables
Color-coded status badges (red/green/orange)
Clickable links in copied content
Professional formatting
Perfect for: Pasting into Outlook, Word, Teams, or SharePoint pages
Just paste (Ctrl+V or Cmd+V) to preserve formatting

📁 Export to CSV

Downloads as spreadsheet file
Filename: SharePoint_Page_Check_[PageName]_[Date].csv
Columns include:

Category (Link/Accessibility/Performance)
Type and Item
URL (for links and images)
Status Code (for links)
Status Message/Description
Fix recommendations
WCAG references

Best for: Excel, Google Sheets, tracking issues over time

Accessibility Checks Performed

Missing Alt Text – Images without alt attributes (skips decorative images, excludes SharePoint system icons, ignores Yammer web part content)
Non-Descriptive Links – Generic link text (“click here”, “read more”, etc.)
Input Without Label – Form inputs missing labels (shows detailed info, excludes search inputs)
Skipped Heading Levels – Non-sequential headings (e.g., H1→H3 missing H2)
Empty Headings – Headings with no text content
Missing Page Title – No <title> element
Missing Language – No lang attribute on <html>
Button Without Text – Buttons with no accessible name
Table Without Headers – Data tables missing <th> elements
Links Without New Tab – Detects document and external website links that do not open in a new tab (shows clickable “Test Link” to verify)

Performance Checks Performed

Oversized Images – Detects images over 2000px in any dimension (shows filename, actual size, display size, wasted pixels, “View Image” link)
Large Image Files – Estimates file size, flags images over 200KB (shows filename, download size estimate, “View Image” link)
Unoptimized Formats – Detects BMP and TIFF files (recommends modern formats)
External Embeds – YouTube, Vimeo, Microsoft Forms, Power BI, social media embeds
Slow SharePoint Web Parts – List, Document, Stream, Sites, News web parts
Too Many Images – Flags pages with 20+ images (recommends lazy loading or galleries)

Tips for Best Results

✅ Wait for full page load – Let SharePoint completely load before scanning
✅ Scan in edit mode – Some elements only appear when editing
✅ Check hidden inputs – Input issues may be in collapsed sections or hidden forms
✅ Verify manually – Click broken links to confirm (some may be false positives)
✅ Use hover feature – Locate issues quickly on complex pages
✅ Export regularly – Track improvements over time with CSV exports
✅ Share with teams – Use Copy feature to paste results into emails or docs

Common Questions
Q: Why can’t I see an “Input Without Label” issue?
A: Check the detailed information shown. It may be in a hidden or collapsed section, or in a web part configuration.
Q: Why do some links show as “Unknown (CORS)”?
A: Browser security prevents checking some external links. These links often still work—click them to verify.
Q: Why are working links flagged as needing target=”_blank”?
A: This is a best practice check. Links to documents and external sites should open in new tabs so users don’t lose their place on your SharePoint page.
Q: Are performance checks accurate?
A: Image size estimates are approximate. Actual file sizes may vary. Use as a guide for optimization priorities.
Q: Does this work on non-SharePoint pages?
A: Yes! The extension works on any webpage, though some SharePoint-specific checks may not apply.
Q: How long does scanning take?
A: Typically 10–30 seconds depending on number of links, images, page complexity, and network speed.
Q: Is my data collected?
A: No. All scanning happens locally in your browser. No data is collected, stored, or transmitted.
Q: Can I scan multiple pages at once?
A: Currently, scan pages one at a time. Navigate to each page and click “Scan Current Page.”
Q: What about Yammer content?
A: Yammer web part content is automatically excluded from checks since it’s embedded from an external service.

Privacy & Permissions
What the extension accesses:

Current tab content (to scan links and elements)
Permission to check if links work
Page HTML structure for accessibility analysis

What the extension does NOT do:

Does not collect or store your data
Does not track your browsing
Does not send information to external servers
Does not modify your SharePoint pages
All processing happens locally in your browser

Browser Compatibility

✅ Google Chrome
✅ Microsoft Edge
✅ Other Chromium-based browsers

Support
For support, questions, or feedback:

Visit: cdsmythe.com
Buy me a coffee: buymeacoffee.com/cdsmythe

Version History
Version 1.1.0 – October 20, 2025

Improved link/document/external tab checks
Enhanced accessibility and performance scanning
UI and export improvements

Version 1.0.0 – October 20, 2025

Initial release
Link checking
Accessibility scanning
Performance monitoring
Export to Email/Copy/CSV
Hover highlighting
Interactive UI with status badges

Note: This extension uses your browser’s existing authentication. Links requiring login are checked using your current session.

Privacy Policy – SharePoint Admin Shortcuts

Last Updated: October 2025

Data Collection
SharePoint Admin Shortcuts does NOT collect, store, or transmit any user data.

Data Storage
The only data stored locally is:
– Custom links you optionally add (stored in Chrome’s sync storage)
– No browsing history, personal information, or usage analytics are collected

Permissions
– storage: Used only to save your custom links locally
– sidePanel: Used to display the extension interface
– tabs: Used to detect which SharePoint site you’re viewing
– host_permissions: Used to read the current URL to build admin links

Third-Party Services
This extension does NOT:
– Make external API calls
– Connect to third-party services
– Track user behavior
– Send data to external servers

Contact
For questions: https://cdsmythe.com

SharePoint Admin Shortcuts – browser extension

SharePoint Admin Shortcuts – browser extension

SharePoint Admin Shortcuts
SharePoint Admin Shortcuts

SharePoint Admin Shortcuts – Chrome Extension

A productivity tool for SharePoint and Microsoft 365 administrators that provides instant access to commonly used administration pages through a convenient side panel.

Get the browser extension Google Chrome Store

What This Extension Does

SharePoint Admin Shortcuts eliminates the tedious navigation through multiple menus and bookmarks by providing one-click access to essential SharePoint and Microsoft 365 administration pages. When you click the extension icon, a side panel opens displaying organized links to admin pages for the SharePoint site you’re currently viewing, plus tenant-wide admin centers.

Key Features

Dynamic Site Detection
– Automatically detects the SharePoint site you’re viewing
– Updates links in real-time as you navigate between sites
– Displays site-specific administration pages with correct URLs

Comprehensive Link Collection
– Current Site Links (20+): Site Settings, Libraries & Lists, Permissions, Content Types, Recycle Bins, Analytics, and more
– Site Catalogs: Web Part Gallery, Theme Gallery, Solutions, App Permissions
– Tenant Admin Centers: SharePoint Admin, Microsoft 365 Admin, Security, Compliance
– Quick Access Tools: Service Health, Message Center, Usage Reports, Teams Admin

Custom Links
– Add your own frequently-accessed SharePoint pages
– Include custom titles, descriptions, and emoji icons
– Links sync across your Chrome browsers via Chrome sync storage
– Easy delete functionality for links you no longer need

Always Accessible
– Side panel design stays open while you navigate
– Doesn’t interfere with your SharePoint work
– Compact, scrollable interface with all links visible
– Automatic refresh when switching tabs or sites

Why Use This Extension?

For SharePoint Administrators
SharePoint administration involves constantly switching between dozens of different admin pages scattered across multiple admin centers. Without this extension, you typically need to:
– Navigate through multiple menu levels to find admin pages
– Remember or bookmark dozens of specific URLs
– Manually construct URLs for different site collections
– Keep multiple tabs open to access different admin areas

This extension solves these problems by:
– Providing instant access to all admin pages from any SharePoint page
– Automatically building correct URLs for the current site
– Organizing links logically by function
– Staying open in a side panel while you work

Common Use Cases
– Site Management: Quickly access Site Settings, Libraries, Permissions without drilling through menus
– Troubleshooting: Jump to Service Health, Audit Logs, or Storage Metrics in one click
– Content Administration: Immediate access to Content Types, Site Columns, Recycle Bins
– Multi-Site Management: Automatically updates links as you switch between site collections
– Team Collaboration: Add your team site or frequently-accessed pages as custom links

Get the browser extension Google Chrome Store

Privacy & Security

What This Extension Does NOT Do:
– Does NOT collect, store, or transmit any user data
– Does NOT track your browsing activity
– Does NOT access or modify SharePoint page content
– Does NOT make external API calls or connect to third-party services
– Does NOT require authentication or login

What Data Is Stored:
– Only your custom links (if you add any) are stored locally using Chrome’s sync storage
– No other data is collected or stored

Permissions Explained:
– storage: Required to save your custom links locally
– sidePanel: Required to display the extension as a side panel
– tabs: Required to detect which SharePoint site you’re currently viewing
– host_permissions (*.sharepoint.com): Required to read the current tab’s URL to build site-specific links

All functionality is completely local to your browser. The extension simply builds and displays links based on the SharePoint site URL you’re currently viewing.

Installation

From Chrome Web Store (Recommended)
1. Visit the Chrome Web Store
2. Search for “SharePoint Admin Shortcuts”
3. Click “Add to Chrome”
4. Click the extension icon to open the side panel

How to Use

1. Navigate to any SharePoint site in your organization
2. Click the extension icon in your Chrome toolbar
3. The side panel opens displaying:
– The current site’s URL at the top
– All available admin links for that site
– Tenant-wide admin center links
– Your custom links (if any)
4. Click any link to open that admin page in a new tab
5. Navigate to a different site – the links automatically update
6. Add custom links using the “+ Add Custom Link” button at the bottom

Adding Custom Links
1. Click “+ Add Custom Link” at the bottom of the side panel
2. Enter a title (e.g., “My Team Site”)
3. Enter the full URL
4. Optionally add a description
5. Optionally add an emoji icon
6. Click “Save Link”
7. Your custom link appears in the Custom Links section

Tips
– Pin the extension icon to your toolbar for easy access
– The side panel stays open while you navigate
– Custom links sync across all your Chrome browsers
– Hover over links to see descriptions

Technical Details

Built With:
– Vanilla JavaScript (no frameworks)
– Chrome Extension Manifest V3
– Chrome Side Panel API
– Chrome Storage Sync API

Browser Compatibility:
– Chrome 114+ (required for Side Panel API)
– Microsoft Edge 114+ (Chromium-based)

For Reviewers

This extension is designed specifically for SharePoint administrators who manage Microsoft 365 environments. The code is straightforward and unminified for easy review:

– No external dependencies – Pure vanilla JavaScript
– No external API calls – All links are constructed locally
– No data collection – Only optional custom links are stored locally
– No content modification – Extension only displays links, doesn’t modify SharePoint pages

The extension provides value by consolidating access to legitimate Microsoft admin pages that administrators access regularly as part of their job duties.

For feature requests, please visit the support page at cdsmythe.com.

Get the browser extension Google Chrome Store

License

This extension is free to use for SharePoint and Microsoft 365 administration purposes.

## Changelog

### Version 1.0 (Initial Release October 2025)
– Side panel interface with organized admin links
– Automatic site detection and URL generation
– 20+ built-in SharePoint site admin links
– 4 site catalog links
– 15+ tenant admin center links
– Custom links feature with add/delete functionality
– Chrome sync storage integration
– Real-time site switching detection
– Compact, scrollable interface design

Privacy Policy – SharePoint Admin Shortcuts

Last Updated: October 2025

Data Collection
SharePoint Admin Shortcuts does NOT collect, store, or transmit any user data.

Data Storage
The only data stored locally is:
– Custom links you optionally add (stored in Chrome’s sync storage)
– No browsing history, personal information, or usage analytics are collected

Permissions
– storage: Used only to save your custom links locally
– sidePanel: Used to display the extension interface
– tabs: Used to detect which SharePoint site you’re viewing
– host_permissions: Used to read the current URL to build admin links

Third-Party Services
This extension does NOT:
– Make external API calls
– Connect to third-party services
– Track user behavior
– Send data to external servers

Contact
For questions: https://cdsmythe.com

SharePoint – Site Pages trick to convert Pages to News Posts and News Posts to Pages

SharePoint – Site Pages trick to convert Pages to News Posts and News Posts to Pages

Changing the promoted state of SharePoint Pages and News Posts

I needed a solution which would make it easy for our intranet team to make changes to the Promoted State of Pages and News Posts in SharePoint.

We needed to quickly convert Pages to News Posts from the Site Pages Library, but also to change some News Posts promoted in error by intranet authors back to Pages.

In the Site Pages library, there is a Promoted State column. Depending on the value stored in this column, you can identify whether it is a site page or a news post. The relationship between the Promoted State value and page type is as follows.

 Promoted State and Page Type

        • 0            Site page
        • 1            News Post not yet published
        • 2            News Post

Once a page is created as news post, it cannot easily be demoted to a site page because the Promoted State column is read only.

Forget about creating views to show the Promoted State of a Page – doesn’t work, you cant edit the cell the promoted state is in.

 

Here’s how to set it up:

  1. In the Site Pages library view click Add column
  2. click Show or Hide columns
  3. choose Promoted State
  4. click Apply

 

 

Now format the Promoted State column so we can add the code to change the SharePoint News Post back to a standard SharePoint Page.

  • Hover of the heading of the Promoted State column
  • select Column Settings
  • select Format this column
  • on the formatting pane that opens select Advanced mode

Delete the default code displayed in the formatting box shown above and paste the code shown below there.

Select all the code shown below then Paste into the Advanced formatting box

{
“$schema”: “https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json”,
“elmType”: “div”,
“style”: {
“flex-wrap”: “wrap”,
“display”: “flex”,
“flex-direction”: “row”
},
“children”: [
{
“elmType”: “div”,
“txtContent”: “=if(@currentField == 0 ,’0 : Page’ , if(@currentField == 1, ‘1 : News (Unpublished)’ , if(@currentField == 2 , ‘2 : News Post’,”) ) )”,
“style”: {
“box-sizing”: “border-box”,
“padding”: “4px 8px 5px 8px”,
“display”: “flex”,
“border-radius”: “16px”,
“height”: “27px”,
“align-items”: “center”,
“white-space”: “nowrap”,
“overflow”: “hidden”,
“margin”: “4px 4px 4px 4px”,
“border”: “1px solid”
},
“attributes”: {
“class”: “=if(@currentField == 0 ,’ms-fontColor-themePrimary ms-borderColor-themePrimary ms-bgColor-white’ , if(@currentField == 1, ‘ms-fontColor-themePrimary ms-borderColor-themePrimary ms-bgColor-themeLighter’ , if(@currentField == 2 , ‘ms-fontColor-white ms-borderColor-themePrimary ms-bgColor-themePrimary’,”) ) )”
}
},
{
“elmType”: “div”,
“style”: {
“font-size”: “18px”,
“cursor”: “pointer”,
“padding”: “10px”,
“border-radius”: “50%”,
“display”: “=if(@currentField == 0 , ‘none’ ,”)”
},
“attributes”: {
“iconName”: “MoreVertical”,
“class”: “ms-fontColor-themePrimary ms-bgColor-themeLighter–hover”
},
“customCardProps”: {
“openOnEvent”: “click”,
“directionalHint”: “rightCenter”,
“isBeakVisible”: true,
“formatter”: {
“elmType”: “div”,
“txtContent”: “Demote (Change to 0:Page)”,
“style”: {
“padding”: “10px 20px 10px 20px”,
“cursor”: “pointer”
},
“attributes”: {
“class”: “ms-bgColor-themeLighter–hover”
},
“customRowAction”: {
“action”: “setValue”,
“actionInput”: {
“PromotedState”: “0”
}
}
}
}
},
{
“elmType”: “div”,
“style”: {
“font-size”: “18px”,
“cursor”: “pointer”,
“padding”: “10px”,
“border-radius”: “50%”,
“display”: “=if(@currentField == 2 , ‘none’ ,”)”
},
“attributes”: {
“iconName”: “MoreVertical”,
“class”: “ms-fontColor-themePrimary ms-bgColor-themeLighter–hover”
},
“customCardProps”: {
“openOnEvent”: “click”,
“directionalHint”: “rightCenter”,
“isBeakVisible”: true,
“formatter”: {
“elmType”: “div”,
“txtContent”: “Promote (Change to 2:News Post)”,
“style”: {
“padding”: “10px 20px 10px 20px”,
“cursor”: “pointer”
},
“attributes”: {
“class”: “ms-bgColor-themeLighter–hover”
},
“customRowAction”: {
“action”: “setValue”,
“actionInput”: {
“PromotedState”: “2”
}
}
}
}
}
]
}

Now that you have the Site Pages list view showing the Promoted State column you can see the options available to convert Pages and News Posts.

Simply click the more options dots next to the Promoted State and choose to Demote or Promote the Page or News Post

Last step – Remember to Republish your page!

How to Fix the “List” Issue in PowerBI when Using SharePoint People Picker Fields

How to Fix the “List” Issue in PowerBI when Using SharePoint People Picker Fields

What is this List and Record issue you get when connecting a SharePoint list to Power BI?

We have connected our company intranet (SharePoint Modern) to Power BI to gather data and present it using a number of reports. Reports are used to support our management of Content, our Intranet Authors and our Page Owners. Through Power BI we can quickly drill into live data from our SharePoint intranet Site Pages libraries and Document libraries.

Power BI allows us to connect to these libraries, but when we do – the People Picker field just returns the word “List” (or maybe you see Record), rather than the person’s name.

Columns such as: Modified By, Created By, Content Owner – only returned the word “List” when we wanted to see the staff member’s name.  Surprisingly, it was difficult to find a solution – hence this post……..

The steps below will help you to expand and choose different items when you see the List/Record content from a SharePoint column cell being displayed in a Power BI query table. For example we also see it when in a choice column, and Expand to New Rows, then choose Label to display the content from the SharePoint list.

 

How to resolve People Picker/Person or group columns not displaying the username in Power BI

Step 1: Connect Your SharePoint List to PowerBI

Open PowerBI and click on Home > Get Data > More > Online Services > SharePoint Online List.

 

STep 1 connect to sharepoint online list for power bi site pages library

 

Paste the URL of your SharePoint site, and click OK.

 

Step 2 - connect to SharePoint site

 

 

The available resources on your SharePoint site will be listed – choose Site Pages. Notice in the preview window if you slide across to a Person or Group column, that the field displays “List” not the persons name. This is what we want to change.

Click Transform Data

 

Step 3 - connect to SharePoint site pages library transform data

 

 

Scroll across to the Column where the Persons name should be displayed – notice it has the word List in every field instead of the user name from the SharePoint list.

Click the icon showing the two arrows and select Expand to New Rows.

 

expand new rows - Problem solved - power bi table shows list not persons name

The column will change and now show the word Record in each cell instead of the word List. Now we can choose from the List of details available to show the title of our person (or whatever other field we want displayed). To view the contents of the list click on some space next to the word Record and a preview will be shown.

Record is displayed - power bi table shows list not persons name

The column will change and now show the word Record in each cell instead of the word List. Now we can choose from the List of details available to show the title of our person (or whatever other field we want displayed). To view the contents of the list click on some space next to the word Record and a preview will be shown.

To select the field we want click again on the icon with the two arrows and make sure only the title (for our demo) is displayed and click OK.

person column Problem solved - power bi table shows list not persons name

To select the field we want displayed in our column, click again on the icon with the two arrows and make sure only the title (for our demo) is displayed and click OK.

choose title - power bi table shows list not persons name

Now to tidy up the column we can rename it by double clicking on the column heading and changing it to simply Page Content Owner.

rename column by double clicking - power bi table shows list not persons name

 

 

 

If that guide was helpful for you please help us by sharing it 🙂

SharePoint – Site Pages trick to convert Pages to News Posts and News Posts to Pages

SharePoint – convert a News Post back to a standard Page

Why would you need to change a SharePoint News Post back to a SharePoint Page?

In our company intranet we have times where people create Pages and then take up SharePoint’s offer to Promote their Page by making it a News Post. While this sounds good – we don’t want every page becoming a News Post and appearing in various News Feeds across different Microsoft 365 apps.

In the Site Pages library, there is a Promoted State column. Depending on the value stored in this column, you can identify whether it is a site page or a news page. The relationship between the Promoted State value and page type is as follows.

 Promoted State and Page Type

        • 0            Site page
        • 1            News page not yet published
        • 2            News page

Once a page is created as news page, it cannot easily be demoted to a site page because the Promoted State column is read only.

Forget about creating views to show the Promoted State of a Page – doesn’t work, you cant edit the cell the promoted state is in.

I had to find a way to convert a SharePoint News Post back into a SharePoint Page.  It wasn’t easy. But I managed to get some help from one of the dozens of forums I went through trying to solve this.

 

Here’s how to set it up:

  1. Start by creating a new view in your SharePoint Site Pages library – base it on All Items and call it All News Posts
  2. In the view click Add column
  3. click Show or Hide columns
  4. choose Promoted State
  5. click Apply

 

 

Now format the Promoted State column so we can add the code to change the SharePoint News Post back to a standard SharePoint Page.

  • Hover of the heading of the Promoted State column
  • select Column Settings
  • select Format this column
  • on the formatting pane that opens select Advanced mode

Delete the default code displayed in the formatting box shown above and paste the code shown below there.

Select all the code shown below then Paste into the Advanced formatting box

{
"$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
"elmType": "div",
"style": {
"flex-wrap": "wrap",
"display": "flex",
"flex-direction": "row"
},
"children": [
{
"elmType": "div",
"txtContent": "=if(@currentField == 0 ,'0 : Page' , if(@currentField == 1, '1 : News (Unpublished)' , if(@currentField == 2 , '2 : News','') ) )",
"style": {
"box-sizing": "border-box",
"padding": "4px 8px 5px 8px",
"display": "flex",
"border-radius": "16px",
"height": "27px",
"align-items": "center",
"white-space": "nowrap",
"overflow": "hidden",
"margin": "4px 4px 4px 4px",
"border": "1px solid"
},
"attributes": {
"class": "=if(@currentField == 0 ,'ms-fontColor-themePrimary ms-borderColor-themePrimary ms-bgColor-white' , if(@currentField == 1, 'ms-fontColor-themePrimary ms-borderColor-themePrimary ms-bgColor-themeLighter' , if(@currentField == 2 , 'ms-fontColor-white ms-borderColor-themePrimary ms-bgColor-themePrimary','') ) )"
}
},
{
"elmType": "div",
"style": {
"font-size": "18px",
"cursor": "pointer",
"padding": "10px",
"border-radius": "50%",
"display": "=if(@currentField == 0 , 'none' ,'')"
},
"attributes": {
"iconName": "MoreVertical",
"class": "ms-fontColor-themePrimary ms-bgColor-themeLighter--hover"
},
"customCardProps": {
"openOnEvent": "click",
"directionalHint": "rightCenter",
"isBeakVisible": true,
"formatter": {
"elmType": "div",
"txtContent": "Demote (Change to 0:Page)",
"style": {
"padding": "10px 20px 10px 20px",
"cursor": "pointer"
},
"attributes": {
"class": "ms-bgColor-themeLighter--hover"
},
"customRowAction": {
"action": "setValue",
"actionInput": {
"PromotedState": "0"
}
}
}
}
}
]
}

Now that you have a list view showing the Promoted State column filter it to show items with Promoted State of 1 or 2 so you can only see news Posts.

Simply click the more options dots next to the Promoted State and choose to Demote the Page to 0 – (Standard SharePoint Page)

Last step – Remember to Republish your page!

sharepoint news post convert to page

Thanks to Tetsuya Kawahara for the solution – Github