Главная JavaScript

Плавающая панель «Добавить в социальные сервисы»

Плавающая панель «Добавить в социальные сервисы»

Недавно я решил отказаться от использования своего скрипта "Добавить в закладки" и создал новый скрипт на jQuery - плавающую панель с кнопками добавления статьи в социальные сервисы. Эту панель вы можете прямо сейчас наблюдать слева на странице любой статьи данного блога (при разрешении экрана более ...

Комментарии (603)

  1. Если путь к папке с изображениями site.ru/Sites/site_ru/General/i/ то как надо прописать в var f = '/examples/socializ-floating-panel/i/'; /* путь к папке с изображениями кнопок */

    Спасибо большое.

  2. Простите за недопонимание. Какую имено? До папки с изображениями на сервере?

  3. Плагин супер! Установил на сайт, но в FireFox (версия 3.6.13) при наведение на иконку любую из панели закладок, то появляется всплывающая подсказка, но русские символы крякозябликами на ней! В Opera 11 все нормаль!!! Как быть, не подскажите? Спасибо заранее!

  4. Наверно самое шикарное решение!
    Хотел поставить на joomla (вариант который лежит на share42.com), но как не парюсь, не получается воткнуть.
    Не хочет отображаться за пределами поля сайта.
    Кто ставил на Joomla? (шаблон от yootheme).
    Это заносится в template. css ???

    #share42 {
    position: fixed;
    z-index: 1000;
    margin-left: -70px; /* смещение панели влево от края контента */
    padding: 6px 6px 0;
    background: #FFF;
    border: 1px solid #E9E9E9;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    }
    * html #share42 {display: none}
    #share42:hover {
    background: #F6F6F6;
    border: 1px solid #D4D4D4;
    -webkit-box-shadow: 0 0 5px #DDD;
    -moz-box-shadow: 0 0 5px #DDD;
    box-shadow: 0 0 5px #DDD;
    }
    #share42 a {opacity: 0.5}
    #share42:hover a {opacity: 0.7}
    #share42 a: hover {opacity: 1}
    #share42 img {margin: 0! important; padding: 0! important; border: none! important;}

  5. Подскажите пожалуйста в каком месте вставлять скрипт, после статьи это где?
    Не особо силен в WP и момент, пока получается вот так вот — img-fotki.yandex.ru/get/5900/pc-load.0/0_50d74_ced3d808_L.jpg
    от чего может быть? просто белая точка там где должна быть панель
    Заранее всем спасибо.

  6. Здравствуйте Дмитрий!
    Поставил Ваш плагин jQuery Comment Links WordPress Plugin и плавающая панель отказалась работать… у меня на блоге стоит 2 выриант… после установки плагина «jQuery Comment Links WordPress Plugin» перестали выделяться кнопки соц сетей при наведении на них мышкой и не активна стала ссылка «еще…»

    Вопрос такой как совместить все это чтобы работала и панель социалок и плагин «jQuery Comment Links WordPress Plugin»
    Спасибо огромное заранее!

    • Скачайте скрипт заново. Я внес исправления. Теперь должно работать,

      • Спасибо ! Теперь вроде бы все работает как положено…
        Огромное Вам спасибо!

        • Как прописать еще technoarti в список закладок???
          Да, и еще у меня в конце список панели закладок стоит значок отправить на email? но он не работает как надо открывается стандартный Outlook express, но там в поле тема и в заголовке все в не правильной кодировке крякозябрами как это поправить или сделать чтобы выводилась онлайн форма отправки на эл. почту типа там друзьям…
          Спасибо заранее!

          • Как прописать еще technoarti в список закладок???

            В соответствующее место с новой строки:

            '<a href="http://technorati.com/faves?add=' + u + '&title=' + t + '" title="Добавить в Technorati"><img src="' + f + 'technorati.png" alt="" /></a>' +

            А лучше воспользуйтесь сервисом Share42.com, там все удобнее сделано.

            но там в поле тема и в заголовке все в не правильной кодировке крякозябрами

            Сам бы хотел решить эту проблему, но не знаю, как.

      • В гугле хроме работает, а вот в firefox так и не работает пришлось плагин «jQuery Comment Links WordPress Plugin» опять отключить…
        В Опере то же вроде работает…, а про остальные сказать не могу, т.к. эксплорером не пользуюсь совсем и давно…
        Жаль что-то с Firefox не поехало…
        Может еще посмотрите и подправите?!
        Спасибо!

  7. БОльшое спс. Весь инет перерыл. Нашел наконецто кнопки с соц.закладкми. ПОставилась конечно не с первого раза. но смотрится шикарно_)

  8. Уважаемый Dimox, подскажите, пожалуйста, что и где надо прописать в таблице стилей, чтобы плавающая панель не уходила за пределы экрана (http://freakblog.ru)? При разрешении 1366×768 всё ок, а 1024×768 уже видно только половину панели. Спасибо.

    • За cдвиг влево отвечает строка:

      margin-left: -70px;
      • Это хорошо, я справил на -50, теперь более менее нормально, только меня не устраивает что теперь когда при большем разрешении панелька все равно остается сидеть в плотную к тексту. Как сделать чтобы как у вас на сайте, при большем разрешении панель была на расстоянии от текста, а при меньшем плотную? «Обратите внимание, что у блока #socializ не указано свойство left.» Я так понимаю тут и надо указать свойство лефт? Как правильно это сделать?

        • После строки:

          s.css({top: m1});

          добавьте следующий код:

          	if ( $(window).width() < 1080 ) s.css({marginLeft: -53});
          	$(window).resize(function() {
          		if ( $(window).width() < 1080 ) { s.css({marginLeft: -53}); }
          		else { s.css({marginLeft: -84}); }
          	})
          

          И цифры подгоните под себя.

          «Обратите внимание, что у блока #socializ не указано свойство left.» Я так понимаю тут и надо указать свойство лефт?

          Нет.

  9. Заработало.
    Димон, огромное тебе спасибо.

  10. Димон. Меня наверно уже можно посчитать спамером. Извиняюсь за назойливость. Но у меня теперь другая проблема.
    Рубрики из выпадающего меню высыпались вправо, точнее переместились как-то коряво.
    От чего может быть?
    Подключение к jQuery делал путем добавление строк через админку WP. Может надо прописать их где-то напрямую в каком другом файле. Если Да, то подскажи пожалуйста где?
    Заранее спасибо.

  11. Dimox, подскажите пожалуйста

    при установленной панели в експлорере и в мозилле страницы при скроллинге прокручиваются с нормальной скоростью, а в опере немного подтормаживает

    в чём может быть дело?

  12. а как его на ucoz вставить??? помогите, особенно где искать строчку после которой вставлять шаг 3 и 4! ПОМОГИТЕ!

  13. Спасибо огромное! Все работает.
    Кстати, наткнулся еще на вашу статью про то как добавить список сайтов для пингования, а там коммент оставить нельзя (
    У меня в WP нет такого пункта, куда бы список можно было вставлять

  14. Плохо искали. Нужно зайти на страницу вида site.ru/wp-admin/options-writing.php.

    clip2net.com/clip/m51974/1 298 362 914-clip-181kb.jpg
    вот все что есть на этой странице.
    (картинка будет храниться на сервере 7 дней)
    спасибо за ответ.
    постоянно вас читаю :)

  15. dl.dropbox.com/u/7 312 900/wp.png
    Возможно, что вы используете какую-то левую сборку WordPress. Я качаю с сайта ru.wordpress.org/

    Да, сборка от myworpress…
    Кстати, как сделали такую верхнюю горизонтальную панель? Плагин какой то?

  16. Сборку от myworpress не рекомендую, они пихают туда всякую хрень,

    Не знал, сейчас уже не смогу исправить это…

    http://wordpress.org/extend/plugins/ozh-admin-drop-down-menu/

    Спасибо!

  17. а как в dle подключить вроде всё работает ну статью не захватует при добавление в контакт например… зарание спасибо

  18. Вопрос. У меня код который выводит текст статьи вида $TWL_TITLE$ т. е. если страница на сайте называется «Тестовая» то так она и выводится. Полный код:

    $TWL_TITLE$

    Куда надо вставить Ваш код socializ (encodeURIComponent ('Ссылка на статью'), encodeURIComponent ('Название статьи'))? Чтоб выводился заголовок статьи и ссылка?

  19. Подскажите, пожалуста, можно как-то убрать затенение картинок по умолчанию? Хотелось-бы что-бы они изначально показывались в полный цвет.

  20. Отличный скрипт! А как сделать чтобы социалки открывались в новом окне, а не в новой вкладке???