How to Embed PDF in Blogger

How to Embed PDF in Blogger

 Do you want to embed PDF files in your Blogger Website?  Well, In this article i will share with you the easiest way to embed PDF in any webpage. 

As you know we can’t upload pdf files to the Blogger website. So, for this, we need to upload our PDF file to a third-party service like Google Drive. 

There are three ways to Embed PDF files in HTML. 

  • Using <Object> tag
  • Using an <iframe> tag
  • Using <embed> tag

But, in this Tutorial, we will use the HTML iframe to embed the PDF file in the Blogger website as it is widely supported in all browsers. 

YouTube video

Steps to embed a PDF file in Blogger

  1. First of all, Upload the PDF file to Google Drive.
  2. Now change the share link permission to public view and copy the link to the clipboard. 
  3. Now you need to add the below iframe code in the HTML view of the blog post. 
  4. Then change the Gdrive file id with the given code and save the post. 
Google Drive File share link
<iframe loading="lazy" width="100%" height="800" src="https://drive.google.com/file/d/1LtZ0sVLWZOiKzno2Xl8Yyy9YGQNoUMoe/preview?usp=sharing"></iframe>

In the above code, you need to change this id 18bJlmnGH7e1Ku_f1CHdNDt2L6rnBBkJc

Now the pdf file is embedded in the Blogger website successfully. 

If you don’t want your users to download the pdf file to their computer and they will be able to just view the pdf file then follow the steps as shown in this video.

You can also adjust the height and width according to the pdf file and the webpage dimensions.

YouTube video

By following the steps in this guide, you can easily embed PDF files into your Blogger website using Google Drive. This is a simple and effective way to enhance your blog with downloadable or viewable PDFs.

I hope you found this article helpful. If you have any questions, feel free to leave a comment below or contact me!

FAQs

No, Blogger does not support direct PDF uploads. You’ll need to use a third-party service like Google Drive to host your PDF files and then embed them into your blog post using an iframe.

To prevent users from downloading the PDF, you can set the Google Drive share link to “View Only.” This way, visitors can view the file on your blog but wonโ€™t have the option to download it.

Yes, but you need to ensure that the iframe is responsive. You can adjust the width to 100% and set an appropriate height for the best viewing experience on different devices.

If the PDF isnโ€™t displaying, double-check the file ID in the embed code and ensure that the Google Drive share permissions are set to “Anyone with the link can view.” Additionally, make sure the link is formatted correctly for embedding.

Yes, you can host your PDF file on other platforms or servers and embed it using the , <object>, or <embed> tag. However, Google Drive is the simplest and most reliable option for most users.

Related Articles..

Leave a Reply

Your email address will not be published. Required fields are marked *