In this tutorial, you will learn how to create an Episerver admin plug-in from scratch. The plug-in will display the current time and it will contain a button to update it. The time will be stored within the Episerver so the value will persist. Saving data and doing postback are two key concepts that you will need to know about when creating custom admin plug-ins. All Episerver admin plug-ins are viewable from the admin UI, here:
Admin Mode →
To create a plugin, create a new file with a
.aspx page extension. This page will be the basis of the plugin. In Visual Studio, create a new standard
PageType. You will need to decide where your admin plug-in is going to live in your webroot. For this example, I am going to add them into a folder in:
The exact file location doesn't really matter and you can put this page anywhere, however, for keeping your project easy to maintain I would recommend putting it somewhere within templates under your site folder. For this plugin, I called the page
Example with a matching namespace.
aspx file is very simple. All I'm doing is adding a button and a method to display the time :
The time is
<%= GetTheTime() %>
The code within the code behind is a bit more tricky as it has to do several things :
Define the control as an Episerver plug-in
GetTheTime()to display the time
UpdateTheTime()to get time
Store everything within Episerver so the value persists.
Within the code-behind, the first thing we need to do is change the base type of the control from a
Page to an Episerver
SimplePage. You need to add the Episerver plug-in declaration attribute to make the plugin display in the admin UI. This is a single line that you need to place on top of the class declaration. Call it whatever you want. The important part is that the
Url property points to the
.aspx page in your webroot.
The next step is to create a method to load and store data into Episerver. This data access is done via an Episerver API, using the
PlugInSettings. Data is read using
Populate() and data can be saved using the
Save() method. The only downside of using
PlugInSettings is that it works using
DataSet, which isn't ideal. To keep things simple, I've wrapped these calls into a custom class that my page will call. In the constructor of the class, I initialize a new
Dataset on creation:
One thing to note is Log4net is being used. This logging provider will be installed when you install Episerver, so you will not need to install anything extra to write a message to the Episerver log files. This is a handy debugging tip! You can see the logging provider being called in the
The last step is to wire up the class in the control.
It really is that simple. You can download the full source code here from my Github Episerver Goodies repository available from here. Happy Coding 🤘