Как сделать кнопку пинтерест на мышке. Новая фишка: кнопка Pin It! Что такое Pinterest и «пиннинг»
Как установить и добавить кнопку "Сохранить в Pinterest" на WordPresss, Blogger, или Tumblr без HTML кода? Что такое Pinterest «Pin It» Button?
«Pin It» Button (в переводе с англ. к нопка "Сохранить"). Кнопка «Сохранить» — это самый простой способ социального обмена, который поможет увеличить ваше присутствие в сети и рост взаимодействия с вашим брендом. Вы можете установить кнопку «Pin It» на сайт, или блог и предоставить возможность вашим посетителям сохранять контент вашего веб-сайта непосредственно на доски в Pinterest . Как только вы ее установите, на изображениях вашего веб-сайта появится логотип Pinterest, который посетители смогут нажать, чтобы сохранить контент на своей доске в Pinterest.
Нажимая кнопку «Сохранить», пользователи добавляют контент вашего сайта в Pinterest. Это означает, что он будет доступен и другим Пинерам, что увеличивает ваше количество показов. За три месяца после того как AllRecipes.com добавили кнопку «Сохранить» на свой сайт, пользователи Pinterest сохранили с него более 50 000 рецептов, а количество показов возросло до 130 млн. Количество показов в Pinterest также помогает увеличить трафик на сайт, так как заинтересованные Пинами пользователи будут переходить на ваш сайт.
Почему Pinterest кнопка «Сохранить» должна быть на вашем сайте?
Добавив кнопку «Сохранить» на свой веб-сайт, вы сможете воспользоваться аналитикой социального сервиса Pinterest, чтобы узнать, какой контент наиболее популярен в Pinterest. Вы также сможете отслеживать, какой контент Пинеры сохраняют непосредственно с вашего сайта. посетителям вашего сайта проще сохранять с него контент, а вы можете оценить свою популярность в Pinterest.
Как настроить дизайн кнопки «Сохранить» для сайта?Есть два типа кнопок «Сохранить»: автоматические и всплывающие. Если вы выбираете автоматическую кнопку, на каждом изображении вашего сайта появляется логотип Pinterest , который можно нажать. Если же выбрать всплывающую версию, такой логотип будет появляться, когда посетитель сайта наводит указатель на изображение.
Оба типа позволяют Пинерам сразу сохранить изображение на своей доске
Размер, форму и цвет кнопки «Сохранить» можно настроить в соответствии с дизайном веб-сайта. Для создания кнопки понадобиться базовое знание HTML.
Как создать и установить Pinterest кнопку "Сохранить" на сайт, или блог WordPress?
Чтобы установить кнопку Pin It на сайт Wordpress, не нужно добавлять никакие коды. Вы можете добавить кнопку Pin It ко всем записям вашего блога Wordpress, включив эту опцию в настройках по умолчанию.
1. Войдите в панель управления Wordpress.com
2. Перейдите в раздел Settings (настройки) и выберите Sharing (обмен).
3. В разделе Sharing Buttons (кнопки для обмена) перетащите сервис Pinterest из раздела Available Services (доступные сервисы) в раздел Enabled Services (используемые сервисы).
4. Если вы хотите, чтобы внешний вид кнопки Pin It не отличался от стандартного, выберите в раскрывающемся списке Button style (стиль кнопок) вариант Official buttons (официальные кнопки).
5. Нажмите Сохранить изменения в нижней части Пина.
Для создания и установки социальной Pinterest кнопки "Сохранить", вы также можете использовать бесплатные плагины и виджеты на сайте Wordpress.com
Как создать и установить Pinterest кнопку "Сохранить" для сайта, или блога Blogger?
1. В панели управления Blogger откройте раздел Layout (шаблон).
2. В разделе Blog Posts (публикации) нажмите edit (изменить).
4. Внесите необходимые изменения в разделе Arrange Items (размещение блоков) и нажмите Save (сохранить).
А сейчас главное! Как установить кнопку Pin It на картинку, чтобы при наведении мышкой появлялся значок "P", позволяющий вашим читателям в любой момент опубликовать вашу фотографию в Pinterest, таким образом показав ее своим друзьям.
Пошаговая инструкция
1. Открываем Шаблон -> Изменить HTML
2. С помощью Ctrl+F ищем тег
3. Перед ним вставляем код
//
// This Pinterest Hover Button is brought to you by bloggersentral.com.
// Visit http://www.bloggersentral.com/2012/11/pinterest-pin-it-button-on-image-hover.html for details.
// Feel free to use and share, but please keep this notice intact.
Все!
После этого на каждой картинке нашего блога, при наведении мышкой на фото, будет появляться такая кнопочка. Она будет появляться у всех наших читателей!
Если нам, по какой-то причине, не нужна кнопка "Pin It" на картинке, то ее можно просто убрать написав к тегу
Выглядеть в режиме HTML это должно примерно так:
Еще можно поменять положение кружочка "P" на фото. Например, нам хочется видеть его в центре изображения. Не проблема!
В скрипте просто меняем var bs_pinButtonPos = "topright"; на var bs_pinButtonPos = "center";
Возможные значения этого параметра: center, topleft , topright , bottomleft , bottomright.
Итак, мы установили кнопку. Теперь посмотрим, что она нам дает.
Когда мы нажимаем на кнопку "Р", то видим такое вот окошечко.
UPD 2
Теперь можно не устанавливать отдельно кнопку в блог. Ее можно целиком встроить в браузер! Как это сделать читайте .
Но если вы хотите, чтобы пользователи любых браузеров могли приколоть пин с вашей страницы, то установить можно и этим способом.
Привет! Мы продолжаем разбирать самые интересные и самые полезные плагины для сайта WordPress ! Сегодня вы узнаете как добавить на свой сайт кнопку Pin It, чтобы делится контентом сайта в соцсети Pinterest. Вы сможете выбрать размер кнопки, цвет кнопки. Можно выбрать расположение кнопки. Можно выбрать на каких страницах будет отображаться кнопка. Очень простой и полезный плагин!
Установить плагин Pinterest “Pin It” Button Lite вы сможете прямо из админ-панели WordPress. Перейдите на страницу: Плагины – Добавить новый , введите название плагина в форму поиска, нажмите Enter, установите и активируйте плагин.
General.
– Button Type, здесь можно выбрать тип кнопки. Рекомендуется оставить по умолчанию.
– Pin Count, можно включить показ счётчика и выбрать его расположение.
– Button Size, можно выбрать размер кнопки, большая или маленькая.
– Button Shape, можно выбрать форму кнопки, прямоугольная или круглая.
– Button Color, можно выбрать цвет кнопки. Только для прямоугольной кнопки.
– Save Settings, снимите галочку и сохраните настройки, когда будете удалять плагин.
– Сохраните изменения.
Post Visibility.
– Post/Page Types, выберите на каких страницах отображать кнопку. По порядку:
- Домашняя страница или последние записи.
- Главная страница (статическая).
- Страницы записей.
- Отдельные страницы.
- Архивы, категории, метки, автор и т.д.
– Post/Page Placement, выберите расположение кнопки, до или после контента. Можно показать в отрывках записей.
– Сохраните изменения.
Styles.
– Custom CSS, можно добавить свои стили.
– Remove DIV Container, можно удалить тег div вокруг обычной кнопки. Не обязательно.
– Disable Plugin CSS, можно отключить стили плагина, чтобы добавить свои.
– Сохраните изменения.
Advanced.
– Always Enqueue Scripts & Styles, подгружать скрипты и стили этого плагина на каждый пост и страницу. Полезно при использовании шорткодов в виджетах или в других нестандартных местах.
– Disable pinit.js, отключение вывода pinit.js. Не обязательно. Только в том случае, если другие плагина выводят pinit.js.
– Сохраните изменения.
Всё готово! После сохранения настроек, кнопка Pin It будет отображаться на вашем сайте, на выбранных страницах.
Вы сможете выводить кнопку Pinterest на сайт с помощью виджета, который появится у вас на странице виджетов. В настройках виджета вам нужно будет указать URL адрес страницы, которой будут делиться в соцсети Pinterest при нажатии на кнопку. Можно указать URL адрес изображения и описание страницы, которые также будут отображаться в соцсети.
