Как сделать, чтобы при клике на файл (pdf, doc, xlsx) он скачивался, а не открывался в браузере?

Всем привет! если вы владеете интернет магазином, то ситуация которую я сейчас опишу будет вам знакома! ) Управляя интернет магазином или блогом (советую почитать мою прошлую статью как выбрать хостинг для сайта) необходимо размещать какую то информацию или прайс листы в формате (pdf, docx, xlsx) но при клике на файл, он у вас открывается в браузере, а вам надо чтобы он при клике у вас было окно с запросом скачать на компьютер! В 99% случаях будь то WordPress или Opencart там изначально идет открытие файлов в браузере и сейчас я покажу как это можно сделать в виде скачивания.🔥

Атрибут — Download в HTML5

✅ Сразу скажу, что данный способ можно решить разными методами, но  мы рассмотрим самый простой и в этом нам поможет новый параметр тега <A>, который появится только в HTML 5 . Данный атрибут поддерживается всеми браузерами.

Как использовать атрибут download?

✅ Данный атрибут не имеет никаких параметров просто прописываете его в ссылке и всё. После этого браузер не будет переходить по прямой ссылке, а сразу предложит скачать файл.

🔥 Какие файлы можно скачать используя атрибут download: pdf, xls, xlsx, doc, docx, png, jpg, mp3 и другие не открывая его.

Это можно использовать в след ситуациях:

  • скачивание файла при клике на изображение
  • 🔥 скачивание файла при нажатии на кнопку
  • скачивание изображений по клику
  • 🔔 принудительное скачивание файла вместо просмотра в браузере
  • запустить загрузку файла при клике на ссылку или кнопку
  • ⛔️ скачивание файла вместо открытия в браузере
  • Как добавить ссылку для скачивания файла

Видео инструкция

подписаться на канал айтишника
Рейтинг
( Пока оценок нет )
nibbl/ автор статьи

Я отец двух сыновей, ITишник, предприниматель и просто человек который любит делиться полезной информацией с другими людьми на такие темы как: Windows, Unix, Linux, Web, SEO и многое другое!

Понравилась статья? Поделиться с друзьями:
Блог ITишника и просто человека
Комментарии: 1
  1. Антон

    chrome://settings/content/pdfDocuments

Добавить комментарий

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!: