Org Chart for SharePoint Online in Office 365 and On-Premises

Anton Khritonenkov
Published in
4 min readSep 11, 2017

In this article, I would like to demonstrate the Plumsail Org Chart web part for SharePoint Online in Office 365 and for SharePoint 2019 / 2016 / 2013 On-Premises including Foundation.

It will help you to maintain employees’ information up to date and easily find information about an employee, you are looking for. In addition to visualization, Plumail Org Chart has navigation optimized for large org structures, which works on mobile devices as well. You can quickly configure, customize and print your organizational structure.

Installation and configuration take a few minutes. Here is the link to installation instruction for SharePoint Online and the quick web part configuration guide. Org Chart can use SharePoint user profiles, SharePoint list or SQL table (external SharePoint list) as a data source. It is quite easy to set up synchronization of Active Directory users with SharePoint and see your organization inside the web part:

Easily navigate through large org structure

We know from our experience that organizational structures can be quite large. It could be difficult to navigate and manage such org charts. To simplify navigation we implemented a few features.

Mouse wheel smart zoom

Use the mouse wheel to zoom in and zoom out. With this feature, you can see more employees on the screen. Our zoom is smart enough to understand that text in boxes is not readable anymore. It hides all the information except employee names and enlarges it:

Navigation with dragging

Just press the mouse button and drag to move along the org chart.

Full-screen mode

It is important to have enough space to explore organization structure, especially for large organizational structures. You can place the Org Chart web part to a small region of page and use “Open full screen” button to get more space for navigation.

Drill down functionality

With this feature, you can see only the information you need. If you hover the mouse over an employee box, you will see a small drill down icon.

Click on this icon and you will drill down to smaller org chart sub-tree. You can go back, go to the root node or drill down deeper.

Easily configure and customize

Org Chart is configured with the help of the configuration wizard. By default, you can just click Next, Next, Next and Finish to configure the web part. But there are much more options available, including:

  • Filtration of the structure
  • Multiple predefined skins
  • Left to right or top to bottom layouts
  • Assistants, dotted line managers, and vacancies
  • Visual or HTML based templates for boxes, tooltips and search results
  • JavaScript framework allows you to add custom logic and handle boxes dynamically
  • Custom CSS allows you to adjust the org chart to your brand book

This is just an example of what you can do with custom JavaScript, CSS and HTML templates. There are employees conditionally highlighted in the boxes and search results. Note, there are different awards displayed:

Print organizational structure

Printing supports two formats, PDF and PNG. You can pick paper size and orientation.

This is an example printed org chart:

Download trial now

Plumsail Org Chart is easy to install and easy to use. Download and install our trial. It will not take a lot of time.



Anton Khritonenkov

Co-founder of, Office 365 and SharePoint expert. Passionate about design and development of easy to use, convenient and flexible products.