Edit

Office Add-in code samples

These code samples are written to help you learn how to use various features when developing Office Add-ins.

Getting started

The following samples show how to build the simplest Office Add-in with only a manifest, HTML web page, and a logo. These components are the fundamental parts of an Office Add-in. For additional getting started information, see our quick starts and tutorials.

Task pane add-ins

Content add-ins

Completed tutorials

Name Description
Excel tutorial This sample is the completed version of Tutorial: Create an Excel task pane add-in that shows how to create an Excel add-in with a task pane and command ribbon buttons. The add-in demonstrates how to create and sort a table, make a chart, freeze a row, protect a worksheet, and display a dialog box.
Outlook tutorial This sample is the completed version of Tutorial: Build a message compose Outlook add-in that shows how to build an Outlook add-in for the message compose surface. The add-in demonstrates how to collect information from the user, fetch data from an external service, implement a function command, implement a task pane, insert content into the body of a message, and display a dialog box.
PowerPoint tutorial (yo office) This sample is the completed version of Tutorial: Create a PowerPoint task pane add-in that shows how to create a PowerPoint add-in with a task pane. The add-in demonstrates how to add an image to a slide, add text to a slide, get slide metadata, and navigate between slides.
PowerPoint tutorial (Visual Studio) This sample is the completed version of Tutorial: Create a PowerPoint task pane add-in that shows how to create a PowerPoint add-in with a task pane. The add-in demonstrates how to add the Bing photo of the day to a slide, add text to a slide, get slide metadata, and navigate between slides.
Word tutorial This sample is the completed version of Tutorial: Create a Word task pane add-in that shows how to create a Word add-in with a task pane. The add-in demonstrates how to insert and replace text ranges, paragraphs, images, HTML, tables, and content controls.
Office Add-in first-run experience tutorial This sample is the completed version of Build an Office Add-in with a basic first-run experience that shows the basics of implementing a first-run experience (FRE). Excel is used in this sample, but the pattern can be applied to other Office applications where Office Web Add-ins are supported.

Blazor WebAssembly

If your development background is in building VSTO Add-ins, the following samples show how to build Office Web Add-ins using .NET Blazor WebAssembly. You can keep much of your code in C# and Visual Studio.

Excel

Name Description
Create an Excel workbook from a web site with an auto-open task pane Create an Excel workbook from web site data using Node.js, and configure it so that a custom Office Add-in task pane automatically opens when the document is opened.
Data types explorer Create and explore data types in your workbooks. Data types enable add-in developers to organize complex data structures as objects, such as formatted number values, web images, and entity values.
Open in Teams Create a new Excel spreadsheet in Microsoft Teams containing data you define.
Insert an external Excel file and populate it with JSON data Insert an existing template from an external Excel file into the currently open Excel workbook. Then, populate the template with data from a JSON web service.
Create custom contextual tabs on the ribbon Create a custom contextual tab on the ribbon in the Office UI. The sample creates a table, and when the user moves the focus inside the table, the custom tab is displayed. When the user moves outside the table, the custom tab is hidden.
Custom function sample using web worker Use web workers in custom functions to prevent blocking the UI of your Office Add-in.
Use storage techniques to access data from an Office Add-in when offline Implement localStorage to enable limited functionality for your Office Add-in when a user experiences lost connection.
Custom function batching pattern Batch multiple calls into a single call to reduce the number of network calls to a remote service.
Excel content add-in Embed a content add-in in the Excel grid.
Data visualization in a content add-in Create an Excel content add-in that includes data visualization.
Synchronous custom function sample (preview) Use @supportSync to create a synchronous custom function that reads a cell value in tandem with Excel's calculation process. This feature is in public preview.

Outlook

Name Description
Encrypt and decrypt messages in Outlook Use Outlook Smart Alerts and the OnMessageDecrypt event to encrypt and decrypt messages.
Report spam or phishing emails in Outlook Build an integrated spam-reporting solution that's easily discoverable in the Outlook client ribbon. The solution provides the user with a dialog to report an email. It also saves a copy of the reported email to a file for further processing in your backend system.
Encrypt attachments, process meeting request attendees, and react to appointment date/time changes using Outlook event-based activation Use event-based activation to encrypt attachments when added by the user. Also use event handling for recipients changed in a meeting request, and changes to the start or end date or time in a meeting request.
Identify and tag external recipients using Outlook event-based activation Use event-based activation to run an Outlook add-in when the user changes recipients while composing a message. The add-in also uses the appendOnSendAsync API to add a disclaimer.
Set your signature using Outlook event-based activation Use event-based activation to run an Outlook add-in when the user creates a new message or appointment. The add-in can respond to events, even when the task pane isn't open. It also uses the setSignatureAsync API.
Verify the color categories of a message or appointment before it's sent using Smart Alerts Use Outlook Smart Alerts to verify that required color categories are applied to a new message or appointment before it's sent.
Verify the sensitivity label of a message Use the sensitivity label API in an event-based add-in to verify and apply the Highly Confidential sensitivity label to applicable outgoing messages.
Invoke an Outlook add-in from an actionable message Use an Adaptive Card in an actionable message to activate an add-in and display initialization context data.

