Главная > Кнопки и виджеты социальных сетей для сайта
Кнопки и виджеты социальных сетей для сайта12 февраля 2011 ![]() Вчера Toribloger попросил написать пост про то, где искать кнопки ретвита, лайки и виджеты прочих социальных сетей для добавления на свой сайт. В этой статье будут рассмотрены кнопки и виджеты от социальных сетей: Твиттер, Фейсбук, ВКонтакте, Одноклассники, Мейл.ру и РуТвит. Для быстрого перехода к нужному разделу жмите ссылки выше. Кнопки и виджеты для работы с ТвиттеромКнопки для фолловинга / Follow buttons![]() Приятные и узнаваемые кнопки разных размеров и цветов, которые прекрасно впишутся в дизайн большинства блогов. Кликаешь на понравившийся вариант, и получаешь всплывающую подсказку с кодом ссылки для установки. Посмотреть и добавить можно здесь: ссылка больше не работает. Кнопка ретвита постов / Retweet Button![]() Одну из таких кнопочек вы можете увидеть на этом блоге в конце каждой статьи. Считаю, что официальная кнопка лучше разного рода плагинов и дополнений. При добавлении кнопки нам предлагают выбрать дизайн кнопки, публикуемый текст (заголовок страницы или свой вариант текста), ссылку, на которую твит будет ссылаться (опять же, текущий URL страницы, или кастомный адрес) и язык (для России пока не актуально). Так же можно выбрать аккаунт, который будет упоминаться в публикуемых твитах — удобная штука, помогает привлечь не только трафик на блог, но и фолловеров на твиттер-аккаунт. В общем смотрите сами: ссылка больше не работает. Виджет последних твитов / Profile Twitter Widget![]() Пример реализации немного доработанного виджета можно увидеть в сайдбаре. Установка такого виджета на блог позволит читателям познакомиться с вами поближе и зафолловить для дальнейшего просмотра анонсов статей. Сам виджет имеет множество настроек как визуальных (высота, ширина, цвета оформления), так и контентных (публикация даты, аватара, хэштегов, тертвитов и т.п.), с которыми лучше разобраться самостоятельно: ссылка больше не работает. Другие виджеты для твиттера / Other Twitter WidgetsХоть эти виджеты и не являются популярными, стоит о них все же упомянуть. Это и виджет вывода последних твитов по хэштегу или слову, виджет вывода избранных твитов, виджет вывода твитов из списков и виджет для Фейсбука. Посмотреть эти виджеты подробнее можно здесь: ссылка больше не работает. Официальные кнопки и виджеты ФейсбукаКнопка «Мне нравится» / Like button![]() Пример применения можно так же увидеть в конце поста. Если пользователю понравилась статья — он может нажать «Лайк» и поделиться ей с друзьями на Фейсбуке. Присутствие на сайте кнопки «Мне нравится» может дать неплохой заряд трафика при хорошем раскладе. Как видите по картинке выше, существует 3 вида таких кнопок: Стандарт (вывод со списком пользователей), горизонтальная кнопка, и коробочка. Страница кнопки тут: https://developers.facebook.com/docs/plugins/like-button. Виджет «Мне нравится» для Фейсбука / Facebook Like Box![]() Я не поклонник применения этого виджета на сайтах, но видел его в сайдбаре у многих блогеров, например, на Блэкпиг.ру. Возможно, скоро попробую поставить и себе в сайдбар и посмотреть на эффект. Виджет «Мне нравится» позволяет пользователям подписаться на новости блога, публикуемые на официальной странице в Фейсбуке. Имеет 2 цветовые схемы: светлую и темную, соответственно. Можно включить показ анонсов последних новостей. Отображение аватаров подписавшихся пользователей и синюю шапку тоже по желанию можно убрать, либо оставить. Ознакомиться с настройками этого виджета для Фейсбука можно на официальной странице: https://developers.facebook.com/docs/plugins/like-box-for-pages. Другие виджеты Фейсбука / Other Facebook WidgetsКроме двух вышеупомянутых еще много других виджетов, которые не пользуются популярностью, но кому-то могут быть полезны. Это комментарии, кнопка логина и регистрации, рекомендации, лента активности и другие. Посмотреть список можно вот здесь: https://developers.facebook.com/docs/plugins. Кнопки и виджеты социальной сети ВКонтактеКнопка «Мне нравится»![]() Одну из таких кнопочек можно так же увидеть в конце статьи. Как видите, существует 4 варианта внешнего вида кнопки «Мне нравится» от ВКонтакте: кнопка с текстовым счётчиком, кнопка с миниатюрным счётчиком, миниатюрная кнопка и миниатюрная кнопка, счётчик сверху. Немного напрягает, что высота кнопок выделяется по отношению с кнопками Твиттера и Фейсбука, но в целом виджет вполне удобный в использовании. Польза в плане привлечения трафика вебмастерской тематики сомнительна, разве что у вас в друзьях находятся коллеги по цеху. Но я добавил, посетителей не много, но приходят ежедневно. Для добавления виджета нужно не просто добавить код на исходник, но и зарегистрировать id для кнопки своего сайта в API Контакта, правда это не сложно и делается буквально в один клик. Подробнее о том, как использовать кнопку «Мне нравится» на своем сайте, смотрите на официальной странице: https://vk.com/dev/Like. Виджет «Мы ВКонтакте» для сообществ и страниц![]() Данный виджет по сути представляет собой аналог виджета «Мне нравится» от Фейсбука. Пока писал пост, твердо решил на днях добавить оба этих виджета в сайдбар и посмотреть на их эффективность. Отличие «Мы ВКонтакте» от Фейсбуковского аналога заключается в том, что он не только позволяет подписаться на новости сайта или группы и получать в общем потоке новостей, но и дает возможность подписаться на бесплатную СМС-рассылку новостей сайта. В виджете «Мы ВКонтакте» можно настраивать высоту, ширину и вывод аватаров подписавшихся пользователей. Для более тонкой настройки виджета нужно будет допиливать исходники (на странице есть руководство). Ссылка: https://vk.com/dev/Community. Кнопка «Сохранить» ВКонтакте![]() Эта кнопка отличается от «Мне нравится» тем, что при нажатии на нее, статья публикуется у пользователя в «заметках» со ссылкой на источник. Имхо, в большинстве случаев это неудобно для пользователей. Именно поэтому в дальнейшем был создан «Лайк» от ВК. Кнопка имеет 5 видов внешнего оформления и настройки страницы для публикации. Посмотреть можно здесь: ***. Другие официальные виджеты для сайтов от ВКонтактеЗдесь я снова описал лишь самые популярные виджеты, на самом деле их больше. У ВКонтакте есть еще такие виджеты как: комментарии, пожертвования, опросы, виджет для авторизации и Open API. Ознакомиться с ними всеми можно на официальной странице: https://vk.com/dev/products. UPD: Выше были перечислены виджеты и кнопки лишь трех самых популярных социальных сетей. Но меня попросили дополнить этот список другими, менее популярными среди вебмастеров социалками. Кнопка для сайта «Класс» от Одноклассники.ру![]() Одноклассники предлагают только кнопку «Класс» в различных комбинациях, виджетов или чего-то еще у них нет. Есть выбор между тремя видами кнопок: со счетчиком, без счетчика, и маленькая иконка. Очень порадовало, что эти кнопки можно полностью настроить под себя при использовании CSS, т.е. можно вставить свое фоновое изображение в кнопку. Использовать «Класс» нужно на тех сайтах, где аудитория более ориентирована на Одноклассники, нежели на ВКонтакте или Фейсбук. Обычно это более взрослые люди, которые достаточно редко заходят в интернет и тем более не являются продвинутыми пользователями. Страница описания: https://apiok.ru/ext/. Социальные плагины от «Мой Мир@Mail.Ru»Кнопка «Мне нравится»![]() Функция кнопки по сути такая же, как ВКонтакте или на Фейсбуке. Кнопка имеет ряд настроек: замена текста «Нравится» на синонимы (Рассказать, Поделиться и т.п.), выбор между большой и маленькой кнопками, показ фотографий и текста, ширина их отображения. Мне так и не удалось найти пунтк «Убрать счетчик», но это можно сделать, задав нужную ширину. Документация: http://api.mail.ru/sites/plugins/share/. Плагин рекомендаций Mail.Ru![]() Плагин показывает пользователям сайта те страницы, которые до этого понравились другим пользователям. При выводе популярных статей учитывается «мнение друзей», страницы которые им нравятся имеют больший вес и показываются выше. Естественно, что для работы плагина на сайте должна стоять кнопка «Мне нравится». Такой же плагин есть у Facebook, и настройки тоже мало чем отличаются. Можно менять высоту и ширину плагина, задавать свой заголовок или убирать его вообще, менять все детали цветовой схемы и шрифт. Подробнее: http://api.mail.ru/sites/plugins/recommendations/. Плагин «Люди на сайте»![]() Плагин показывает друзей пользователя и других людей с проекта «Мой Мир», которым нравились какие-либо страницы сайта. Опять же, для функционирования плагина должна быть установлена кнопочка «Мне нравится». Данный плагин — копия виджета «Мне нравится» от Фейсбук и «Мы ВКонтакте». В настройках все схоже с предыдущим: ширина, высота, цвет фона, текста, ссылок, рамки, шрифт. Тоже можно задать свой вариант надписи с заголовке или скрыть совсем. Посмотреть можно вот здесь: http://api.mail.ru/sites/plugins/faces/. Кнопки и виджеты для сайта от РуТвитКнопка «Опубликовать» в РуТвит![]() Как можете видеть, в русской версии Твиттера аналог кнопки ретвита представлен в виде единственного экземпляра, без возможности выбор цвета и формата. Это плохо, учитывая что и сама социальная сеть не пользуется особой популярностью. Кнопка «Читать меня»![]() Эта кнопка позволяет пользователю мгновенно подписаться на ваши твиты, или оповещает о том, что он уже подписан (как на картинке выше). Опять в единственном экземпляре. Да и вообще, честно говоря, целесообразность существования этой кнопки под большим вопросом. Кнопки профиля от РуТвита![]() Тут РуТвит может похвастать хоть каким-то разнообразием. Чтобы получить код кнопки нужно нажать на нее, и он появится во всплывающем окошке. Сами кнопки после установки на сайт будут вести в профиль пользователя социальной сети. Посмотреть все три типа кнопок можно здесь: ***. Виджет «Мои твиты на сайте»![]() Аналог твиттеровского виджета. В принципе, возможности такие же: настройки цветовой схемы, размеров окна, количества твитов и вывода определенных категорий твитов. Подробнее тут: ***. Другие виджеты и плюшки от социальной сети РуТвитВ РуТвите, кроме вышеперечисленных, есть еще несколько виджетов: Окно отправки твитов прямо с сайта, «Прямой эфир» — своего рода чат, приложения для мобильного, плагин для WordPress и дополнение к браузерам. Единой страницы со всеми виджетами у РуТвита нет (идиотизм, не правда ли?), поэтому кликайте на ссылку в предыдущем абзаце и смотрите виджеты в правом меню. Надеюсь, что эта статья оказалась полезной. И если Вы дочитали до конца, предлагаю поучаствовать в моем маленьком конкурсе, где я бесплатно раздаю места под логотипом и вечные ссылки :) Upd: попробовал добавить виджеты в сайдбар и тут же убрал. Причины: на личном блоге — это лишнее, и немного портит дизайн. Похожие записи
Комментарии:04.01.2014 / 09:00 — Макс 04.01.2014 / 08:59 — Макс 22.11.2013 / 00:55 — dufa 12.08.2013 / 17:06 — Холпер 23.06.2013 / 12:18 — Игорь 21.06.2013 / 18:12 — dima 25.05.2013 / 03:19 — Онлайн игры 14.04.2013 / 12:04 — sitekos 11.04.2013 / 02:55 — Михаил 10.04.2013 / 12:35 — Влад 09.03.2013 / 14:57 — Роман 02.03.2013 / 20:00 — whitik 15.01.2013 / 16:13 — Николай 13.01.2013 / 08:09 — Олег 07.01.2013 / 15:43 — Ольга 29.12.2012 / 11:13 — Фикрет 18.12.2012 / 10:30 — Костя 23.11.2012 / 12:58 — Наталья 21.11.2012 / 23:03 — fgd 11.10.2012 / 17:13 — koshka 10.10.2012 / 22:46 — Denis 07.10.2012 / 15:41 — Влад 07.10.2012 / 14:09 — Hero 01.10.2012 / 22:53 — Макар 14.09.2012 / 18:17 — narko0 14.09.2012 / 07:39 — Евгений 13.09.2012 / 17:30 — Олег 09.09.2012 / 22:30 — вмиси 21.07.2012 / 19:35 — toor 20.07.2012 / 18:00 — Николай 20.07.2012 / 16:52 — anadikt 18.07.2012 / 15:55 — Алексей 25.06.2012 / 18:08 — Filix 17.06.2012 / 13:09 — Менеджер 21.05.2012 / 12:58 — Natalie 15.05.2012 / 14:07 — feedalt 12.05.2012 / 21:41 — лолмэн 10.05.2012 / 13:16 — Ольга 10.05.2012 / 01:25 — B-ReD 09.05.2012 / 11:34 — Алекс 04.05.2012 / 14:50 — Ольга 01.05.2012 / 09:48 — dos1k 01.05.2012 / 00:52 — Артём 29.04.2012 / 17:16 — Сашко 19.04.2012 / 11:23 — Белый 18.04.2012 / 18:32 — pekkea 07.04.2012 / 07:47 — Александр 05.04.2012 / 00:15 — Викки 03.04.2012 / 20:50 — Emin 31.03.2012 / 15:03 — Михайло 22.03.2012 / 05:21 — gurman 01.03.2012 / 16:51 — Игорь 14.02.2012 / 19:31 — Demannet 07.02.2012 / 02:13 — Тон 18.01.2012 / 21:30 — Алёша 10.01.2012 / 18:02 — Аксана 08.01.2012 / 21:48 — Чупакабра 07.12.2011 / 19:30 — odnoklassniki 06.12.2011 / 09:20 — Татьяна Ширякова 15.11.2011 / 23:14 — Den 11.11.2011 / 16:48 — Сергей 05.11.2011 / 22:35 — B-ReD 05.11.2011 / 22:17 — Ramik 03.11.2011 / 22:51 — B-ReD 03.11.2011 / 22:32 — Артем 03.11.2011 / 19:35 — RIA 02.11.2011 / 21:31 — Дабл 30.10.2011 / 11:45 — Галина 28.10.2011 / 11:09 — Елена 25.10.2011 / 04:16 — Иван 17.10.2011 / 18:03 — Александр 13.10.2011 / 18:54 — Николай 13.10.2011 / 17:45 — Олег 30.09.2011 / 17:56 — iQuik 27.09.2011 / 13:20 — coddax 27.09.2011 / 13:04 — coddax 22.09.2011 / 17:39 — Димка 20.09.2011 / 12:56 — Прокудина Наталья 09.09.2011 / 16:44 — ushi 08.09.2011 / 16:34 — Ксения 30.08.2011 / 02:53 — кристина 21.08.2011 / 17:04 — Дмитрий Колбин 21.08.2011 / 16:26 — Дмитрий Колбин 19.08.2011 / 13:35 — Adm 18.08.2011 / 14:06 — Азия 16.08.2011 / 10:15 — Дмитрий 13.08.2011 / 14:34 — Александр 13.08.2011 / 13:23 — Александр 10.08.2011 / 10:54 — ОЛьга 08.08.2011 / 20:13 — armin van buuren 2012 25.07.2011 / 12:01 — Алексей 23.07.2011 / 00:12 — Татьяна 07.07.2011 / 02:28 — dr.Web 02.07.2011 / 01:47 — B-ReD 02.07.2011 / 01:43 — Валентина 01.07.2011 / 12:38 — Имя 29.06.2011 / 20:35 — B-ReD 29.06.2011 / 20:22 — Имя 26.06.2011 / 02:55 — B-ReD 25.06.2011 / 14:10 — Владимир 25.06.2011 / 12:04 — Илья 23.06.2011 / 17:32 — Андрей 17.06.2011 / 08:21 — recived 13.06.2011 / 00:22 — B-ReD 11.06.2011 / 20:55 — kTunes 08.06.2011 / 22:54 — B-ReD 08.06.2011 / 12:11 — Тиесто 17.05.2011 / 00:14 — Промокашка 16.05.2011 / 16:12 — Сергей Горячев 08.05.2011 / 13:00 — Прокудина Наталья 22.04.2011 / 22:05 — Купоны 18.04.2011 / 00:14 — Павел 16.03.2011 / 20:11 — B-ReD 16.03.2011 / 18:18 — Татьяна 27.02.2011 / 23:12 — B-ReD 27.02.2011 / 21:32 — артёмка 23.02.2011 / 23:28 — B-ReD 23.02.2011 / 10:52 — Анатолий 22.02.2011 / 22:09 — B-ReD 22.02.2011 / 20:50 — GrachWeb 22.02.2011 / 17:25 — B-ReD 22.02.2011 / 16:22 — GrachWeb 14.02.2011 / 23:16 — B-ReD 14.02.2011 / 19:01 — Izanagi 13.02.2011 / 10:47 — B-ReD 13.02.2011 / 07:56 — Машнин 12.02.2011 / 17:08 — toribloger 12.02.2011 / 15:11 — pavka
|
![]() «Личный блог — это не общество анонимных интеллигентов, здесь и нахуй послать могут» © B-ReD
АрхивО сайтеКонтакты |