Как добавить кнопку Google Plus (G+) на свой сайт. Как на сайт добавить кнопку


Как добавить кнопку Google Plus (G+) на свой сайт

10.01.2017

Добрый день дорогие читатели сайта. В прошлых статьях мы научились добавлять кнопки социальных сетей на сайт. Сегодня же рассмотрим, как добавить одну кнопку Google Plus на сайт, как настроить кнопку G+. Узнаем, насколько она важна для сайта. А может достаточно установить единый блок социальных кнопок? Обо всем об этом читайте в этом обзоре.

Стоит сразу напомнить, что кнопка Google (G+) Plus является официальной кнопкой социальной сети Гугл плюс, поэтому к установке ее на сайт нужно отнести с большим вниманием. Почему? Расскажу ниже.

Как и любая кнопка социальной сети, кнопка Google+ помогает расшаривать материал сайта в социальных сетях. Но, в отличие от других социальных кнопок, она является официальной кнопкой поисковой системы Гугл. От сюда следуют несколько полезных особенностей:

  1. Если она была использована пользователем, то есть, он нажал на нее и поделился ссылкой в социальной сети, то Google понимает, что этот материал интересен посетителям и по своим алгоритмам считает, что нужно страницу с этим материалом нужно лучше ранжировать в своей поисковой выдаче. Как признается сам поисковик, он следит за отдачей от этой кнопки и на основании этого ранжирует страницу
  2. Расшаренная страница в социальной сети при помощи g+ быстрее индексируется Гуглом. Это проверенно многими опытами и наблюдениями
  3. Увеличение трафика. Пользователей социальной сети от Гугл насчитывается несколько миллионов. Вы представляете, какое количество людей могут увидеть ссылку на сайт?!

Исходя из этих соображений, стоит устанавливать отдельно кнопку Google Plus на сайте.

Первым делом переходим по адресу: https://developers.google.com/+/web/+1button/

Здесь производим настройку кнопки Google +1

  1. Размер. В этом поле выбираем размер кнопочки. Она может быть маленькой (small), средней (medium), стандартной (выбрано по умолчанию) и большой (tall, хотя я разницы не заметил)
  2. Примечание. Здесь указываем, как мы хотим видеть подсказку на кнопки. На выбор есть встроенное, всплывающее и его отсутствие. Если выбрать нет в этой настройке, то кнопка G+ будет расположена одна, без счетчика и примечаний
  3. 1600 (Ширина). Я понятия не имею, почему этот пункт отображается как 1600, вместо того чтобы иметь название «Ширина». Может это трудности перевода на русский язык, не знаю. Этот пункт настройки кнопки Google +1 отвечает за ширину поля, в котором будет размещена кнопка, счетчик и примечание
  4. Язык. Язык информации, размещенный с кнопкой

Справой стороны пунктов настройки расположено окно (верхний красный квадрат) – это то, как будет выглядеть ваша кнопка на сайте. Благодаря нему можно проиграться настройками и визуально настроить G+ на свой вкус.

Рассмотрим расширенные настройки кнопки Google +1

В расширенных настройках кнопки можно указать URL страницы для кнопочки Google Plus в соответствующем поле. Если это не сделать, то кнопка будет передавать адрес страницы, на которой она установлена, в противном случае – на конкретный адрес будет заточена кнопка G+.

В поле «Функция Java Script…» можно указать скрипт, который будет выполнять после выполнения плюсования страницы.

Остальные поля расширенных настроек мне не известны. В руководстве пользователя по добавления кнопки Google +1 они не описаны. Если вы знаете, за что они отвечают, то буду благодарен, если вы напишите про них в комментариях к этой статье.

Как и многие социальные сети, код кнопки от Гугл + имеет двойной код. То есть, он состоит из двух частей

Первую часть кода (верхнюю) устанавливаем в начале страницы, между тегами <head>…</head>.

Вторую часть кода устанавливаем в том месте страницы, где вы хотите видеть кнопку g+

 

Вывод

Сегодня мы научились настраивать и добавлять на сайт кнопку Google Plus (g+). Как видно, настройка и установка кнопки от Гугл сильно ничем не отличается от установки кнопок других социальных сетей. Единственным недочетом, с моей точки зрения, это отсутствие адекватной документации к настройкам этой кнопки. Не адаптированный дизайн страницы настройки G+ (на моем компьютере не помещалось поле с кодом, при уменьшении размера экрана исчезали некоторые пункты настройки Google +1). Но все это технические трудности, спишем на новый, сырой дизайн, который недавно выкатил Google.

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

Всем удачи!!!

1st-finstep.ru

Как легко добавить кнопку на сайт

Здравствуйте, сегодня рассмотрим отличный wordpress плагин, который позволит с легкостью добавить на ваш сайт красивые кнопочки!Скачать исходники для статьи можно ниже

Этот плагин называется – Forget About Shortcode Buttons.

Сведения о плагине Forget About Shortcode Buttons на момент публикации статьи:Последнее обновление: 8 месяцев назад.Количество активных загрузок: 30000+Средняя оценка: 5 из 5.Сайт плагина: “wordpress.org/plugins/forget-about-shortcode-buttons/”

Установка и активация сайта стандартная – через панель управления wordpress.

После активации плагина в Редакторе записей/страниц у вас появится новая кнопочка – “Insert Button”:

button1

button1

Откроется следующее окно:

button2

button2

Нажимаем на кнопку Insert и кнопка вставляется туда где был курсор мышки:

button3

button3

Вот кнопочки, которые можно создать:

button4

button4 Запись обновлена Февраль 26, 2017 и опубликована в рубрике Плагины by Константин.

mnogoblog.ru

Как добавить на сайт кнопку, картинку и картинку плюс текст?

Эта возможность есть в разделе "О компании" и на текстовых страницах. Показываем на примере первого.

Перейдите в раздел "О компании". Нажмите "редактировать".Добавление кнопки 1. Нажмите иконку "Кнопка".2. Измените текст кнопки, нажав на нее.3. Нажмите на шестеренку, откроются дополнительные настройки.По желанию измените дизайн кнопки......размер кнопки и добавьте ссылку с кнопки:Добавление других блоков Также вы можете добавить картинку, картинку слева и права от текста, а также выровнять и добавить к ней ссылку. Возможный результат:

Также читайте:

  • Как и зачем регистрировать домен?
  • Как скрыть логотип Nethouse в правом нижнем углу сайта?
  • Как подключить sms-уведомления?
  • Как создать сайт бесплатно?
  • Как зарегистрировать домен бесплатно?

Была ли статья вам полезна? Да Нет

nethouse.ru

Как добавить кнопку на сайт?

Интернет становится все более интерактивен, и пользователи все чаще начинают взаимодействовать друг с другом через самые разные сайты, используя свои аккаунты в социальных сетях – таких, как ВКонтакте, Facebook, Одноклассники, и другие. Практически на каждом сайте теперь в конце статьи имеется несколько кнопок, нажав на которые, вы можете оперативно поделиться понравившимся материалом с друзьями в своем аккаунте. Установить кнопки социальных сетей вы можете и на свой собственный сайт. Создать сайт самостоятельно с Wix.com

