Как начать пользоваться школой!

Интересно? Полезно?
Подпишись на обновления в блоге одним кликом!
Реклама на блоге
Начинаем знакомство с лучших постов
Бронирование гостиниц
Продвижение сайтов


Rambler's Top100
Рейтинг блогов

Powered by  MyPagerank.Net
Яндекс цитирования

Моя аська: 155ноль54семь9 (всегда invisible)
Мой скайп: remarka.reklama
Мой емайл: masterxbablorub@gmail.com

пятница, 1 апреля 2011 г.

Как поставить кнопку Нравится (Mail.ru, Vkontakte), Лайк (Facebook), Класс (Одноклассники), Retweet (Твиттер)

Дает ли это траффик? Не знаю, как с одноклассников и майла, но с твиттера и контакта траффик идет. С фейсбука меньше, но тоже есть. А поскольку интернет быстро и активно социализируется, то возникает вопрос, как воткнуть все эти кнопки себе на сайт.

За пример берем сайт paranepara.ru. На нем установлены все пять кнопок. Для установки 4 из них никаких лишних телодвижений совершать не нужно. Для вконтактовской кнопки вам понадобится регистрация в этой сети.

Начнем с простого.

1) I like от Фейсбук (Facebook.com).

Официальный мануал и конструктор тут. Но он нам нафиг не нужен. Берем код

<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fmysite.ru&amp;layout=button_count&amp;show_faces=false&amp;width=200&amp;action=like&amp;colorscheme=light&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:200px; height:21px;" allowTransparency="true"></iframe>

И меняем в нем mysite.ru на ваш урл. Кнопка готова. Если вам нужен другой вид кнопки - воспользуйтесь конструктором по ссылке выше.

2) Нравится от Майл.ру (Мой мир, Mail.ru).

Официальный мануал и конструктор тут. Но он опять нам не нужен. Берем код

<a target="_blank" class="mrc__plugin_like_button" href="http://connect.mail.ru/share?share_url=http%3A%2F%2Fmysite.ru" data-mrc-config="{'type' : 'button', 'width' : '150'}">Нравится</a>
<script src="http://cdn.connect.mail.ru/js/loader.js" type="text/javascript" charset="UTF-8"></script>

И опять меняем mysite.ru на нужный нам урл.

3) Retweet от Твиттера (Twitter.com)

Тут лучше всего пользоваться сервисом tweetme.com, чем oфициальной кнопкой. Процесс установки описан тут. Но опять же ничего мы по ссылке смотреть не будем, а скопируем код ниже

<script type="text/javascript">tweetmeme_style = 'compact'; tweetmeme_url = 'http://mysite.ru';</script>
<script type="text/javascript" src="http://tweetmeme.com/i/scripts/button.js"></script>

И снова меняем mysite.ru на свой урл.

4) Класс! от Одноклассников (Odnoklassniki.ru)

Официальное руководство тут. Но оно нам не потребуется, хотя сам процесс несколько сложнее. Сначала между тэгами <head>...</head> надо вставить вот этот код

<link href="http://stg.odnoklassniki.ru/share/odkl_share.css" rel="stylesheet">
<script src="http://stg.odnoklassniki.ru/share/odkl_share.js" type="text/javascript" ></script>

а потом в нужном вам месте уже саму кнопку

<a class="odkl-klass-stat" href="http://mysite.ru/" onclick="ODKL.Share(this);return false;" ><span>0</span></a>

И снова меняем mysite.ru на наш урл. Не забываем добавить в тэг BODY атрибут onload="ODKL.init();"

5) Мне нравится или Одобряю от Вконтакте (Vkontakte.ru)

Здесь самый сложный алгоритм. Все сайты надо регистрировать в самом контакте. Так что авторизуемся в контактике и переходим на страницу виджетов. Тут выбираем "Подключить новый сайт" и добавляем свой сайт. После этого, кнопка ниже будет уже создаваться с вашим кодом API, который нам важен. Чтобы быть уверенным, что все ок, нажмите после создания сайта F5 - у меня был случай, когда код API сгенерился не сразу, а только с перегрузкой страницы.

Подбираем переключателями кнопку и дальше переносим код из поля себе на сайт. Между тэгами <head>...</head> вставляем первые две части кода

<script type="text/javascript" src="http://userapi.com/js/api/openapi.js?23"></script>

<script type="text/javascript">
  VK.init({apiId: ТУТ-ВАШ-НОМЕР, onlyWidgets: true});
</script>

Саму кнопку вставляете там, где она вам нужна

