Как добавить Google Plus кнопки в WordPress?

Автор:
Nurlan Kemelbekov

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

Google для своей популярной социальной сети Google Plus расширил возможности использования кнопок. Теперь можно  делиться новостями, статьями и т.д. с помощью этой обменной кнопки.

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

Как добавить кнопку Google Plus на блоге WordPress?

Вот простой путеводитель, который шаг за шагом покажет, как добавить кнопку Google Plus поделиться от Google на страницы блога на WordPress и при этом не занимает лишнего времени при загрузке страницы. После небольшого исследования интернет, я нашел этот метод, который помогает улучшить скорость загрузки страниц. И так, здесь два шага, которые вы должны пройти.

  •  Для добавления требуется:

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

  • Нормальный JavaScript

Это нормальная версия JavaScript и занимает немного времени для загрузки. Просто добавьте нижеприведенный код в functions.php файл вашей темы WordPress  и обновите его.
/** Начало загрузки скриптов в футер темы WordPress*/
function wp_scripts() { ?>
<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
<?php
}
add_action('wp_footer', 'wp_scripts');
/** Окончание загрузки сктриптов в футер темы  Wordpress*/

  • Асинхронная загрузка JavaScript

Асинхронная версия всегда используется для повышения скорости страниц, и рекомендуется использовать его на  блоге WordPress. Просто добавьте этот код в functions.php файл в вашей теме и сохраните его.
/** Начало асинхронных сценариев в футер темы от WordPress*/
function wp_scripts() { ?>
<script type="text/javascript">
(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>
<?php
}
add_action('wp_footer', 'wp_scripts');
/** Конец асинхронных сценариев в футер темы WordPress*/

Вы сделали первый шаг. Теперь давайте перейдем к более важной части.

  •  Добавление Google Plus кнопки без плагина.

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

  • Вертикальное расположение счетчика кнопки.


<div class="g-plus" data-action="share" data-annotation="vertical-bubble" data-height="60"></div>

  • Средняя горизонтальная Кнопа.


<div class="g-plus" data-action="share" data-annotation="bubble"></div>

  • Большая горизонтальная Кнопка.


<div class="g-plus" data-action="share" data-annotation="bubble" data-height="24"></div>
Если вам нужны другие стили кнопок,  можете посетить страницу Google Developers.

Темы WordPress могут отличаться друг от друга по функциональности и  поэтому вы можете экспериментировать, внедрив другой вариант кнопки Google Plus «поделиться». Добавить нижеследующий код в functions.php файл и ваша виртуальная кнопка «отправить» будет располагаться на странице, чуть ниже названия статьи.
/** Start of Google Share Button before Post in Thesis */
function gplus_share() {
if (is_single()) { ?>
<div data-action="share" data-annotation="bubble"></div>
<?php
}}
add_action('thesis_hook_before_post', 'gplus_share');
/** End of Google Share Button before Post in Thesis*/

Приведенные выше примеры скриптов лишь ускоряют загрузку страниц (наверно, вернее будет сказать не создают дополнительную нагрузку). Без самого скрипта кнопки Google Plus, расположенной в футере, иконка со счетчиком не появится.

  • Скрипт в футере:

<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>

Автоматически добавить кнопку Google+

Вставьте этот простой кусок кода в functions.php файл, чтобы автоматически добавить кнопку Google+ ниже каждой записи и на главной.
add_filter('the_content', 'wpr_google_plusone');
function wpr_google_plusone($content) {
$content = $content.'<div class="plusone"><g:plusone size="standart" href="<?php the_permalink(); ?>"></g:plusone></div>';
return $content;
}
add_action ('wp_enqueue_scripts','wpr_google_plusone_script');
function wpr_google_plusone_script() {
wp_enqueue_script('google-plusone', 'https://apis.google.com/js/plusone.js', array(), null);
}

После сохранения, кнопка Google+ будет автоматически добавлена ​​на все ваши публикации.

Ну, вот и все действия, которые нужно было совершить для того, чтобы добавить эту волшебную кнопку поделиться от Google Plus.

Вы также можете попробовать и другие методы в действии, чтобы добавить Google Plus кнопки «поделиться».  А также прочитать статью «Как добавить иконки социальных сетей без плагина«.



Вам также может понравиться:


Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

* Copy This Password *

* Type Or Paste Password Here *

19 − семнадцать =

Я просто хотел сказать, как сильно я ценю Ваш комментарий на мой пост. Спасибо Вам !!