Доброго времени суток, друзья, читатели и гости блога. В продолжении темы кнопок социальных сетей и по просьбе своих читателей, сегодня шпаргалка о том, как установить в блоге кнопки Гугл+, В Контакте и Фейсбук. Этот пост дополнение к статье Виджеты. кнопки и другие фишки Твиттер. Давайте сразу и приступим.
Кнопка Гугл+.
В Блоггере есть возможность через раздел дизайн установить такую кнопку. Но для полноты картины покажу другой вариант.
Заходим на страницу. C левой стороны выбираем кнопка+1 и настраиваем её внешний вид. Я остановилась на стандартной кнопке. Сразу видно, как она будет отображаться. После всех настроек копируем готовый код и устанавливаем его в гаджет HTML/JS или в тело поста, методом описанным немного ниже.
Кнопка В Контакте.
Заходим по ссылке и выбираем опцию подключение сайтов и виджеты. Из списка выбираем "мне нравится".
Если у вас блог ещё не подключен, быстро это делаем. Вписываем название блога, адрес, основной домен. Таким образом вы создадите свой персональный id номер для блога.
Сохраняем и тут же оформляем внешний вид кнопки.
Мой код выглядит так -
Дальше находим строку <data:post.body/>. Как я уже говорила в предыдущем посте, таких строк может быть несколько. Нам нужна последняя. Хотите видеть кнопку вверху поста, вторую часть кода устанавливайте над этой строчкой. Если же внизу, соответственно под строкой.
Если из списка виджетов вы выбираете подписаться на автора, то там совсем просто. Оформляете свой вариант кнопки, копируете код и устанавливайте в блоге.
Кнопка Фейсбук.
Переходим и настраиваем внешний вид кнопки. Нажимаем получить код.
Дальше выбираем опцию iframe
Готовый код копируем и устанавливаем в гаджет HTML/JavaScript. Вставить в шаблон блога этот код обычным способом у меня не получилось. Но вот сохранился код кнопки, который можно установить в тело поста.
Вкладка шаблон. Находим тег </head> и над ним вставляем следующий код.
Возможно вас заинтересует -
Как встроить запись из Фейсбук в сообщение блога.
Как встроить запись из сети В контакте в блог.
Установка кнопки YouTube в блоге.
У меня сегодня всё. Спасибо что читаете мои шпаргалки и до новых встреч.
В Блоггере есть возможность через раздел дизайн установить такую кнопку. Но для полноты картины покажу другой вариант.
Заходим на страницу. C левой стороны выбираем кнопка+1 и настраиваем её внешний вид. Я остановилась на стандартной кнопке. Сразу видно, как она будет отображаться. После всех настроек копируем готовый код и устанавливаем его в гаджет HTML/JS или в тело поста, методом описанным немного ниже.
Кнопка В Контакте.
Заходим по ссылке и выбираем опцию подключение сайтов и виджеты. Из списка выбираем "мне нравится".
Если у вас блог ещё не подключен, быстро это делаем. Вписываем название блога, адрес, основной домен. Таким образом вы создадите свой персональный id номер для блога.
Сохраняем и тут же оформляем внешний вид кнопки.
Мой код выглядит так -
<!-- Put this script tag to the <head> of your page -->
<script type="text/javascript" src="//vk.com/js/api/openapi.js?127"></script>
<script type="text/javascript">
VK.init({apiId: 4430502, onlyWidgets: true});
</script> <!-- Put this div tag to the place, where the Like block will be -->
<div id="vk_like"></div>
<script type="text/javascript">
VK.Widgets.Like("vk_like", {redesign: 1, type: "button"});
</script>
Копируем готовый код и устанавливаем в гаджет HTML/JavaScript. Если хотите установить кнопку в конце или начале поста, то нужно зайти во вкладку шаблон (обязательно сделайте копирование). Найти закрывающийся тег </head> и над ним вставьте первую часть кода. Я её выделила.<script type="text/javascript" src="//vk.com/js/api/openapi.js?127"></script>
<script type="text/javascript">
VK.init({apiId: 4430502, onlyWidgets: true});
</script> <!-- Put this div tag to the place, where the Like block will be -->
<div id="vk_like"></div>
<script type="text/javascript">
VK.Widgets.Like("vk_like", {redesign: 1, type: "button"});
</script>
Дальше находим строку <data:post.body/>. Как я уже говорила в предыдущем посте, таких строк может быть несколько. Нам нужна последняя. Хотите видеть кнопку вверху поста, вторую часть кода устанавливайте над этой строчкой. Если же внизу, соответственно под строкой.
Если из списка виджетов вы выбираете подписаться на автора, то там совсем просто. Оформляете свой вариант кнопки, копируете код и устанавливайте в блоге.
Кнопка Фейсбук.
Переходим и настраиваем внешний вид кнопки. Нажимаем получить код.
Дальше выбираем опцию iframe
Вкладка шаблон. Находим тег </head> и над ним вставляем следующий код.
<script src='http://connect.facebook.net/ru_RU/all.js#xfbml=1' type='text/javascript'/>
Сейчас найдите строку <data:post.body/> и, как описано выше, вставьте этот код.
<div>
<fb:like action='like' colorscheme='light' expr:href='data:post.url' font='arial' layout='button_count' send='false' show_faces='false' width='150'/> </div>
Если вы пробежитесь по ссылкам, которые я привела выше, то можно выбрать кроме кнопок другие виджеты, которые так же можно установить у себя в блоге. Без социальных сетей сейчас просто не обойтись.<fb:like action='like' colorscheme='light' expr:href='data:post.url' font='arial' layout='button_count' send='false' show_faces='false' width='150'/> </div>
Возможно вас заинтересует -
Как встроить запись из Фейсбук в сообщение блога.
Как встроить запись из сети В контакте в блог.
Установка кнопки YouTube в блоге.
У меня сегодня всё. Спасибо что читаете мои шпаргалки и до новых встреч.
здесь можно оформить подписку на новые шпаргалки
Виктория, доброе утро! Изучаю твой пост! Разве, нажав такую кнопку, можно попасть на мою страничку, например, в Фэйсбуке? В кодах ведь нет адресов наших страничек, как в твоем предыдущем сообщении про Твиттер.
ОтветитьУдалитьИрина, посмотри и попробуй на блоге http://test-tri.blogspot.ru/
ОтветитьУдалитьСпасибо, Виктория! Попробую!
ОтветитьУдалить