<div id="vk_like"></div>
<script type="text/javascript">
VK.Widgets.Like("vk_like", {type: "button"});
</script>

И в этом коде ничего менять не надо - вконтактик будет брать сайт из своей базы.

Собственно все. Остается один момент для тех, у кого блогспотовский блог и он задается вопросом, как я врезал тэги в текст статьи: вставить HTML-код можно, конвертируя его в этом сервисе.

После установки попросите ваших друзей пролайкать ваши кнопки, чтобы были ненулевые значения. Приятная часть в том, что кнопки майла, фейсбука и ретвита сами подхватят старые лайки, если они были кем-то сделаны по доброй воле до установки кнопок на сайте. У "класса" и вконтакта такого эффекта не обнаружено. Больше всего траффика с кнопочных ссылок идет с вконтакта. На втором месте твиттер, на третьем - фейсбук. В количественном плане быстрее всего набираются лайки фейсбука, потом ретвиты и затем только вконтакт.

Удачной вам социализации своих сайтов!

Совсем забыл про новую возможность в блоггер.ком. Наберите адрес этого блога так: http://bablorub.blogspot.com/view/ Перебирать варианты отображения - с помощью селекта вверху справа. Дальше без комментариев. Я минут пятнадцать игрался. Это теперь работает для всех блогспотовских блогов.

---------------------------------
Подпишись на обновления в блоге одним кликом! Читать на твиттере! :: Реклама в блоге


61 коммент.:

МастерХ, с каких пор ты начал писать такие нубские посты, как я?)

Вроде всегда писал. Смотри на метку: новичкам (85)

Да нет, последний качественно отличается от соседей по рубрике. Даешь про фавиконку! :)

Нормальный пост)) Не каждый же раз затрагивать глобальные проблемы. К тому же, как сегодня выяснилось, не сам Дмитрий их и пишет)))

Эх, жаль. Пойду к себе, о черном seo писать.

Спасибо. Но у меня получилось поставить одноклассников также без внешних файлов: http://beloperators.info/content/view/11682/812/ пробуем

Зачет, бля, как у учебнике.

Молоток! Это мне точно пригодится. Побольше такого, Дима. Я всё хотел разобраться в этом, да лень было, а теперь вот и не надо даже - всё уже готово. Спасибо!

а я пользуюсь набором кнопок от qip'a - там и дизайн нормальный, и к обычным социалкам еще и соц. закладки добавлены

facebook через iframe - не лучшее решение, не получится смотреть статистику через insights. Лучше потратить чуть больше времени и поставить кнопку с использованием XFBML.

Руслан, Вы бы ссылку на набор кнопок от qip'a указали!

Как и Dimalash, тянул время, а тут за несколько минут добавил. Спасибо!

Кому интересно, для Joomla+VirtueMart надо править такие страницы:

Здесь править HEAD
/templates/%ВАША ТЕМА%/index.php

Здесь добавить кнопки для статьи
/templates/%ВАША ТЕМА%/html/com_content/article/default.php

Здесь добавить кнопки для товара в каталоге или магазине
/components/com_virtuemart/themes/default/templates/product_details/flypage.tpl.php

Есть ли какой-нибудь сервис, который позволяет отслеживать количество лайков для страниц сайта суммарно по разным соц сетям?
Я нашел только вот это - http://web-sence.com
но там недоделка и проверка только по одному URL

sMiles, попробуй addthis, он умеет трекать не только лайки, но и их виральность.
Еще можно поставить яндексовую поделку http://api.yandex.ru/share/ при наличии Метрики на сайте можно увидеть статистику использования кнопок.

про кнопку Гугл +1 забыли написать

спасибо за информацию.
но такой вопрос.
на моем блоге кнопка появилась, но лайк с нее пропадает и остается вечный 0. когда сама хотела получить код с фейсбука пишет, что только проверенные разработчики могут могут быть добавлены.

что же не так?

Я хз. У меня лайки не сбрасываются. Есть косяк только с вконтакте. Там и регистрировать каждый сайт отдельно надо. И частенько счетчик в ноль сбрасывается.

я че-то не могу лайкера под вконтакте засунуть на blogger. В шаблоне кода мой ID не указывается хотя во вконтакте защел под своим логином, обновлял много раз но мой идентификатор на указывался. Как быть?

Перевойти вконтакт. Заново добавить свой сайт. Получить айди.

Подскажите, как поставить кнопки в один ряд. Они у меня встают столбиком - это не красиво.

Верстку надо освоить. По-другому никак. Закажите на фрилансе за 5 баксов.

По лайку от фейсбука.
В коде указан урл сайта, а не конкретной записи. Будет ли он считать лайки только конкретной записи или сайта в целом?

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

