Je vous propose un hack pour DLE en installant un nouveau bouton de téléchargement de fichier ou un bouton de pièce jointe avec téléchargement de fichier en arrière-plan pour DataLife Engine 11.x à 14.x. Le bouton Télécharger avec une fonction de téléchargement de fichiers d'arrière-plan plutôt intéressante On peut l'installé en quelques étapes, facile et simple. Un bouton de téléchargement unique (pièce jointe) , combine un design agréable, un style moderne avec une belle animation, le fichier est téléchargé en arrière-plan.
Une excellente solution de ressources avec beaucoup de fichiers sur les pages de contenu. Le bouton peut être parfaitement intégré sur des sites au design sombre, si vous le souhaitez, vous pouvez refaire la couleur du design du bouton. Après avoir cliqué sur le lien de la pièce jointe, un indicateur de téléchargement apparaîtra, une fois terminé, l'utilisateur pourra choisir où enregistrer le fichier sur son ordinateur.
1. Connectez-vous à votre site via FTP.
2. Téléchargez l'archive à la fin de l'article, dézippez-la et téléchargez le contenu dans le dossier de votre thème.
3. Ensuite, dans le fichier main.tpl avant la balise de fermeture
< /body >
Insérez
<script type="text/jаvascript" src="{THEME}/js/download_button.js">
4. Ici, dans la section HEAD, connectez la police:
<link href="https://fonts.googleapis.com/css?family=Roboto+Condensed" rel="stylesheet">
5. Ensuite, dans le styles.css de votre site (tout en bas), insérez:
/** © Artem Malcov **/
.black_button * {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.black_button *:before, .black_button *:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.black_button {
height: 61px;
width: 265px;
border-top: 1px solid #4b4b4b;
border-bottom: 1px solid #090909;
border-left: 1px solid #090909;
border-right: 1px solid #090909;
border-radius: 99px;
background: #313131;
background: -moz-linear-gradient(top, #313131 0%, #242424 100%);
background: -webkit-linear-gradient(top, #313131 0%, #242424 100%);
background: linear-gradient(to bottom, #313131 0%, #242424 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#313131", endColorstr="#242424", GradientType=0);
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
cursor: pointer;
transition: .2s;
margin: 0 auto;
}
.black_button:hover {
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4);
transition: .2s;
}
.black_button_one {
color: #838383;
font-family: "Roboto Condensed", sans-serif;
font-size: 18px;
height: 60px;
line-height: 60px;
text-shadow: 0 1px 2px rgba(0, 0, 0, .6);
width: 200px;
margin: 0 auto;
background: url("../dleimages/download.png") no-repeat center right;
}
.left_button span {
font-size: 13px;
}
.black_button_progress {
width: 200px;
margin: 0 auto;
color: #838383;
font-family: "Roboto Condensed", sans-serif;
text-shadow: 0 1px 2px rgba(0, 0, 0, .6);
display: none;
}
.right_button {
font-size: 24px;
float: left;
width: 60px;
text-align: right;
height: 60px;
line-height: 60px;
}
.left_button {
float: left;
width: 140px;
padding: 8px 0 0 0;
}
.progress_bar {
background: #222;
border-bottom: 1px solid #393939;
height: 10px;
border-radius: 99px;
box-shadow: inset 0px 1px 2px rgba(0, 0, 0, 0.5);
padding: 2px 0 0 0;
margin: 7px 0 0 0;
}
.progress_line {
background: #2c4c7f;
background: -moz-linear-gradient(left, #2c4c7f 0%, #c95cc6 50%, #f7b401 100%);
background: -webkit-linear-gradient(left, #2c4c7f 0%,#c95cc6 50%,#f7b401 100%);
background: linear-gradient(to right, #2c4c7f 0%,#c95cc6 50%,#f7b401 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#2c4c7f", endColorstr="#f7b401", GradientType=1);
height: 5px;
margin: 0 2px 0 2px;
border-radius: 99px;
position: relative;
max-width: 136px;
width: 0;
}
.progress_line div {
position: absolute;
height: 1px;
background: #fff;
border-radius: 99px;
opacity: 0.4;
left: 1px;
right: 1px;
}
6. Dans le dossier de votre thème, ouvrez le fichier attachment.tpl et remplacez tout le contenu par:
[allow-download]
<div class="black_button">
<div class="black_button_one">Cliquez et téléchargez</div>
<div class="black_button_progress">
<div class="left_button">
<span>Téléchargement.....</span>
<div class="progress_bar">
<div class="progress_line">
<div></div>
</div>
</div>
</div>
<div class="right_button">0%</div>
</div>
</div>
[/allow-download]
7. Assurez-vous ensuite d'installer le hack de cet article.
8. Nettoyez le cache de votre site. L'installation des boutons est terminée.
Installation facultative, mais si vous n'êtes pas autorisé à télécharger des torrents, vous pouvez résoudre ce problème comme suit.
1. Connectez-vous au site via FTP.
2. Ouvrez le fichier .htaccess dans le dossier /uploads/files/
3. cherchez la ligne:
<FilesMatch "\.(avi|divx|mp3|mp4|flv|swf|wmv|m4v|m4a|mov|mkv|3gp|f4v)$|^$">
Remplacez par
<FilesMatch "\.(avi|divx|mp3|mp4|flv|swf|wmv|m4v|m4a|mov|mkv|3gp|f4v|torrent)$|^$">
4. Videz le cache du site.