7

I would like to insert a hyperlink to the task pane of my add-in, and I want this link to open support.html page in a default browser.

<a href="https://example.com/support.html" target="_blank">Support</a>

However, the above code opens support.html page inside the task pane. Users may not know how to go back to the main page of the add-in.

Does anyone know how to open the page in a default browser of users? (By the way, is it recommended to launch something outside the add-in? If not, what's the common UX design for the help page?)

SoftTimur
  • 5,630
  • 38
  • 140
  • 292

2 Answers2

8

You can open a new browser window from an Office Add-in via JavaScript: simply

window.open("your-url.com");

Alternatively, if you want the browsing experience to be more in-line, you can use the dialog API:

Office.context.ui.displayDialogAsync(url,
    { height: 75, width: 80, requireHTTPS: true });

See https://github.com/OfficeDev/Office-Add-in-UX-Design-Patterns-Code/tree/master/templates/feedback/office-store for a full example.

~ Michael Zlatkovsky, Developer on Office Extensibility Team, MSFT

Michael Zlatkovsky - Microsoft
  • 8,424
  • 1
  • 33
  • 46
  • You can also use the displayDialogAsync API; see my updated answer. – Michael Zlatkovsky - Microsoft Jun 29 '16 at 20:37
  • I tried the two methods you suggested. In `Home.js` file of my `Add-in for WORD`, `window.open("myURL.com");` worked and opened a URL I specified. But after replacing `window.open(...)` with `Office.context.ui.displayDialogAsync(myURL.com,....);` in `Home.js` it did not do anything. It seems more steps are required for your second method it to work. Could you please elaborate what steps are needed for the second method to work? – nam Oct 22 '18 at 01:29
  • 2
    window.open doesn't seem to open the default browser window, but the new window of the office app with embedded browser control only. – Les Nie Nov 27 '18 at 20:35
  • I would suggest you open a new question, so that it goes on the team’s radar. – Michael Zlatkovsky - Microsoft Nov 29 '18 at 15:09
  • Maybe add the dialog api to the requirements – juliushuck Apr 10 '20 at 08:14
  • As of this date use window.open("myURL.com") in Office online otherwise use Office.context.ui.openBrowserWindow("myURL.com"). – RBILLC Aug 31 '20 at 22:17
3

If you are trying to open the default OS Browser use the following:

Office.context.ui.openBrowserWindow('https://someurl.com')

This launches the default browser instead of a Dialog box attached to the Addin

https://learn.microsoft.com/en-us/javascript/api/office/office.ui?view=excel-js-preview#openBrowserWindow_url_

Phil C
  • 33
  • 3
  • Beware this is a relatively new feature that is unavailable in old clients. See https://learn.microsoft.com/en-us/office/dev/add-ins/reference/requirement-sets/open-browser-window-api-requirement-sets – markdon Dec 21 '21 at 05:46