Инструкция
  • Вы можете пойти простым путем и установить готовые кнопки, коды javascript, которых имеются в соответствующих разделах на сайтах социальных сервисов. Однако javascript существенно снижает скорость загрузки страниц, особенно, если таких элементов на странице много, а также такой формат кнопки не позволяет изменять ее размер и делать все кнопки одинаковыми и аккуратными.
  • Если вы владеете Photoshop, вы можете сделать кнопки в виде графических файлов, скачав из интернета иконки популярных социальных сетей и доработав их до одинаковой ширины и высоты.
  • Все, что вам понадобится сделать – это добиться того, чтобы при нажатии на графическую кнопку информация размещалась в вашем аккаунте в соответствующей социальной сети. Используйте обычный системный блокнот для открытия php-файлов.
  • Все коды кнопок добавляйте в файл single.php или index.php, и формируйте код следующего вида, для соблюдения общего стиля всех кнопок, коды которых вы сформируете и вставите в тег:
  • коды кнопок

  • Стиль оформления всех кнопок задается через файл style.css.
  • Установите кнопки нескольких наиболее популярных социальных сервисов с функцией «поделиться с друзьями» и «разместить материал на своей странице», а также при желании добавьте ссылки на собственные профили в тех же социальных сетях, чтобы посетители вашего сайта могли легко находить с вами контакт.
  • Оцените статью!

    imguru.ru

    Как вставить кнопки на сайт?

    В интернете существуют общепринятые стандарты на размеры рекламных баннеров. Баннеры самого маленького из размеров (88 на 31 пиксель) принято называть «кнопками». Их наиболее часто используют не для полномасштабной рекламы, а при обмене ссылками между владельцами сайтов или в качестве графических счетчиков посетителей. Последовательность действий при размещении таких кнопок на вашем сайте описана ниже.Создать сайт самостоятельно с Wix.com

    Вам понадобится
    • Система управления сайтом или текстовый редактор.
    Инструкция
  • Если вам нужно разместить кнопку-счетчик какого либо интернет-каталога или рейтинговой системы, то, как правило, вместе с регистрацией на этом ресурсе, вы получаете код для вставки в свои страницы. Это может быть JavaScript-код или простой код HTML. Сама картинка при этом находится на сервере рейтинговой системы, загружать ее на ваш сервер не требуется. В этом случае последовательность ваших действий должна быть такова:- в редакторе страниц системы управления вашим сайтом откройте нужную страницу и переключитесь в режим редактирования html-кода. Если вы не используете систему управления сайтом, то скачайте файл с исходным кодом страницы к себе в компьютер и откройте его, например, в стандартном блокноте. Скачивать страницу удобно с помощью файл-менеджера, который есть практически в любой панели управления хостинговой компании;- затем скопируйте код счетчика и вставьте в нужное вам место исходного кода редактируемой страницы. Кнопки счетчиков, как правило, помещают в самый низ страницы, то есть перед тегом . Но, в зависимости от дизайна вашей страницы, его можно поместить и в другое место;- если вы используете он-лайн редактор, то просто сохраните изменения. Если редактируете страницу в текстовом редакторе, то, сохранив, не забудьте закачать на сервер, заменив существующий файл страницы. Это можно сделать с помощью того же файл-менеджера.
  • Если это кнопка не от рейтинговой системы, а от какого-либо партнера по обмену ссылками, то и в этом случае, чаще всего, партнер предоставляет код для вставки его в страницы вашего сайта. Ваши действия должны быть таким же, как в предыдущем варианте. Разница может заключаться в том, что саму картинку вы должны разместить на своем сайте. Закачать ее на свой сервер можно воспользовавшись тем же файл-менеджером хостинг-провайдера или системы управления сайтом.
  • Если в вашем случае никакого исходного кода в комплекте с кнопкой нет, то его не трудно составить самостоятельно. В языке HTML (HyperText Markup Language - «язык разметки гипертекста») для отображения картинки служит тег, который выглядит так:Здесь images/button.gif в атрибуте src вам надо заменить на имя файла вашей кнопки. Этот тег изображения следует поместить внутрь тега, формирующего гиперссылку:
  • Здесь http://partnerSite.ru в атрибуте href вам надо заменить на адрес сайта вашего партнера по обмену ссылками.Этой строки кода будет достаточно для отображения кнопки со ссылкой, ведущей на сайт партнера. Вам осталось вставить ее в исходный код страницы способом, описанным выше.Совет добавлен 3 сентября 2011 Совет 2: Как вставить код на кнопку Кнопки в веб-страницах используются для организации интерактивного взаимодействия с пользователем. Как правило, если ответ на нажатие кнопки не требует отправки данных на сервер, то интерактив реализуется с помощью JavaScript-сценариев. Способы вызова соответствующего JavaScript-кода могут различаться - ниже описаны несколько возможных вариантов для кнопок разного типа.

    Инструкция
  • Если отображение кнопки в веб-странице организовано с помощью тега button, то JavaScript-код можно поместить в атрибут onclick. Например, так:кнопкаРазумеется, помещать непосредственно в тег кнопки достаточно большой код не целесообразно - лучше оформить его как функцию, а в атрибут onclick поместить только код вызова этой функции. Например:
  • function showAlert() {

    alert('Кнопка нажата!')

    }

    кнопка

  • Если кнопка отображается посредством одного из вариантов тега input (submit, reset, button или image), то можно использовать тот же самый атрибут onclick. Например, для кнопки очистки полей формы (reset), код может выглядеть так:Если необходимо, чтобы по нажатию кнопки исполнялся только JavaScript-сценарий, а назначенного ей по умолчанию действия не происходило, то в функцию или непосредственно в атрибут onclick следует добавить команду return false. Например:
  • Если надо организовать отклик на нажатие кнопки типа submit, то, кроме приведенного выше способа с использованием атрибута onclick, можно использовать свойства тега формы, к которой относится эта кнопка. Соответствующий вызов функции можно поместить в атрибут onsubmit тега form. Например:
  • Если кнопка не является элементом формы, а всего лишь графическим элементом (тег img), то и для него стандарты допускают использование атрибута onclick. Например:
  • Если кнопка является гиперссылкой, то использовать атрибуты самой кнопки не стоит, лучше воспользоваться свойствами тега ссылки. Можно, как и в предыдущих вариантах, задействовать тег onclick. Например:А можно заменить вызовом функции адрес в атрибуте href. Например, так:
  • Как вставить код на кнопку - версия для печатиОцените статью!

    imguru.ru

    Как добавить кнопки поделиться (нравится) на сайт?

    Кнопка "Like" ("Мне нравится" или "Поделиться") является быстрым и эффективным инструментом, с помощью которого можно мгновенно добиться эффекта популярности своего сайта (блога, интернет-магазина) и рассказать о чем-либо множеству людей. Успешное развитие компаний, использовавших инструмент "кнопка мне нравится" в продвижении своих товаров через facebook, в контакте, одноклассники и в увеличении числа посетителей сайта, подтверждает этот факт.

    Создать сайт самостоятельно с Wix.com

    Кнопка "Like" ("Мне нравится" или "Поделиться") является быстрым и эффективным инструментом, с помощью которого можно мгновенно добиться эффекта популярности своего сайта (блога, интернет-магазина) и рассказать о чем-либо множеству людей. Успешное развитие компаний, использовавших инструмент "кнопка мне нравится" в продвижении своих товаров через facebook, в контакте, одноклассники и в увеличении числа посетителей сайта, подтверждает этот факт.Сегодняшнюю жизнь невозможно представить без социальных сетей . Тому подтверждение - миллионные аудитории в контакте, фейсбук, одноклассники, твиттер, гугл плюс, мэйл ру и др. Есть люди, которые зависают там целыми сутками, просматривая новости друзей, групп и страниц, на которые подписаны.Поставленная кнопка "мне нравится" на Ваш сайт - это один из бесплатных инструментов раскрутки Вашего блога, интернет-магазина, сайта. Ваш читатель нажал на эту кнопку, отправив таким образом себе на страничку краткий анонс понравившейся статьи и товара и, соответственно, ссылку на них. Его друзья это увидели и зашли к Вам на сайт по той ссылке, чтобы подробнее ознакомиться со статьей либо с товаром. У кого-то 50 друзей, у кого-то 100, а то и больше. Степень доверия к размещаемым новостям на личных страницах в социальных сетях очень высока.Итак, чтобы привлекать новый трафик, наращивать показатели ТИЦ и PR, ставим на свой сайт кнопки "мне нравится". Как правило, их размещают в конце статьи. Существует несколько способов, как добавить кнопку "мне нравится". Можно заходить в каждую социальную сеть и, пользуясь их программными средствами, создавать отдельно для каждой социальной сети свою кнопку (получать код кнопки мне нравится, например, в контакте), а потом вставлять этот код в сообщения или в шаблон страниц сайта. Но можно воспользоваться удобным, чрезвычайно простым и быстрым сервисом от Яндекс - Набор кнопок "Поделиться" для Вашего сайта. В результате работы с этим сервисом Вами будет получена яндекс кнопка, с помощью которой пользователи смогут отправить анонс статей Вашего сайта на свои странички вконтакте, facebook, одноклассники, твиттер, google +1 и др. Вы с легкостью сможете добавить этот набор кнопок "мне нравится" и на blogger, и на wordpress, и opencart, и joomla, и ucoz, и мн.др.

    Оцените статью!

    imguru.ru