How to develop add-ins for Office 2016, Office Online, and Office Mobile

Dave W. Shanahan

Looking for more How To posts? Check out our How To Page for all the latest tips on Windows, Microsoft Teams, LinkedIn, and more!

Office 2016 add-ins allow you to extend the capability, functionality, and features of Office clients such as Word, Excel, PowerPoint, and Outlook by using web technologies like HTML, CSS, and JavaScript. Office Add-ins can be used to do the following:

  • Add new functionality to Office clients – For example, augment Word, Excel, PowerPoint, and Outlook by interacting with Office documents and mail items, bringing external data into Office, processing Office documents, exposing third-party functionality into Office clients, and much more.
  • Create new rich, interactive objects that can be embedded into Office documents – For example, maps, charts, and interactive visualizations that users can add to their own Excel spreadsheets and PowerPoint presentations.

Office Add-ins are able to run across a variety of platforms including Office for Windows 10, Office Online, Office 2016 for Windows, Office 2016 for Mac, and Office for the iPad. Office Add-ins are not yet available for Windows 10 Mobile or Android, but the Office team is working on it (see the Office Add-in host and platform availability for more details). In order to run Office Add-ins, there are certain system requirements needed for your device, and you can find those requirements here.

How can an Office Add-in help me?

Office Add-ins can help you be doing almost anything a website can do within a browser.  Office Add-in capabilities include:

  • Extend Office native UI by creating custom ribbon buttons and tabs.
  • Provide an interactive UI and custom logic through HTML and JavaScript.
  • Use JavaScript frameworks such as jQuery, Angular, and many others.
  • Connect to REST endpoints and web services via HTTP and AJAX.
  • Run server-side code or logic, if the page is implemented using a server-side scripting language such as ASP or PHP.

The Office Add-ins infrastructure allows interaction with the Office application and user content through a JavaScript API.

Types of Office Add-ins 

At the moment, there are a few types of Office Add-ins currently available:

  1. Word, Excel, and PowerPoint add-ins that extend functionality
  2. Excel and PowerPoint add-ins that create new objects
  3. Outlook add-ins that extend functionality

Word, Excel, and PowerPoint add-ins that extend functionality

Adding new functionality to Word, Excel, or PowerPoint is relatively simple. All you need to do is register your add-in by using the task pane add-in manifest. This add-in manifest allows for two integration modes; add-in commands and insertable task panes.

Add-in commands

You can use add-in commands to expand the UI of Office for Windows 10 and Office Online. With add-in commands, you have the ability to add buttons for your add-ins on the ribbon or within selected contextual menus, giving you easy access to your add-ins within Office. Add-in command buttons can be used to launch different actions, such as showing a task pane with a custom HTML or executing a particular Javascript function.

You can also define your commands in your add-in command manifest by using VersionOverrides. To get started, take a look at these examples on GitHub, or you can also check out the Add-in commands for Excel, Word, and PowerPoint.

Office 2016, Excel
Add-in commands in Excel
Office, Excel Online
Add-in commands in Excel Online

Additionally, there is a Channel 9 video that goes into more depth on add-in commands, called “Add-in Commands in the Office Ribbon.”

Insertable Task Panes

In case you have a client that does not yet support add-in commands (Office 2013, Office for Mac, and Office for iPad), you will need to run your add-in commands as an insertable task pane using the DefaultURL provided in the manifest. From there, you can launch your add-in from the “My Add-ins” menu from the Insert tab.

Excel and PowerPoint add-ins that create new objects

You can also insert add-ins to Excel or PowerPoint to create new web-based objects or content that can be embedded within documents or presentations. Content add-in commands allow for embedded media, such as a picture gallery or YouTube video, as well as web-based data visualizations and other external content.

Excel, Office
Excel 2013 content add-in example

To test out this content add-in with Excel 2013 or Excel Online, install the Bing Maps add-in.

Outlook add-ins that extend functionality

Outlook add-ins present an opportunity to extend the Office Ribbon and provide additional display content next to an Outlook item when you are creating or viewing an email message. Add-ins can work with an email message, meeting request, response, or cancellation, as well as appointments.

Office, Outlook, Add-ins
Outlook add-in with command buttons on the ribbon

Outlook add-ins can use the contextual information from an item, such as an address or package tracking ID, and then use that data to access additional information from web services to create complete user interactions. For the most part, Outlook add-ins can run without any problems with Outlook, Outlook for Mac, Outlook Web App, and OWA for Devices, to provide a unified experience on the desktop, online, tablets, or mobile devices.

Office, Outlook, Add-in
Contextual Outlook add-in

You can install the Package Tracker add-in in Outlook, Outlook for Mac, or Outlook Web App. Check out more Outlook Add-ins.

What makes up an Office Add-in?

An Office Add-in is composed of an XML manifest file and your own web application. The XML manifest file creates rules for various settings, including how your add-in integrates with your Office clients. On the other hand, your web application needs to be hosted on a web server or you can use a web-hosting service, like Azure.

Office, Add-in
XML Manifest File + Web Application = Office add-in

 Manifest

The XML Manifest file indicates specific settings and capabilities of the Office add-in, specifically:

  • The add-in’s display name, description, ID, version, and default locale.
  • How the add-in integrates with Office:
    • For add-ins that extend Word/Excel/PowerPoint/Outlook: The native extension points the add-in uses to expose functionality, such as buttons on the ribbon.
    • For add-ins that create new embedable objects: The URL of the default page that is loaded for the object.
  • The permission level and data access requirements for the add-in.

If you need more information, take a look at Office Add-ins XML manifest.

Web app

The most basic version of a web app is a static HTML page that is displayed within an Office application, but the page doesn’t interact with the Office document or the Internet. The page needs to be hosted on a web server, or a web hosting service, such as Azure; it is up what service you feel suits you best.

Office, Add-in
Example of a Hello World Office Add-in

Because it is a web application, you can use any client and server technologies that your hosting provider supports (such as ASP.net, PHP, or Node.js). In order to interact with Office clients and documents, you need to use the office.js JavaScript API that Office 2016 provides.

JavaScript APIs and Additional Resources

The JavaScript APIs for Word and Excel provide host-specific object models that can be used in an Office Add-in. These APIs support access to paragraphs and workbooks, which provides an easier way to create an add-in for Word or Excel. See Word Add-ins and Excel Add-ins for more information.

For more information and technical information about Javascript APIs for Office 2016, see Understanding the JavaScript API for Office, JavaScript API for Office, and Design guidelines for Office Add-ins.