Социальные закладки в блоге/сайте на Друпале(drupal) версии 6

О том как сделать «Социальные закладки» в блоге/сайте основанном на Друпале(drupal) версии 5,6,7

Социальные закладки от автора: dimox

Вообще это очень «клёвая тема» добавить панельку с закладками. Такую панель встречаешь на многих зарубежных сайтах, там так сказать «прохавали фишку» ;)

Надо jQuery 1.4.2, на младших не пробовалось. У Мну в Друпале уже была, так что не провтыкивайте !!!

Обозначу несколько моментов по поводу панельки:

1. В IE6 не будет работать! Ну его в Ж… (так автор отозвался о поддержке браузера, который забивает на CSS+ W3C + стандарты.
2. В панели очень красивые иконки из “Vector Social Media Icons”
3. Иконки для «Мой Мир», «Бобрдобр», «Memori» автор(не Я ;) ) делал сам, а некоторые (ВКонтакте, Livejournal) нашел у Миши Шакина.
4. Весь HTML-код кнопок находится непосредственно в скрипте. Это лучше тем, что:
* во-первых, на сайте не будет «лишних» ссылок ;
* во-вторых, HTML-код страниц не зависит и не будет захламляться кодом кнопом;
* в-третьих, кэширование скрипта рулит ;).

вертикальная панелька №1:
jQuery-скрипт «Добавить в социальные сервисы» пример №1

вертикальная панелька №2:

jQuery-скрипт «Добавить в социальные сервисы» пример №2

горизонтальная панелька №3:
jQuery-скрипт «Добавить в социальные сервисы» пример №3

Установка панели соц-закладок в (drupal 6.19) друпал 6.19 на примере темы оформления «scruffy»

Скрипт панели закладок можно подключить следующими способами:

  • template
  • module
  • theme info

Я подключал через редактирование theme info у моей темы «scruffy».

в /themes/scruffy/js Я скопировал: socializ_3.js и socializ.js

создал файл social.css (еще раз замучу Я использовал вариант №3):

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
/* Плавающая панель */
#socializ {
        display: inline-block;
  border: 1px solid #E5E5E5;
        -moz-border-radius: 4px;
        -webkit-border-radius: 4px;
        border-radius: 4px;
        padding: 6px 0 6px 6px;
        background: #FFF;
        overflow: hidden;
}
* html #socializ {display: inline}
*+html #socializ {display: inline}
#socializ:hover {
        background: #F6F6F6;
  border: 1px solid #D4D4D4;
        -moz-box-shadow: 0 0 5px #DDD;
        -webkit-box-shadow: 0 0 5px #DDD;
        box-shadow: 0 0 5px #DDD;
}
#socializ a {
        float: left;
        width: 32px;
        height: 32px;
        margin: 0 6px 0 0;
        padding: 0;
        background-color: #F6F6F6;
}
#socializ img {
        margin: 0 !important;
        padding: 0 !important;
        border: none !important;
}
/* конец Плавающая панель */

в scruffy.info добавил:

stylesheets[all][] = social.css
scripts[] = js/socializ_3.js

В общем решил вопрос с тем, что бы горизонтально после текста была панелька из примера №3

Зайдите — поддержите Меня ;) блог который надо поддержать ;)

в node.tpl.php, а не в page.tpl надо добавить следующий код:

1
2
3
4
5
<?php if ( (arg(0) == 'node') && is_numeric($nid = arg(1)) ) { ?>
        <script type="text/javascript">socializ(encodeURIComponent('http://blog.kh.ua<?php if ( (arg(0) == 'node') && is_numeric($nid = arg(1)) ) {echo url('node/'.$nid); } ?>'),encodeURIComponent('<?php if ( (arg(0) == 'node') && is_numeric($nid = arg(1)) ) {echo $title; } else { print $site_name; } ?>'))</script>
<?php
}
?>

Comments to Социальные закладки в блоге/сайте на Друпале(drupal) версии 6

  • такой вариант позволит, что бы панелька была только когда смотрим ноду ;)

    wel 24.10.2010 22:57 Ответить

Leave a Comment

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Загрузка...
Menu Title