Some of my colleagues have asked me how I have managed to include Visio files into this public website, so I thought I would share my secret. Microsoft has kindly provided a File Viewer Web Part for use in SharePoint that appears to be useful in other websites too.
If you view a Visio file that is stored on OneDrive or in SharePoint Online, you can get the </> Embed code for the Visio document from the Show More Commands (…) button in the top right corner. This is normally intended for use within SharePoint pages.
A panel will appear where you can enter the Width and Height of the embedded diagram.
The Embed Code will be something like:
This code assumes that you have permission to see the Visio document within SharePoint, so it is not suitable for general public viewing. Fortunately, the Share option allows you to create a read only link:
This link text can then be copied and used within the embed code yo replace the permissioned access to the file, as follows:
This edited code can then be inserted as custom html into your public non-SharePoint web page, and will display as follows, with active hyperlinks:
I don’t know if the other Microsoft Office web views provide the embed code, but the Visio one can be used and the source document replaced with, for example, and PowerPoint file (this was created with Slide Snippets feature in Visio Plan 2):
Or a Word file (this was created with Export to Word feature in Visio Plan 2):
Or Excel (this was created with Shape Reports feature in all desktop Visio apps):
Intended or not, it is very useful!
Webinar on Visio, SharePoint and Teams using SPFx
I will be presenting a webinar on embedding Visio diagram in SharePoint Online and Teams next month, please register here ! (Or if you missed it live, then watch the recording !) The slides are available at https://www.slideshare.net/bvisual/creating-a-visio-web-part-with-sharepoint-spfx
learn why shape mouse enter and leave events may not fire in Visio for the web, and how to fix it.
Visio Extensibility roadmap from Microsoft Ignite 2018
I like embedding Visio diagrams into SharePoint web pages, but I am not too enamoured with the Shape Info panel and the popup hyperlinks menu because they clutter the diagram surface. So, I thought I would take some time to make an html document that can be included in a Content Editor web part. This…
Thank you for this! Gives me hope that I can do something similar for the embed URL. Is it possible?
David Parker says
I am using the Embed URL in this example, or are you wanting to do something different?