Виктория
за 3$ готов сделать )))

Возможно туплю но я начинающий и просят поставить лайк фейсбука... урл писать с хттр или без него?)

по коду же видно, что с хттп.

vklike.tk накрутка "мне нравится"

Вау! Хоть кто-то по-РУССКИ описал как это сделать! Спс!

Как это сделать на Blogspot???

Спасибо, очень полезный пост! Только вот вопрос как бы поставить кнопки вряд, чтоб красиво было.

А я себе на Blogspot "вконтакте" прикрутила, но как-то криво. Тоже все времени нет поправить, чтобы красиво было. Хотя, с другой стороны. она всегда на виду. Такие посты тоже нужны. А то или пишут сильно заумно (так для тех, кому понятно уже - и так все ясно), или же пишут такие же новички (а как тогда верить информации?).

Кнопочки очень нужный элемент, они привлекают читателя заставляя его тем самым дольше задерживаться на блоге, да и трафик с социалок идёт неплохой. Спасибо за статейку!

Статья отличная, но я вот уже три дня бьюсь с одной проблемой. Мне надо несколько кнопок на одной странице.
У меня такая проблема: есть сайт-каталог автомагазинов города.
мне необходимо что бы в каждой карточке была кнопка "понравилось" и
"класс ". Карточки заполняются через функцию. я в эту функцию добавляю
строчку:
a href=" http://connect. mail.ru/share? share_url =http%3 A% 2F% 2Fapi.mail. ru"
target="_ blank">Нравится
в файл шаблона index. php добавляю
script src=" http://cdn .connect.mail.ru/js /loader.js " type="text/javascript "
charset="UTF -8">
для того что бы каждая кнопка была уникальной я в share_ url= пишу есho
($hrеf );
$href в этой переменной содержиться ссылка на запись, то есть если тапнуть
по названию карточки то мы попадем внутрь записи. ссылка в названии
карточки как раз задается этой переменной, т.е . она работоспособна.
так вот проблема заключается в том что на каждую карточку создается своя
кнопка, но при нажатии на любую кнопку +1 добавляется к каждой карточки
и на стенку в соц. сети мне вывдится не ссылка на запись, которая должна, а
ссылка на категорию с карточками.
подскажите как можно сделать что бы каждая кнопка была уникальная?

Вот скрин сайта content.foto.mail.ru/mail/n-ck/_blogs/i-80.jpg

лайк за лайк))
добовляемся в друзья:3
http://vkontakte.ru/id160039419

http://vkontakte.ru/ubiniti
на стену, отвечу тем же))

Не понял, как все же сделать кнопку для ВК, ОК и ММ?
Куда коды вставлять?
Сверху справа нет ниче ( для блогспот)...

Ребята,вы все умные,поражаюсь! Объясните мне:не загружается TopFace на Facebook ,что делать?

Народ как можно увиличить лайки вк. Кто умеет помогите пожалуста

есть еще вариант от яндекса:
http://api.yandex.ru/share/
только возможностей по настройке внешнего вида там почти никаких
зато добавляемого кода всего пара строк (а кнопок штук 9)

еще есть сервис - одна кнопка:
http://odnaknopka.ru/
кнопок в нем еще больше, установка - как и у яндекса (внешний вид тоже похож)

http://prostrelcs.at.ua/news/asus_spring_cup_2012_objavlen_vtoroj_gruppovoj_ehtap/2012-05-28-53 вот как сделал !надо бы в ряд

как поставить кнопку лайка под каждой картинкой подскажите

Процесс действительно сложный(

очень полезный материал, огромное спасибо автору!!!

У нас реализованы все основные кнопки, причем пользователям нет необходимости устанавливать на своем сайте кучу кнопок, делая на нем внешние, исходящие ссылки с главной страницы!
http://social-catalog.ru

2socialmagic.com - модуль для DLE, всего за 3 вмз можно получить много лайков и ретвитов.

Спасибо за код кнопок, поставлю себе

Спасибо классная инфа! супер давно хотел зделать. вот только не знал как. Думал что всё намного сложнее. Еще раз благодарю!

Скажите пожалуйста какой файл редактировать в вордпресс для вставки кода между тегами head? Спасибо заранее!

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

Ребята подскажите, что за номер нужно вписывать в VK кнопке??

Как поставить класс в Одноклассниках: http://www.socseti4you.ru/2015/08/kak-postavit-klass-v-odnoklassnikah.html

Отправить комментарий

Популярные сообщения

Эту страницу: Twitter Facebook Favorites More