In this SharePoint tutorial, we will discuss the SharePoint file viewer web part and how to open selected documents in the file viewer web part SharePoint online.
In the modern SharePoint experience, Microsoft provides a lot of web parts to work in SharePoint Online or SharePoint 2019 or SharePoint server subscription edition. One of the most popular web parts is the SharePoint file viewer web part.
Let us see how to display a selected file in a File viewer web part with examples.
The example we are going to see is based on the SharePoint online environment, but in the same way, you can use the file viewer web part in SharePoint 2019 or the subscription edition.
File viewer web part in SharePoint Online
- There might be requirements where you want to open a SharePoint document without downloading it. For, this we can use the modern file viewer web part in SharePoint Online.
- SharePoint Online File viewer web part is used to insert/display files in the SharePoint modern site page. Here we can view the selected file in the file viewer web part, no need to open the file in the browser.
- The supported file types in a file viewer web part in SharePoint Online are:
- Excel
- PowerPoint
- Visio
- Word
- PDFs
- 3D models
- Videos, etc
- If you are using File viewer web part in SharePoint Onpremise versions like SharePoint Server 2019 or SharePoint Subscription edition, then the file types are limited to the below formats:
- Word (.doc, .docx)
- Excel (. xls, .xlsx)
- PowerPoint (.pot, .potx, .ppt and .pptx)
- Image files are not supported in SharePoint file viewer web part, instead you can use the SharePoint image web part.
- SharePoint Document Library web part – we can display document library files.
How to add file viewer web part in Modern SharePoint?
Let us see how we can add the file viewer web part in the modern SharePoint sites,
- Open the SharePoint site page where you want to configure the document library file viewer web parts in the SharePoint modern site page.
- Click on the Edit Page at the top right of the SharePoint site page.
- Add a new Section layout by clicking on the + circled icon.
- In the search box, enter file viewer and select the file viewer web part.
In the below screenshot, we can see the file viewer web part is added. Click Add button to insert files.
Here you can click on the Add file button to choose any file you want to display. I have selected a PDF file and you can see how it appears.
This is how to add the file viewer web part to a modern SharePoint site and view files using the SharePoint Online file viewer web part.
Read SharePoint Quick Links Web Part
Dynamic preview via file viewer web part in SharePoint
Let us see how we can display the dynamically selected documents in SharePoint online file viewer web part.
- Now, edit the SharePoint site page and Select a two-column section to add the Document library web part (add in the left column), and the file viewer web part (add in the right side column).
- Now we can select the document library to add it into the web part, we will also see how to connect the file viewer to the Source document.
- Edit the File viewer web part section, click the ellipses (…) at the top right of the property pane, and select Connect to source.
- Now we select the Source list in the file viewer web part from the dropdown option. You can view that This web part is connected to the selected list, here is Documents (highlighted in Red).
- Once connected the Document library web part and file viewer web part looks as shown below:
- Click on the Save as draft and Select Republish at the top right of the page to commit your changes.
- When we select any documents from the document library web part, it displays the selected document will be displayed in the SharePoint file viewer web part.
- This is how to work with dynamic preview in modern SharePoint file viewer web part.
SharePoint file viewer web part excel
Let us see how we can display an Excel spreadsheet by using the File Viewer web part in modern SharePoint,
To achieve this follow the below steps:
- Edit the SharePoint site page and Select column section and add the file viewer web part.
- Now select the excel spreadsheet from the below options.
- Recent: Choose from the recent files.
- OneDrive: You can even upload the files to OneDrive and choose from there. If your file is presented in OneDrive choose this option,
- Site: When you choose Site, it will display the document libraries, from where you can choose the excel spreadsheet that you want to display on the SharePoint site.
- Upload: It will allow you to upload the excel file from your local system. When you will upload the file, it will be saved in the SharePoint documents document library.
- From a link: You can also provide the excel file link directly.
In this example, I have uploaded the excel spreadsheet to the document library. Select the excel file that you want to display and click Open.
- Now, you can see the excel sheet on the page of a SharePoint site.
- Click on Republish.
- This is how we can display excel sheet in sharepoint online using the file viewer web part.
Modern File Viewer web part issues displaying ranges in Excel files
Let us see, how we can fix the file viewer web part issues, displaying ranges in Excel files in modern SharePoint.
- Edit the File Viewer web part, where you Uploaded the Excel File.
- Select Range Option from the dropdown.
- Now Add the Sheet Name of your excel spreadsheet under the Sheet Name Option.
- We can select and specify the range options as Starting cell and Ending cell to display the excel cell values.
- Select Apply and Click on the Republish to commit your changes.
- Now we can see the, File viewer web part displays the Excel cell for the Specified ranges.
This is how we can display ranges in an excel spreadsheet in the Modern SharePoint file viewer web part.
Read Enable Chart Web Part in SharePoint
SharePoint online file viewer web part resize
Let us see how we can resize the file viewer web part in the SharePoint Online,
On the Modern SharePoint site page, we can display the selected document content using the File viewer web part.
- Directly we cannot resize the file viewer web part in a Modern SharePoint page.
- There is an alternative way that we can display the selected document with the same size in a SharePoint site page.
- The alternative way that we can add and display the document to a SharePoint Online page is using Embed web part.
To Overcome this follow the below steps:
- Copy the URL of the document from the browser that you want to display it in the File viewer web part.
- Edit SharePoint page, add new section and search for Embed web part. Click on Embed web part from Search results.
- Edit the embed web part as shown below, and paste the copied URL into the Website address or embed code box. Click on Publish or Republish button to save the changes.
- We can see the expected output on the SharePoint site page as shown below:
- This is how we can display the document with the same size in a modern SharePoint file viewer web part.
The file viewer web part is a modern web part and is available in the modern SharePoint sites, but if you want to use it in a classic SharePoint site, what to do?
Page Viewer Web Part in SharePoint (Classic SharePoint)
If you want to display a page, file, or folder in a classic SharePoint site, then we can use the page viewer web part in SharePoint classic online or SharePoint 2013/2016, etc.
SharePoint Page Viewer Web Part is an out of box web part provided by Microsoft. By using this web part you can show a web page, file, or folder on a SharePoint classic page. But you can use the page viewer web part only in a browser that supports the HTML IFRAME element.
And you can display a file or a folder in Internet Explorer. The Page Viewer Web Part displays content asynchronously from the rest of the page.
To add page viewer web part in a SharePoint classic web part page, Open the SharePoint site and then Edit the page and then click on Add a Web Part. Then from the Web Part categories Select Media and Content.
From the Media and Content Web Part categories select Page Viewer web part. Then click on Add.
Once you will add the web part now you can configure the web part by clicking on the open the tool pane link on the web part. Once you will click on open the tool pane link, the Page Viewer properties dialog will open.
From the first section, you can choose from a radio button list what you want to display like Web Page, Folder, or File. Suppose you will select the Web Page then in the Textbox put the URL of the webpage as shown in the figure below.
Now the Web Page will appear inside the Page Viewer web part. You can also set all the other properties for the web part like here I have changed for width and height. The page looks like below:
Only secure content is displayed error in SharePoint Online page viewer web part
Let us see, how to solve Only secure content is displayed error in SharePoint. The error comes while using the Page viewer web part in SharePoint Online or SharePoint 2013/2016.
Recently I was using the page viewer web part in SharePoint Online site. I was displaying a URL inside the page viewer web part in a web part page. But in IE it was showing error as:
Only secure content is displayed. And once I click on Show all content. Then only it will show the content from the page viewer web part.
Only secure content is displayed sharepoint
Here below are two ways I resolved the issue “Only secure content is displayed”.
Options-1:
Inside my SharePoint Online page viewer web part, I was trying to show https://www.enjoysharepoint.com URL.
Since SharePoint Online site is an https site and this one is an HTTP site. It was showing that warning message. The page viewer web part URL was like below:
When I change the URL to an “https” URL. It started showing the page without the warning message.
Option-2:
The other option is can disable the warning message in the browser itself. Open Internet Explorer -> On the Tool menu, click Internet Options -> Click the Security tab and then click Custom level -> In the Settings box, scroll down to the Miscellaneous section, and under Display mixed content choose Enable.
It looks like below:
This is how to solve Only secure content is displayed error which comes in SharePoint Online page viewer web part.
Related SharePoint Online tutorials:
- SharePoint Online modern list properties web part
- SharePoint Current user filter web part
- RSS Viewer Web Part in SharePoint
- Create custom announcement web part using Rest API in SharePoint
- Site Feed web part in SharePoint
In this SharePoint tutorial, we have learned the SharePoint Online File Viewer web part, how to add a File Viewer web part for the SharePoint Online modern site page. And also covered below topics:
- File viewer web part in SharePoint Online
- Dynamic preview via file viewer web part
- SharePoint file viewer web part excel
- Modern File Viewer web part issues displaying ranges in Excel files
- SharePoint online file viewer web part resize
After working for more than 15 years in Microsoft technologies like SharePoint, Office 365, and Power Platform (Power Apps, Power Automate, and Power BI), I thought will share my SharePoint expertise knowledge with the world. Our audiences are from the United States, Canada, the United Kingdom, Australia, New Zealand, etc. For my expertise knowledge and SharePoint tutorials, Microsoft has been awarded a Microsoft SharePoint MVP (9 times). I have also worked in companies like HP, TCS, KPIT, etc.
Can I put a default document to be previewed into the File Viewer, before any selection?
How do I CONVERT FILES, IN OTHER WORDS, how do I get the film from the 1-file-viewer ???