Как добавить кнопку «Закрепить» Pinterest в WordPress (Ultimate Guide)

2 min


Хотите добавить кнопку «Закрепить» на Pinterest в WordPress? Недавно в статистике нашего блога появился новый источник трафика.

Это было достаточно важно для нас, чтобы заметить. Этот источник трафика был Pinterest.

Pinterest — это популярная социальная сеть, которая позволяет вам делиться визуальным контентом и привлекать много трафика на ваш сайт (следите за WPBeginner на Pinterest).

В этой статье мы покажем вам, как добавить кнопку «Закрепить» на Pinterest в свой блог WordPress. Мы также объясним, как добавить кнопку «Прикрепить» к изображениям вашего сайта.

Добавить кнопку «Закрепить» в WordPress

Добавление кнопки «Закрепить» в Pinterest с помощью плагина

Pinterest официально изменил «Pin It» имя кнопки для Сохранить в 2016 году.

Хотя некоторые плагины по-прежнему используют имя «Закрепить» вместо «Сохранить», они выполняют ту же функцию, что и прикрепление ваших изображений в Pinterest.

Самый простой способ добавить кнопку Pinterest на свой сайт WordPress — использовать плагин для обмена в социальных сетях.

Мы рекомендуем использовать плагин Shared Counts для этой цели. Это лучший плагин для социальных сетей для WordPress, потому что он бесплатный и позволяет легко добавлять кнопку Pinterest вместе с другими популярными социальными сетями.

Для начала вам необходимо установить и активировать плагин Shared Counts. Вы можете следовать нашему пошаговому руководству по установке плагина WordPress для получения подробных инструкций.

После установки отправляйтесь в Настройки »Общие счета страница для настройки плагина.

Страница настроек общего счета

На странице настроек вам нужно прокрутить вниз до дисплей раздел и затем нажмите на текстовое поле «Share Buttons to Display».

Откроется раскрывающееся меню, в котором вы можете выбрать службы социальных сетей, которые хотите добавить. По умолчанию Pinterest будет присутствовать в этом поле, а также Facebook и Twitter.

Вы также можете выбрать место и тип публикации, где вы хотите отобразить кнопку Pinterest. Он поставляется с несколькими стилями кнопок, которые вы можете выбрать из опции «Поделиться стилем кнопки».

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

Теперь вы можете посетить любой пост на своем веб-сайте, чтобы увидеть кнопку Pinterest в действии.

Добавлена ​​кнопка Pinterest в пост WordPress

Еще одна полезная вещь о SharedCounts — это бесплатное дополнение Custom Pinterest Image, доступное на Github. Это позволяет вам настраивать изображение и описание для обмена на Pinterest, оптимизированное для Pinterest.

Заметка: Мы используем плагин SharedCount на нашем сайте, потому что это лучший вариант на рынке. Это очень хорошо закодировано и бесплатно.

Добавление кнопки «Закрепить» в WordPress вручную в WordPress

Некоторые промежуточные пользователи могут предпочесть добавить кнопки общего доступа в социальные сети на свой сайт WordPress вместо использования плагина.

Давайте посмотрим, как вручную добавить кнопку Pinterest в WordPress.

Первое, что вам нужно сделать, это сделать полную резервную копию WordPress вашего сайта. Это поможет вам восстановить ваш сайт на случай, если что-то сломается случайно.

Затем вам нужно подключиться к вашему хостингу WordPress с помощью FTP-клиента и затем перейти в папку / wp-content / themes /.

Отсюда вам нужно открыть вашу текущую папку темы и затем найти файл footer.php.

Скачать php файл нижнего колонтитула

Затем просто щелкните правой кнопкой мыши на этом файле и выберите Скачать из меню. Это загрузит файл footer.php на ваш компьютер.

Теперь вам нужно открыть файл footer.php с помощью простого текстового редактора, такого как Блокнот, а затем вставить следующий скрипт прямо перед тег.




(function () {
    window.PinIt = window.PinIt || {загружено: ложно};
    if (window.PinIt.loaded) return;
    window.PinIt.loaded = true;
    function async_load () {
        var s = document.createElement ("script");
        s.type = "text / javascript";
        s.async = true;
        s.src = "https://assets.pinterest.com/js/pinit.js";
        var x = document.getElementsByTagName ("script")[0];
        x.parentNode.insertBefore (s, x);
    }
    if (window.attachEvent)
        window.attachEvent ("onload", async_load);
    еще
        window.addEventListener («загрузка», async_load, false);
}) ();

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