Word

Name Description
Automatically add labels with an add-in when a Word document opens Configure a Word add-in to activate when a document opens.
Get, edit, and set OOXML content in a Word document with a Word add-in Get, edit, and set OOXML content in a Word document. The sample add-in provides a scratch pad to get Office Open XML for your own content and test your own edited Office Open XML snippets.
Import a Word document template with a Word add-in Import templates in a Word document.
Load and write Open XML in your Word add-in Add a variety of rich content types to a Word document using the setSelectedDataAsync method with ooxml coercion type. The add-in also gives you the ability to show the Office Open XML markup for each sample content type right on the page.
Manage citations with your Word add-in Manage citations in a Word document.

Authentication, authorization, and single sign-on (SSO)

Name Description
Office Add-in with SSO using nested app authentication Use MSAL.js nested app authentication (NAA) in an Office Add-in to access Microsoft Graph APIs for the signed-in user. The sample displays the signed-in user's name and email. It also inserts the names of files from the user's Microsoft OneDrive account into the document.
Outlook add-in with SSO using nested app authentication Use MSAL.js nested app authentication (NAA) in an Outlook Add-in to access Microsoft Graph APIs for the signed-in user. The sample displays the signed-in user's name and email. It also inserts the names of files from the user's Microsoft OneDrive account into a new message body.
Use SSO with event-based activation in an Outlook add-in Use SSO to access a user's Microsoft Graph data from an event fired in an Outlook add-in.
Single Sign-on (SSO) Sample Outlook Add-in Use Office's SSO feature to give the add-in access to Microsoft Graph data.
Get OneDrive data using Microsoft Graph and msal.js in an Office Add-in Build an Office Add-in, as a single-page application (SPA) with no backend, that connects to Microsoft Graph to access workbooks stored in OneDrive for Business and update a spreadsheet.
Office Add-in auth to Microsoft Graph Build a Microsoft Office Add-in that connects to Microsoft Graph to access workbooks stored in OneDrive for Business and update a spreadsheet.
Outlook Add-in auth to Microsoft Graph Build an Outlook add-in that connects to Microsoft Graph to access workbooks stored in OneDrive for Business and compose a new email message.
Single Sign-on (SSO) Office Add-in with ASP.NET Use the getAccessToken API in Office.js to give the add-in access to Microsoft Graph data. This sample is built on ASP.NET.
Single Sign-on (SSO) Office Add-in with Node.js Use the getAccessToken API in Office.js to give the add-in access to Microsoft Graph data. This sample is built on Node.js.

Office

Name Description
Save custom settings in your Office Add-in Save custom settings inside an Office Add-in. The add-in stores data as key-value pairs, using the JavaScript API for Office property bag, browser cookies, web storage (localStorage and sessionStorage), or by storing the data in a hidden div in the document.
Use keyboard shortcuts for Office Add-in actions Create custom keyboard shortcuts to invoke certain actions for your Office Add-in.
Define KeyTips for the ribbon controls of an Office Add-in Define KeyTips for ribbon controls of an Office Add-in.

Shared runtime

Name Description
Share global data with a shared runtime Set up a basic project that uses the shared runtime to run code for ribbon buttons, task pane, and custom functions in a single browser runtime.
Manage ribbon and task pane UI, and run code on doc open Create contextual ribbon buttons that are enabled based on the state of your add-in.

Additional samples

Name Description
Use a shared library to migrate your Visual Studio Tools for Office add-in to an Office web add-in Use a shared library to reuse code when migrating from VSTO Add-ins to Office Add-ins.
Integrate an Azure function with your Excel custom function Integrate Azure functions with custom functions to move to the cloud or integrate additional services.
Dynamic DPI code samples Explore a collection of samples for handling DPI changes in COM, VSTO, and Office Add-ins.
Rubric grader task pane add-in for OneNote on the web Explore the basics of OneNote add-ins with a sample tool for teachers.

Next steps

Join the Microsoft 365 Developer Program to get resources and information to help you build solutions for the Microsoft 365 platform, including recommendations tailored to your areas of interest.

You might also qualify for a free developer subscription that's renewable for 90 days and comes configured with sample data; for details, see the FAQ.

  • Last updated on