Skip to main content Skip to footer

How to remove the UmbracoNews dashboard in Umbraco V15+

Using a Composer, removing the "Getting Started" Umbraco dashboard in Umbraco 13 and prior was extremely quick and easy.

It's a little more tricky in Umbraco 15+ so this post explains how to achieve the same thing.

Before you can remove the dashboard, I recommend taking a look at the Umbraco documentation which covers how to setup your local development environment:
https://docs.umbraco.com/umbraco-cms/customizing/development-flow/vite-package-setup#create-a-vite-package

The steps below will explain roughly how to make the dashboards disappear:

First, create an empty package:

npm create vite@latest

Next change into the directory you just created and then run the commands below:

npm install
npm install -D @umbraco-cms/backoffice

Next, open the tsconfig.json file and add the lines below under "compilerOptions": {

{
    "compilerOptions": {
        ...
        "types": [
            "@umbraco-cms/backoffice/extension-types"
        ]
    }
}

Create a file called vite.config.ts and add the below code:

import { defineConfig } from "vite";

export default defineConfig({
    build: {
        lib: {
            entry: "src/hide-dashboards.ts",
            formats: ["es"],
        },
        outDir: "../App_Plugins/HideDashboards",
        emptyOutDir: true,
        sourcemap: true,
        rollupOptions: {
            external: [/^@umbraco/],
        },
    },
    base: "/App_Plugins/HideDashboards/",
});

You may need to tweak the outDir setting to your needs

Next, create a file called umbraco-package.json and place this inside the public folder, it should contain the lines below:

{
    "name": "Hide Dashboards",
    "alias": "hide-dashboards",
    "extensions": [
        {
         "type": "backofficeEntryPoint",
         "alias": "hide-dashboards-entrypoint",
         "js": "/App_Plugins/HideDashboards/hide-dashboards.js"
        }
    ]
}

Now you should create a file called hide-dashboards.js inside the src folder which should contain the below:

import { UmbEntryPointOnInit } from '@umbraco-cms/backoffice/extension-api';
import { umbExtensionsRegistry } from '@umbraco-cms/backoffice/extension-registry';

export const onInit: UmbEntryPointOnInit = (_host) => {
    umbExtensionsRegistry.exclude('Umb.Dashboard.UmbracoNews');
};

Next, run the command below to trigger the build:

npm run build

Once the build has completed, head back to your Umbraco project and run a build.

The next time you access the backoffice you should no longer see the "Getting Started" / "Umbraco News" dashboard

About the author

Aaron Sadler

Aaron Sadler, Umbraco MVP (2x), Umbraco Certified Master Developer and DevOps Engineer

comments powered by Disqus