top of page

How to Easily Embed a PDF Viewer in Your Wix Blog Post

Adding a PDF viewer to your Wix blog post can significantly enhance your readers' experience, allowing them to view important documents, forms, or portfolios directly on your page. Fortunately, Wix makes this process straightforward by using the Embed element along with a simple piece of HTML code. In this tutorial, we'll guide you through each step to seamlessly integrate a PDF viewer into your post.


Example of a PDF Viewer:




Step 1: Upload Your PDF to the Wix Media Library


Before embedding your PDF into a blog post, you'll need to upload the file to the Wix Media Library. This ensures that your document is stored securely on Wix's servers and is accessible to your readers. Here's how to do it:


  1. Go to your Wix site's dashboard.

  2. Click on "Media" on the left-hand side menu to access the Wix Media Library.

  3. Select "Upload Media" and choose your PDF file from your computer.

  4. Once uploaded, click on your PDF file in the Media Library to view its details.



Step 2: Copy Your PDF's URL


To embed the PDF into your blog post, you'll need the direct URL to the file. Wix makes it easy to obtain this:


  1. With your PDF file selected in the Media Library, look for the "File Info" option.

  2. Click on "File Info" to open the file's details.

  3. Locate and click on the "Copy URL" button. This URL is what you'll use to embed the PDF in your blog post.



Step 3: Embed the PDF Viewer in Your Blog Post


Now that you have your PDF uploaded and its URL copied, you're ready to add it to your blog post using an Embed element and HTML code. Follow these steps:


  1. Open the blog post editor in Wix where you want to embed the PDF.

  2. Click on the "+" icon to add a new element and select "HTML Code" from the menu.

  3. Click on Edit HTML and choose the "HTML Code" option.

  4. Paste the following HTML code into the HTML box:

htmlCopy code

<!DOCTYPE html> <html> <object data="YOUR_PDF_FILE_URL" type="application/pdf" width="100%" height="500px"> <p>Unable to display PDF file. <a href="YOUR_PDF_FILE_URL">Download</a> instead.</p> </object> </html>

  1. Replace YOUR_PDF_FILE_URL in the code with the URL you copied from the Wix Media Library.

  2. Click "Update" to save the changes.


And that's it! You now have a fully functional PDF viewer embedded within your Wix blog post. This allows your readers to view the PDF directly on your page, enhancing their experience and engagement with your content.



Final Thoughts


Embedding a PDF viewer into your Wix blog post is a simple yet effective way to share documents with your readers. By following the steps outlined above, you can easily add this functionality to your site, ensuring your audience has immediate access to important PDFs without having to leave your blog. Whether you're sharing a digital portfolio, product catalogs, or informational resources, this method provides a professional and seamless way to present your documents.


Remember, the key to a successful embed is ensuring the PDF file is properly uploaded to your Wix Media Library and using the correct URL in the HTML code. With this approach, you can effortlessly integrate PDF viewing capabilities into your Wix blog posts.

留言


ABOUT WIXCREATE

Welcome to WIXCreate, your top-level WIX Partner! Our experienced team of digital professionals has built hundreds of beautiful and functional websites using the WIX platform for companies and organizations around the world.

 

We're passionate about helping businesses like yours succeed online. With our expertise in design, development, and digital marketing, we're here to support you every step of the way. Whether you're looking to create a new website, improve your online presence, or drive more leads and sales, we're here to help you achieve your goals.

HOW CAN WE HELP?

We offer the following services:

  • Design and development of new websites

  • Migration of existing websites to WIX

  • Help with managing and updating existing WIX websites

  • Ongoing website maintenance and support

  • SEO optimization to improve your website's search engine ranking