Всем доброго времени суток, сегодня хочу предложить Вам простую но в тоже время интересную идею для кнопки СКАЧАТЬ для DLE. 

Многие , я уверен, хотят иметь на своем сайте что то другое, не похожее на стандартные картинки ,анимации,кнопки в CMS. 

Поэтому сегодня предлагаю Вам изменить те самые стандарты, а именно, кнопка СКАЧАТЬ для DLE. 

Ничего особенного и тяжелого в этом нет. Вам нужно просто заменить файл attachment.tpl  на другой.. (Ссылка на скачивание находится внизу страницы. Кстати кнопка будет выглядеть именно так,как Вы видите у нас на сайте. )

В Вашем шаблоне, например Default , у Вас конечно может быть совсем другое название.

Код HTML и CSS attachment

Тут конечно Вы вправе изменить все по своему желанию, цвета,ширину,скорость анимации.... Просто хочу подсказать, облегчить задачу (кто совсем не силен в CSS) 

Вот собственно и весь HTML код кнопки скачать для DLE. 

[not-allow-download]<span class="quote">У вас нет доступа к скачиванию файлов с нашего сервера. (<b><a href="/index.php?do=register">Зарегистрироваться</a></b>)</span>[/not-allow-download]
[allow-download]
<div class="warges"><div class="knopka_down down"><div>ПЕРЕЙТИ К СКАЧИВАНИЮ</div><div></div><div><a href="{link}">[count]Скачиваний: ({count})[/count]</a></div></div></div>
[/allow-download]

{who-downloaded}

А это само оформление , СТИЛИ CSS КНОПКИ

.warges{margin:20px auto;padding:0;width:295px;max-width:300px;box-sizing:border-box;display:block;position:relative;}
 .knopka_down{margin:10px;padding:0;font-size:18px;font-family:verdana;height:38px;cursor:default;text-align:center;-moz-user-select:none;border:0 none;box-sizing:border-box;position:relative;}
 .knopka_down:hover{cursor:pointer;}
 .down{overflow:hidden;border:1px solid #188cb6;}
 .down div{position:absolute;text-align:center;width:100%;height:38px;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;padding:4px 5px 5px;}
 .down div:nth-child(1){color:#188cb6;background-color:#fff;}
 .down div:nth-child(2){background-color:#188cb6;background:-moz-linear-gradient(to bottom, #188cb6 0%, #188cb6 47%, #4dc7f4 100%);background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#188cb6), color-stop(48%,#188cb6), color-stop(100%,#4dc7f4));background:-webkit-linear-gradient(to bottom,  #188cb6 0%,#188cb6 48%,#4dc7f4 100%);background:-o-linear-gradient(to bottom, #188cb6 0%,#188cb6 48%,#4dc7f4 100%);background:-ms-linear-gradient(to bottom, #188cb6 0%,#188cb6 48%,#4dc7f4 100%);background:linear-gradient(to bottom, #188cb6 0%,#188cb6 48%,#4dc7f4 100%);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#188cb6', endColorstr='#4dc7f4',GradientType=0 );width:300px;transition:all 0.2s ease;-webkit-transition:all 0.2s ease;-moz-transition:all 0.2s ease;transform:translate(-308px, 0px) skewX(-30deg);-webkit-transform:translate(-308px, 0px) skewX(-30deg);-moz-transform:translate(-308px, 0px) skewX(-30deg);}
 .down div:nth-child(3){color:#fff;left:-308px;transition:left 0.2s ease;-webkit-transition:left 0.2s ease;-moz-transition:left 0.2s ease;}
 .down:hover div:nth-child(2){transition:all 0.5s ease;-webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;transform:translate(-15px, 0px) skewX(-30deg);-webkit-transform:translate(-15px, 0px) skewX(-30deg);-moz-transform:translate(-15px, 0px) skewX(-30deg);}
 .down:hover div:nth-child(3){left:0px;transition:left 0.30000000000000004s ease;-webkit-transition:left 0.30000000000000004s ease;-moz-transition:left 0.30000000000000004s ease;}
 .down div a,.down:hover div a{color:#fff;text-decoration:none;}

Либо можете скачать готовый файл со стилизацией кнопки как у нас на сайте..