{"id":2508,"date":"2021-01-08T06:23:11","date_gmt":"2021-01-08T06:23:11","guid":{"rendered":"https:\/\/www.vuepilot.com\/support\/?post_type=article&p=2508"},"modified":"2021-06-01T02:42:49","modified_gmt":"2021-06-01T02:42:49","slug":"displaying-microsoft-office-365-documents-with-the-iframe-app","status":"publish","type":"article","link":"https:\/\/www.vuepilot.com\/support\/article\/displaying-microsoft-office-365-documents-with-the-iframe-app\/","title":{"rendered":"Displaying Microsoft Office 365 Documents With The IFrame App"},"content":{"rendered":"

You can display your Microsoft Office 365 documents, spreadsheets and PowerPoint presentations on TV screens in your office by using the “embed” feature and the VuePilot IFrame app.<\/p>\n

PLEASE NOTE USING IFRAMES ARE NO LONGER THE PREFERRED WAY TO EMBED OFFICE DOCUMENTS AND WILL BE UNSUPPORTED BY MICROSOFT IN 2021 – PLEASE USE OUR OFFICE 365 APP GOING FORWARD – SEE MORE INFORMATION HERE<\/a><\/strong><\/span><\/p>\n

By using the IFrame app and not manually uploading a copy of the document to our servers we can display a real time version of your documents directly from Microsoft which means when you update the document it will automatically be updated on your office TV screens when displayed with the VuePilot software.<\/p>\n

An IFrame is simply a way to embed one webpage inside of another. Many web applications will provide a “embed code” that is simply a snip of code, known as an “IFrame” which lets you display the content from that website inside your own website.<\/p>\n

The process to set this up is quick and easy. Users will login to Office 365 using their own credentials (preferably using a low permsission service account) on the machines attached to the screens via the VuePilot software. The credentials are never sent to our servers and are only stored locally on the display machine.<\/p>\n

Here’s a quick tutorial to display a PowerPoint<\/strong> presentation, however the process is the same for Excel<\/strong> and Word<\/strong> documents.<\/p>\n

Please Note<\/strong>
\nYou must perform these steps from the Online Office 365 interface<\/strong>, within your browser. Your local office software will not have the option to share an embed code. You will need to ensure you have saved your document in the cloud \/ OneDrive.<\/p>\n

Step 1: Generate The Embed Code<\/h2>\n

From your online Office 365 interface, when viewing a document, click File > Share > Embed<\/strong><\/p>\n

If you do not see a “Embed<\/strong>” option here,\u00a0 you may instead see a “Save To Cloud<\/strong>” option, this means you are using your local software version of Microsoft Office. You will need to click “Save To Cloud<\/strong>” and then use the online interface to get the embed code.<\/p>\n

\"PowerPoint<\/a><\/p>\n

This will open a modal that contains an “Embed Code<\/strong>“,\u00a0 copy this code<\/p>\n

\"PowerPoint<\/a><\/p>\n

*NOTE*\u00a0<\/strong>For PowerPoint\u00a0 you most likely want to click the “Interaction > Use default auto-advance settings<\/strong>” check box so the slides will move on.\u00a0 Please note that unfortunately Microsoft does not permit rotating slide shows with the web based version of PowerPoint. You can however just add another page to your rotation of the same IFrame app if you wish to create a looping slideshow.<\/p>\n

There will be other specific options for Excel spreadsheets and Word documents on this screen you can choose from.<\/p>\n

Step 2: Create Your IFrame App<\/h2>\n

Open up the VuePilot dashboard, click\u00a0Apps\u00a0\u00a0<\/strong>from the sidebar and then click the\u00a0IFrame<\/strong> app from the\u00a0Create New App<\/strong> section.<\/p>\n

Give the app a name and paste in the embed code you copied from step 1, \u00a0click save.<\/p>\n

\"IFrame<\/a><\/p>\n

 <\/p>\n

At this point, if you are already signed into your Office 365 account you will see a small preview in the preview panel.\u00a0 If you are not signed in, you will be presented with the Microsoft login window. You only need to login here if you want a preview of what the screen will look like from the dashboard.<\/p>\n

You can now assign this app to any of your rotations, simply click the “Add To Rotation<\/strong>” button and select any rotation to assign it to.<\/p>\n

\"Add<\/a><\/p>\n

Step 3: Authenticate The VuePilot Player<\/h2>\n

The VuePilot software attached to your TV screens will need to be logged into your Microsoft account in order to display your document. It is highly recommended<\/strong> that you do not use your own credentials to do this, instead you should use a specific account setup with only permissions to view the documents for security reasons.<\/p>\n

From the VuePilot player software, click the\u00a0Rotations <\/strong>tab, select the rotation you have assigned the IFrame app to and find the app listed,\u00a0 click the\u00a0Preview<\/strong> icon and a small window will pop up attempting to display your embedded document, it will initially present you with a Microsoft login screen<\/p>\n

\"Cycle<\/a><\/p>\n

Simply login as normal, and once done you can close this window as this VuePilot Player is now authenticated and will be authenticated during normal rotations.<\/p>\n

*Please Note*<\/strong>\u00a0 Be sure to to click YES when prompted if you would like to stay signed in to Microsoft, also check the \u201cDon\u2019t show this again<\/em>\u201d box. This will allow us to continue displaying documents without you needing to frequently re-authenticate<\/p>\n

\"Microsoft<\/a><\/p>\n

You’re done!<\/p>\n

You should now see your documents display as normal in Previews and in rotations<\/p>\n

\"Sales<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"

You can display your Microsoft Office 365 documents, spreadsheets and PowerPoint presentations on TV screens in your office by using the “embed” feature and the VuePilot IFrame app. PLEASE NOTE USING IFRAMES ARE NO LONGER THE PREFERRED WAY TO EMBED OFFICE DOCUMENTS AND WILL BE UNSUPPORTED BY MICROSOFT IN 2021 – PLEASE USE OUR OFFICE […]<\/p>\n","protected":false},"author":1,"featured_media":2513,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","format":"standard","article-category":[46,66],"article-tag":[61],"class_list":["post-2508","article","type-article","status-publish","format-standard","has-post-thumbnail","hentry","article-category-digital-signage","article-category-software","article-tag-office"],"yoast_head":"\nDisplaying Microsoft Office 365 Documents With The IFrame App – VuePilot<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.vuepilot.com\/support\/article\/displaying-microsoft-office-365-documents-with-the-iframe-app\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Displaying Microsoft Office 365 Documents With The IFrame App – VuePilot\" \/>\n<meta property=\"og:description\" content=\"You can display your Microsoft Office 365 documents, spreadsheets and PowerPoint presentations on TV screens in your office by using the “embed” feature and the VuePilot IFrame app. PLEASE NOTE USING IFRAMES ARE NO LONGER THE PREFERRED WAY TO EMBED OFFICE DOCUMENTS AND WILL BE UNSUPPORTED BY MICROSOFT IN 2021 – PLEASE USE OUR OFFICE […]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.vuepilot.com\/support\/article\/displaying-microsoft-office-365-documents-with-the-iframe-app\/\" \/>\n<meta property=\"og:site_name\" content=\"VuePilot\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/vuepilot\" \/>\n<meta property=\"article:modified_time\" content=\"2021-06-01T02:42:49+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.vuepilot.com\/wp-content\/uploads\/2021\/01\/office-365.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"422\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:site\" content=\"@vuepilot\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.vuepilot.com\/support\/article\/displaying-microsoft-office-365-documents-with-the-iframe-app\/\",\"url\":\"https:\/\/www.vuepilot.com\/support\/article\/displaying-microsoft-office-365-documents-with-the-iframe-app\/\",\"name\":\"Displaying Microsoft Office 365 Documents With The IFrame App – VuePilot\",\"isPartOf\":{\"@id\":\"https:\/\/www.vuepilot.com\/support\/#website\"},\"datePublished\":\"2021-01-08T06:23:11+00:00\",\"dateModified\":\"2021-06-01T02:42:49+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.vuepilot.com\/support\/article\/displaying-microsoft-office-365-documents-with-the-iframe-app\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.vuepilot.com\/support\/article\/displaying-microsoft-office-365-documents-with-the-iframe-app\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.vuepilot.com\/support\/article\/displaying-microsoft-office-365-documents-with-the-iframe-app\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.vuepilot.com\/support\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Displaying Microsoft Office 365 Documents With The IFrame App\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.vuepilot.com\/support\/#website\",\"url\":\"https:\/\/www.vuepilot.com\/support\/\",\"name\":\"VuePilot\",\"description\":\"Digital signage help and assistance\",\"publisher\":{\"@id\":\"https:\/\/www.vuepilot.com\/support\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.vuepilot.com\/support\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.vuepilot.com\/support\/#organization\",\"name\":\"VuePilot\",\"url\":\"https:\/\/www.vuepilot.com\/support\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.vuepilot.com\/support\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.vuepilot.com\/wp-content\/uploads\/2020\/06\/vuepilot-social-banner.jpg\",\"contentUrl\":\"https:\/\/www.vuepilot.com\/wp-content\/uploads\/2020\/06\/vuepilot-social-banner.jpg\",\"width\":1200,\"height\":630,\"caption\":\"VuePilot\"},\"image\":{\"@id\":\"https:\/\/www.vuepilot.com\/support\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/vuepilot\",\"https:\/\/twitter.com\/vuepilot\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Displaying Microsoft Office 365 Documents With The IFrame App – VuePilot","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.vuepilot.com\/support\/article\/displaying-microsoft-office-365-documents-with-the-iframe-app\/","og_locale":"en_US","og_type":"article","og_title":"Displaying Microsoft Office 365 Documents With The IFrame App – VuePilot","og_description":"You can display your Microsoft Office 365 documents, spreadsheets and PowerPoint presentations on TV screens in your office by using the “embed” feature and the VuePilot IFrame app. PLEASE NOTE USING IFRAMES ARE NO LONGER THE PREFERRED WAY TO EMBED OFFICE DOCUMENTS AND WILL BE UNSUPPORTED BY MICROSOFT IN 2021 – PLEASE USE OUR OFFICE […]","og_url":"https:\/\/www.vuepilot.com\/support\/article\/displaying-microsoft-office-365-documents-with-the-iframe-app\/","og_site_name":"VuePilot","article_publisher":"https:\/\/www.facebook.com\/vuepilot","article_modified_time":"2021-06-01T02:42:49+00:00","og_image":[{"width":1200,"height":422,"url":"https:\/\/www.vuepilot.com\/wp-content\/uploads\/2021\/01\/office-365.jpg","type":"image\/jpeg"}],"twitter_card":"summary_large_image","twitter_site":"@vuepilot","twitter_misc":{"Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.vuepilot.com\/support\/article\/displaying-microsoft-office-365-documents-with-the-iframe-app\/","url":"https:\/\/www.vuepilot.com\/support\/article\/displaying-microsoft-office-365-documents-with-the-iframe-app\/","name":"Displaying Microsoft Office 365 Documents With The IFrame App – VuePilot","isPartOf":{"@id":"https:\/\/www.vuepilot.com\/support\/#website"},"datePublished":"2021-01-08T06:23:11+00:00","dateModified":"2021-06-01T02:42:49+00:00","breadcrumb":{"@id":"https:\/\/www.vuepilot.com\/support\/article\/displaying-microsoft-office-365-documents-with-the-iframe-app\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.vuepilot.com\/support\/article\/displaying-microsoft-office-365-documents-with-the-iframe-app\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.vuepilot.com\/support\/article\/displaying-microsoft-office-365-documents-with-the-iframe-app\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.vuepilot.com\/support\/"},{"@type":"ListItem","position":2,"name":"Displaying Microsoft Office 365 Documents With The IFrame App"}]},{"@type":"WebSite","@id":"https:\/\/www.vuepilot.com\/support\/#website","url":"https:\/\/www.vuepilot.com\/support\/","name":"VuePilot","description":"Digital signage help and assistance","publisher":{"@id":"https:\/\/www.vuepilot.com\/support\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.vuepilot.com\/support\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.vuepilot.com\/support\/#organization","name":"VuePilot","url":"https:\/\/www.vuepilot.com\/support\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.vuepilot.com\/support\/#\/schema\/logo\/image\/","url":"https:\/\/www.vuepilot.com\/wp-content\/uploads\/2020\/06\/vuepilot-social-banner.jpg","contentUrl":"https:\/\/www.vuepilot.com\/wp-content\/uploads\/2020\/06\/vuepilot-social-banner.jpg","width":1200,"height":630,"caption":"VuePilot"},"image":{"@id":"https:\/\/www.vuepilot.com\/support\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/vuepilot","https:\/\/twitter.com\/vuepilot"]}]}},"_links":{"self":[{"href":"https:\/\/www.vuepilot.com\/support\/wp-json\/wp\/v2\/article\/2508","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.vuepilot.com\/support\/wp-json\/wp\/v2\/article"}],"about":[{"href":"https:\/\/www.vuepilot.com\/support\/wp-json\/wp\/v2\/types\/article"}],"author":[{"embeddable":true,"href":"https:\/\/www.vuepilot.com\/support\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.vuepilot.com\/support\/wp-json\/wp\/v2\/comments?post=2508"}],"version-history":[{"count":6,"href":"https:\/\/www.vuepilot.com\/support\/wp-json\/wp\/v2\/article\/2508\/revisions"}],"predecessor-version":[{"id":2607,"href":"https:\/\/www.vuepilot.com\/support\/wp-json\/wp\/v2\/article\/2508\/revisions\/2607"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.vuepilot.com\/support\/wp-json\/wp\/v2\/media\/2513"}],"wp:attachment":[{"href":"https:\/\/www.vuepilot.com\/support\/wp-json\/wp\/v2\/media?parent=2508"}],"wp:term":[{"taxonomy":"article-category","embeddable":true,"href":"https:\/\/www.vuepilot.com\/support\/wp-json\/wp\/v2\/article-category?post=2508"},{"taxonomy":"article-tag","embeddable":true,"href":"https:\/\/www.vuepilot.com\/support\/wp-json\/wp\/v2\/article-tag?post=2508"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}