The Little Widget That Could: Building Office Add-Ins

Al Rosenthal
May 17, 2018

What are Microsoft Office Add-Ins?

A little context before we get started. Office Add-Ins are lightweight web applications that are meant to extend or add to the functionality of office products. These apps are made with modern technologies like HTML5, CSS and JavaScript, or modern JavaScript frameworks like React or Angular. Microsoft has also been consistently adding new features for each Office product, like more cross-platform support or more consistent features across each different product. Since we made our first app (April 2017) the documentation has changed radically from being quite limited to providing developers with a good idea of what they can do with these add-ins.

Depending on the targeted Office product, these add-ins can do a lot of things leveraging the API provided by Microsoft. They can be made into simple tools for Outlook to help sort and deal with the notifications you might get flooded with throughout the day. The Excel add-ins are great for creating more advanced graphs for doing data analysis or report generation. For the literary applications, like Word or OneNote, they have a lot of options for templating forms and documents or formatting the text already on the page. With the more modern approach with these apps, developers can really expand what their office products can do for their clients.

Our Little Widget That Could: a Microsoft Word App

Our first foray into Office Add-Ins was a Word application for a municipal government client. The task was to create an app that would take user input and output it onto the page for official letters. These letters are used internally and externally, so they need to adhere to their standards for look and feel. With all the different possible combinations, they have over 100 different versions of the letterhead. This means no premade letter templates; it needed to be a custom solution. The users need to fill out 3 basic forms in the app that each interact with different areas of the page. Each section was built around a portion of their official template: header / footer, heading / recipient address, and the “From” section of a letter. The 3 sections all have slightly different formatting associated with them regarding spacing, font-size and where the information is coming from. All the formatting is handled by the API that Microsoft provided to add paragraphs, sections and text to a page. This API allows you to get as granular as adding a single space to a specific line of text. Having this control over the text in the document made things on our end a lot easier.

One of the other requirements was also to persist some of the user data that was inputted. The web app fortunately has access to localstorage, so we were able to leverage that instead of creating a more complex mechanism.

The group we are working with are using this app for the letters and statements in an official capacity. Our application handles a lot of the heavy lifting for their needs. All the users need to do is fill out the forms with their information and apply the template to the page; it couldn’t be simpler. The application is being used often and makes a great case for the power of these add-ins. Between being able to access basic web tools like localstorage or template out a letterhead, this app streamlines a lot of the document generation process. As you might expect, a government body can generate a lot of paperwork, so anything that can help streamline that process is a huge help.

Making Your Own Office Add-In

Office Add-Ins can be small and lightweight, or larger scale applications that can really expand what office products can do. They can act as a go-between for data outside of the product or leverage some basic functions to streamline a business process. These apps are as complex or as simple as your needs are. Microsoft provides a lot of documentation on starting your add-in and even provide some great examples of what you can do with them. Check it out, play around with them, see what you can come up with.

Get started with Office Add-Ins here.

Leave a Reply

Your email address will not be published. Required fields are marked *