DeKnows

<p>A simple PDF viewer widget for Elementor that displays PDFs directly on your website.</p>
<h4>What It Does</h4>
<ul>
<li>Shows PDFs in a clean viewer with zoom controls</li>
<li>Works with PDFs uploaded to your site or external URLs</li>
<li>Responsive design that works on mobile and desktop</li>
<li>Download and print buttons for users</li>
</ul>
<h4>Features</h4>
<ul>
<li><strong>PDF Rendering</strong>: Powered by PDF.js for fast and reliable display</li>
<li><strong>Zoom Controls</strong>: Zoom in/out with smooth scaling (25% to 300%)</li>
<li><strong>Fullscreen Mode</strong>: Immersive viewing experience</li>
<li><strong>Download & Print</strong>: One-click download and print functionality</li>
<li><strong>Page Navigation</strong>: Intuitive previous/next page controls</li>
<li><strong>Responsive Design</strong>: Perfect display on all devices</li>
<li><strong>Accessibility</strong>: Keyboard navigation and screen reader support</li>
<li><strong>Custom Styling</strong>: Extensive Elementor styling options</li>
<li><strong>Multiple Sources</strong>: Support for URL and file upload PDF sources</li>
</ul>
<h3>Usage</h3>
<ol>
<li>Edit a page with Elementor</li>
<li>Add the “PDF Smart Viewer” widget</li>
<li>Choose your PDF file or enter a PDF URL</li>
<li>Customize the settings as needed</li>
</ol>
<h3>Settings</h3>
<p>Go to <strong>Settings <span aria-hidden="true" class="wp-exclude-emoji">→</span> PDF Smart Viewer</strong> to configure:<br />
* Default zoom level<br />
* Default height (100% by default)<br />
* Which buttons to show</p>
<h3>Coming Soon</h3>
<ul>
<li><strong>Remote PDF Support</strong>: Load PDFs from Google Drive, Dropbox, etc.</li>
<li><strong>More Features</strong>: Thumbnails, search, annotations</li>
</ul>
<h3>Support</h3>
<p>Need help? Contact us at <a href="https://deknows.com" rel="nofollow ugc">deknows.com</a></p>
<h3>Credits</h3>
<ul>
<li><strong>Development</strong>: Mr. Hamad Khan – Founding Partner – Lead Development and Operations @Deknows Inc</li>
<li><strong>Development</strong>: Mr. Amanat Ali – WordPress Site Builder @Deknows Inc</li>
<li><strong>PDF.js</strong>: Mozilla Foundation (https://mozilla.github.io/pdf.js/)</li>
<li><strong>Elementor</strong>: Elementor Ltd (https://elementor.com/)</li>
</ul>


PDF Smart Viewer for Elementor

A simple PDF viewer widget for Elementor that displays PDFs directly on your website.

Ben Lawson

Thomas McMahon

<p>Incorporate <a href="https://github.com/mozilla/pdf.js/" rel="nofollow ugc">Mozilla’s PDF.js</a> viewer into your pages and posts via a Gutenberg block or a simple shortcode. PDF.js is a javascript library for displaying pdf pages within browsers.</p>
<p>Features:</p>
<ul>
<li>Gutenberg Block and Shortcode</li>
<li>Translation Support (plugin only): Spanish and French included, ready for more languages</li>
<li>Elegant Theme that adapts to dark and light mode (if browser supports dynamic CSS)</li>
<li>Customizable buttons</li>
<li>Page navigation drawer</li>
<li>Search functionality</li>
<li>Protected PDF password entry</li>
<li>Loading bar & displays partially loaded PDF (great for huge PDFs!)</li>
<li>Document outline</li>
<li>Classic Editor: Easy to use editor media button that generates the shortcode for you</li>
<li>Support for mobile devices</li>
</ul>
<p>Shortcode Syntax:</p>
<pre><code>`
</code></pre>
<p>[pdfjs-viewer attachment_id=123 viewer_width=600px viewer_height=700px fullscreen=true download=true print=true]<br />
    `</p>
<p>Or use a direct URL:</p>
<pre><code>`
</code></pre>
<p>[pdfjs-viewer url=http://www.website.com/test.pdf viewer_width=600px viewer_height=700px fullscreen=true download=true print=true]<br />
    `</p>
<p><strong>Shortcode Parameters:</strong></p>
<ul>
<li><code>attachment_id</code> (recommended): ID of the media file in WordPress media library</li>
<li><code>url</code> (alternative): Direct URL to PDF file. Use <code>attachment_id</code> when possible for better security.</li>
<li><code>viewer_width</code> (optional): Width of the viewer (default: <code>100%</code>)</li>
<li><code>viewer_height</code> (optional): Height of the viewer (default: <code>800px</code>)</li>
<li><code>fullscreen</code> (optional): <code>true</code>/<code>false</code>, displays fullscreen link above viewer (default: <code>true</code>)</li>
<li><code>fullscreen_text</code> (optional): Text for the fullscreen link (default: <code>View Fullscreen</code>)
<ul>
<li>Spaces not allowed. Use <code>%20</code> in place of spaces.</li>
</ul>
</li>
<li><code>fullscreen_target</code> (optional): <code>true</code>/<code>false</code>, open the fullscreen link in a new tab (default: <code>false</code>)</li>
<li><code>download</code> (optional): <code>true</code>/<code>false</code>, enables or disables download button (default: <code>true</code>)</li>
<li><code>print</code> (optional): <code>true</code>/<code>false</code>, enables or disables print button (default: <code>true</code>)</li>
<li><code>openfile</code> (optional): <code>true</code>/<code>false</code>, show open file button (default: <code>false</code>)</li>
<li><code>zoom</code> (optional): Initial zoom level – <code>auto</code>, <code>page-actual</code>, <code>page-fit</code>, <code>page-width</code>, or percentage like <code>75</code>, <code>100</code>, <code>150</code> (default: <code>auto</code>)</li>
</ul>
<p>Want to help develop the plugin? Found a bug? <a href="https://github.com/TwisterMc/PDF.js-Viewer-Shortcode" rel="nofollow ugc">Find us on GitHub</a>. For build instructions and contribution guidelines see the developer guide in <code>DEVELOPER.md</code>.</p>
<h3>Admin Notice After Updates / Invalid Block</h3>
<p>When you update the plugin, editors may see an admin banner explaining that Gutenberg could show an “Attempt Block Recovery” prompt when editing older posts with PDFs. Clicking it updates the block format; it does not affect what visitors see. You can dismiss the banner, and it won’t reappear until a future release enables it again.</p>
<h3>License</h3>
<p>This WordPress plugin is licensed under GPLv2 or later.</p>
<p>PDF.js (included in this plugin) is developed by Mozilla and licensed under the Apache License 2.0. See the <a href="https://github.com/mozilla/pdf.js" rel="nofollow ugc">PDF.js repository</a> for details.</p>


PDF.js Viewer


I was impressed with the level of support provided with the recent issue where the plugin stopped displaying due to Mozilla’s PDFjs, and they started using mjs files.



Thank you for an excellent plugin.


PDF Smart Viewer for Elementor vs PDF.js Viewer