2010-10-28

Кнопки социальных закладок

   Каждый из нас, конечно же, неоднократно видел на блогах, сайтах и форумах единую кнопку добавить в социальные закладки. Такая кнопка является своего рода инструментом в продвижении блога. Любой читатель Вашей странички может добавить ссылку на понравившуюся статью в те закладки, которыми он привык пользоваться. В итоге вы получите постоянного читателя, дополнительную ссылку, а также возможно, что по этой ссылке к вам придут и новые посетители.
   Чтобы добавить такую кнопку себе на страницу воспользуемся сервисом Одна кнопка.
1.Переходим на страницу сайта и жмем на кнопку .
2.Выбираем вид кнопок.
..
   Однако, если у вас блог находится на платформе, не позволяющей использовать скрипты (такие как, LI.ru, ЖЖ, Я.ru, mail.ru, привет.ru, Diary.ru и др.).
3. Следующим шагом указываете, где будет установлена кнопка
- в блоге или на сайте, то указываете первый вариант.
- в блоге, в котором возможно редактирование шаблонов, таких как blogspot или Wordpress - то второй.
4.Копируем полученный код из пункта 3. Для блогов Li.ru, ЖЖ, Я.ru, Mail.ru, привет.ru, Diary.ru копируем код без скрипта (он выделен на скриншоте красным цветом):
   Чтобы вставить код скрипта после каждого сообщения на блогспоте необходимо в шаблоне HTML найти строчку <div class='post-footer'>, предварительно, поставив галочку напротив строчки "расширить шаблоны виджета" и после нее вставить код Javascript.

   Еще одним сервисом, предоставляющим такие кнопки является сайт AddThis.
   Здесь Вы заполняете все необходимые поля:
Если хотите увеличит скриншот, то нажмите на него.

В первом пункте выбираете Email Newsletter, затем вводите адрес вашего блога, выбираете стиль кнопки, нажав на more options...,Вы найдете очень много стильных кнопок (однако их выбрать из этой коллекции возможно лишь если есть поддержка скриптов). Выбираете понравившийся стиль и копируйте код. Код Javascript поместите в шаблон HTML до закрытия тега </body>, а html-код в любом месте страницы, там, где хотите видеть кнопочки. На Blogspote идем Элементы страницы - Добавить гаджет - HTML/JavaScript. В открывшееся окно вставляем HTML-код.
   В качестве примера я на время установила такие кнопочки у себя в блоге (в левом нижнем углу).

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

Анонимный комментирует...

Искал иконочку "Добавить в избранное". Нашел у вас. Спасибо)))

Анонимный комментирует...

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

я поставила кнопки социальных закладок внизу поста, воспользовавшись вашим советом с div class='post-footer'
когда читатель внутри поста, все кнопки работают и дают ссылку на этот пост. [например: me.blogspot.com/leto]
но когда читатель на главной странице и жмёт кнопку в конце любого поста, кнопки дают ссылку на главную страницу, а не на этот пост :-( [например: me.blogspot.com]

мой вопрос: как сделать так, чтобы, нажав кнопку под любым постом на главной странице блога, можно было бы поделиться адресом именно этого поста, а не самого блога?

Mycrib комментирует...

В данном уроке продемонстирирован наиболее простой способ вставки кнопок социальных закладок в блог.

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

Копируйте код социальных закладок с любого сервиса, предлагающего кнопки. Вставьте в блокноте код между кодами <b:if cond='data:blog.pageType == &quot;item&quot;'> и </b:if>

У меня получилось следующее:

<b:if cond='data:blog.pageType == &quot;item&quot;'><script src='http://odnaknopka.ru/ok3.js' type='text/javascript'/></b:if>

Теперь открываем редактор кода в шаблоне blogger, расширяем шаблоны виджета, находим строчку в коде <p><data:post.body/></p> и вставляем код из блокнота после нее. Если вы хотите добавить кнопки в начале записи, то код вставляем до строчки <p><data:post.body/></p>. И в этом случае кнопки соцзакладок не будут видны на главной странице блога, равно как и на странице меток, архивов и прочее.

Если у вас остануться вопросы - пишите, обязательно отвечу.

Анонимный комментирует...

спасибо вам огромное за ответ, а тем более за быстрый ответ! вы меня очень порадовали:-)
а не могли бы вы ответить ещё на пару вопросов?

