Le HTML5 c’est sympa, ça nous a bien simplifié la diffusion de nos épisodes dans une page web.

Mais si il y a bien un truc qui m’énerve, c’est le fait que lorsque je donne un lien pour télécharger un fichier que le navigateur sait lire… il va le lire dans un nouvel onglet ce c###### !

Exemple : Voilà le genre de comportement lorsque je clique sur un lien vers un fichier mp3 (sur Chrome) :

c’est nul.

Si j’ai mis un lien “Télécharger” c’est pour le… télécharger, oui ! Du coup c’est un peu nul.

Technique 1 : Côté site

Voici une technique hyper simple si vous avez la main sur votre code :

Modifiez vos liens vers vos fichiers initialement écrits comme ça :

<a href="lien/vers/le/fichier.mp3"> Texte à cliquer </a>

Et ajoutez “download” à la fin du début de la balise, comme ceci :

<a href="lien/vers/le/fichier.mp3" download> Texte à cliquer </a>

Technique 2 : Côté hébergement des fichiers

Voici la technique si vous avez vos fichiers stockés sur un hébergement sur lequel vous avez un peu la main :

Ouvrez un éditeur de texte :

  • sous Windows:  NotePad ou Bloc-Note
  • sous OS X: TextEdit 

Créez un nouveau fichier et copiez-coller ça :

<FilesMatch ".(mov|mp3|jpg|pdf)$">

  Header set Content-Disposition attachment

</FilesMatch>

“mov|mp3|jpg|pdf” de la première ligne indique les extensions de fichiers à télécharger au lieu de les lire dans un nouvel onglet. Vous pouvez donc choisir quels fichiers seront ouverts dans un nouvel onglet et lesquels seront téléchargés.

Attention: mp3 et MP3 seront considérées comme des extensions différentes

Voici ce que je recommande pour un podcasteur :

<FilesMatch ".(MP3|mp3|mp4|MP4)$">

  Header set Content-Disposition attachment

</FilesMatch>

Enregistrez ce fichier (peu importe le nom pour l’instant) et utilisez votre client S/FTP pour aller le mettre dans le dossier contenant vos fichiers; sur votre serveur/hébergement.

Renommez-le “.htaccess” (oui, le point au début est important)

le fichier .htaccess au milieu des autres fichiers média

Dans tous les cas : BOUM ! ça marche !

C’est beau la technologie !
(ce flash est présent dans la version .htaccess uniquement puisque ça ouvre rapidement un nouvel onglet)

Note : Pensez à vérifier que ça marche toujours pour les lecteurs de podcast si vous utilisez le .htaccess, on ne sait jamais.

Forcer le téléchargement des fichiers : 2 techniques

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *