SEO простым языком

О продвижении бизнеса в интернете

Кнопки социальных сетей для Blogspot Blogger

Доброго времени суток, уважаемые читатели. Вот уже несколько месяцев хочу поделиться с вами красивым оформлением кнопок социальных сетей. Ещё летом, перейдя на персональный домен, я задумала поменять дизайн блога, под который искала красивое решение кнопок добавления в социальные сети. Все-таки, однакнопка, которая у меня установлена в конце статьи смотрится неказисто, а то, что под ней, кнопки Addthis и Мой мир вообще никуда не годятся. Дизайн менять передумала, а вот кнопочки давно хотела установить.

Кнопки социальных сетей для Blogger Blogspot
Давайте для начала немного определимся, что мы называем социальной сетью.
Сайты, которые наполняются зарегистрированными пользователями, участниками этого сайта и называются социальными сетями. Мы привыкли называть социальной сетью Мой Мир, Вконтакте, Одноклассники и другие. Все это сайты, которые наполняются участниками. Пользователи заводят в них свои странички, дневники, пишут на стенах друг друга (если это есть), делятся ссылками на интересные ресурсы. У каждой социальной сети есть свои кнопки, которые можно устанавливать в своем блоге или на сайте.

Я уже писала у себя в блоге, почему важно иметь подобные кнопки.

Установка кнопок закладок, социальных сетей относится к внутренней социальной оптимизации.

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

То, что не так давно было предложено разработчиками блоггер мне нравится.

Кнопки социальных сетелй
Просто, со вкусом, лаконично, но согласитесь, что этого очень мало. Данные кнопки сделаны под англоязычный интернет, у нас же, наряду с этими социальными сетями, пользуются даже большим успехом наши, русскоязычные сети. К сожалению, в рунете нет хороших полноценных решений для интеграции кнопок социальных сетей в блоги на Blogger Blogspot. Для WordPress, например, чего только не придумали, а вот нашу любимую платформу обходят стороной. А так хочется, чтобы наши блоги достойно стояли в одном ряду с блогами на WordPress. Да и умельцев почему-то очень мало, кто мог бы взять и сделать это. А зря, это имело бы очень большой успех. Потому что даже то, что я сегодня вам предложу, не является идеальным решением.

Решение я нашла в одном блоге и в конце этой статьи дам ссылку, а так объясню, почему я решила написать свою статью. Дело в том, что я доработала тот код под свой вкус, внесла некоторые изменения, о которых и упомяну в конце. А вы уж сами решите, пользоваться моим решением, или тем, которое предложено в том блоге. Но перейду к делу.

Вот как могут выглядеть кнопки на вашем блоге.

Кнопки русских социальных сетей
Почему “могут”? Потому что вы можете сами менять внешний вид кнопок, сделать под свой вкус, под свой дизайн блога. Они могут быть другого цвета, формы, в другом порядке. Я постараюсь максимально подробно все описать, чтобы вы могли сами менять их на свое усмотрение.

Начну с того, что для кнопок Twitter и Blogger я взяла код от разработчиков blogger, поэтому, чтобы они работали, необходимо включить у себя в блоге их показ.

Идем в Инструменты блога, на вкладку Дизайн – Элементы страницы – Сообщения блога – Изменить. И ставим галочку Показывать копки для публикации. Но нам не нужно, чтобы эти кнопки видели читатели, ведь мы будем использовать собственные кнопки. Поэтому идем на вкладку Изменить HTML. Ставим галочку Расширить шаблоны виджета и находим код:

<div class=’post-share-buttons’>
<b:include data=’post’ name=’shareButtons’/>
</div>
Этот код необходимо закомментировать, для этого обрамляем его вот таким образом
<!—<div class=’post-share-buttons’>
<b:include data=’post’ name=’shareButtons’/>
 </div>—>
Любой код в шаблоне можно найти при помощи поиска, вызывается нажатием клавиш Ctrl+F.

Еще по теме  Особенности рекламной кампании в социальных сетях

Лучше эти строки закомментировать, чем использовать в стилях шаблона display:none. Если вдруг вы не нашли эти строки в своем шаблоне, то не мучайтесь, а посмотрите, отображаются ли эти кнопки в самом блоге. Скорее всего нет. А значит, у вас все готово. Дело в том, что когда разработчики внедрили свои кнопки, не во всех шаблонах они отображались, а чтобы начали отображаться, нужно было добавить в шаблон именно тот код, который мы перед этим закомментировали. Если все же кнопки в блоге есть, а вы не можете их найти в шаблоне, то будьте внимательны и поищите ещё раз.

С этим справились. Я решила не выкладывать весь код кнопок, а сделала вот такой файл. Открываем его. Это обычный блокнот. Смотрим. Так выглядит код полностью с моими комментариями. Давайте разберем подробнее, как строится код каждой кнопки. Это очень просто. Вам только нужно понимать, какой код имеет ссылка и изображение на языке HTML

<a class=’shareme’  expr:href=’адрес социальной сети и код добавления’><img src=’http://адрес картинки’  /></a>
Самое главное понять, что каждая кнопка представляет из себя картинку <img src=’http://адрес картинки’  /> , которая находится внутри ссылки <a href=’http://…’>тут код картинки</a>.
Я специально выделила цветами для большей наглядности. То, что синее – это ссылка, то, что внутри синего зеленое – это код картинки.

Если вы впервые сталкиваетесь с кодом, то рекомендую ознакомиться с этой статьей.

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

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

<!—AddThis—>
<a class=’addthis_button’ expr:addthis:title=’data:post.title’ expr:addthis:url=’data:post.url’>
<img alt=’в закладки’ src=’http://lh6.ggpht.com/_G92voTj-yF0/TFXt9xlZLrI/AAAAAAAAAbI/p2KDApn2m0E/addthis.png’/></a>
<script type=’text/javascript’>var addthis_config = {&quot;data_track_clickback&quot;:true};</script>
<script src=’http://s7.addthis.com/js/250/addthis_widget.js#username=amateurbloger’ type=’text/javascript’/>
Дело в том, что я решила не отказываться от кнопки Addthis, которая стояла в блоге до этого момента, и нашла решение, как изменить ее внешний вид. Вы можете не использовать эту кнопку, удалив ее из кода в файле. А можете зарегистрироваться на их сайте, подключить статистику и получить код кнопки.

Еще по теме  Создание блога на Bogger, регистрация, первый вход, изменение адреса или названия блога

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

<!— AddThis Button BEGIN —>
<div class=»addthis_toolbox addthis_default_style»>
<a href=http://www.addthis.com/bookmark.php?v=250&amp;username=тут будет ваш логин class=»addthis_button_compact»>Share</a>
</div>
<script type=»text/javascript»>var addthis_config = {«data_track_clickback»:true};</script>
<script type=»text/javascript» src=»//s7.addthis.com/js/250/addthis_widget.js#username=тут будет ваш логин«></script>
<!— AddThis Button END –>
Из этого кода удаляем все ненужное, и получаем вот такой вариант:
<a href=http://www.addthis.com/bookmark.php?v=250&amp;username=тут будет ваш логин class=»addthis_button_compact»>Share</a>
<script type=»text/javascript»>var addthis_config = {«data_track_clickback»:true};</script>
<script type=»text/javascript» src=»//s7.addthis.com/js/250/addthis_widget.js#username=тут будет ваш логин«></script>
А вместо слова Share вставляем код картинки. Получается, как в моем коде выше.

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

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

