New Community Website

Ordinarily, you'd be at the right spot, but we've recently launched a brand new community website... For the community, by the community.

Yay... Take Me to the Community!

The Community Blog is a personal opinion of community members and by no means the official standpoint of DNN Corp or DNN Platform. This is a place to express personal thoughts about DNNPlatform, the community and its ecosystem. Do you have useful information that you would like to share with the DNN Community in a featured article or blog? If so, please contact .

The use of the Community Blog is covered by our Community Blog Guidelines - please read before commenting or posting.

DNN 9: Extending the Persona Bar

The new Persona Bar in DNN 9.0 is extensible. No surprises there. We at DNN believe in extensibility, it’s core of how we build software. The Persona Bar is no exception. Let me walk you through the simple steps to build a Hello World Persona Bar Extension.p

Hello World Extension

The purpose of this extension is to show a “Hello World” sub-menu under the Settings area in the Persona Bar. Clicking on the sub-menu will show a new UI consisting a simple line of text. Here is how the extension will look after installation:

UI After Installation Folder Structure

This extension has a very simple structure. It contains a folder named “admin” with 4 files under different sub-folders. There are 6 other files at the root of the project also. These 6 files are very standard DNN files. The folder structure will get complex as you add more functionality into it. This sample extension does not have any Web APIs per se.

Source Folder Structure


Extension is driven by the standard DNN manifest. We have added a few updates to provide this extensibility. 

A new extension type “PersonaBar” has been introduced.

There is a new section under Components called as “PersonaBarMenu”. This section is used to specify the menu location for this component. The attribute “parent” is meant to specify the primary menu for the extension.



Source Structure

Persona Bar does not use web forms or Asp.Net ascx controls. Instead it's built using modern front-end technologies including Html, JavaScript and CSS. Of course the Web APIs are still provided using C#, but the front-end does not use any server side controls as such.

Persona Bar automatically loads the corresponding Html, CSS and JavaScript files upon clicking of the respective menu. It uses convention to load those files. The file names for .html, .css and .js must match what's specified in the manifest.

Html file

This simple extension simply prints a line of text in the Persona Bar. However, you are free to render your own custom Html with matching CSS and JavaScript. In this example, HelloWorld.html file is loaded from admin\personabar folder.

Html File

CSS file

Persona Bar expects a corresponding .css file under admin\personabar\css folder and loads it automatically. In this example, the file name is HelloWorld.css. You can add your own custom styles here.

CSS File

JavaScript file

Persona Bar also loads the respective JavaScript file as well from the admin\personabar\scripts folder. In this example, the file name is HelloWorld.js.

There is a little bit of boiler plate code that's required for your extension to load up in the Persona Bar. This code is included in the sample extension as well (link below). We will get into more details in a future blog.

JavaScript File

Resource File

Persona Bar expects a resource file to be present under admin\personabar\App_LocalResources folder. It must follow the same naming convention also. In this example, file is named HelloWorld.resx.

It has one resource key entry "nav_HelloWorld". This entry is required, and corresponds to the resourcekey entry under PersonaBarMenu section of the manifest (see Manifest section). This key is rendered on the sub-menu.

Resource File

Reference Library

This sample depends on just one library - Dnn.PersonaBar.Library. You will need more references when this extension becomes complex. The nuget package for this library is currently included in the repo (see below) Nuget Reference Library

Post Installation – Extensions

After installation, the extension will show up under the extension type "Persona Bar". Post Installation View In Extensions

Post Installation – Folder Structure

All the four key files are deployed under SiteRoot\admin\Dnn.PersonaBar folder

  • Html – installed under root folder

  • Resx – installed under App_LocalResources sub-folder

  • CSS – installed under css sub-folder

  • JavaScript – installed under scripts sub-folder

Post Installation Folder Structure

Installation Zip File

The sample code contains all the build scripts to create an installation package. Simply compile in “Release” mode and a zip file should be found under: Website\Install\Module

Install Zip File


Sample Source Code

The entire source code of this sample extension is available on GitHub for free. Here is the link:


Git Repository

  • Published:


Scott Wilkinson
I guess the step I am missing is how to build the existing Dnn.PersonaBar.Extensions solution and install that in Dnn9 before I try to build my own extension.
Scott Wilkinson Friday, November 18, 2016 10:15 AM (link)
Scott Wilkinson
Disregard my previous comment. The easiest way forward is to just start with a nightly build.
Scott Wilkinson Friday, November 18, 2016 10:26 AM (link)
Stephen Lim
@Ash, why do we need to include the Dnn.PersonaBar.Library.dll ? What's the purpose of the dll even for a static HTML example like this one?
Also, why the lengthy admin/personaBar folder convention? Is that necessary?
Stephen Lim Thursday, December 8, 2016 3:50 PM (link)
Joe Brinkman
@Stephen - No the Dnn.PersonaBar.Library is not needed for a trivial implementation like this. However, once you start adding any type of real code you will likely want the library. Even in some advanced scenarios you might be able to work around requiring the library - but then you are likely to end up duplicating some code.

