Подключаем социальные закладки от share42.com в shortstory.tpl DLE

Главное условие - прямые руки

Важные опции

• Тип панели с иконками: "Горизонтальная"
  
• К вашему сайту подключен jQuery: "Да" (т.к. DLE есть ужа давно библиотека jQuery)
  

1. Поэтому, чтобы защитить неподготовленный мозг от нелепых ошибок, лучше создадим файл social.js и положим его в папку js шаблона.
   В файле пишем:
   

   $(document).ready(function(){
   //в это место вставляем наш основной код, скопированный ранее
   });

   
   
2. Кладём картинку из архива (который скачали с share42.com) в папку images.
   
3. Подключаем скрипт в шаблон. Для этого откроем main.tpl и после

   <script type="text/javascript" src="{THEME}/js/libs.js"></script>

   прописываем

   <script type="text/javascript" src="{THEME}/js/social.js"></script>

   
   
4. С простым разобрались, теперь немного посложнее (для неподготовленного мозга - очень сложно).
   После "обрезания" скрипта нам более не нужна отдельная его инициализация, но для корректной работы скрипта ему нужен id блока, в который он будет вставлять кнопки соцсервисов и получать необходимые данные (заголовок и ссылку на новость), мы можем использовать стандартный тег {news-id} для присвоения уникальных идентификаторов для каждого блока. Поэтому блок в файе shortstory.tpl, куда будут вставляться кнопки будет выглядеть примерно так:
   

   <div id="sh{news-id}" class="share42init" data-url="{full-link}" data-title="Подключаем социальные закладки от share42.com в shortstory.tpl DLE"></div>

   где 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('<span id="share42">' + l + '</span>');

   и заменить на

   $(this).html('<span id="share42_'+shareId+'">'+l+'</span>');

   
   Это нехитрое телодвижение научит скрипт "различать блоки друг от друга".
   
6. Внимательный человек сразу увидит, что вместе с "обрезанием" скрипт утратил переменную f (она отвечала за путь к картинке), поэтому мы ещё немного причешем скрипт, заодно избавимся от не уместных в нашем случаи инлайн-стилей (не люблю я их).
   Для этого просто заменим длинную строку:

   for (j = 0; j < s.length; j++) l += '<a rel="nofollow" style="display:inline-block;vertical-align:bottom;width:24px;height:24px;margin:0 6px 6px 0;outline:none;background:url(' + f + 'icons.png) -' + 24 * j + 'px 0" href=' + s[j] + ' target="_blank"></a>';

   на более изящную и короткую:

   for (j = 0; j < s.length; j++) l += '<a rel="nofollow" class="sharelink" style="background-position: -' + 24 * j + 'px 0" href=' + s[j] + ' target="_blank"></a>';

   
   
   

   Внимание!

   не забудьте поменять размер иконок на свой (в данном случаи это циферка 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 += '<a rel="nofollow" class="sharelink" style="background-position: -' + 24 * j + 'px 0" href=' + s[j] + ' target="_blank"></a>';

		$(this).html('<span id="share42_'+shareId+'">'+l+'</span>');
	})	
});

Вот и всё!