andre/30-seconds-of-code
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add downloadable file customization tip

Browse Source
This commit is contained in:
Chalarangelo
2021-01-11 05:00:00 -04:00
parent b248230e9d
commit ff3cbf4ddc
2 changed files with 17 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
blog_images/hard-disk.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 MiB

17
blog_posts/custom-file-download-names.md Normal file
View File

@ -0,0 +1,17 @@
---
title: "Tip: Customize the names of downloadable files"
type: tip
tags: webdev,html,browser
authors: chalarangelo
cover: blog_images/hard-disk.jpg
excerpt: Learn what HTML5 attribute you can use to customize the names of your downloadable files with this quick tip.
---
HTML5 introduced a variety of convenient features that many of us use every day. As downloadable links aren't something I work with very often, I recently found out that you can use the `download` attribute on an `<a>` element for much more than just making it trigger a download. In fact, you can pass it a string value that will act as the name of the downloadable file, effectively allowing you to customize its name:
```html
<!-- The downloaded file will be named 'June-2020.csv' -->
<a href="/data/2020/06/report.csv" download="June-2020.csv">June 2020</a>
```
**Image credit:** [Frank R](https://unsplash.com/@frank041985?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText) on [Unsplash](https://unsplash.com?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText)