Социальные кнопки: более 20 вариантов

09.12.2016

Социальные кнопки ДЛЯ САЙТА
Более 10 статей накопилось в моем блоге о социальных кнопках для блогов и сайтов. И каких только вариантов кнопок нет... Но меня поразил один сайт, на котором есть социальные кнопки, отличающиеся не только по форме и цвету, но и по расположению их на сайте (вертикальные, в два ряда, в два столбца, скрытые, анимированные...).


И, если в предыдущей статье мы с Вами удивлялись разнообразными персонажами из "социальных" анимаций, как я их назвала, то в этой будем наслаждаться богатой фантазией и мастерством авторов сайта, где и расположены социальные кнопки с готовыми кодами для вставки на сайт или блог

Итак, посмотрим, какие варианты кнопок нам предлагают авторы:

1. Соцкнопки в два ряда


2. Соцкнопки в два столбца


3. Фиксированные социальные кнопки
    - вертикальные
    - в два столбца



4. Прижатые
   - к верху сайта
   - к низу сайта


5. Скрытые социальные кнопки - открываются при нажатии на специальный значок:
 - в два ряда
 - вертикальные социальные кнопки,


  - скрытые социальные кнопки, раскрывающиеся в разные стороны (в обе стороны, в обе стороны пошагово, вверх или вниз, в горизонтальную линию, по кругу 

 - скрытые кнопки в форме многоугольника



6. Анимированные соцкнопки (есть вертикальные и в два ряда).



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

А также выбрать форму социальных кнопок, внешний вид кнопок и их размер:


Для каждого вида кнопок есть пример и предпросмотр на Вашем сайте.

Как добавить на сайт социальные кнопки.

1. Нажать под выбранным типом кнопок Установить


2. Выбрать шаблон (чаще он один).


3. На 2 шаге предлагается отредактировать шаблон (я оставляю без изменений)

4. Под полем с кнопками есть возможность вписать адрес своего сайта/блога и посмотреть - как будут выглядеть соцкнопки в реальном режиме


Например:


5. На следующем шаге для платформы Blogger выбираем вариант 2 - код в развернутом виде.


6. Для блогов на Blogger создаем новый гаджет HTML/JavaScript (Дизайн -> Добавить гаджет -> HTML/JavaScript)

 И вставляем в поле Содержание сначала код библиотеки:

<script async src="//cdn-library.su/plusonet/lib/plusonet-3.8.min.js"></script>


Затем ниже скопированный код скрипта.

  Указанный тег я не использовала.

  Гаджет сохраняем.

  Социальные кнопки от Pluso мне всегда нравились, я их устанавливала на каждый свой блог. Но теперь выбор вариантов кнопок, которые я описала выше, еще больше, что не может не радовать.

5 комментариев:

  1. Замечательные кнопочки! У меня уже есть свои! Менять пока не планирую. Спасибо за пост.

    ОтветитьУдалить
  2. Привет. сделала все по плану. Но кнопки не хотят отражаться в блоге..Какие могут быть причины???

    ОтветитьУдалить
    Ответы
    1. В основном, соц.кнопки работают при помощи скриптов, работу которых могут блокировать браузер и дополнительные расширения.

      Удалить
  3. Добрый вечер) Подскажите как вы установили кнопки соц.сетей с боку у меня не получается как у вас установить. Спасибо

    ОтветитьУдалить
    Ответы
    1. Здравствуйте. Статья о том, как вставить вертикальные (и другие) социальные кнопки: http://samasajt.blogspot.ru/2013/04/yarkie-socialnye-knopki.html

      Удалить

Загляните и на другие страницы ^