View Categories

How To Embed Document And PDF In WordPress

7 min read

With EmbedPress, now you can easily embed documents and PDF into your WordPress website with just a single click. The ultimate embedding solution brings you a fully responsive EmbedPress PDF block for Gutenberg editor and an EmbedPress PDF widget to help you embed any PDF on the Elementor website builder.

Similarly, you will also get a ‘Document’ block and widget to help you embed documents in any format – be it a PowerPoint presentation, a spreadsheet, a Word document, or more. 

How To Embed PDFs In Gutenberg Editor Using PDF Block? #

Follow these steps given below to embed documents and PDF of any file type in your WordPress website using the Gutenberg editor.

Step 1: Insert EmbedPress PDF Block #

Create a new post or page from your WordPress dashboard and click on the ‘+’ icon on top of the web page or anywhere in your content area of the Gutenberg editor. Search for ‘PDF’ or ‘EmbedPress’, and select the EmbedPress PDF block, as shown below.

embed document and PDF

Step 2: Upload Your PDF Or Document #

To embed your PDF or documents, simply click on the ‘Media Library’ button and choose the PDF that you want to embed on WordPress. EmbedPress will automatically upload the embedded PDF or document file into your post or page.

embed document and PDF

Step 3: Edit & Publish Your PDF  #

You can add some customization and choose how you want to showcase your embedded PDF or document. You can adjust the width and height of your PDF from the options under the Block tab on your right-hand side. You can also toggle to hide the ‘Powered By EmbedPress’ text if you want.

embed document and PDF

Now under the ‘PDF Control Settings’ you can enable the toolbar option with the proper placement. Additionally, you can enable Presentation mode, Print/Download option, Copy Text, Rotation, and much more. 

Click on the ‘System Deafult’ dropdown to select your preferable PDF themes. There are 4 available options for you to choose from. If you set your preset as ‘Custom’ then you can choose your favorite color palette for your pdfs. 

embed document and PDF

Additionally, you can enable Presentation mode, Print/Download option, Copy Text, Rotation, Draw, and much more. 

Note: Make sure to install EmbedPress pro to get the Print/Download option and the Presentation feature. 

embed document and PDF

By enabling the ‘Draw‘ feature you can add any custom text or highlight with your preferred color choice.

embed document and PDF

When you are done, publish and preview your WordPress content and a fully responsive PDF or document file will be available for your website visitors to view. 

How to Embed PDFs In Elementor Using PDF Widget? #

You can use EmbedPress with Elementor to embed documents and PDFs of any kind in your WordPress website by following the detailed steps below. 

Step 1: Insert The EmbedPress PDF Widget #

First, create a new page from your WordPress dashboard by navigating to Pages→ Add New and then click on the blue ‘Edit With Elementor’ button.

Then search for the ‘EmbedPress PDF’ or ‘EmbedPress Document’ element from under the ‘Elements’ tab in the editor’s side panel. Next, drag and drop this element anywhere on your page where you want to embed your PDF or document. 

embed document and PDF

Step 2: Upload Your PDF On The Elementor Editor #

From the ‘Content’ tab on the side panel, you can choose the Document type from under the ‘Content Settings’ and then click on the media icon under the ‘Upload File’ section to upload your  PDF or document. EmbedPress will automatically embed the PDF into your website.

embed document and PDF

Step 3: Edit & Publish Your PDF #

You can adjust the width and height of your PDF or document, and even choose the alignment from the Elementor Editor. You can also toggle to hide or show the ‘Powered By EmbedPress’ text.

embed document and PDF
How To Embed Document And PDF In WordPress 21

Now under the ‘PDF Control Settings’ you can enable the toolbar option with the proper placement.

If you click on the ‘System Deafult’ dropdown, you can select your preferable PDF preset. There are 4 available options for you to choose from. If you set your preset as ‘Custom’ then you can choose your favorite color palette for your pdfs.

embed document and PDF

Additionally, you can enable Presentation mode, Print/Download option, Copy Text, Rotation, Draw, and much more. 

embed document and PDF

You can draw any text on your PDF embed easily. Simply, click on the place you want your text or highlight to add & you are good to go. 

embed document and PDF

Note: Make sure to install EmbedPress pro to get the Print/Download option and the Presentation feature. 

When you are done, click on ‘Publish’ and preview to see how a fully responsive and functional PDF or document has been embedded by EmbedPress.

How To Embed Documents In WordPress Using Document Blocks & Widgets? #

As mentioned earlier, EmbedPress also provides a Document Block for Gutenberg and a Document widget for Elementor to enable you to embed any type of document you want website: PDF, DOC/DOCX, PPT/PPTX, XLS/XLSX, etc.

The steps to embed Document Block in your Gutenberg editor are the same as those mentioned above for the PDF block. This time, you will only have to search for ‘Document’ to insert the block onto your editor, as shown below.

embed document and PDF

 

Similarly, you need to follow the same steps mentioned above to embed the ‘EmbedPress Document’ widget in the Elementor editor. 

embed document and PDF

Next, upload your required document and customize it as necessary. Once you have finished, simply publish the content and EmbedPress will embed a fully responsive document to your WordPress website, as shown below. 

embed document and PDF

How To Embed PDFs In Classic Editor, Divi, Beaver Builder & Others? #

Using the EmbedPress plugin’s exclusive feature Shortcode, you can easily embed PDFs in Classic Editor, Beaver Builder, Divi, Oxygen builder, and all other popular page builders. Follow this step-by-step guide to embedding PDFs in Classic Editor and other popular builders. 

Step 1: Upload Your PDF To The Website #

If you want to embed PDF in Classic editor, you have to upload the PDF first. From your WordPress dashboard, go to Media → Add New. Then upload your PDF there, it will be instantly uploaded. Make sure, the PDF size is less than 300 MB. 

embed document and PDF

Step 2: Collect Uploaded PDF URL  #

Now, you have to get the PDF URL. right after uploading the PDF, you will get the option to copy the URL by clicking on ‘Copy URL to clipboard’. Or you can visit ‘Library’ from the Media tab and copy the PDF URL seamlessly. 

embed document and PDF

Step 3: Convert PDF URL Into Shortcode #

Navigate to the EmbedPress tab. From there, go to General → Shortcode. Paste your URL in the input field and click on the ‘Generate’ button. Then the shortcode will be created instantly. Now click on the Copy icon to copy the shortcode. 

embed document and PDF

The PDF shortcode is ready to embed. Now you can paste the shortcode on Classic Editor and all other page builders. 

Step 4: Embed PDF Shortcode In Classic Editor #

To embed PDF shortcode in Classic editor, open a new page or post on the Editor. Then embed the PDF shortcode there and publish the page. The PDF will be instantly embedded. This is how easily you can embed PDFs in Classic Editor, Divi, and other page builders. 

embed document and PDF

How To Add Custom Branding To Document & PDF Embeds?  #

EmbedPress also comes with the advanced feature to embed custom logo and CTA for your embedded documents and PDF and customize them further to match your brand. Check out this documentation to learn the procedure.

embed document and PDF

With these simple steps, you can embed documents or PDFs, and add custom branding, instantly to your WordPress website with EmbedPress using the Gutenberg editor or the Elementor Editor.

If you are facing problems and require further assistance, feel free to contact our support or join our Facebook Community to get in touch with WordPress experts and content creators like yourself.

Powered by BetterDocs