Carregando...

Como criar um link de Download Direto

Postado: 1 de janeiro de 2022

Como criar um link de Download Direto

Neste artigo veja como criar um link de Download no Html5 utilizando o atributo “download” do HTML5

Utilizando o atributo Download do Html5

Baixe o arquivo ao clicar no link (em vez de navegar até o arquivo):

Ná prática!

<a href="images/foto.jpg" download>Baixar Foto</a>

Definição e Uso na Prática

O atributo download especifica que o destino (o arquivo especificado no atributo href) será baixado quando um usuário clicar no link.

O valor opcional do atributo download será o novo nome do arquivo após o download. 

Não há restrições aos valores permitidos e o navegador detectará automaticamente a extensão de arquivo correta e a adicionará ao arquivo (.img, .pdf, .txt, .html, etc.).

Se o valor for omitido, o nome do arquivo original será usado.

O atributo download também permite que você renomeie o nome do arquivo antes de efetuar o download.

Quando o arquivo está hospedado no servidor, especificamente se foi gerado automaticamente, ele pode ser nomeado pelo sistema com números e traços.

Exemplo

Especifique um valor para o atributo de download, que será o novo nome do arquivo baixado (“imagem-grande.jpg” em vez de “foto.jpg”):

<a href="downloads/imagem-grande.jpg" download="imagem-fullhd.jpg">Baixar Foto</a>

Se você não quiser Renomear o nome do arquivo deixe assim:

<a href="images/foto.jpg" download>Baixar</a>

Se você quiser baixar um arquivo em PDF direto, você pode aplicar o atributo download, ao invés de abrir o arquivo.pdf ele vai baixar DIRETO

Veja:

<a href="pasta/artigo-sobre-html.pdf" download="">Baixar Artigo</a>

No html5 baixar um arquivo realmente ficou muito fácil né mesmo.

Publicado por: Loop Nerd

2.447 Visualizações

3 respostas para “Como criar um link de Download Direto”

  1. loopnerd disse:

    uma dica para aprender a fazer sites é !
    um site é feito por partes.

    Cabeçalho;
    Corpo;
    Rodape;
    Menus;
    Banner;
    Links;
    Botões.

    Ou seja aprenda por camadas.
    exemplo: aprenda em fazer menus simples bem feitos. depois foca em fazer botões com html e css. e assim por diante…

  2. loopnerd disse:

    Olá deova!
    Obrigado por visitar o BLOG.
    e fico Feliz que você estar aprendendo.
    aos poucos você vai pegando conhecimento…
    Eu vi aqui o seu primeiro site. olha ficou legal.

    Posto artigos todos os dias.
    do básico ao mais avançado.

    qualquer dúvida deixe nos comentários que te ajudo.
    tudo de bom sucesso…

  3. deova disse:

    bom dia, sou novo no html, estou nos primeiros passos,
    criei meu primeiro site com a ajuda de vocês, fico agradecido mesmo de coração.
    tenho muitas dúvidas ainda, mas aos poucos chego lá
    eu faço down todo dia no site pra treinar e cada dia aprendo coisas novas
    meu primeiro site está criado vai ter alguns erros com certeza e aceito as críticas ok
    abraço e muitissimo obrigado mesmo

Deixe um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *

Artigos Relacionados