2 Апр 2012

Кнопки социальных сервисов в блог (на примере Drupal)



Кнопки социальных сервисов в Drupal можно вставить разными способами:

1. Готовые модули:
AddThis
Service links
AddToAny
ShareThis
SexyBookmarks
Плюсы: быстро и просто устанавливаются
Минусы: не всегда можно настроить так, как хочется; часто имеется скрипт со стороннего сайта, что может влиять на время загрузки страницы

2. Вставить самостоятельно в виде блока или непосредственно в макет заметки с помощью плагина CCK (как это сделать с помощью CCK см. например, тут).
<div class="social-but">
<script type="text/javascript">
var page_title = (document.title);
var page_url = (document.location.href);

//определяем массивы в порядке отображения на странице

//массив URL соц. сервисов
var share_url = [ 'http://twitter.com/share?url=' + page_url + '&text=' + encodeURI(page_title), 'http://vkontakte.ru/share.php?url=' + page_url, 'http://www.facebook.com/sharer.php?u=' + page_url, 'http://connect.mail.ru/share?share_url=' + page_url, 'http://www.livejournal.com/update.bml?event=' + page_url + '&subject=' + encodeURI(page_title), 'https://m.google.com/app/plus/x/?v=compose&content=' + encodeURI(page_title) + ' - ' + page_url];

//массив заголовков
win_title = ['Twitter', 'VK', 'Facebook', 'MMIR', 'LJ', 'Gplus'];

//массив ссылок на иконки
service_img = ['http://путь_к _папке/twitter.png', 'http://путь_к _папке/vkontakte.png', 'http://путь_к _папке/facebook.png', 'http://путь_к _папке/moy-mir.png', 'http://путь_к _папке/livejournal.png', 'http://путь_к _папке/google-plus.png'];

//массив title'ов, отображающихся при наведении курсора на иконку btn_title = ['Твитнуть', 'Поделиться с друзьями ВКонтакте', 'Поделиться с друзьями в Facebook', 'Мой Мир на Mail.ru', 'Опубликовать в уютную жежешечку', 'Запилить в Google+'];

//отображаем код на странице
var i = 0;
for (i=0;i<6;i++) { document.write("<a onclick=\"window.open('" + share_url[i] + "', '" + share_url[i] + "\', \'width=626, height=436\'); return false;\" href=" + share_url[i] + " rel=\"nofollow\"><img src='" + service_img[i] + "' width=\"32\" height=\"32\" title=\"" + btn_title[i] + "\"><\/a> ");
}
</script>
</div>


В коде в адресах "путь_к_папке" нужно заменить на полный путь к папке с иконками на вашем сервере. Иконки можно скачать тут.
Вот, как это выглядит:

Добавить комментарий

You must have Javascript enabled to use this form.