Also, the admin/personabar folder convention is not needed for development, but it does simplify packaging. The personabar will expect to find resources in certain folders once your extension is installed.
Joe Brinkman Friday, December 9, 2016 10:32 AM (link)
Stephen Lim
Thank you @Joe. I think the persona bar with the modern client side development without abandoning Web forms and yet have a gradual upgrade path is brilliant and awesome. I love it as a developer and as a user! :)

Can a persona bar content with a href anchor that links to open another persona bar content (e.g. cross-link information available in different content)?
Stephen Lim Friday, December 9, 2016 3:10 PM (link)
steve larsc
Thanks for sharing us a space to express personal thoughts about DNNPlatform, the community, and its ecosystem. Such feedback's and suggestions from users will surely help you improve the Photoediting India services.
steve larsc Wednesday, May 24, 2017 12:04 PM (link)
Terry Cowley
Terry Cowley Wednesday, August 30, 2017 8:19 AM (link)
Nicholas Hurd
Thanks for the project. I've installed it but get a blank page when opening it. I'm on DNN 9.2 - does that make a difference?

Nicholas Hurd Thursday, September 13, 2018 3:30 PM (link)

Comment Form

Only registered users may post comments.


Aderson Oliveira (22)
Alec Whittington (11)
Alessandra Daniels (3)
Alex Shirley (10)
Andrew Hoefling (3)
Andrew Nurse (30)
Andy Tryba (1)
Anthony Glenwright (5)
Antonio Chagoury (28)
Ash Prasad (37)
Ben Schmidt (1)
Benjamin Hermann (25)
Benoit Sarton (9)
Beth Firebaugh (12)
Bill Walker (36)
Bob Kruger (5)
Bogdan Litescu (1)
Brian Dukes (2)
Brice Snow (1)
Bruce Chapman (20)
Bryan Andrews (1)
cathal connolly (55)
Charles Nurse (163)
Chris Hammond (213)
Chris Paterra (55)
Clint Patterson (108)
Cuong Dang (21)
Daniel Bartholomew (2)
Daniel Mettler (181)
Daniel Valadas (48)
Dave Buckner (2)
David Poindexter (12)
David Rodriguez (3)
Dennis Shiao (1)
Doug Howell (11)
Erik van Ballegoij (30)
Ernst Peter Tamminga (80)
Francisco Perez Andres (17)
Geoff Barlow (12)
George Alatrash (12)
Gifford Watkins (3)
Gilles Le Pigocher (3)
Ian Robinson (7)
Israel Martinez (17)
Jan Blomquist (2)
Jan Jonas (3)
Jaspreet Bhatia (1)
Jenni Merrifield (6)
Joe Brinkman (274)
John Mitchell (1)
Jon Henning (14)
Jonathan Sheely (4)
Jordan Coopersmith (1)
Joseph Craig (2)
Kan Ma (1)
Keivan Beigi (3)
Kelly Ford (4)
Ken Grierson (10)
Kevin Schreiner (6)
Leigh Pointer (31)
Lorraine Young (60)
Malik Khan (1)
Matt Rutledge (2)
Matthias Schlomann (16)
Mauricio Márquez (5)
Michael Doxsey (7)
Michael Tobisch (3)
Michael Washington (202)
Miguel Gatmaytan (3)
Mike Horton (19)
Mitchel Sellers (40)
Nathan Rover (3)
Navin V Nagiah (14)
Néstor Sánchez (31)
Nik Kalyani (14)
Oliver Hine (1)
Patricio F. Salinas (1)
Patrick Ryan (1)
Peter Donker (54)
Philip Beadle (135)
Philipp Becker (4)
Richard Dumas (22)
Robert J Collins (5)
Roger Selwyn (8)
Ruben Lopez (1)
Ryan Martinez (1)
Sacha Trauwaen (1)
Salar Golestanian (4)
Sanjay Mehrotra (9)
Scott McCulloch (1)
Scott Schlesier (11)
Scott Wilkinson (3)
Scott Willhite (97)
Sebastian Leupold (80)
Shaun Walker (237)
Shawn Mehaffie (17)
Stefan Cullmann (12)
Stefan Kamphuis (12)
Steve Fabian (31)
Steven Fisher (1)
Tony Henrich (3)
Torsten Weggen (3)
Tycho de Waard (4)
Vicenç Masanas (27)
Vincent Nguyen (3)
Vitaly Kozadayev (6)
Will Morgenweck (40)
Will Strohl (180)
William Severance (5)
What is Liquid Content?
Find Out
What is Liquid Content?
Find Out
What is Liquid Content?
Find Out