Making files available for download

Published: 20 July, 2021 | Category: WordPress Help

We are assuming some knowledge of how to open WordPress posts and pages, gained either from the reader’s own experience of from our First Steps page.

Why bother with downloadable files?

Offering downloadable documents from a website has many applications. Whether it’s agendas or minutes of a meeting, application forms to print out or policies and pricings that need regular updating, there is a myriad of reasons for offering downloadable files in universal formats such as pdf.

Many organisations have two parts to their website. They have public-facing part explaining who they are, and a large private section hidden behind a password-protected gateway. This can contain personal information for committee members only. Making files available for download here saves a lot of work and time.

Let’s get started with adding files for download

Documents for download are stored in the Media Library. They can be uploaded either in advance or at the point of needing to insert them into a Page or Post. Uploading is as for images. Drag and drop the files, or use the browse button to find the files on your computer.

To add the file to a Page or Post from within that Page or Post’s editing area, start by creating a new block. Either press the return key on your keyboard or click the little + Plus sign at the top left of your screen. When browsing the choice of blocks, look for the section called Media, and click on the block called File:

Choosing a WP block
WordPress file block

At this point, you have a choice between uploading the file there and then, or going to the Media Library for a previously uploaded file. You can now see the pdfs (and also docx files, if using). We recommend that documents for download be available as universal pdf, not proprietary formats such as Word or Pages.

Pdf document in the Media Library

Select your desired file by clicking on it and clicking the Select button bottom right of the screen. The system inserts the link to the file into your Post or Page using the filename as link text (you can edit this afterwards) and next to it, a button with the text “Download”.

At the front end, both the link text and the button will activate the download. The link text, in this case Privacy Document, is automatically set from the file’s name (the words before the .pdf ending). You can edit it later.

Plain file download button

The result is functional but a bit boring. Ask Applegreen Websites to add some colour and make sure the look of the button reflects your theme:

Styled file download buttons

Inline document presentation

Oops! Does your page look like this?

Making files available for download

If you like seeing the whole document on your page, that’s good! But it takes a lot of space so you may prefer the button presentation as in the examples above. If so, click on the document block and from the options settings in the right sidebar, untick the button that says “show inline embed”:

Turning off inline embed

Don’t forget to save or update your work.

Has all this changed since the introduction of the Gutenberg block editor?

You bet. Before the block editor, adding downloadable files was really simple. An “Add Media” button above the main content box took you to the Media Library where you could see and select pdf documents. You could also access mp3s and other non-image files through this method.

The “Add Media” button has disappeared now that the content is made up of blocks. There is no longer a content box as such. The image block takes you to the Media Library but only shows files image file formats (jpg, png or gif). Pdfs may be present in the Libary, but they don’t show up.

The Gutenberg block editor has evolved since it was first launched. The special block to enabling making files available for download is a great advance.

And now?

There are plenty more tips for using WordPress. Just look at the links below or see the list in the navigatifor


Category: WordPress Help

← Previous post: Adding a table to a WordPress Page or Post

→ Next post: SEO and Keyword Placement in WordPress