Плавающая панель кнопок соцсетей

Автор: | Рубрика: Блог на Wordpress | Обновлено: 2015-03-14 | Создано:
Просмотров: 2656
Плавающая панель кнопок соцсетей

Приветствую, Вас, посетители блога inetsovety.ru. В этой статье я хочу показать, как установить на свой сайт плавающую панель с кнопками соцсетей. Эту панель Вы можете видеть слева.

Сделать это можно с помощью сервиса share42.com. Сайт предоставляет возможность настроить под свои требования и предпочтения скрипт плавающей панели с кнопками социальных сетей. Далее этот скрипт легко устанавливается на Ваш сайт и не создает большой нагрузки на хостинг, как плагин с такими же функциями. Установить этот скрипт можно не только на сайт на WordPress, но и на другие движки. На сайте можно на любой вкус сделать плавающую панель соц закладок. Всего для выбора представлено 43 кнопки.

Последовательность действий по добавлению плавающей панели с кнопками соцсетей:

  1. Переходите на сайт share42.com. На вкладке генератор, Вы должны настроить на свой вкус будущую панель с кнопками.
  2. В первом пункте выберите размер кнопок, выделите кнопки соцсетей, которые хотите видеть на плавающей панели. Кнопки можно менять местами, для этого перетяните кнопку в нужное место последовательности.
  3. Во втором пункте установите настройки, как на картинке ниже. Если Вы добавили в плавающую панель кнопку RSS, то укажите в соответствующем поле адрес RSS.Плавающая панель кнопок соцсетей
  4. Нажмите на кнопку просмотра панели, которую Вы настроили, если, что-то не нравится, то можно сразу же поменять. Далее скачайте настроенный скрипт плавающей панели на компьютер. И перейдите на вкладку Установка.
  5. Следуйте инструкции на вкладке Установка. Первым делом распакуйте архив и загрузите через FTP папку со скриптом на хостинг в корневую папку сайта public_html.
  6. Далее на странице установка укажите путь до папки. Если Вы скопировали папку в public_html, то укажите адрес в таком формате: http://вашсайт.ru/share42/.
  7. Потом выберите движок на котором работает Ваш сайт.
  8. В пятом пункте нужно вставить код в шаблон сайта. Я, например, на своем сайте хочу, чтобы плавающая панель отображалась только в  полных статьях. Поэтому я вставила этот код в файл single.php. У себя я вставила код перед <div class="entry">. В какое место в Вашем шаблоне нужно вставлять я однозначно сказать не могу, все зависит от шаблона. Пробуйте и подберете правильное место.
  9. Осталось в файл стилей style.css вставить код, который отвечает за положение панели относительно контента. Строка z-index: 1000; отвечает за смещение плавающей панели сверху (я для своего шаблона установила 500).  Изменяя значение margin-left: -70px;  Вы смещаете панель влево от блока контента. Так как в моем шаблоне 2 сайдбара, то мне нужно было сместить панель влево от контента на -295px. Для Вашего шаблона это значение будет другим. Подбирайте и у Вас  получится расположить панель в нужном месте.

На этом установка плавающей панели с кнопками соцсетей завершена. Не забывайте делать анонсы своих статей через аккаунты в соцсетях. Это ускорит их индексацию .

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

С уважением, Виктория – блог inetsovety.ru

Поделиться ссылкой на пост в соц. сетях
Получать уведомления о новых статьях на e-mail
Комментариев: 8 к статье "Плавающая панель кнопок соцсетей"
  • Игорь 2016-12-12 в 19:06

    Отличный сервис share42.com.
    Долгое время его использовал

    Ответить
  • Марина 2013-12-18 в 10:57

    Спасибо за статью! Решилась сделать свой сайт и как раз искала, как установить кнопку Одноклассников (в рекомендуемом плагине такой не было). Теперь все будет в норме!

    Ответить
    • seomodern 2013-12-18 в 14:23

      Лучше не полениться и напрямую поставить кнопки от каждой социальной сети отдельно.

      Ответить
      • Марина 2013-12-19 в 06:19

        Спасибо за подсказку) Со временем поищу, как это делается.

        Ответить
  • seomodern 2013-07-18 в 15:31

    В скрипте с этого сервиса прописывается индексируемая ссылка на сам сервис?

    И немого не по теме: хотелось бы узнать, как называется виджет, который выводит похожие статьи?

    Ответить
    • Виктория 2013-07-18 в 15:41

      Кнопку на данный сервис можно добавлять по желанию. Внешней ссылки на сервис нет.
      Вы имеете ввиду похожие статьи после поста? Их можно вывести плагином http://inetsovety.ru/kak-vvesti-pohozhie-zapisi-s-kartinkami/

      Ответить
    • alf2012 2013-07-26 в 22:56

      Не только нет ссылки на сам сервис, но и можно после скачивания архива переименовать сам файл со скриптом, а также заменить картинку с кнопками на свою.

      Ответить
  • Гульнур 2012-04-14 в 21:33

    Вроде все понятно,но ну никак не смогла вставить такие же красивые кнопки на свой сайт.помогите пож-та.СПАСИБО!!!

    Ответить
Оставить комментарий
Нажмите, чтобы отменить ответ.

Комментарий появится после проверки. Комментарии, содержащие спам и ненормативную лексику будут удалены!