Inserting PDF viewer in Posts/Pages

In the last chapter, you’ve created your first PDF viewer, Now it’s time to insert the viewer on any of your posts or pages on your WordPress Website. This chapter is useful only if you’re using the default WordPress Gutenberg Block Editor or Classic Editor.

If you’re using any page builders like Elementor, Divi, or WPBakery Page Builder, we have addons for those page builders. Please check the Add-ons and integrations section in that case.

1. Go to Add or Edit any page or posts
2. If you’re using Gutenberg Block Editor, click on Add Block icon
   1. Search for PDF viewer Block
   2. Click on Add PDF viewer Button
   3. Select Embed a PDF viewer if you want to embed a PDF viewer using iFrame on the page you’re editing.
      1. On Select Viewer to Embed, Search & select by the title of the PDF viewer you’ve created and want to embed on this page.
      2. Set width, and height, jump to page & iframe_title parameters of your choice & click on insert PDF viewer.
      3. All these settings are for the iframe that will be embedded on the page.
      4. Now, Publish or update the page & then view the page to see PDF viewer embed there.
   4. Select Link to a PDF viewer if you want to insert a link on the page that will open the PDF viewer when clicked.
      1. On Select Viewer to Link to, Search & select by the title of the PDF viewer you’ve created and want to link from this page.
      2. Set Link Text, Target, jump to page and CSS class of your choice & click on Insert PDF viewer
      3. Now, Publish or update the page & then view the page to see PDF viewer link there.
3. If you’re using Classic Editor, Click on ADD PDF viewer button just above the editor
4. Select Embed a PDF viewer if you want to embed a PDF viewer using iFrame on the page you’re editing.
   1. On Select Viewer to Embed, Search & select by the title of the PDF viewer you’ve created and want to embed on this page.
   2. Set width, and height, jump to page & iframe_title parameters of your choice & click on insert PDF viewer.
   3. All these settings are for the iframe that will be embedded on the page.
   4. Now, Publish or update the page & then view the page to see PDF viewer embed there.
5. Select Link to a PDF viewer if you want to insert a link on the page that will open the PDF viewer when clicked.
   1. On Select Viewer to Link to, Search & select by the title of the PDF viewer you’ve created and want to link from this page.
   2. Set Link Text, Target, jump to page and CSS class of your choice & click on Insert PDF viewer
   3. Now, Publish or update the page & then view the page to see PDF viewer link there.