Думаю, не надо объяснять, как популярны сейчас в Интернете социальные сети. Чтобы дать возможность читателям поделиться вашим постом в своих социальных сетях, нужно поставить кнопки этих сетей.
В Блоггере предусмотрены стандартные кнопки, но, во-первых, они очень аскетичны. Во-вторых, в них не представлены такие популярные в Рунете социалки, как "Вконтакте", "Одноклассники", ЖЖ.
Поэтому я решила вставить в блог свои кнопки.
Для этого сначала надо убрать из блога блоггеровские стандартные кнопки социальных сетей.
Можно просто отключить их показ.
Делается это в "Дизайн"-"Сообщения блога"-"Изменить". И отключаете галочку напротив "Показывать кнопки для публикации".
Таким образом мы добьемся того, что кнопки видны не будут. Но их код со свеми исходящими ссылками останется в шаблоне нашего блога.
Поэтому лучше всего убрать их код из шаблона блога, чтобы освободить его от лишних исходящих ссылок.
Делается это следующим образом:
Открываем в своем блоге Шаблон-Изменить HTML. (Внимание! Нужно обязательно сделать резервную копию шаблона блога перед любыми изменениями в нем).
Поиском (в шаблоне, а не на странице!) находим такие слова: post-share-buttons
Они часть этого куска кода:
<div class='post-share-buttons goog-inline-block'>
Можно просто отключить их показ.
Делается это в "Дизайн"-"Сообщения блога"-"Изменить". И отключаете галочку напротив "Показывать кнопки для публикации".
Таким образом мы добьемся того, что кнопки видны не будут. Но их код со свеми исходящими ссылками останется в шаблоне нашего блога.
Поэтому лучше всего убрать их код из шаблона блога, чтобы освободить его от лишних исходящих ссылок.
Делается это следующим образом:
Открываем в своем блоге Шаблон-Изменить HTML. (Внимание! Нужно обязательно сделать резервную копию шаблона блога перед любыми изменениями в нем).
Поиском (в шаблоне, а не на странице!) находим такие слова: post-share-buttons
Они часть этого куска кода:
<div class='post-share-buttons goog-inline-block'>
<b:if cond='data:post.sharePostUrl'>
<b:include data='post' name='shareButtons'/>
</b:if>
</div>
<b:include data='post' name='shareButtons'/>
</b:if>
</div>
Этот кусок надо закомментировать (как в примере ниже) или вовсе удалить.
<!-- <div class='post-share-buttons goog-inline-block'>
<b:if cond='data:post.sharePostUrl'>
<b:include data='post' name='shareButtons'/>
</b:if>
</div>-->
<b:if cond='data:post.sharePostUrl'>
<b:include data='post' name='shareButtons'/>
</b:if>
</div>-->
Нажимаем "Просмотр". Если все в порядке, то сохраняем шаблон и переходим непосредственно к вставке кнопок.
Я пошла самым простым путем, и кнопки решила вставлять не в шаблон блога, а в виде виджета. Так проще - если потом захочется их убрать и поставить какие-то другие, то их будет легко найти и не надо рыться в коде.
Сам скрипт для кнопок можно взять на множестве сайтов. Мне понравились те, которые предоставляет Sharethis.com (а вот здесь можно прочитать, как вставить кнопки соцсетей от русскоязычного сервиса Pluso)У этого плагина есть "побочный эффект". Если теперь в вашем блоге кто-то скопирует кусок текста Ctrl-C и вставит у себя Ctrl-V, то в конце скопированного текста появится ссылка вида See more at: адрес_поста_откуда_скопировано
Это защита контента блога. Но я про это ничего не знала и была шокирована происходящим.
Чтобы вставить такие кнопки социальных сетей нужно проделать следующее:
Заходим на сайт и выбираем GET THE BUTTON (фото кликабельные)
На первом шаге выбираем платформу, на которую ставим кнопки (у нас это Блоггер). Нажимаем NEXT.
Вторым шагом выбираем стиль будущих кнопок. Я выбрала просто кнопки.
Третьим шагом выбираем нужные социальные сети. Список там огромный, и, что приятно, есть и наши: "Вконтакте" и т.д.
Нажимаем FINISH
Выскочит окошко, в котором вам предложат зарегистрироваться. Я выбрала регистрацию по e-mail. После регистрации Блоггер спросит, добавлять ли виджет и в какой блог (если у вас их несколько).
Нажимаете "Добавить виждет", и он появляется у вас в "Дизайн" самым первым в правой панельке под названием ShareThis. Остается только перетащить его на нужное место (я поставила кнопки под сообщение).
Нажимаете "Добавить виждет", и он появляется у вас в "Дизайн" самым первым в правой панельке под названием ShareThis. Остается только перетащить его на нужное место (я поставила кнопки под сообщение).
P.S. Кнопка "Вконтакте", к сожалению, не дает выбирать картинку сообщения. Только его ссылку. Читателю придется заходить к себе на страничку "Вконтакте" и вручную вставлять адрес изображения из вашего поста.
UPD: Иногда бывает полезно скрыть тот или иной виджет на некоторых страницах блога. Например, убрать кнопки соцсетей с главной для ускорения загрузки.
Для этого
1. Сделать виджет с кнопками и убедиться, что он правильно работает. Запомнить название виджета.
2. Зайти в "Шаблон" -> Изменить HTML. (Тут неплохо было бы еще раз сохранить код перед изменениями)
3. Найти виджет в коде по названию. Открыть его. Он может выглядеть так:
4. После строчки <b:includable id='main'> вставить: <b:if cond='data:blog.pageType == "item"'>
5. Перед строчкой </b:includable> вставить </b:if>
Таким образом будет создано условие, работающее только на внутренних страницах блога и не выполняющееся на главной.
UPD2: Заодно можно подправить некоторую странность, заложенную создателями Blogger'а:
Почему-то малозначительный заголовок виджета оформляется типом <h2>, что совершенно не нужно. Лучше заменить этот тип на <p>, например.
NB: Необходимо помнить, что если виджет придется удалить и создать заново, то эти изменения пропадут и их нужно будет вносить заново.
Еще полезные вещи, которые можно вставить в блог:
Как вставить музыку в блог
Как поставить проверку орфографии
Как вставить социальный плагин от Фейсбука
Как вставить виджет от ВКонтакте
Как перевести свой блог на другие языки
Как вставить презентацию в блог
Как вставить после поста ссылки на похожие посты с помощью LinkWithin
Как сделать галерею ссылок с помощью InLinkz
Как вставить счетчик посещений с флагами Flagcounter
Как вставить баннер в блог
Как вставить в блог рассылку по электронной почте
Какие кнопки счетчиков поставить в блог
Как вставить поиск по блогу
UPD: Иногда бывает полезно скрыть тот или иной виджет на некоторых страницах блога. Например, убрать кнопки соцсетей с главной для ускорения загрузки.
Для этого
1. Сделать виджет с кнопками и убедиться, что он правильно работает. Запомнить название виджета.
2. Зайти в "Шаблон" -> Изменить HTML. (Тут неплохо было бы еще раз сохранить код перед изменениями)
3. Найти виджет в коде по названию. Открыть его. Он может выглядеть так:
Или так:
4. После строчки <b:includable id='main'> вставить: <b:if cond='data:blog.pageType == "item"'>
5. Перед строчкой </b:includable> вставить </b:if>
6. Сохранить код.
UPD2: Заодно можно подправить некоторую странность, заложенную создателями Blogger'а:
Почему-то малозначительный заголовок виджета оформляется типом <h2>, что совершенно не нужно. Лучше заменить этот тип на <p>, например.
NB: Необходимо помнить, что если виджет придется удалить и создать заново, то эти изменения пропадут и их нужно будет вносить заново.
Еще полезные вещи, которые можно вставить в блог:
Как вставить музыку в блог
Как поставить проверку орфографии
Как вставить социальный плагин от Фейсбука
Как вставить виджет от ВКонтакте
Как перевести свой блог на другие языки
Как вставить презентацию в блог
Как вставить после поста ссылки на похожие посты с помощью LinkWithin
Как сделать галерею ссылок с помощью InLinkz
Как вставить счетчик посещений с флагами Flagcounter
Как вставить баннер в блог
Как вставить в блог рассылку по электронной почте
Какие кнопки счетчиков поставить в блог
Как вставить поиск по блогу
Таня, здравствуйте! Может, Вы сможете мне помочь? Я вставила гаджет Переводчик, но у меня он не "включился", т.е. не открывается окошечко со списком языков, его почему-то вообще нет...
ОтветитьУдалитьЕлена, похоже на какой-то глюк. А вы пробовали еще раз переставить этот гаджет? Ума не приложу, как он мог так "косо" встать.
ОтветитьУдалитьХоть бы ссылку на этот сайт оставили, ХРЕН НАЙДЕШЬ НУЖНЫЙ В ГУГЛЕ!
ОтветитьУдалитьСтранно, неужели какие-то проблемы? Копируйте sharethis.com сразу в строку, где набираете адрес сайта. И попадете на него! Да и по поиску первый результат тот, что нужно.
УдалитьДа, я тоже вставила гаджет Переводчик, а он не работает. Несколько раз вставляла, переставляла, перегружала, а он не работает:-) Глюк однозначно!!!
УдалитьЯ рада, что вам что-то пригодилось :)
ОтветитьУдалитьХороший блог, спасибо за полезные статьи.
ОтветитьУдалитьМожно узнать почему вы убрали блок социальных сетей?
Спасибо, что напомнили. Я собралась вставить другие кнопки, от Яндекса (из-за того эффекта с копированием, о котором я писала в посте). Убрать старый убрала, а новый вставить забыла :) Будет минутка времени - добавлю.
УдалитьСпасибо, Татьяна. Очень помогли. У меня получилось поставить то, что я хотела. Это здорово. Хочу добавить: чтобы быстро найти нужные HTML строчки:
ОтветитьУдалитьскопировала их, нажала на сочетание Ctrl+F, в строку поиска вставила и быстро нашла. Благодарю!
Я рада, что все получилось. А поиск по Ctrl+F, действительно, удобен в таких случаях:)
УдалитьТатьяна, спасибо огромное за эту статью! Очень помогли!!
ОтветитьУдалитьНе за что :)
УдалитьКлассные кнопочки, то что нужно) слишком уж упрощен их первоначальный вариант в блогспоте. А здесь даже и на я.ру выход есть) спасибо за статью, используем)
ОтветитьУдалитьЗдорово, что пригодится :)
Удалитьа лайк можно ставить?
ОтветитьУдалитьВ этом плагине их нет, но можно подыскать и с лайками. Я еще таким вопросом не задавалась :)
УдалитьСпасибо большое, блог полезный... Вот только не могу я найти строчки, которые нужно удалить (для удаления старых кнопок). То ли смотрю не там, то ли не вижу ничего...
ОтветитьУдалитьИщите поиском по CTRL-F
УдалитьЗдравствуйте Татьяна! Вопрос такой: ну ни как не могу найти где ставить галочку "Расширить шаблоны виджета ". У вас написано так:"Открываем в своем блоге Шаблон-Изменить HTML. Нажимаем галочку "Расширить шаблоны виджета" Я не нашел там где ставить галочку и может ли быть, что из-за этого у меня тоже не находит нужные надписи в коде?
ОтветитьУдалитьтак, с галочкой "Расширить шаблоны виджета" разобрался. Оказывается такой галки сейчас нет, т.к новый редактор шаблонов. Осталось разобраться с кодом. Если знаете, то подскажите как этот код выглядит.
ОтветитьУдалитьДа, вы правы, в новом редакторе все виджеты доступны и без галочки. Код же кнопок остался прежним. Поищите, где написано: 'post-share-buttons goog-inline-block'
УдалитьЧтобы найти нужную надпись, скопируйте ее CTRL-C. Перейдите в шаблон. Нажмите там CTRL-F (поиск) и в появившемся окошке вставьте CTR-V то, что вы скопировали. Нажмите ввод, и вам редактор подсветит желтым то место, где эта надпись встречается. Дальше действуйте так, как я описала в статье.
я тоже не нашла эти строки... Татьяна, пробовала по новому как Вы указали, их тоже уже нет
ОтветитьУдалитьМожно пойти другим путем и просто отключить показ кнопок. Делается это в "Дизайн"-"Сообщения блога"-"Изменить". И отключаете галочку напротив "Показывать кнопки для публикации"
УдалитьЯ перепроверила на шаблоне экспериментального блога - у меня все есть и все находит. Вы уверены, что правильно ищите по шаблону? Откройте его, щелкните по тексту мышкой, чтобы он стал активен, а после этого нажимайте СTRL-F. Окошко для поиска должно появиться в правом верхнем углу шаблона. Туда и вставляйте текст для поиска. Нажимайте "Enter".
УдалитьНадеюсь, все получиться.
в дизайне есть где панель навигации кнопка изменить..там надо просто все выключить... но это единственное что я нашла чтобы вставить ... мож еще че есть..
ОтветитьУдалитьЕсли вы отключите панель навигации (навбар), то это исчезнет вверху меню самого Блоггера, там где "Следующий блог", "Новое сообщение", "Настроить", "Выход".
УдалитьКстати, ссылка в шаблоне все равно останется, поэтому если чистить шаблон, то надо ее удалить. Вот тут я писала, как это сделать
Спасибо за вашу работу! Так понятно и просто описана работа с блогом, все реально работает, а это вселяет надежду и придает сил в блоговедении. Спасибо!
ОтветитьУдалитьЯ так рада, что мой опыт помогает вам:)
Удалитьспасибо большое за самое понятное описание! все работает! Только может подскажете как вставить еще и на главную страницу (в боковую колонку), а не только в сообщения?
ОтветитьУдалитьВам надо будет в своем блоге зайти в "Дизайн" -"Добавить гаждет" - выбрать "HTML/java script" и вставить код скрипта в появившееся окошко.
УдалитьСпасибо за ответ, но проблема в том, что готовый РАБОЧИЙ код не могу нигде найти... Может подскажете?
УдалитьНе очень поняла, что вы имеете ввиду под "рабочий код". Надо вставить тот же самый код, что вставляли для сообщений. Просто в другое место.
Удалитьспасибо))
ОтветитьУдалитьТаня, мерси. следуя четко инструкции получила заветные кнопки )))
ОтветитьУдалитьРада, что все получилось )
УдалитьТавика, напомните плиз, как сделать поиск нужных строчек в HTML коде?
ОтветитьУдалитьЗаходите в шаблон, выбираете "Изменить HTML" и нажимаете Ctrl-F. Справа вверху появится окошко Search, куда и нужно вставить искомый фрагмент. Только перед этим обязательно щелкните мышкой на самом тексте, а то бывает, что окошко неактивно, поэтому ничего и не ищет. И не забудьте включить в списке виджетов нужный (если вы ищите какие-то строчки из виджетов)
УдалитьА я у себя на Я.ру не могу найти где дизайн,чтобы вставить кнопки.Реву не могу.Сил нету искать. SOS. Помогите.
ОтветитьУдалитьВ Я.ру никогда не работала, поэтому, к сожалению, ничего подсказать не могу. Может, кто-нибудь из читателей моего блога откликнется?
Удалитьспасибо за сервис!
ОтветитьУдалитьСпасибо, Татьяна, за полезное сообщение)
ОтветитьУдалитьРада, видеть вас у меня в гостях и рада, что пригодилось:)
УдалитьЗдравствуйте, Татьяна! Благодаря Вашим подсказкам мне многое удалось усовершенствовать в своем блоге, спасибо Вам большое! У меня правда не все получается... может подскажете еще разик? Вставляю кнопки социальных сетей, но они у меня вставляются только внизу, под всеми сообщениями, либо вверху над всеми, уже замучилась... Понимаю, что в коды не попадаю, но попасть точно не могу...http://mybells197.blogspot.ru/
ОтветитьУдалитьЭто можно сделать прямо в "Дизайне" блога. Возьмите мышкой с правой панельки ваш гаджет и перетащите его под блок "Сообщения блога" - он должен вставть под него. После этого гаджет будет стоять под каждым постом.
УдалитьБлог Ваш понравился, только рубрики долго искала.
ОтветитьУдалитьСпасибо :) А рубрики, наверное, действительно есть смысл поднять. Я тут потихонечку переделываю дизайн, скоро и до рубрик доберусь :)
УдалитьСпасибо за пост. Есть вопрос, а как поставить кнопки соцсетей на фото в блоге?
ОтветитьУдалитьвот как здесь, например, при наведении курсора на фото, сразу несколько кнопок для поделиться
http://www.adme.ru/svoboda-kultura/velikolepnaya-koko-748460/
спасибо
подскажите пожалуйста, как поставить окошко подписки на мой блог. не могу найти. чтоб посетители нажав кнопку присоединились к моему блогу. спасибо и извините за, наверное, глупый вопрос.
ОтветитьУдалитьНу что вы, все мы проходим через эти этапы, и у всех на первых порах похожие трудности, так что ничего глупого в вопросе нет :) Для этого надо зайти в Дизайн, выбрать "Добавить гаджет". Там в окошке нажать "Другие гаджеты" и выбрать из них "Постоянные читатели".
УдалитьТатьяна, я желаю Вам процветания! Вы так помогли мне привести блог в порядок! Творите дальше нам на радость!
ОтветитьУдалитьСпасибо большое за добрые пожелания! :)
Удалитьполезно, спасибо
ОтветитьУдалитьПожалуйста :)
УдалитьЗдравствуйте! У меня проблема... Со времени написания Вашей статьи прошло время и всё немного поменялось. В инструкции на сайте указано что нужно пользоваться виджетом "HTML/JavaScript", но к сожалению значки не отображаются!
ОтветитьУдалитьЗдравствуйте! А как убрать кнопки с блога и вернуть стандартные?
ОтветитьУдалитьНадо сделать все в обратном порядке - удалить новый код и раскомментировать тот, что был.
УдалитьПривет. Не получилось убрать кнопки с главной.
ОтветитьУдалитьТатьяна, спасибо вам большое! Хотя на рекомендованном сайте немного всё поменялось, но у меня, чайника, благодаря вашим рекомендациям получилось поставить кнопки в сообщения в блоге! )))
ОтветитьУдалитьРада, что все получилось :)
УдалитьПривет! спасибо за пост! то, что мне было нужно. я использовал кнопки pluso. на главной кнопки перестали отображаться так же как и на всех последующих страницах. я хочу уточнить так и должно быть или у меня с кнопками от pluso вышло не совсем так? даю сылку на блог http://geliosmyblog.blogspot.com/. Посмотри пожалуйста так у меня все вышло или не совсем?
ОтветитьУдалитьЯвно что-то пошло не так :) Кнопки должны быть видны, иначе нет смысла их вставлять:)
УдалитьФух...попотеть пришлось. Сам сайт кнопочный немного изменился и процедура вставки тоже - Вы не уточнили кое какие детали, так что методом тыка, как обычно пришлось))) А а совет убрать кнопки с главной страницы - спасибо. Загрузка быстрее!
ОтветитьУдалитьТак сколько лет прошло:) Но кнопки все еще работают - и это главное :)
УдалитьВы так непонятно написали именно про вставку виджета... Я так понимаю это теперь называется добавить гаджет в разделе дизайн?
ОтветитьУдалитьСкажите, пожалуйста, как сделать вот такой блок ссылок, как у вас на сайте - "Еще полезные вещи, которые можно вставить в блог"?
ОтветитьУдалитьВ данном случае я просто вручную его написала в конце поста.
УдалитьПонятно. А есть ли какие-то автоматические способы это сделать?
Удалить))) Как раз в этом блоке ссылок можно найти "Как вставить после поста ссылки на похожие посты с помощью LinkWithin" - возможно, этот вариант вам подойдет.
УдалитьВсе, увидела. Просто ссылок много в блоке, сразу не заметила. Спасибо.
УдалитьБлагодарю! Отличная работа.
ОтветитьУдалитьЯкий краще обрати заголовок для блогу 1) Our world 2) An Uninterrupted view
ОтветитьУдалитьУ меня исчез карандашик для редактирования сообщения .Можно что то сделать? Видимо нечаянно удалила, когда хотела вставить кнопки соц.сетей.
ОтветитьУдалить