построить дом своими руками с мансардной крышей кнопка мне нравится на сайт

Привет! Социальные сети очень крепко вошли в нашу жизнь. Посмотрите сколько кругом людей целыми днями, зависают в facebook, vkontakte, twitter, google + и других сетях.

Если у вас есть сайт или блог, почему тогда не использовать данные социальные сети, чтобы привлекать новый трафик, наращивать показатели ТИЦ и PR, делая проект все популярнее и популярнее.
В этом нам помогут кнопки «мне нравится» от Вконтакте, Facebook, а также кнопки Твитнуть и Google +1, которые будут расположены в конце статьи.

Работают они очень просто! Когда посетитель вашего сайта прочитал статью и она ему понравилась, тогда скорее всего он захочет высказать свое мнение о ней.

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

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

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

Кнопка «мне нравится» от Вконтакте


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

Далее выбираем формат и размер кнопки «мне нравится».

кнопка от вконтакте

Теперь необходимо скопировать "1 Часть кода" и добавить ее в файл header.php перед закрывающим тегом </head>.

1 2 3 4 <script type="text/javascript" src="http://userapi.com/js/api/openapi.js?49"></script> <script type="text/javascript"> VK.init({apiId: 2970045, onlyWidgets: true}); </script>

<script type="text/javascript" src="http://userapi.com/js/api/openapi.js?49"></script> <script type="text/javascript"> VK.init({apiId: 2970045, onlyWidgets: true}); </script>

Далее копируем "2 Часть кода" и вставляем ее в любое место на сайте, где хотите, чтобы показывалась кнопка от Вконтакте.

Так как я сделал вывод ее после текста статьи, поэтому код вставил в файл single.php.

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

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

код кнопки

Перезагружаем страницу и смотрим результат.

вконтакте

Кнопка от Google +1


Для того, чтобы добавить кнопку «google +1» на сайт или блог переходите по этой ссылке и попадает на страницу простого конструктора.

кнопка google +1

Выбираете размер кнопки (маленькая, средняя, большая). Не забудьте выбрать русский язык.

код кнопки google

Затем вставляете "1 Часть кода" в то место, где планируете установить кнопку «google +1». Я сделал вывод ее после текста статьи, поэтому код вставил в файл single.php.

<g:plusone size="medium"></g:plusone>

<g:plusone size="medium"></g:plusone>

Далее надо вставить "2 Часть кода" в файл footer.php перед закрывающим тегом </body>

1 2 3 4 5 6 7 8 9 <script type="text/javascript"> window.___gcfg = {lang: 'ru'}; (function() { var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; po.src = 'https://apis.google.com/js/plusone.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); })(); </script>

<script type="text/javascript"> window.___gcfg = {lang: 'ru'}; (function() { var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; po.src = 'https://apis.google.com/js/plusone.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); })(); </script>

Перезагружаем страницу и смотрим полученный результат. Если кнопка не нравится можно поменять настройки ее в конструкторе.

гугл +1

Кнопка «Твитнуть»


Если вы хотите установить кнопку «твитнуть» от соц сети микроблогов twitter переходите по этой ссылке и попадаете на страницу конструктора.

кнопка твитнуть

Выбираете из предложенных кнопочек самую подходящую для вас. Мне понравился вариант «Отправить ссылку».

настройки кнопки твитнуть

Выбираете в настройках русский язык и копируете код в то место, где планируете сделать показ кнопки «твитнуть». В моем варианте это файл single.php.

Перезагружаете страницу и наслаждаетесь полученным результатом.

твитнуть

Кнопка «мне нравится» от Facebook

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

кнопка мне нравится facebook

URL to Like – данное поле не заполняем.

Send Button (XFBML Only) — я убрал галочку Send Button, чтобы не было дополнительной кнопки «Отправить».

Layout Style – формат кнопки. Мне понравился botton_count, но на вкус и цвет сами знаете, как бывает с приятелями.

Show Faces – ставим галочку, чтобы видеть аватарки тех, кому понравилась статья.

WIdth – указывает ширину. Я оставил все без изменений.

Verb to display – выбираете, какая надпись будет расположена на кнопке facebook. Здесь только два варианта: «like» – мне нравится или «recommend» – я рекомендую.

Color Scheme — выбираете цветовую схему оформления. Для темного (dark) или светлого (light) сайта.

Font – можете указать определенный шрифт названия кнопки (arial, verdana и другие).

Далее нажимаем кнопку «Get Code» и появляется окно с двумя кодами, которые надо добавить в шаблон темы сайта.

код кнопки фейсбук

Первую часть кода устанавливаем перед закрывающим тегом </body> в файле footer.php.

1 2 3 4 5 6 7 8 <div id="fb-root"></div> <script>(function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/ru_RU/all.js#xfbml=1"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk'));</script>

<div id="fb-root"></div> <script>(function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/ru_RU/all.js#xfbml=1"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk'));</script>

Вторую часть кода кнопки «мне нравится» facebook добавляем в то место, где будет показываться кнопка. У меня под текстом, значит файл single.php.

<div data-send="false" data-layout="button_count" data-width="450" data-show-faces="true"></div>

<div data-send="false" data-layout="button_count" data-width="450" data-show-faces="true"></div>

Перезагружаем и смотрим полученный результат.

фейсбук

После некоторой настройки расположения кнопок «мне нравится» Вконтакте, Facebook, а также «Твитнуть» и «Google+» у меня получился вот такой результат.

вывод кнопок социальных сетей на сайте

На этом все! Надеюсь, моя статья поможет вам в настройке и установке кнопок социальных сетей. Не пропускайте следующие посты, подписывайтесь обновлений блога.

Если что-то не получается или у вас есть вопросы по теме пишите в службу поддержки или оставляйте комментарий, помогу обязательно!

Буду рад, если нажмете на любую из кнопок:


Источник: http://SEOslim.ru/wordpress/knopka-mne-nravitsya-vkontakte-facebook-tvitnut-google-1-na-sajt.html



Рекомендуем посмотреть ещё:


Закрыть ... [X]

Свайно ростверковый фундамент своими руками (пошаговая инструкция) Как сделать крутые локоны


Построить дом своими руками с мансардной крышей Построить дом своими руками с мансардной крышей Построить дом своими руками с мансардной крышей Построить дом своими руками с мансардной крышей Построить дом своими руками с мансардной крышей Построить дом своими руками с мансардной крышей Построить дом своими руками с мансардной крышей Построить дом своими руками с мансардной крышей Построить дом своими руками с мансардной крышей