Wednesday, August 7, 2013

Embedding an Office 365 document in a webpage

One of the handy things that you can do with web based storage these days is embed a document from them into a web page. This can give the web page viewer almost full document functionality via a web page if you want.

SharePoint Online via Office 365 can also provide this same functionality. Simply upload an Office document to a SharePoint Document Library.

image

Select the ellipse (three dots) to the right of the name.

image

You should then see the preview window as shown. You’ll need to do this with current browser so you get all the features.

Just below the document preview you will see a small menu icon. Select this to display the menu shown above. In this menu you will see an option Embed Information, select this.

image

You will then a snippet of HTML code that you can copy and paste into a HTML page.

image

Now don’t forget that documents generally stored on SharePoint Online are secured so only certain people can access them. This means that unless you alter the security people will need to have a login to view the document.

image

You can of course alter the security of that file. In this case we’ll alter it so everyone (i.e. anonymous internet users) can have read only access.

If you return the file preview, just under the preview you will probably see a link that says Only shared with you. Select this to change the security on that file.

image

You’ll then be shown a dialog that displays the current file security. At the moment you can see that only I have access to that file. To change this select INVITE PEOPLE from the lower part of the screen.

image

You should now see a dialog that allows to select whom you wish to invite and what rights to the file they have.

For complete anonymous access to the file (i.e. anyone, anywhere on the Internet can view that file) enter Everyone into the Invite people field and change the access to Can view won the right. Also ensure that the Require sign-in option at the bottom of the page is unchecked.

Press the Share button when complete.

image

Immediately after doing this, you should see a message appear in the top right as shown above that tell you the document is now shared via a guest link.

image

If you return to the properties of the document again you will notice that the security options now say Shared with lots of people and Open to anyone via a guest link as shown above.

image

If you select the Open to anyone via a guest link you will be shown a dialog like that above that gives you a public link to that document. Thus, if you send that link to someone via email and they click on it they will be able to view the document.

image

If you select the link lots of people to view the securities you should now see something like shown above. Remember, EVERYONE means EVERYONE!

With all that done hopefully people can see the document embedded in your page as shown below.

If you can’t see the document or there is an error it is probably because I have forgotten about this post and deleted document but hopefully you understand how to embed it for yourself.