как сделать так, чтобы кнопки социальных закладок всё же появлялись под постами на главной странице (до "читать дальше"), но, когда их нажимаешь, возникали бы ссылки на эти посты, а не на главную страницу?

если я правильно вас поняла, кнопки, расположенные под постами на главной странице, могут ссылаться только на неё? и сделать так, как я хочу, невозможно?

но у меня есть посты-коротышки без "читать далее", и мне просто хотелось бы, чтобы читатели могли делиться и ими (никто ведь не пойдёт внутрь поста за кнопками :-( )

Mycrib комментирует...

Вряд ли это возможно.

Оксана Титова комментирует...

Спасибо! Получилось сразу!
Извините за просьбу, не могли бы Вы рассказать, как разместить на блоге гаджет " я в контакте", при нажатии на которую можно было бы перейти на мою страницу в этой соц. сети?
Заранее спасибо!

Mycrib комментирует...

Оксана, вставьте код кнопки, который вы получите на странице виджетов vkontakte

Оксана Титова комментирует...

Я должна вписать этот код в шаблон страницы, или вставить отдельным гаджетом?
Я не сильна в языке HTML, к сожалению.

Mycrib комментирует...

Это зависит от того куда вы хотите вставить кнопку "я в контакте". Если рядом с кнопками социальных закладок, то нужно идти в редактор шаблонов, найти код одной кнопки (Ctrr + F и ищем http://odnaknopka.ru/) и вставляем код кнопки на профиль вконтакте рядом со скриптом социальных закладок.

Если вы хотите разместить кнопку vkontakte в боковой колонке блоа, то воспользуйтесь гаджетом Html / Javascript.

Antonina Romanova комментирует...

Наталья, как на сайте AddThis добавить нужные кнопки?
Доступны всего 3 - http://s019.radikal.ru/i638/1303/c6/2b3096382a29.jpg

Mycrib комментирует...

Антонина, уже все в порядке. Это были какие-то глюки на пикасе. Я тоже видела, что скринов нет. Зашла сейчас на страницу статьи addthis - все картинки на месте.

Antonina Romanova комментирует...

Спасибо! Вчера поставила кнопки в некоторые сообщения в качестве пробы, испытала - появились ссылки вконтакте и одноклассниках, а сегодня кнопок в сообщениях блога не вижу(((((

Antonina Romanova комментирует...

Разобралась с кнопками. Вставила в шаблон блога после div class='post-footer'. Все работает! Спасибо! Пришлось немного помучится, и все получилось. =)

kraser комментирует...

Mycrib, здравствуйте!
В моем блоге на Blogger я использовал кнопки от PLUSO после каждого своего сообщения на блоге. Нормальный сервис. Скажите, пожалуйста, как убрать стандартные кнопки от Blogger, чтобы не было и тех и этих? И еще, как прикрутить кнопки PLUSO к старым сообщениям блога, когда еще я не получал код от PLUSO? Спасибо.

Mycrib комментирует...

kraser, вы можете для начала попробовать убрать стандартные кнопки так:

1. Вкладка "Дизайн",
2. Элемент страницы "Сообщение блога" -> изменить,
3. убираете галочку напротив кнопок blogger.

Второй способ:
В редакторе шаблона блога ищем и удаляем код <div class='post-share-buttons goog-inline-block'>
<b:if cond='data:post.sharePostUrl'>
<b:include data='post' name='shareButtons'/>
</b:if>
</div>


или такой в ависимости от шаблона:

<div class='post-share-buttons'>
<b:include data='post' name='shareButtons'/>
</div>

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

Комментарии, содержащие ненормативную лексику, спам, оскорбления, публиковаться не будут. Ели вы хотите опубликовать код в комментарии, то воспользуйтесь encoder HTML
Публикуя комментарии, вы соглашаетесь с политикой конфиденциальности