.post-body img, .post-body .tr-caption-container, .Profile img, .Image img,
.BlogList .item-thumbnail img {
  padding: 5px;
  background: #fff;
  -moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, .5);
  -webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, .5);
  box-shadow: 1px 1px 5px rgba(0, 0, 0, .5);
}
И удаляем тот кусок, который я выделила серым курсивом. Если не хотите удалять, можете просто закомментировать, поместив его внутрь этой конструкции /*код, который нужно закомментировать*/. Обратите внимание, закрывающая скобка } должна остаться в неизменном виде.

После этого уже можно и внести стиль для кнопок. Находим код:

]]></b:skin>

и перед ним вставляем этот:

.sharebuttons a img{
border: none;
opacity:0.5;
}
.sharebuttons a:hover img{
border: none;
opacity:1.0;
}
.sharebuttons img {
padding:0;
margin:0;
}
В принципе, этот код не обязателен и кнопки будут отлично функционировать без него. Первый блок придает всем кнопкам полупрозрачный вид, а второй блок, наоборот, делает кнопки яркими при наведении на них курсора мыши. Если вам это не нравится, можете удалить или переделать на свой вкус. Последний код просто сообщает, что у картинок кнопок нет полей. У всех шаблоны разные, и возможно, вам понадобиться указать какие-то поля (указываются в пикселях, например margin:5px;). В этой статье я давала ссылки на учебники, по которым вы можете получить минимальные знания по HTML и CSS.

Ну и теперь самое главное, куда вставлять весь код кнопок в шаблон. На мой взгляд, самое идеальное место – это, естественно, в конце каждой статьи. Открываем вкладку Дизайн-Изменить HTML и находим этот код:

<div class=’post-body entry-content’>  
<data:post.body/>
Сразу после него можете вставить весь код, который находится в файле. Естественно, слова «Понравилась статья? Поделитесь ей с друзьями» можете поменять на свои, а так же указать свой стиль для них, чтобы они визуально выделялись рядом со стандартным шрифтом вашей статьи. Какие-то рекомендации давать не имеет смысла, т.к. у всех шаблоны разные, но это может быть примерно так:
.sharebuttons {
font: 20 px Comic Sans MS, Comic Sans MS, cursive;
color: #B01D1D;
}
Параметр font задает размер и тип шрифта. Самые распространенные шрифты можете посмотреть тут. А color задает цвет шрифта, подобрать цвет вы можете здесь.

Еще по теме  Правильное написание статей для сайта

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

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

Немного расскажу, какие есть отличия между кодами.

Как я выше заметила, я решила для Twitter и Blogger использовать код разработчиков. В случае с твиттером из-за того, что в том варианте не сокращаются ссылки, но зато в сообщение есть RT, так что решайте сами. В случае с Blogger – в предложенном коде отправляется одна только ссылка, в «моем» же варианте после ссылки идет небольшой кусочек начала статьи, что и выглядит приятней и избавляет блоггера (который решил опубликовать у себя ссылку) от лишних телодвижений.

[ads1]Так же, практически ко всем кнопкам я добавила код, благодаря которому ссылки открываются в небольшом окошке. Что и смотрится аккуратней, и, опять же, наш читатель не уходит на другой сайт, а остается в нашем блоге. Не удалось сделать только для Twitter, почему то никак не хочет получаться, и не сделала для ЖЖ, т.к. не имело смысла. Были и другие мелочи, о которых не имеет смысла писать. Так что выбор за вами.

Если вам понравились мои кнопочки, то вот архив с картинками. Вы можете, как пользоваться моими, так и загрузить эти же кнопки в свой веб-альбом, а в код поместить адрес своих картинок. Или вообще придумать свои личные кнопки.

P.S. Дополнение через час после публикации статьи.
Прошу прощения у всех читателей, которые могли уже успеть прочитать статью. Вот так бывает, поторопишься и совсем из головы вылетит. В шаблон необходимо вставить ещё один код. Он полностью взят с того блога, на который я дала ссылку, и необходим для удобства пользователей Яндекс Блогов Я.ру. Вот этот код:

<script type=»text/javascript» src=»//ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js»></script>
<script type=»text/javascript»>
$(document).ready(function() {
  $(«a.shareme[href^=’http://my.ya.ru’]»).attr(«href», function() {
      return «http://passport.yandex.ru/passport?mode=auth&amp;retpath=» + escape(this.href);
  });
});
</script>
Вставить его нужно перед закрывающим тегом </head>.
На этом все. Удачи.

Мои услуги

Создание сайта

Полностью готовый сайт для посетителей и продвижения под ключ

От 10 000р

SEO услуги

От аудита до продвижения. Независимый консалтинг.

От 3 000р

Digital-маркетинг

Разработка стратегии продвижения под Ваш проект. Распаковка экспертов.

От 3 000р

Коучинг

Инструмент, который поможет Вам завоевать весь мир.

От 10 000р

Поделитесь с друзьями

