Скрипт кнопка Спасибо за материал

Если вы имеете свой сайт (блог, портал или просто статейный ресурс), наверняка вы бы хотели себе на сайт разместить кнопку Спасибо за материал. Эта кнопка первым делом привлечет внимание пользователя, чуть на дольше, но остаться у вас на сайте, что в свою очередь, в статистике уменьшит процент отказов, и в дополнение посетитель при нажатии на кнопку добавит + в репутацию автора материала.

Получается, что мы одним скриптом делаем масштабную работу, если мыслить чуть более широко. Если вы желаете установить такую кнопку себе на сайт, читайте все подробности чуть ниже.

Установка кнопки спасибо себе на сайт

Для установки кнопки много телодвижений от вас не нужно, первым делом, вам нужно перейти в шаблон страницы материала и комментариев, нужного вам модуля, где вы хотите установить этот скрипт кнопку. Далее найти код $MESSAGE$ и где-то рядом с ним разместить такой код:

<a href="javascript:;" class="thanks" title="Сказать спасибо автору материала" onclick="doronot();">
 <img src="https://mybloga.com/img/post/thanks.png">
 <span class="thanks__title">Спасибо за файл</span>
 <span class="thanks__tip"> Отблагодарить автора</span>
</a>
 
<script type="text/javascript"> 
 function doronot(){
 new _uWnd('repaplus','Подтверждение',350,200,{shadow:1,autosize:1,maxh:350,minh:100,resize:0},'<br>Репутация повысится автоматически, продолжить?<br><br><input type="button" onclick="madeplus()" value="Да, продолжить"> <input type="button" value="Нет" onclick="noplus();">'); }
 function noplus(){ _uWnd.close('repaplus'); }
 function madeplus(){<?if($USERNAME$=$USER$)?>_uWnd.alert('Вы не можете повысить репутацию самому себе','',{w:300,h:75,tm:6500});_uWnd.close('repaplus');<?else?>
 $.get('/index/23-$UID$', function(data) { var ssid = $($('cmd:eq(2)', data).text()).find('input[name="ssid"]').val();
 $.post('/index/', {act: 2, reason: 'Благодарю за «$ENTRY_NAME$»', a: 23, s: $UID$, t: 1, ssid: ssid, ref: '$ENTRY_URL$'},
 function(data){bad = $('<div/>').html($(data).text()).find('div').attr("title");
 if (bad=='') {_uWnd.alert('<b>Ошибка:</b><br>'+bad+'','',{w:300,h:75,tm:6500});}
 else {_uWnd.alert('Репутация <b>$USER$</b> повышена!','',{w:200,h:75,tm:6500});}});}); _uWnd.close('repaplus');<?endif?>}
 </script>

В скрипте выше используется код $ENTRY_NAME$ который выводит название материала для модулей Новости и Блог, если вы будете использовать этот скрипт для модулей каталогов (файлов, статей, объявлений, сайтов и игр), тогда этот код нужно будет заменить на $ENTRY_TITLE$. Так же стоит добавить, что в коде выше прописана ссылка на фото кнопки моя thanks.png вы же это фото загрузите себе на сайт и замените на свою ссылку, чтобы фото подгружалось с вашего сайта. Аналогично вы можете эту картинку заменить на другую, главное чтобы вы соблюдали размеры 40х40.

Установка стилей к кнопке Спасибо

В таблицу стилей CSS прописать в самый низ после всех стилей и кавычек вот такие стили:

.thanks {
 float: left;
 width: 220px;
 border-radius: 20px;
 margin-top: 20px;
 height: 60px;
 background: linear-gradient(45deg, #9ca8b6, #c1c8d1);
 box-sizing: border-box;
 padding-left: 10px;
 padding-top: 12px;
 position: relative;
 line-height: 1;
}
.thanks img {
 width:40px;
 font-size: 40px;
 color: #fff;
 float: left;
 margin-right: 5px;
 transition: all 0.5s ease;
}
a.thanks {text-decoration:none!important;} 
.thanks__title {
 margin-top: 3px;
 font-size: 16px;
 font-weight: bold;
}
.thanks__title, .thanks__tip {
 transition: all 0.5s ease;
 color: #fff;
 display: block;
} 

На этом как бы все, материал окончен. Если у вас остались вопросы или сложности в установке, спрашивайте в комментариях к материалу.