Next steps:
22 | 23 |1. Host the add-in website. 24 | 25 | 2. Sideload your add-in. 26 | 27 | 3. Build your Outlook Add-in using the Office JavaScript APIs.28 | 29 |
For more information, choose Next.
30 |You can also explore the links in the additional resources section.
31 |You can host your add-in locally or use any web server. Make sure that the add-in is served using HTTPS and 37 | also update the add-in’s source location in the manifest.
38 | 39 |To help you get started, we have included webpack-dev-server for your convenience. To learn more about it, see the documentation 40 | here.
41 | 42 |
43 | # To host the add-in using webpack-dev-server, use the following command:
44 | npm start
45 |
46 | You will need to add the self-signed security certificate that npm creates as a trusted root certificate, 47 | or your add-in will not display. You only need to do this once for all add-ins hosted this way.
48 | 49 |50 | # To verify that the add-in is running, open your browser and go to the main page at: 51 | https://localhost:300052 | 53 |
54 | See our documentation for information about adding the self-signed certificates.
55 |Load the add-in into Outlook. The easiest way to do this is by sideloading the add-in using the in-client Office Store UI.
61 | 62 |1. Open the Office Store, either in Outlook 2016 for Windows or Outlook on the web: 63 | 64 | - In Outlook 2016 for Windows, choose the Store button on the Home tab. 65 | 66 | - In Outlook on the web, choose the gear icon in the upper-right corner, then choose Manage integrations. 67 | 68 | 2. Click the text Click here to add a custom add-in. 69 | 70 | 3. Choose Add from file.... 71 | 72 | 4. Browse to and select the manifest.xml file from the root of the project folder, and then choose Open. 73 | 74 | 5. Review the warning prompt and choose Install. 75 | 76 | 6. Close the Office Store window. Your add-in will load in Outlook. 77 |78 | 79 |
Here's some advice for building a stellar add-in:
84 | 85 |- Use the Design Patterns to create a rich and immersive UI.
86 | 87 |- Use the Office Helpers to simplify Authentication, Storage management etc.
88 | 89 |- Use the included Office Add-in Validator to ensure your manifest.xml file is correct and complete. It will also give you information on against what platforms to test your add-in before submitting to the store.
90 |# To validate your manifest, use the following command in your project directory:
91 | $ npm run validate manifest.xml
92 | - Ensure your add-in works on all browsers and platforms that Office supports.
93 | 94 |For more information and resources to help you develop your add-in project, follow through the next steps 95 | or click on the additional resources to help you get started.
96 |' +
63 | ' Hi,
' +
64 | 'I am on ' + this.emailDetails.leaveType.text + ' from ' + this.emailDetails.startDate.toLocaleDateString() + ' to ' + this.emailDetails.endDate.toLocaleDateString() +
65 | ', because ' + this.emailDetails.reason + '.
' +
66 | 'Thank you.' +
67 | '