Сегодня я расскажу как легко и непринуждённо, без правок php и плясок с бубнами, добавить кнопки социальных сервисов от share42.com в короткие новости DLE.Статья будет интересна прежде всего новичкам, поэтому я постарался расписать всё немного подробнее, чем это необходимо.
Главное условие — прямые руки
Идём на share42.com и генерируем там скрипт с удобными для себя параметрами.
Я выбрал G+, Twitter, OK, FB, ЖЖ и ВК. Думаю для примера этого вполне достаточно. 
Важные опции
Тип панели с иконками: «Горизонтальная»К вашему сайту подключен jQuery: «Да» (т.к. DLE есть ужа давно библиотека jQuery)
Нужно сделать полученный скрипт читабельным. Для этого идём на jsbeautifier.org, вставляем содержимое файла share42.js в большое текстовое поле и жмём единственную кнопку.
Вот теперь работать со скриптом станет значительно удобнее.
Копируем код, по аналогии с выделенным на рисунке, или проще говоря: отсчитываем три открывающие фигурные скобки вначале и три закрывающие в конце, всё что между ними — копируем.
Это будет наш основной код.
Для примера я возьму стандартный шаблон DLE — Gemini (Default уже приелся )
Скрипт можно вставлять куда угодно и как угодно, главное правильно.
1. Поэтому, чтобы защитить неподготовленный мозг от нелепых ошибок, лучше создадим файл social.js и положим его в папку js шаблона.
В файле пишем:
$(document).ready(function(){
//в это место вставляем наш основной код, скопированный ранее
});2. Кладём картинку из архива (который скачали с share42.com) в папку images.
3. Подключаем скрипт в шаблон. Для этого откроем main.tpl и после
прописываем 4. С простым разобрались, теперь немного посложнее (для неподготовленного мозга — очень сложно).
После «обрезания» скрипта нам более не нужна отдельная его инициализация, но для корректной работы скрипта ему нужен id блока, в который он будет вставлять кнопки соцсервисов и получать необходимые данные (заголовок и ссылку на новость), мы можем использовать стандартный тег {news-id} для присвоения уникальных идентификаторов для каждого блока. Поэтому блок в файе shortstory.tpl, куда будут вставляться кнопки будет выглядеть примерно так:
где id=»sh{news-id}» может быть в принципе любым, главное наличие тега {news-id} и какого-либо текста рядом с ним (чтобы не дублировать id новостей).
Стоит отметить, что data-url и data-title — это HTML5-атрибуты и валидацию на старых доктайпах они не пройдут (хотя когда DLE проходил валидацию…)5. Ну а наш скрипт теперь нуждается в несложной доработке, а именно: нужно дать понять скрипту в какой блок какие ссылки-кнопки вставлять.
Для этого:
Перед (или после или на строчку ниже, разницы нет)
u = $(this).attr('data-url');Вставить
shareId = $(this).attr('id');Далее найти
$(this).html('' + l + '');и заменить на
$(this).html(''+l+'');Это нехитрое телодвижение научит скрипт «различать блоки друг от друга».
6. Внимательный человек сразу увидит, что вместе с «обрезанием» скрипт утратил переменную f (она отвечала за путь к картинке), поэтому мы ещё немного причешем скрипт, заодно избавимся от не уместных в нашем случаи инлайн-стилей (не люблю я их).
Для этого просто заменим длинную строку:
for (j = 0; j < s.length; j++) l += '';на более изящную и короткую:
for (j = 0; j < s.length; j++) l += '';Внимание!
не забудьте поменять размер иконок на свой (в данном случаи это циферка 24).
7. Осталось только добавить воды стилей.
Открываем любой css файл (например styles.css) и в любом месте пишем:
.sharelink {
display: inline-block;
vertical-align: bottom;
width: 24px;
height: 24px;
margin: 0 6px 6px 0;
outline: none;
background-image:url(../images/icons.png);
}Естественно не забываем указать нужный размер иконок. 
В готовом виде скрипт должен выглядеть примерно так:
$(document).ready(function(){
$('div.share42init').each(function () {
shareId = $(this).attr('id');
u = $(this).attr('data-url');
t = $(this).attr('data-title');
if (!u) u = location.href;
if (!t) t = document.title;
u = encodeURIComponent(u);
t = encodeURIComponent(t);
var s = new Array('"#" onclick="window.open('https://plusone.google.com/_/+1/confirm?hl=ru&url=' + u + '', '_blank', 'scrollbars=0, resizable=1, menubar=0, left=200, top=200, width=550, height=440, toolbar=0, status=0');return false" title="Добавить +1 и поделиться в Google+"', '"#" onclick="window.open('http://twitter.com/share?text=' + t + '&url=' + u + '', '_blank', 'scrollbars=0, resizable=1, menubar=0, left=200, top=200, width=550, height=440, toolbar=0, status=0');return false" title="Добавить в Twitter"', '"#" onclick="window.open('http://www.odnoklassniki.ru/dk?st.cmd=addShare&st._surl=' + u + '&title=' + t + '', '_blank', 'scrollbars=0, resizable=1, menubar=0, left=200, top=200, width=550, height=440, toolbar=0, status=0');return false" title="Добавить в Одноклассники"', '"#" onclick="window.open('http://www.facebook.com/sharer.php?u=' + u + '&t=' + t + '', '_blank', 'scrollbars=0, resizable=1, menubar=0, left=200, top=200, width=550, height=440, toolbar=0, status=0');return false" title="Поделиться в Facebook"', '"http://www.livejournal.com/update.bml?event=' + u + '&subject=' + t + '" title="Опубликовать в LiveJournal"', '"#" onclick="window.open('http://vk.com/share.php?url=' + u + '', '_blank', 'scrollbars=0, resizable=1, menubar=0, left=200, top=200, width=554, height=421, toolbar=0, status=0');return false" title="Поделиться В Контакте"', '"http://share42.com/" title="Share42.com - Бесплатный скрипт кнопок социальных закладок и сетей"');
var l = '';
for (j = 0; j < s.length; j++) l += '';
$(this).html(''+l+'');
})
});Вот и всё!
P.S. Проверено на DLE 9.6 (но версия тут не играет роли)
Автор: ПафНутиЙ