How to deploy to SharePoint Online

Last update:

Audience: System administrators installing and configuring Sapho Server

Sapho supports using your micro apps within your SharePoint Online environment. Follow these three simple steps to set up the integration.

1. Set up Azure Active Directory

In order to get started, you first need to set up your Azure Active Directory identity provider in Sapho.

  • Go to the Identity tab and add Azure Active Directory identity provider.
    spo1.png
  • Fill in the relevant information to connect to your Azure Active Directory. (To obtain your credentials, refer to this article.) Click Done.spo2.png
  • Finally, go to the Micro Apps with Access tab in the left side menu within your newly created identity provider and toggle the switch on to activate the Can Access setting for the micro app that you would like to use within SharePoint.spo3.png

2. Get the embed code from the SharePoint endpoint

Once Azure Active Directory is set up, you will need to get the embed code for your micro app from the SharePoint endpoint.

  • Go to the Publish tab and publish the micro app you want to use within SharePoint.spo4.png
  • Navigate to Endpoints → SharePoint Online and click the add button.spo5.png
  • Select your micro app and hit Add to enable embedding.spo6.png
  • After configuring your micro app settings for the SharePoint embed, copy the code from the HTML tab.spo7.png

3. Set up the SharePoint embed

  • Navigate to your SharePoint account and edit the page where you’d like to embed your Sapho micro app.
  • Click the plus button to add a web part and select Embed.spo8.png
  • Paste the HTML code you obtained earlier from the SharePoint endpoint in Sapho. The embedded micro app will load in the iframe.spo9a.png
  • After publishing the SharePoint page, your end users can begin using the micro app right away.

Notes

1. If the micro app doesn't load immediately, ask your admin to follow this tutorial and add the URL of your Sapho instance to the sites allowed for embedding in SharePoint .

  • spo9.png

2. If you're having a "classic" SharePoint page, the steps for adding the embed with the micro app are slightly different:

  • Click on the Insert tab and select the Embed Code component.spo17.png
  • Paste the HTML code obtained from the SharePoint endpoint in Sapho. The embedded micro app will load in the iframe. Click Insert.spo18.png
  • After saving the SharePoint page, you can begin using the micro app right away.spo19.png