{"id":192,"date":"2016-04-20T20:11:37","date_gmt":"2016-04-20T20:11:37","guid":{"rendered":"https:\/\/itgroove.net\/bangimportant\/?p=192"},"modified":"2023-02-24T21:39:36","modified_gmt":"2023-02-24T21:39:36","slug":"office-online-inline","status":"publish","type":"post","link":"https:\/\/regroove.ca\/archive\/2016\/04\/20\/office-online-inline\/","title":{"rendered":"Office Online Inline"},"content":{"rendered":"\n<p>Recently on a project we needed a way to display PDFs inline on a page within a &#8220;document viewer&#8221; we were building. Basically there is a table of contents driven by a library going down the left hand side and when the user chooses a document we wanted to render it in a panel on the page.<\/p>\n\n\n\n<p>Using the inspector in Firefox we took a look at how Microsoft does it on the &#8220;popout&#8221; document view in a library. Turns it is very simple. There is an iFrame point to the WebApps page and the GUID of the file is passed in. Luckily as we were working in JSLink we had the GUID easily available to us and it worked like a charm.<\/p>\n\n\n\n<p>\n\n&lt;iframe id=&#8221;medecision-viewer&#8221; src=&#8221;&lt;SP Online Site URL&gt;\/layouts\/15\/WopiFrame.aspx?sourcedoc={GUID}&amp;amp;action=interactivepreview&amp;amp;wdSmallView=1&#8243; role=&#8221;presentation&#8221; tabindex=&#8221;-1&#8243; frameborder=&#8221;0&#8243;&gt;&lt;\/iframe&gt;\n\n<\/p>\n\n\n\n<p>Our next mission is to play with the action and wdSmallView parameters to see what we can enhance. Right now if we remove them it stops working.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Recently on a project we needed a way to display PDFs inline on a page within a &#8220;document viewer&#8221; we were building. Basically there is a table of contents driven by a library going down the left hand side and when the user chooses a document we wanted to render it in a panel on &hellip; <a href=\"https:\/\/regroove.ca\/archive\/2016\/04\/20\/office-online-inline\/\"><\/a><\/p>\n","protected":false},"author":4,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"footnotes":""},"categories":[4,6,7,9],"tags":[],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v23.0 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Office Online Inline - Archive<\/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:\/\/regroove.ca\/archive\/2016\/04\/20\/office-online-inline\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Office Online Inline - Archive\" \/>\n<meta property=\"og:description\" content=\"Recently on a project we needed a way to display PDFs inline on a page within a &#8220;document viewer&#8221; we were building. Basically there is a table of contents driven by a library going down the left hand side and when the user chooses a document we wanted to render it in a panel on &hellip;\" \/>\n<meta property=\"og:url\" content=\"https:\/\/regroove.ca\/archive\/2016\/04\/20\/office-online-inline\/\" \/>\n<meta property=\"og:site_name\" content=\"Archive\" \/>\n<meta property=\"article:published_time\" content=\"2016-04-20T20:11:37+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-02-24T21:39:36+00:00\" \/>\n<meta name=\"author\" content=\"Matt Lonpre (Alumni)\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Matt Lonpre (Alumni)\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/regroove.ca\/archive\/2016\/04\/20\/office-online-inline\/\",\"url\":\"https:\/\/regroove.ca\/archive\/2016\/04\/20\/office-online-inline\/\",\"name\":\"Office Online Inline - Archive\",\"isPartOf\":{\"@id\":\"https:\/\/regroove.ca\/archive\/#website\"},\"datePublished\":\"2016-04-20T20:11:37+00:00\",\"dateModified\":\"2023-02-24T21:39:36+00:00\",\"author\":{\"@id\":\"https:\/\/regroove.ca\/archive\/#\/schema\/person\/0deb86ff016aebc76f86a79a0e7236d0\"},\"breadcrumb\":{\"@id\":\"https:\/\/regroove.ca\/archive\/2016\/04\/20\/office-online-inline\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/regroove.ca\/archive\/2016\/04\/20\/office-online-inline\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/regroove.ca\/archive\/2016\/04\/20\/office-online-inline\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Blog Archive\",\"item\":\"https:\/\/regroove.ca\/archive\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Office Online Inline\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/regroove.ca\/archive\/#website\",\"url\":\"https:\/\/regroove.ca\/archive\/\",\"name\":\"Archive\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/regroove.ca\/archive\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/regroove.ca\/archive\/#\/schema\/person\/0deb86ff016aebc76f86a79a0e7236d0\",\"name\":\"Matt Lonpre (Alumni)\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/regroove.ca\/archive\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/f084e0ef8fd6992834b5b085b737a7a2?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/f084e0ef8fd6992834b5b085b737a7a2?s=96&d=mm&r=g\",\"caption\":\"Matt Lonpre (Alumni)\"},\"url\":\"https:\/\/regroove.ca\/archive\/author\/mlongpre\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Office Online Inline - Archive","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:\/\/regroove.ca\/archive\/2016\/04\/20\/office-online-inline\/","og_locale":"en_US","og_type":"article","og_title":"Office Online Inline - Archive","og_description":"Recently on a project we needed a way to display PDFs inline on a page within a &#8220;document viewer&#8221; we were building. Basically there is a table of contents driven by a library going down the left hand side and when the user chooses a document we wanted to render it in a panel on &hellip;","og_url":"https:\/\/regroove.ca\/archive\/2016\/04\/20\/office-online-inline\/","og_site_name":"Archive","article_published_time":"2016-04-20T20:11:37+00:00","article_modified_time":"2023-02-24T21:39:36+00:00","author":"Matt Lonpre (Alumni)","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Matt Lonpre (Alumni)","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/regroove.ca\/archive\/2016\/04\/20\/office-online-inline\/","url":"https:\/\/regroove.ca\/archive\/2016\/04\/20\/office-online-inline\/","name":"Office Online Inline - Archive","isPartOf":{"@id":"https:\/\/regroove.ca\/archive\/#website"},"datePublished":"2016-04-20T20:11:37+00:00","dateModified":"2023-02-24T21:39:36+00:00","author":{"@id":"https:\/\/regroove.ca\/archive\/#\/schema\/person\/0deb86ff016aebc76f86a79a0e7236d0"},"breadcrumb":{"@id":"https:\/\/regroove.ca\/archive\/2016\/04\/20\/office-online-inline\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/regroove.ca\/archive\/2016\/04\/20\/office-online-inline\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/regroove.ca\/archive\/2016\/04\/20\/office-online-inline\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Blog Archive","item":"https:\/\/regroove.ca\/archive\/"},{"@type":"ListItem","position":2,"name":"Office Online Inline"}]},{"@type":"WebSite","@id":"https:\/\/regroove.ca\/archive\/#website","url":"https:\/\/regroove.ca\/archive\/","name":"Archive","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/regroove.ca\/archive\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/regroove.ca\/archive\/#\/schema\/person\/0deb86ff016aebc76f86a79a0e7236d0","name":"Matt Lonpre (Alumni)","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/regroove.ca\/archive\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/f084e0ef8fd6992834b5b085b737a7a2?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/f084e0ef8fd6992834b5b085b737a7a2?s=96&d=mm&r=g","caption":"Matt Lonpre (Alumni)"},"url":"https:\/\/regroove.ca\/archive\/author\/mlongpre\/"}]}},"_links":{"self":[{"href":"https:\/\/regroove.ca\/archive\/wp-json\/wp\/v2\/posts\/192"}],"collection":[{"href":"https:\/\/regroove.ca\/archive\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/regroove.ca\/archive\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/regroove.ca\/archive\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/regroove.ca\/archive\/wp-json\/wp\/v2\/comments?post=192"}],"version-history":[{"count":1,"href":"https:\/\/regroove.ca\/archive\/wp-json\/wp\/v2\/posts\/192\/revisions"}],"predecessor-version":[{"id":2752,"href":"https:\/\/regroove.ca\/archive\/wp-json\/wp\/v2\/posts\/192\/revisions\/2752"}],"wp:attachment":[{"href":"https:\/\/regroove.ca\/archive\/wp-json\/wp\/v2\/media?parent=192"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/regroove.ca\/archive\/wp-json\/wp\/v2\/categories?post=192"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/regroove.ca\/archive\/wp-json\/wp\/v2\/tags?post=192"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}