In this tutorial, you will learn how to create a custom dashboard within the Episerver 11 editor. Dashboards can be really useful if you want to create your own bespoke admin area for a client. Luckily getting one up and running is very simple. First, you will need to create a controller to render the admin screen. This controller can be a normal MVC controller. Remember, when working with normal MVC controllers you will need to add a corresponding route in the routeing table. More information on how to do this can be found here.
To render a custom admin screen we will need to write some HTML. This will live in a view within the view folder. Depending on what you want to build, the custom logic you put in the controller and the HTML will be based on your requirements. There are a few 'Episerver' things that you will need to do to ensure the editor experience looks nice when someone visits your custom admin screen. Without doing these things, when someone visits the screen they will lose the editors header and footer. First, you will need to add the HTML, CSS and JS to enable the Episerver global navigation to render. The code to do this is shown below:
Creating a link in the Episerver menu so content editors can access the admin screen, is done using a menu provider. To create a menu provider create a new class and implement from
IMenuProvider. The code to do this is shown below:
Another consideration is security. You will not want any Tom, Dick, or Harry accessing your secure admin screens. Instead, you should lock it down. In the code above, you will see the
IsAvailable property. It is possible to restrict who can view the menu link, meaning you can prevent it from being displayed to certain content editors. In the snippet above, the link to the dashboard will be hidden unless the current content editor, is either an admin or has been added into a custom role that I have imaginatively called 'CustomRole'.