207 thoughts on “Кнопки социальных сетей для Blogspot Blogger

  1. Катя привет.Ты прямо как мысли мои читаешь.Решила я себе тоже кнопки социальные поставить и пишу поставить соц кнопки в блогер и что мне выдал наш любимый Гуглик???Товю статью.Когда посмотрела какого числа пост удивилась.Прям как в яблочко честно.Пока поставила обычные т.к. времени нема делать как у тебя,но когда разгребусь сделаю красивенькие кнопочки ,по твоему руководство очень отлично всё написала.Спасибо как всегда.

  2. Kuzuxa, не знаю, как насчет моих телепатических способностей, а вот в способностях гугла ты сегодня убедилась. Это был быстрый поиск гугла, который находит самые свежие материалы по запросам, которые вводит пользователь в строку запроса. Такое же есть и у Яндекс. А в быстром поиске участвуют те сайты, которые часто обновляются, и в день публикации можно получить несколько переходов даже по очень конкурентным запросам. Как я писала в недавней статье, что как только я стала часто публиковать статьи, у меня сразу стал увеличиваться поисковый трафик.

  3. Катерина, Ваш блог пора переименовывать в блог «СЕО ГУРУ» или «СЕО Сенсея».
    Кнопки красивые получились, но путь установки слишком тернист для меня, подожду попроще решения этого вопроса, тем более что соц сети меня не очень интересуют.

  4. Спасибо, Oleg. Конечно, подождите, но хочу сказать, что кнопки устанавливаются очень просто, а я как всегда постаралась все подробно разжевать, поэтому кажется сложно.

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

  6. Kladez-zolota, а вам мой вариант и не подойдет, т.к. он для Blogger, а у вас WordPress. Но для вас есть решение в виде специального плагина, посмотрите на сайте однойкнопки, там это есть.

  7. Спасибо.
    А я использую Код — одна кнопка, я так думаю особой разницы нет? кроме визуальной. Единственное что мне не нравится, то что он располагается под комментариями, что очень плохо, как не настраивал, все равно в самом низу поста(
    http://iamhappinessnow.blogspot.com/2010/10/blog-post.html

  8. Дмитрий, разница, хоть и несущественная, но есть.
    В одной кнопке нет Blogger
    Однакнопка открывает новые полноценные вкладки (или окна, у кого какие настройки браузера), в моем же коде открываются небольшие окошки под размер рабочего поля.
    Ещё разница в том, что в однойкнопке, что есть, то есть, а в моем коде кнопок можно убрать не нужное, а в будущем, может добавится что-то новое, другими словами, предложенный мной вариант более гибок в настройках.
    И да, внешний вид. Однукнопку вы никак не измените, эти же кнопки можно изменить как душе угодно.
    В принципе, конечно, это мелочи, и дело вкуса каждого.
    по поводу того, что у вас кнопки не в том месте — плохо стараетесь, не в то место ставите. Прочитайте, в какое месте рекомендую я установить свой код, и попробуйте вставить туда свой.
    И ещё, как вариант, найдите строчку с этим кодом
    post-footer-line post-footer-line-3
    и сразу после его окончания, должен завершиться скобкой >вставьте свою кнопку.

  9. спасибо большое, все таки буду ставить Ваши кнопки, они гораздо лучше))

  10. Да, Катя, интересное решение. При том очень актуальное на сегодня в плане оптимизации и в первую очередь удобства для людей. Я на своем сайте тоже добавил нечно подобное.

  11. К сожалению, для Blogger мало таких решений, но стараемся, выкручиваемся:). Спасибо за комментарий.

  12. Получилось красиво. Я же издавна сторонник минимума кнопок, но со счётчиками. И в этом плане очень заинтересовал 3 тип кнопок на сервисе AddThis, который beta. Надо будет попробовать.

  13. Olesyacreate, попробуем разобраться.
    То, что у вас не вставлялось в тот код, который написала я, но вставилось в другой — это из-за того, что у всех шаблоны разные, и возможна разница. Из-за этого и не получалось.
    А вот почему кнопок нет, совсем не понятно.
    Зашла только что на ваш блог, вижу, уже все есть. Значит справились.

  14. Все действительно появилось, оказывается проблема была из-за блокировки рекламы… поэтому кнопки и не отображались.

    Спасибо, за статью, очень понравился блог, унесла много ценного и полезного, буду читать дальше!!!

  15. Добрый вечер!
    Вы знаете вроде бы все сделал как Вы написали.
    В результате просто исчезли все кнопки.
    Что делать?

  16. Здравствуйте.
    Смотрите, выше в комментариях, у Olesyacreate была очень похожая проблема. Попробуйте вставить код в другое место, и там ещё что-то из-за объявлений не получалось.

  17. Огромное Вам спасибо за статью , очень пригодилась.
    У меня к Вам просьба, опишите пожалуйста установку виджета похожих статей.
    Заранее благодарен

  18. а у меня не получилось,не сохраняется шаблон еще на этапе закомментирования стандартных кнопок 🙁

  19. Хельга, давайте сделаем так.
    Вы ещё раз внимательно читаете и пробуете, возможно, что, что-то сделали не так.
    Если все равно не получается, тогда в стили шаблона вставьте этот код
    .post-share-buttons {
    display: none;
    }
    Куда именно вставить, прочитайте в этой статье, там где я пишу про код, который нужно вставить перед этим
    ]]>

  20. А у меня тоже кнопок не видно. А где поискать блокировку рекламы?

  21. Рекламу блокировать не надо, это реклама блокировала показ кнопок. Попробуйте сами кнопки вставить в другой место.

  22. Я сделала у себя на сайте и у меня получилось! Спасибо за подробные инструкции, Катя. А как добавить еще и кнопку Класс от Одноклассников?

  23. Я рада, что проблем не возникло.
    Сразу не скажу, как сделать кнопку одноклассников. Сама не пробовала, но давно собираюсь. Постараюсь в ближайшее время поэкспериментировать и написать об этом.

  24. Решила проверить, как работают кнопки у меня в блоге. Оказалось, что первые две, Блоггер и Твиттер, не работают. Пишет, что страница не найдена. Вы не знаете, Катя, с чем это может быть связано? http://onoskah.blogspot.com

  25. Сколько времени существует мой основной блог,столько я и экспериментирую с этими кнопками.И сам делал в том числе.Твой вариант то,что мне нужно,я бы сказал идеальный.Кстати грамотно ссылку на этот пост разместили,сразу понятно где искать,так бы может и не бегал по архиву.
    В целом.Спасибо.Займусь на досуге)

  26. А в какое другое место, Катя? Все вроде сделал по писаному, ну только последнюю кнопку выбросил, с крестиком такую. Родные кнопки хорошо пропадают, а новых что-то не видно при просмотре.

  27. Это может быть связано с тем, что вы невнимательно прочитали статью, т.к. об этом написано здесь:).
    Как я вам уже написала на почту, я отвечу вам более подробно.

  28. Конечно, мой вариант не идеальный, но из того, что есть в рунете, действительно самый удобный и красивый:) Я старалась.
    по-поводу ссылки, конечно, я подумала, что так будет для читателей удобней всего, да и на позициях в гугл это хорошо сказывается.

  29. вот что значит грамотный подход.
    Я ночью саттелит делал и хотел сделать эти кнопки,чтобы на главной отображались,т.е везде,там ката не будет.Как сделать не подскажете,что убрать?Я часть кода убрал,а они у меня с интервалом получились почему то.

  30. Что-то я не пойму: ваш код из блокнота куда все-таки надо вставлять? Поясните для особо одаренных…

  31. Найдите в статье эти слова:
    Ну и теперь самое главное, куда вставлять весь код кнопок в шаблон.
    И начинайте следовать инструкциям.

  32. Именно так и было поскольку в просмотре я видел главную страницу, а на внутренних кнопки есть. Не знаю пока работает ли все нормально, в выходные покопаюсь. Спасибо за участие.

  33. Хорошо. Если вы четко следовали всем инструкциям, все должно работать.

  34. Здравствуйте. Вопрос немного не по теме. Я установила в блоге топ комментаторов, но мое имя там на первом месте. Как его оттуда убрать?

  35. А там, откуда вы этот скрипт устанавливали об этом не написано? Обычно, если эта настройка предусмотрена, об этом пишут.

  36. Татьяна:

    Спасибо. Вставила в блоггер без проблем!

  37. Катя,здравствуй!А у меня оказывается кнопки блоггера и твиттера не работают,окно всплывает,но адрес страницы не до конца прописывает,получается ссылка вида http://www.домен.ру/2010/&target=blog ,код из блокнота не менял,может глянешь что там не то?

  38. Мне и глядеть не нужно, я знаю, в чем проблема. Ты невнимательно прочитал статью:)
    Я писала, что чтобы именно эти кнопки заработали, нужно в инструментах блога включить их показ, но скрыть от глаз пользователей. Прочитай статью внимательней. И сделай так, как написано. Если после этого не получится, будем решать.

  39. как подобное реализовать на DLE ?

  40. Простите, но ничем не смогу помочь. Я не знакома с этой CMS на столько, чтобы сделать для нее такие кнопки.

  41. Ryapolova_nadezda:

    Катя,здравствуйте. Статья замечательная!!!Очень полезная!Но…я уже в отчаянии,уже час пробую вставить эти кнопки,но все безрезультатно. Пишет мне следующие: Не удалось предварительно просмотреть ваш шаблон

    Исправьте перечисленные ниже ошибки и отправьте шаблон еще раз.
    Не удалось проанализировать ваш шаблон, так как он неправильно сформирован. Убедитесь, что все элементы XML правильно закрыты.
    Сообщение об ошибке в XML: The element type «div» must be terminated by the matching end-tag «
    Катя, вроде уже все перепробовала.Пожалуйста, подскажите!

  42. Спасибо за статью, все получилось!!! Скажите пожалуйста, как надпись «понравилась статья? поделись с друзьями» сделать по центру?
    Заранее благодарю за ответ

  43. Могу предположить, что вы вставляете код не в то место, которое можно вставить. Даже если вы вставляете туда, куда написала я, это не означает, что в вашем шаблоне этой пройдет, т.к. шаблоны все разные. Чтобы дать вам более точный совет, мне нужно видеть ваш блог. Пожалуйста, укажите свой блог в нике или в самом комментарии, я посмотрю и скажу, как лучше сделать в вашем конкретном случае.

  44. Там, где вы указывали стиль отображения кнопок в шаблоне, добавьте такой код:
    .sharebuttons {text-align:center;}

  45. тоже ничего не выходит: или отвергается, немного по другому — все остается на прежнем месте. Единственное, что я не делал — не устранял стандартныее кнопки, но, думаю, это не важно. Если бы все получилось, выполнил бы операцию отКОММЕНТИРОВАНИЯ СТАНДАРТНЫХ КНОПОК., НО…

  46. По задумке, кнопки и не должны отображаться на главной. но это можно исправить, убрав специальный код, первая строка начинается с Во-первых, изучите внимательно, какие бывают у Яндекса фильтры. У каждого фильтра есть свои характерные особенности и признаки. Проанализируйте, под какой из фильтров мог попасть ваш блог. Уберите с блога все, что могло послужить попаданию под фильтр. И после проделанной работы можете написать письмо в Яндекс. Только сразу не пишите, вам все равно по существу не ответят.

  47. Доброй ночи! У меня проблема начинается еще с первых строк, так сказать )) Хотя и стоит у меня галочка «Показывать кнопки для публикации», но эти кнопки не отображаются вообще, и кода, который надо найти в шаблоне и необходимо закомментировать, тоже нет (( С чем это связано? И как можно это исправить? Я работаю в Опере, смотрела через Гугл Кроме — тоже не видно кнопок. Заранее спасибо! (мой блог craft-fair.blogspot.com)

  48. Сорри, не дочитала, предыдущий пост уже не актуален, т.к. у меня все получилось сделать с первого раза — кнопки есть в конце поста. Только не поняла как выделить слова «Поделиться с друзьями». Куда нужно вставить код

    .sharebuttons {
    font: 20 px Comic Sans MS, Comic Sans MS, cursive;
    color: #B01D1D;
    }

    Спасибо!

  49. Этот код приведен для примера, если вы захотите, чтобы эти слова выглядели по другому,т.е. этот код не обязателен. Но если вы хотите попробовать, то этот код определяет стили фразы, а про то, куда ставить стили в статье написано сразу после слов «После этого уже можно и внести стиль для кнопок»

  50. Ответили дважды. Первый раз поблагодарили за письмо, во второй раз пообещали все исправить через две недели. Просили не беспокоиться, сказали, что у меня с блогом все нормально. Вот так… Буду ждать. Под какие фильтры попал — сам разобраться не могу — попросту не знаю толком как это делать. Но скорее всего связано с робот — текстом…

  51. Думаю, в первый раз было автоматическое письмо:). Хорошо, что они именно так ответили, значит проблема с индексацией была на их стороне. Считайте, вам очень повезло:), потому что часто бывают совершенно обратные ситуации.

  52. У меня текст «Поделиться с друзьями» сливается с текстом статьи, т.е. не выделяется ни жирным ни курсивом и нет между текстом и этой фразой никакого разрыва. В шаблон вставила изначально только то, что находилось в файле для закачки. Попыталась вставить после ]]> код для изменения стиля надписи, но при нажатии кнопки Сохранить, начинает ругаться блоггер, что ошибка в коде. Я не туда вставляю?

  53. Я поняла свою ошибку ))) Я код стиля вставляла после кода в шаблоне, а не до…Эх моя невнимательность. Спасибо еще раз за нужную статью!

  54. Здравствуйте, Катя, еще один вопрос. Как сделать, чтобы надпись «Понравилась статья? Поделитесь ей с друзьями» отстояла от текста статьи как у вас на строку и текст самой надписи отличался от текста статьи хотя бы размером и жирностью, ну в общем как у вас.

  55. Чтобы межу статьей и кнопками было пространство, вставьте перед кодом кнопок такой код:

    Что касается отличия текста, в статье об этом написано. Но самый простой вариант, чтобы не мучиться:), замените на это:

    Понравилась статья? Поделитесь ей с друзьями

  56. Воспользовался вашими кнопками — встали в блог как влитые! Спасибо!

  57. Уже изучаю 😉 помимо этого еще одну замечательную идею у вас позаимствовал… вы не против?

  58. Добрый день!

    Спасибо за статью, кнопки встали в блоге хорошо. А то стандартных действительно было маловато.

    Есть 2 вопроса:
    1. Почему-то у меня кнопки не становятся прозрачными. Где может быть глюк?
    2. Может подскажете, как сделать, чтобы у кнопок границ не было, а у картинок — были?

    Заранее спасибо!

  59. Здравствуйте.
    Я посмотрела кнопки у вас в блоге, почему так получается, до конца сама не понимаю. Но кое-что подправьте. Вы в стилях указали комментарий

    стиль

    Так вот этот код замените на такой
    /***определяем…***/
    стиль
    /***конец***/
    Дело в том, что в стилях всегда используются другие комментарии, повлияло именно это? Скорее всего нет. Но браузер именно этот стиль почему-то не видит. Поэтому если этот способ не принесет изменений, то дальше сделайте так:
    В каждый код кнопки, который начинается с style=»border: 0pt none; opacity: 0.5;»
    В общем, это должно помочь.
    По поводу второго вопроса… лично я не смогла так сделать, а решение нашла другое, в стилях блога все это отключено, рамок нет, но я пользуюсь редактором для блогов Windows Wright, так там каждой картинке можно делать и рамки. подробнее смотрите здесь.
    Ввот, надеюсь, все понятно:)

  60. Вы не поверите, но повлияло изменение комментариев. Теперь кнопочки красивые, все как надо!

    Огромное спасибо!

  61. Я рада, что все получилось. Может вы сможете подробнее написать, что вы изменили, вдруг у кого-то такая же проблема возникнет. Будем знать, как решать.

  62. Евгений, по-поводу последнего кода — я не знаю, как другими словами объяснить куда его вставлять, тат как вы должны в шаблоне найти код и перед ним вставить тот, про который вы спрашиваете. По другому это не объяснить.
    Что касается того, что кнопки вообще не отображаются, во-первых, почитайте комментарии, у некоторых была такая же проблема, в основном связана с тем, что у всех шаблоны разные, и при вставке кода в другое место, все начинало работать, во-вторых, чтобы более точно сказать, что вы делаете не так, мне нужно увидеть блог, вы же не оставили никаких контактов.

  63. Спасибо большое за помощь, что то мудрил-мудрил и вроде как получилось 😉 Всех с новым годом!!! Данный блог однозначно добавляю себе в закладки, думаю ни раз еще пригодится!

  64. Хорошо, что все получилось. Заходила, видела. Извините, что сразу не ответила… праздники:)
    Спасибо. И вас с Новым годом:)

  65. Ну всё! Благодаря этой статье мой блог стал ещё лучше и удобнее. Спасибо!

  66. дгщшщгд

  67. У вас в новом шаблоне после статей есть форма подписки по почте, вот перед ней и поставьте код.
    И Юля, извините, но к чему вы оставили комментарий «дгщшщгд» — это что? Проявление любви к моему блогу?

  68. Вот и я удивилась… ну ладно. может это был какой-нибудь глюк. Я его удалила. Спасибо, что обожаете мой блог:).

  69. В два ряда сделались из-за того, что между ними поля образовались, я могу предположить, что это связано с настройками самого шаблона. Я писала об этом в статье.
    По-поводу одноклассников — скорее всего вы сделали не все, как я описала. Проверьте ещё раз. Прочитайте комментарии к той статье, там есть уточнения разные. Скорее всего все-таки что-то упустили. И опишите процесс установки, ведь я же не могу видеть, как именно вы сделали.

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

  71. А нельзя ли для кнопки Твиттера сделать сокращение ссылок через goo.gl?

  72. Я не знаю, как это можно реализовать. Не обладаю такими знаниями. А чем вас не устраивает тот, который сейчас?

  73. Люблю Гугл:) Я просто не понял, каким способом кнопка отправляет данные в Твиттер. Это кнопка какого-то сервиса?

  74. А вы вообще нажимали на эту кнопку? Статью читали? Эта кнопка от самих разработчиков платформы Blogger, т.е. от Google (об этом написано в статье), а Google в свою очередь, интегрировал код самого Twitter (это видно, когда отправляешь информацию в Twitter).

  75. Екатерина!
    Спасибо Вам за такой большой труд и упорство. Мне, как начинающему чайнику в ведении блогов, очень помогли многие ваши статьи! Мне совсем не нравятся стандартный вид кнопок, шаблонов и т.д. и т.п. Целый день просидев тут и покапавшись, многое сделала в своём блоге и он стал более приемлем мне и удобен!
    Хочу обратиться с вопросом. Быть может я была не внимательна, рассматривая Ваши посты, но все же, существует ли здесь, в Вашем блоге инструкция по добавлению не каких-то отдельных записей в закладки и, в частности, приведенных в этом посте, а таких кнопок, которые будут на главной странице, чтобы добавить непосредственно сам блог в любимые. Как-то так)
    Заранее спасибо!

  76. Анжелика, дело в том, что установка кнопок в тело сообщения блога не многим отличается от установки на главной, для главной даже проще. Для этого используйте гаджет HTML/JavaScript. Единственное только, что именно эти кнопки в такой гаджет установить не получится. Зато все остальные, описанные в моем блоге — без проблем. Попробуйте самостоятельно. Если не получится, попробую помочь иначе.

  77. Поставил на сайт давно, за что выражаю большую благодарность. И всячески поощряю оглаживаниями )
    Но недавно залез в Инструментs для веб-мастеров и увидел, что есть ссылки 404.
    Проверил, так и есть — кнопки blogger и twiter выдают:
    К сожалению, страница, которую вы искали в этом блоге ( site ), не существует.
    Ссылки имеют вид: http://site.blogspot.com/2011/02/&target=twitter
    Куда копать, не пойму? Сравнивая с данным сайтом вижу разницу адреса указанных ссылок.

  78. А как установить плавающие кнопки (у вас с левого края страницы). Даже не имею понятия как они называются, чтобы поискать. Если не очень понятно объяснил, вот скрин: http://clip2net.com/s/LvTb

  79. Я тоже с этим столкнулась, как решить, пока не знаю, но думаю. Именно кнопки блогера и твитера я взяла стандартные от разработчиков блогера, вот и думаю, это их глюк или мой?… Если удастся решить проблему, отпишу здесь.

  80. Странная ситуация, с других статей работает, а именно с этой у меня тоже не работает. Постараюсь разобраться. Может, правда, глюк. Посмотрела, можно таким образом отправить через последнюю кнопку SHARE, в ней есть кнопка блоггера.

  81. Жму в этом посте Blogger-овскую кнопку («Опубликовать в блоге») и получаю сообщение «Request-URI Too Large
    The requested URL /accounts/ServiceLogin… is too large to process.» . В адресной строке при этом адрес
    То же самое в FF и Chrome, а IE «Не может отобразить страницу». Это что, глюк со стороны платформы Blogger?

  82. ААААА! Понял! Всё работает ЕСЛИ человек залогинен в Goggle-аккаунт. Иначе — ошибка с сообщением про длинный адрес. А почему?

    И ещё просьба. Екатерина, не могли бы Вы для тех кто не с знаком Твиттером, объяснить на пальцах фразу «В случае с твиттером из-за того, … зато в сообщение есть RT». Т.е. практическая разница между вашим и «тем» вариантом.

  83. Очень сложно объяснить твитер на пальцах.
    RT — ReTweet — это, как в обычных блогах репост, т.е. перепост чужого поста в своем блоге. Так же смысл в том, что тем самым вы особенно рекомендуете это своим последователям.

  84. Понятия не имею… Просто вспомнил про ту статью…

  85. Катерина! Спасибо Вам за статью, все очень понятно! Я установила кнопочки себе на блог, потому что у меня после смены шаблона они исчезли. Но у меня такой вопрос: почему они у меня в блоге сделались в два ряда? И кнопочка одноклассники не желает отображаться, хотя я сделала все, как Вы описали….

  86. Здравствуйте, Екатерина.
    Спасибо за Ваш труд.
    У меня к Вам вопрос. В коде для твиттера я не увидел закрывающего тэга rel nofollow. как это можно осуществить по Вашему мнению? И как можно добавить тэг noindex?

  87. Нофолоу нет так же и у кнопки Blogger. Код этих кнопок от самих разработчиков Blogger и мне не удалось внутрь их кода вставить нофолоу.
    Ноиндексом можете оформить весь контейнер с кнопками. Но вообще-то тег ноиндекс уже, почти, год, как бесполезная вещь.

  88. Ага спасибо! Но у Шакина в его кодах для WP, он пока есть.

  89. Да у многих есть. Когда ещё это имело смысл, все делали, у меня тоже в старом дизайне был ноиндекс, пока не перешла на новый. Просто у Шакина и других на WordPress стоит специальный плагин, который все ссылки закрывает автоматически не только в ноиндекс, но и в нофолоу. У Яндекса тоже есть разделы, в которых ссылки на себя же закрыты в ноиндекс:)

  90. У меня та же проблема с кнопкой Фэйсбука. В качестве анонса статьи берет описание блога. Если вы уже разобрались в чем дело, помогите и мне, пожалуйста.

  91. Знаете, дело не в кнопке, а в механизме самого Фэйсбука. так что тут ничего не сделаешь. Я вручную заменяю анонс.

  92. Доброго времени суток, Катя! Спасибо, за Ваш труд. У меня все работает, только вот кнопка Addthis(+) почему-то больше всех? Как исправить?… помогите пожалуйста.

  93. Я не знаю, что вы сделали не так, что у вас получилась другая кнопка Addthis. покажите блог или объясните подробнее.

  94. Здравствуйте, Екатерина. Спасибо за статью.
    Но скажите, пожалуйста — а куда вставлять-то этот код? После того как Вы даёте ссылку на скачивание блокнота с кодом, Вы переходите плавно к рассказу про AddThis, а куда именно вставлять этот код — я так и не нашёл. Вставляю после того кода, который в самом начале статьи (который закоментировать надо) — пишет, что не удаётся сохранить шаблон…

  95. Просто вы не дочитали статью до конца, а только пробежались по не глазами. А зря, там рассказывается не только про кнопку AddThis, а так же, как применить стили CSS для кнопок, а про место вставки кода в статье написано. Абзац начинается со слов: «Ну и теперь самое главное, куда вставлять весь код кнопок в шаблон.»

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

  97. По поводу в три раза больше, рядли, но лично свои кнопки для нового шаблона я уменьшала вручную. Чтобы сдвинуть в правый угол, пропишите стили. Лично у меня прописано float:right;, но из-за того, чтобы перед ними встали кнопки-счетчики. А так, можно прописать text-align:right;

  98. Всё получилось! Спасибо!

  99. Екатерина, будьте так любезны. А как именно вы уменьшали размер конопок? Очень надо ))

  100. Через Photoshop, или можно через любой редактор изображений, который есть на вашем компьютере. Просто сохраните кнопки к себе на комп и отредактируйте, затем загрузите на Picasa. В статье написано, как можно заменить мои картинки на свои, и есть ссылка на статью, как работать с Picasa.

  101. Видно, что у вас кнопки стоят в условной конструкции. Возможно, они отображаются только на внутренних страницах, или что-то другое. В общем, это не суть важно. Можете смело комментировать весь блок, если собираетесь устанавливать мои кнопки:).

  102. Я, всё-таки, поставила ваши кнопочки, потому что в блоке Я.ру не хватает того, что есть в AddThis и кнопки Blogger нет. Спасибо, объясняете доходчиво, получилось сразу! Пыталась свои кнопки поставить, сохранила их в Picassa, поменяла в коде ссылки, картинки с чёрной каёмкой получились, поэтому оставила ваши. Единственная проблема, скорость загрузки страниц снизилась. Может кнопки поменьше поставить?

  103. То, что кнопки с черной каемкой получились, надо смотреть в каком формате вы их сохраняете. Самый лучший вариант именно в этом случае — формат .gif. Я привыкла к .png, но если неправильно его сохранить, у картинок может получиться рамка.
    По-поводу загрузки — к сожалению, ничего не придумаешь. Ведь каждая кнопка обращается к своему серверу и ждет ответа от него. Это и влияет. Из этой ситуации толко один выход — установка одной кнопки. Но, как мы уже знаем, либо где-то чего-то нет, либо внешний вид не устраивает. Так что тут каждый индивидуально решает, что для него лучше будет. Однозначного ответа нет.

  104. Не знаток редактирования, но по Вашей инструкции всё сделал. Спасибо.

  105. Спасибо, Екатерина, уже всё получилось! Я думаю картинки лучше у себя хранить, так надёжнее. А вариант хороший, пока нет другого. AddThis если добавит Я.ру и одноклассники, тогда можно только их и оставить. Желаю вам успехов и процветания!

  106. Конечно, надежнее хранить картинки у себя. Ведь если что-то случится с моим веб-альбомом на пикаса, мои картинки станут недоступны. Спасибо за пожелания.

  107. Извини, но из твоего комментария вообще ничего не понятно. В файле все кнопки в единичном варианте, дважды ничего не повторяется. То, что получилось сразу после заголовка, значит, вставила не правильно.
    Пожалуйста, ещё раз перечитай статью, проделай все внимательно, почитай комментарии (в них обсуждаются некоторые проблемы). Этот код уже установили десятки блоггеров, и у кого были проблемы, то только от невнимательности.
    Если все же не получится, то четко по пунктам, подробно, можно со скрином и ссылкой на свой блог опиши свою проблему. Из этого комментария я ничего не поняла.

  108. Спасибо, хорошее замечание. Я немного подправила комментарий, иначе код не отображался.

  109. .sharebuttons {
    font: 20 px Comic Sans MS, Comic Sans MS, cursive;
    color: #B01D1D;
    }
    а куда вставлять этот код??

  110. и ещё ) в коде AddThis Button BEGIN есть «тут будет ваш логин» важно его туда вводить ?

  111. Катя, здравствуй! Вышла на твой пост через поиск в Гугле. Попробовала изменить код по твоим инструкциям, а он не показывает страницу, говорит: «Не удалось проанализировать ваш шаблон, так как он неправильно сформирован». И дальше высказывает предположение, что какой-то элемент div не закрыт. Я попробовала закрыть отдельно заглавие «Понравилась статья?…», но это не помогло. Не подскажешь, в чем может быть ошибка? Лучше на e-mail, а то тут в комментах твой ответ не найду.
    Копировала твой код полностью, ничего внутри не изменяла.
    С благодарностью, Шошана Бродская, блог «Мамочка-бизнесменка»

  112. Shoshana Brodsky:

    Извини еще раз, увидела свой комментарий — и ужаснулась. Аватарка не моя! У меня был цветочек, а тут какая-то морда и силуэт мужика выскакивает. Что за глюки?

  113. Попробовала изменить так, как предлагает Олеся-Креатив, но тоже не получается. Зато успокоилась по поводу страшной морды — она тут у многих))) А почему ?
    Еще вопрос из другой области. Когда подписывалась на вашу рассылку, для подтверждения выскочила страничка с текстом на английском. На моем блоге то же самое. А я видела у многих такую страничку на русском, и для пользователей это гораздо удобнее — не все свободно читают по-английски. Как это можно изменить? (И у себя тоже поменяйте).

  114. А вы внимательно почитайте статью. То, что вы спрашиваете — это стиль, стиль всегда вставляется в одно место в шаблоне. Об этом месте написано чуть выше этого кода.

  115. Почему сложно внимательно прочитать статью? Если вы хотите получать статистику по кликам на закладки именно в кнопке AddThis, то вам нужно зарегистрироваться на их сайте, а в код вставить свой логин. Об этом написано в статье.
    Логично предположить, что если вы не хотите получать статистику, то указывать логин вообще не нужно. Соответственно, если его туда не вводить, то статистику вы не получите. А теперь вопрос: Вам важно получать статистику? Так что ваш вопрос вы должны задать себе, а не мне:). И читайте, пожалуйста, статьи внимательно.

  116. Извините, Шошана, письмом на почту не вижу смысла отвечать. Шаблон не удалось проанализировать, т.к. вы действительно не правильно скопировали мой код. Возможно, вы его пытались переделать под себя, на свой вкус, возможно, выкинули какую-то кнопку. И не учли все закрывающие теги. Так что ищите ошибку у себя. Будьте внимательны. Мой код правильный, его установили себе уже десятки блоггеров. Ошибка у вас!.Я помочь не смогу.

  117. Вы не зарегистрированы в системе комментариев Дискус, поэтому вместо вашей аватарки, появляется моя аватарка для комментаторов, которые не зарегистрированы в Дискусе.

  118. Я не совсем понимаю, про какую страничку подтверждения вы говорите. У меня несколько способов подписки на блог, и везде, где возможно указать русский язык — он указан. Если все же появляются английские — значит возможности поменять на русский — нет.

  119. У меня, наверное, похожее было. Некоторые записи (не все) при попытке отправить в фэйсбук пишет — «без заголовка», адрес из таких символов — %. А остальные — нормально.
    Но сегодня проверил эти записи — всё нормально, хотя ничего не исправлял.
    Видимо, с самим Блогспотом проблемы.

  120. Спасибо большое за помощь в установке кнопочек.
    Из всего, что до этого читал про кнопки, только по Вашей статье смог сделать всё…

  121. Скажите пожалуйста как сделать отступ этих кнопок от текста? Текст «Понравилась статья? Поделитесь ей с друзьями» стоит впритык с текстом поста.

  122. Большое вам спасибо!

  123. Я не то, что думаю, я знаю и уверена, что все можно сделать. Просто вы до конца во всем не разобрались и совершенно точно, что-то сделали не правильно. И статью прочитали невнимательно. Я это пишу не для того, чтобы вас обидеть, а для того, чтобы вы внимательно прочитали каждое слово в статье. Все ваши проблемы в статье описаны. Чего нет в статье, есть в комментариях. В статье дается вариант размещения кнопок для стандартных шаблонов, вы же пользуетесь «собственным», а я, как автор статьи не могу предусмотреть все возможные варианты установки кнопок в сотни и тысячи всевозможных шаблонов, поэтому данная часть установки кнопок ложится на ваши печи. Уже в который раз повторяю, выше в комментариях это тоже есть, если у вас не получилось, значит вы сделали не правильно. Эти кнопки уже есть на десятках блогах, и на вашем могут быть.
    Прочитайте внимательно статью, комментарии и после этого по-шагово установите кнопки. Если не получится, напишите мне здесь каждый шаг, что вы предприняли. Я постараюсь помочь.

  124. Здравствуйте, Екатерин.
    Исключительно основываясь на ваших статьях создаю свой блог.
    Постоянно вас читаю и следую приведенным вами инструкциям.
    У меня возник вопрос по поводу «затемнения»(серый цвет) кнопок социальных сетей на Вашем сайте.Как вы это сделали? очень они хорошо гармонируют с текстом.Хотел сделать на своем блоге аналогичный цвет, но промучившись, так и не осилил.

  125. Екатерина, еще один вопрос вдогонку. Вопрос по поводу ЧПУ для blogspot. Найден ли какой-нибудь более удобный вариант решения, чем по два раза переписывать названия сообщений: то на латинском, то на русском?

  126. Действительно, в своем блоге я переделала кнопки под личный дизайн. Не скажу, что это сложно, но это своего рода ноу-хау. В общем, если подтянете свои знания по HTML и CSS, научитесь пользоваться расширением для браузера Firebug и вам не составит труда посмотреть, как я это сделала и сделать так же.
    простите, просто я пока не планирую об этом писать отдельную статью, а описывать весь процесс в комментарии не очень удобно.
    P.S.У меня есть рубрика Задайте вопрос:).
    По-поводу ЧПУ — я других способов не знаю.

  127. Спасибо! Я обязательно еще раз внимательно все изучу!

  128. Катя, а у Вас код в статье в таких красивых рамочках! Как вы это делаете? И тень у рисунков?

  129. Вячеслав:

    Екаетрина, а не могли бы вы научить, как сделать в blogger кнопки подписки, как у вас например. Т.е. хочется разместить их компактно, одним виджетом, в один ряд по горизонтали. И красиво и внеш.ссылок меньше. Спасибо.

  130. Вячеслав, хоть у меня кнопки и выглядят компактно, но это не виджет и внешних ссылок от этого не меньше. По-поводу рассказать, как сделать именно так, как у меня, думаю, скоро расскажу.

  131. Доброго времени суток, Екатерина. Что-то кнопки у меня вышли слишком большие… В чём загвоздка? И на главной странице их не видно, они открываются взору, если отдельно заходить в каждую статью, но не каждый читатель так делает…

  132. Здравствуйте.
    Понятие «слишком большие» немного размытое. Если вы сравниваете их с моими, то для нового дизайна блога свои я переделывала на более маленькие, на старом шаблоне были такие, как в статье. Вы можете уменьшить картинки в любом редакторе, предварительно скачав кнопки себе на компьютер.
    На главной странице не видно кнопок, потому что они стоят в специальной условной конструкции, об этом в статей написано, в комментариях обсуждалось, пожалуйста, почитайте повнимательней:).

  133. Огромное спасибо за статью!) Мне кажется, или эти кнопки из вашего архива гармонируют с любым дизайном сайта? =)

  134. Я старалась найти такие кнопки, которые подходили бы под любой дизайн блога:).

  135. На столько подробной инструкции я еще не встречала! Очень доступно, даже для тех кто код ни разу в жизни не видел.
    Спасибо за кнопки, успешно разместились в моем блоге, пока стандартно, как описано в статье, но как будет время, обновлю картинки, на более мелкие.
    Спасибо за реализацию скрытия кнопок с главной, это небольшая заноза у меня была, кнопки вставила, а с главной убрать не смогла. А у вас нашла ответ и заодно прихватила кнопочки 🙂
    Еще раз Спасибо.

    PS Я согласна с Олегом, что Вам надо менять название своего блога 😉

  136. Катя, здравствуйте. Устанавливаю кнопки по вашей статье уже не первый раз, а тут загвоздка: выдает «Понравилась статья? Поделитесь ей с друзьями TEMPLATE ERROR: Invalid data reference post.sharePostUrl: No dictionary named: ‘post’ in: [‘blog’] » и не показывает кнопочки(((( Может вы сможете помочь?

  137. Спасибо за ответ. Мучилась, мучилась, не получается, а ведь они у меня на этом блоге стояли. Потом установила новую форму комментариев и после ее удаления пропали кнопочки. И возвращаться не хотят)))

  138. УРА!!!!!!!!!!! Я нашла старый шаблон, который как-то случайно в блокноте сохранила, заменила и теперь все в порядке. Красивенькие кнопочки снова со мной)))

  139. Спасибо за решение! Давно искал, как кнопки вставить в Blogger. Вопрос еще такой, а как сделать рамочку такую полупрозрачную? В которой кнопки находятся, как у вас.

  140. Это обычный контейнер div, к нему применяете нужный стиль, рамки, цвет — это из области HTML и CSS. Можете поизучать этот учебник или задать свой вопрос на форуме про Blogger. Ссылка на форум — баннер в сайдбаре.

  141. В статье рассматривается вариант, если вы не можете найти эти строчки. Прочитайте внимательно.

    Если есть ещё какие-то проблемы, опишите, постараюсь помочь.

  142. Большое спасибо за Ваш блог. Почерпнул очень много интересного и полезного.
    Воспользовался и Вашим решением добавления кнопок социальных сетей. Правда, пришлось немного помучиться (видимо из-за шаблона моего блога), но тем-не менее результат был достигнут. Но есть одно но… Не все кнопки работают корректно. 
    Так при нажатии кнопки «Вконтакте» добавляется лишь адрес статьи, но не указывается заголовок и вместо рисунка к статье добавляется фото с моего профиля. При чем, если я это делаю через кнопку «Добавить» — заголовок появляется, а с фото все тоже самое 🙁
    С кнопками «Блог», «Твиттер», «Я.ру» все ОК
    Кнопка «Facebook» — ссылка добавляется, фото — то, что надо, заголовка тоже нет.
    Буду признателен за подсказку и  помощь.
    Мой блог — http://brehalovka.blogspot.com/

  143. Спасибо за то, что поделились. Очень приятно. Реализую на досуге и внесу изменения в статью.

  144. Добрый день, Екатерина!
    А Вы не поделитесь секретом, как вы сделали кнопки от Яндекса (на форуме Blogger), с таким полупрозрачным фоном? Буду признательна. И конечно, ПОЗДРАВЛЯЮ ВАС С ПОДАРКОМ :0). В виде пухлого конвертика и …

  145.  Алин, за прозрачность отвечает стиль CSS opacity, посмотрите, где и как прописан этот стиль в статье, попробуйте сделать по аналогии. Суть в том, что кнопки находятся в контейнере, которому присвоен стиль — прозрачность.

  146. Здравствуйте, Екатерина! Когда  вставляю Ваш код и нажимаю «предварительный просмотр», страница предварительного просмотра  не открывается, а всплывает окно об угрозе скриншотов. Пожалуйста, подскажите, что делают в таких случаях? Хочется вставить кнопки…

  147. Мне не совсем понятно, что значит «угроза сринщотов», но, как правила, Blogger ругается в том случае, если вы пытаетесь вставить код не совсем то место, которое нужно или если копируете не весь код, в результате также происходит ошибка. Обычно следует сообщение проверить, правильно ли закрыты все элементы XML. У вас в шаблоне есть строчка:

  148. Спасибо! буду пробовать

  149. Екатерина, спасибо! всё получилось!

  150. Орест Якобчук:

    Дуже цікава та потрібна статя. Дякую.

  151. Катя спасибо большущее!!!!!!! Профессионал!!!!!!

  152. Руслан Бахарчиев:

    У меня не получается сделать в конце постов эти значки(

  153. Спасибо вам огромное)
    Интересно бы было сделать кнопочки загорающийся как у вас)
    Очень красиво и оригинально смотрится)

  154. Екатерина здравствуйте. Это Лилия сайт http://maman-lima.com/. Сегодня поменяла шаблон блога и решила вставить эти кнопки. Все сделала пошагово как вы написали, но кнопок почему то не видно. Не подскажете в чем может быть причина?

  155. Катя, а как убрать кнопки с главной страницы?

  156. Приветствую, Екатерина. По Вашим подробным рекомендациям установил эти сверхудобные кнопки, включая «Одноклассники», на четырёх Blogger-блогах, все с нестандартными шаблонами. Работают, как часы! Огромное спасибо за труд.

    Теперь вопрос: реально ли к этим кнопкам добавить «Google+»? Если да, то как это сделать? На каком-то блоге WordPress я видел похожий вариант, но там, вероятно, это делается плагином.

  157. Спасибо за статью!
    Все разжевано и разложено по полочкам!
    Как всегда ритвит и уважение:))

  158. Признаюсь, мне пока было не до кнопки +1, поэтому сходу сложно сказать, как можно привязать. Но судя вообще по ее коду, она всегда будет со счетчиком, и если брать ее код с сайта гугл, то нельзя будет ставить несколько кнопок на главной. Но можно посмотреть, возможно ли вытащить код из стандартного виджета Blogger, чтобы она отображалась несколько раз на главной (для желающих). В общем, извините, пока нет никакой информации. Постараюсь разобраться.

  159. Ольга Ивановна:

    Здравствуйте Екатерина. Спасибо большое за ваш полезный блог и в частности за эту статью.
    Все кнопочки работаю корректно, кроме ВКонтакте, не добавляется картинка к названию статьи, у меня изображения залиты в Веб-альбом Picasa. Я ради интереса попробовала вставить картинку по URL, с радикал фото и с яп файлы, всё получилось, т.е. и картинка и название статьи добавлялось. Возможно с Picasa что-то не стыкуется? Кстати, во многих блогах тоже такая ситуация, я и у вас попробовала, такая же ситуация с кнопкой ВКонтакте, картинка не добавляется.

  160. Здравствуйте,Екатерина. Подскажите пожалуйста: с сайта http://www.addthis.com/ автоматом установились кнопки, в принципе они меня устраивают, но этот гаджет также добавился пустым в панель сбоку без иконок. Как его убрать или добавить показ кнопок там. Заранее спасибо.
    PS спасибо за статьи, учитывая, что я в этом деле «чайник», многое понятно.

  161. Сергей Загуляев:

    Спасибо всё получилось.Хотелось бы кнопки поменьше.

  162. Сергей Загуляев:

    Вставил на два блога в одном все кнопки работают,а в другом первые две не работают.Пишет что страница не найдена.В чём может быть проблема?

  163. Сергей Загуляев:

    Сам разобрался.Кнопки были выключены.

  164. Спасибо большое! У меня всё получилось!

  165. Дело в том, что этот пустой гаджет и необходим для того, чтобы у вас автоматом установились кнопки. Если его удалить, то кнопки исчезнут, если его изменить (добавить новый код), то кнопки так же могут исчезнуть. В общем, это специально так делается, чтобы облегчить установку кнопок. И так многие сторонние гаджеты устанавливаются. Тот же Дискус, например.

  166. сделала вот такой файл КАКОЙ?

  167. Татьяна Прозорова:

    Спасибо за материал!
    Все получилось(учитывая, что я «чайник» в HTML ).
    Кнопки нашла куда поставить 🙂

  168. Вот вот вот…привет привет!!!!
    у меня блог…в черно-белом стиле будет выполнен,я сначала хотел установить черно-белые кнопки от яндекса,а они не красивые такие чертовски!!!!!А вот у тя в самый раз черно-белые стоят!Можешь мне помочь такие установить мне на блог?Напиши плиз на почту там поговорим!ae-liberty@bk.ru 

  169. Екатерина, у меня в блоге про котов совсем нет кнопок, шаблон старый.. Мне эта статья поможет? Я что-то не разобрался:(

  170. Спасибо, буду пробовать.

  171. Кнопки установить хочу, но ничего в кодах не понимаю. Посмотрел установки но так и не понял, куда что установить. Жалко.

  172. Спасибо очень познавательно!, подскажите только как уменьшить размер кнопок, так как они у меня получились очень большими по отношению к тексту статти

  173. Екатерина, очень симпатизирует мне вид кнопочек, которые расположены у вас в правом углу блога, подскажите как можно это реализовать?) Спасибо

    1. SEO-Дилетант'ка:

      Юрий, у меня кнопки сделаны с помощью изображений. Но сейчас я так не делаю вообще. В клиентских сайтах я использую ресурс http://fontawesome.io/. Очень удобно. К сожалению, у меня на сайте нет инструкции, как работать с этим ресурсом. Но в интернете есть подробные описания, поищите. Если будут вопросы, пишите. Адрес почты на странице Об авторе.

Comments are closed.