Добрый вечер!
Сегодня я хочу рассказать о социальных кнопочках от Яндекса. Но, не о тех фиксированных и ленивых, которые, чаще всего, располагаются после статьи. А о кнопочках, которые “парят” вместе с читателем по страницам блога! Эти кнопочки полностью оправдывают свою социальность: они всегда находятся рядом, готовые в любую секунду принять и передать очередной лайк, а может быть даже лав! =)
Позаимствовал это простое решение я с блога xstroy.com. Спасибо автору!
Вот так эти социальные кнопки выглядели на моем блоге на момент написания статьи:
Подкупили они меня своим минимализмом и легкостью установки.
Вот код для размещения:
1 2 3 4 5 6 7 8 9 10 11 12 |
<div style="left: 0px; position: fixed; top: 330px; background-color: transparent; height: 200px; width: 80px; background-position: initial initial; background-repeat: initial initial;"> <script type="text/javascript" src="//yandex.st/share/share.js" charset="utf-8"></script> <div align="center" class="yashare-auto-init" data-yashareL10n="ru" data-yashareQuickServices="yaru" data-yashareTheme="counter"></div><br/> <div align="center" class="yashare-auto-init" data-yashareL10n="ru" data-yashareQuickServices="vkontakte" data-yashareTheme="counter"></div><br/> <div align="center" class="yashare-auto-init" data-yashareL10n="ru" data-yashareQuickServices="facebook" data-yashareTheme="counter"></div><br/> <div align="center" class="yashare-auto-init" data-yashareL10n="ru" data-yashareQuickServices="twitter" data-yashareTheme="counter"></div><br/> <div align="center" class="yashare-auto-init" data-yashareL10n="ru" data-yashareQuickServices="moimir" data-yashareTheme="counter"></div><br/> <div align="center" class="yashare-auto-init" data-yashareL10n="ru" data-yashareQuickServices="gplus" data-yashareTheme="counter"></div><br/> <div align="center" class="yashare-auto-init" data-yashareL10n="ru" data-yashareQuickServices="odnoklassniki" data-yashareTheme="counter"></div> </div> |
Этот код нужно вставить в файл
/wp-content/themes/ваш_шаблон/footer.php
перед закрывающими тегами </body></html>
Вот и всё! Установка не займет у вас и минуты!
Некоторое время может занять настройка местоположения. В случае необходимости, можете изменить значения параметров в стилях блока.
Например, если style=”left:0px;” замените на style=”right:0px;”, то блок будет выровнен по правому краю. Если изменить значение параметра width, то изменится отступ от края страницы и т.п.
Если захотите изменить набор кнопок, то заходите на их родную страницу “Поделиться в соцсетях”.
А теперь не сдерживайте в себе желание протестировать эти чудо-кнопочки! Пройдитесь по ним сверху-вниз или снизу-вверх, или через одну, мягко нажимая то красную, то синюю, то оранжевую… Посмотрите как они изменятся после ваших кликов.
Ну, что, понравились?!
Ну, ладно, ладно – хватит играться. =)
Уверен, что вы не удержитесь и установите на свой сайт такие же!
Желаю всем много-много лайков во всех социальных сетях!
Эти новые кнопки от Яндекса очень классные. Увидев их, я отказался от плагинов для шаринга и поставил эти на все сайты.
PLUSO рулит!!!
попробовала поставить через редактор в консоли WP, но у меня почему-то видны не все кнопки и они не двигаются при прокрутке текста, а “приклеены” внизу страницы…
Затрудняюсь сказать в чем проблема. Может какая-то особенность в верстке вашего шаблона.
Спасибо за подробное объяснение процесса, кнопочки мной успешно установлены и не возникло никаких сложностей, хотя я не специалист в этой области.