Затем вам нужно найти и загрузить файл single.php из папки вашей темы и открыть его для редактирования. После этого вам нужно добавить следующий код.

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

ID), «полный»); ?>
<a href = "http://pinterest.com/pin/create/button/?url=Я БЫ)); ?> И СМИ =& Описание ="class =" pin-it-button "count-layout =" vertical "> Закрепить

Приведенный выше код отображает кнопку Pinterest с вашим избранным изображением, заголовком, описанием и URL-адресом публикации в параметре URL-адреса общего ресурса.

Наконец, вам нужно сохранить файл и загрузить его обратно в каталог вашей темы, используя FTP.

Это добавит вертикальную кнопку «Поделиться» к сообщениям вашего сайта. Если вы хотите отобразить горизонтальную кнопку общего доступа, просто измените кол-макет параметр по горизонтали.

Создание шорткода для кнопки Pinterest

Недавно один из наших пользователей спросил нас, как создать шорткод для кнопки Pinterest.

Шорткоды в WordPress позволяют легко добавлять динамические элементы в ваши записи, страницы и виджеты WordPress. Создав шорткод, вы сможете вручную добавить кнопку Pinterest в свои статьи.

Во-первых, вам нужно добавить следующий код в файл functions.php вашей темы или плагин для сайта:




function get_pin ($ atts) {
$ pinterestimage = wp_get_attachment_image_src (get_post_thumbnail_id ($ post-> ID), 'full');
вернуть 'Я БЫ)) . '& media ='. $ pinterestimage[0] , '& description ='. get_the_title (). '"class =" pin-it-button "count-layout =" vertical "> Закрепить«; }

add_shortcode ('pin', 'get_pin');

После этого вы можете использовать [pin] шорткод в ваших сообщениях WordPress, где вы хотите отобразить кнопку Pinterest.

Добавление кнопки «Pinterest» над изображениями

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

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

Сначала вам нужно установить и активировать плагин Pinterest для кнопки «Картинки».

После активации перейдите к Настройки »Pinterest Pin It страница для настройки плагина.

Pinterest Pin It кнопка для страницы настроек изображений

На странице настроек вы можете выбрать, где вы хотите показать кнопку «Закрепить» на вашем сайте WordPress. Вы можете отображать его только на отдельных сообщениях, страницах, страницах категорий или везде на вашем сайте.

Следующий вариант — выбрать описание по умолчанию из выпадающего меню. Это будет использоваться в качестве описания изображения для закрепленного изображения.

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

Pinterest Прикрепите кнопку над изображениями

Если вы хотите исключить некоторые изображения из кнопки «Прикрепить», вы можете добавить nopin Класс CSS для изображений, которые вы хотите исключить.

Для этого вам нужно выбрать блок изображения в редакторе постов, а затем щелкнуть значок 3 вертикальных точек на панели инструментов блока. Это откроет меню, где вам нужно нажать на Редактировать как HTML вариант.

Изменить изображение как HTML-вариант, чтобы добавить класс CSS

Теперь вы увидите HTML-код вашего изображения. Идти вперед, чтобы добавить nopin к учебный класс атрибут тега img:

название изображения

Аналогично, вы также можете использовать плагин для отключения автоматического отображения кнопки «Прикрепить» и использовать класс «pinthis» для CSS, чтобы выборочно отображать кнопку на определенных изображениях.

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

Pinterest Pin It плагин расширенные настройки

Теперь вам нужно проверить опцию, которая гласит: «Показывать кнопку« Закрепить »только на изображениях с классом =» pinthis »‘, а затем нажмите на кнопку Сохранить кнопка.

В следующий раз, когда вы добавите изображение в сообщение или страницу, вам нужно выбрать блок изображения и затем использовать Редактировать как HTML возможность добавить pinthis CSS класс для изображения кода. Вот пример:

название изображения

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

Это все!

Мы надеемся, что эта статья помогла вам понять, как добавить кнопку «Закрепить» на Pinterest в свой блог WordPress. Вы также можете посмотреть наше руководство о том, как создать электронную рассылку и получить больше подписчиков.

Если вам понравилась эта статья, пожалуйста, подпишитесь на наш канал YouTube для видеоуроков WordPress. Вы также можете найти нас на щебет и фейсбук.

Пост Как добавить кнопку «Закрепить» Pinterest в WordPress (Ultimate Guide) впервые появился на WPBeginner.


0 Comments

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