This is a Hugo Shortcode developed for use in Hugo based websites. This shortcode allows you to embed a PDF file in a page on your Hugo website. It is developed using the PDF.js library by Mozilla.
Note: This shortcode is for use in Hugo based websites. It will not work anywhere else.
- Clone this repository
git clone https://github.com/anvithks/hugo-embed-pdf-shortcode.git
cd hugo-embed-pdf-shortcode
- Copy the file
.layouts/shortcodes/embed-pdf.html
to./layouts/shortcodes
in your Hugo website directory.
Note: If you do not have a ./layouts/shortcodes
directory you can create it.
cp ./layouts/shortcodes/embed-pdf.html /path/to/your/hugo/website/layouts/shortcodes
- Copy the pdf.js library files from
./static/js/pdf-js
to./static/js
in your Hugo website directory.
Note: If you do not have a ./static/js
directory you can create it.
cp -R ./static/js/pdf-js /path/to/your/hugo/website/static/js/
In your Hugo website place the following shortcode in any of the markdown pages.
{{< embed-pdf url="./path/to/pdf/file/example.pdf" >}}
To hide pagination
{{< embed-pdf url="./path/to/pdf/file/example.pdf" hidePaginator="true" >}}
To hide loading spinner
{{< embed-pdf url="./path/to/pdf/file/example.pdf" hideLoader="true" >}}
- url (required) : The relative location of the file.
- hidePaginator (optional): Boolean which expects
true
orfalse
. Hides the paginator for single page documents. - hideLoader (optional): Boolean which expects
true
orfalse
. Hides the loading spinner while your document loads.
Note: Currently supports local file embed. If absolute URL from the remote server is provided, configure the CORS header on that server.
[Back to Top] You an reach me at:
- Twitter : @anvith3
For any bugs, enhancement requests, feature requests please raise issues here