In WordPress, when you “Add Media” and include a link to the image you’re adding to your page, that link will take you to a whole separate page with the full-size image shown, and then you would have to right click in order to download that image.

But what if you’re wanting to provide an image as a direct download, such as you’d see on sites like It’s actually pretty simple to accomplish. And you could either create a button that links to the image, or just link the image itself. Here’s the gist of it:

<a download="name-of-file-with-extension-but-no-path.png" href="path-to-image/name-of-file.png" title="Download This Image"><img src="path-to-image/name-of-file.png" class="img-responsive"></a>

Note that the image class “img-responsive” is from Bootstrap v3. If you aren’t using Bootstrap 3, you can omit that. If you’re using Bootstrap 4, the class to use is “img-fluid”.

Give it a try by clicking here.

Subscribe and receive my FREE eBook

4 MISTAKES You’re Making on Your Website that are Costing You MONEY!

  • This field is for validation purposes and should be left unchanged.

The Author


Leave a Reply

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

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Ready to chat about how ThePixelPixie can help?