Как добавить виджет Instagram в WordPress (пошаговое руководство)

 

Хотите узнать, как добавить виджет Instagram в свой блог WordPress? Просмотр вашей ленты Instagram в вашем блоге — отличный способ увеличить взаимодействие с вашими читателями, предоставить им дополнительный контент и многое другое.

Подключение вашей учетной записи Instagram к вашему  блогу WordPress  может показаться сложным, но на самом деле это не так!

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

Готовый?

Давайте погрузимся!

 

Что такое виджет WordPress?

Во-первых, если вы новичок в WordPress, вам может быть интересно, что такое виджет WordPress.

Виджеты — это в основном небольшие блоки контента, которые вы можете  добавить на боковую панель  , нижний колонтитул и другие области вашего сайта WordPress.

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

В приведенном ниже примере Studio Mommy добавила виджет Instagram в нижний колонтитул своего веб-сайта, а также значки социальных сетей,  форму подписки на рассылку новостей  и многое другое.

instagram-feed-studio-мама

Добавление виджета Instagram в WordPress может быть особенно полезным для вашего блога.

Читайте дальше, чтобы узнать, почему. 

Преимущества добавления виджета Instagram в ваш блог WordPress

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

Итак, давайте подробнее рассмотрим, почему вы должны добавить ленту Instagram в свой блог. 

Предоставьте посетителям больше контента

Когда вы добавляете ленту Instagram в свой блог, вы предоставляете посетителям вашего сайта более интересный контент для ознакомления. Вместо того, чтобы покидать ваш блог после прочтения вашего последнего поста, они могут прокручивать вашу ленту в Instagram, не покидая ваш сайт.

Этот дополнительный контент побуждает посетителей оставаться на вашем сайте дольше.

Улучшить SEO

Когда вы добавляете виджет Instagram в WordPress, подписи Instagram встраиваются на ваш сайт.

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

Увеличение вовлеченности и подписчиков

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

Это может помочь вам получить больше подписчиков в Instagram и увеличить свое присутствие в социальных сетях.

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

Легко обновляйте свой блог

Лента Instagram, встроенная в ваш блог, позволяет легко обновлять ваш сайт новым контентом. Всякий раз, когда вы публикуете новый контент в Instagram, он автоматически появляется на вашем веб-сайте. Это экономит ваше время и показывает, что ваш блог активен. 

Создайте социальное доказательство и доверие

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

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

Теперь, когда вы знаете обо всех преимуществах привязки вашей учетной записи Instagram к WordPress, давайте сразу перейдем к руководству. 

Как добавить виджет Instagram в WordPress (вручную)

Если вы хотите добавить виджет Instagram в WordPress без плагина, вы можете сделать это вручную.

Мы рекомендуем использовать плагин, потому что он проще и даст вам массу других параметров просмотра и настройки, мы рассмотрим это в следующем разделе.

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

Но чтобы вручную добавить виджет Instagram, начните с перехода в свою учетную запись Instagram и выбора фотографии, которую вы хотите отобразить в своем блоге.

Нажмите на 3 маленькие точки в правом верхнем углу поста в Instagram. Затем нажмите  Встроить  .

Встраивание Instagram

На следующем шаге нажмите синюю кнопку «  Копировать код для встраивания»  . Здесь у вас также есть возможность удалить заголовок из встраивания, если вы хотите, сняв  флажок «Включить заголовок»  .

скопируйте включенный код

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

Если вы хотите добавить виджет Instagram на боковую панель в WordPress со скопированным кодом для встраивания, перейдите на панель инструментов WordPress. Затем перейдите в  Внешний вид »Виджеты.

виджет-внешний вид-приборная панель

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

перетащите текстовый виджет на боковую панель

После размещения виджета в нужном месте на вашем сайте щелкните стрелку раскрывающегося списка на виджете.

выпадающее меню

Откроется текстовое поле, в которое вы можете вставить код для встраивания Instagram, который вы скопировали ранее. Убедитесь, что вы вставляете код для встраивания в  текстовый  редактор, а не в визуальный.

вставить код для вставки

Вы также можете добавить заголовок для своей ленты Instagram. Нажмите  Сохранить ,  когда  закончите  .

Это все.

Теперь вы можете видеть свой виджет Instagram в прямом эфире в своем блоге.

Instagram-сайдбар-виджет

Как вы можете видеть из приведенного выше примера, у вас не так много вариантов настройки при ручном добавлении виджета Instagram в WordPress.

Итак, давайте рассмотрим лучший способ добавить виджет Instagram в WordPress.

Как добавить виджет Instagram в WordPress (с помощью плагина)

Самый простой и лучший способ добавить виджет Instagram в WordPress — с помощью плагина. Мы рекомендуем  плагин Smash Balloon Instagram Feed Pro  .

лента instagram pro разбить воздушный шар

Instagram Feed Pro —  плагин Instagram №1 для WordPress с  самым высоким рейтингом   .

С помощью этого плагина Smash Balloon всего за несколько кликов вы можете легко добавить свою ленту Instagram в качестве виджета на боковой панели, к любому посту или странице вашего блога с помощью редактора блоков WordPress или вставив шорткод в любое место на вашем сайте.

Кроме того, Instagram Feed Pro предлагает отличные функции, которые помогут вам создать мощный и настраиваемый виджет Instagram, в том числе:

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

Smash Balloon также предлагает  бесплатную версию плагина  , так что вы можете попробовать его.

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

Теперь давайте рассмотрим, как использовать Smash Balloon для добавления виджета Instagram в WordPress шаг за шагом. 

Шаг 1. Установите плагин для ленты Instagram.

Во-первых, вам нужно скачать  Instagram Feed Pro от Smash Balloon ,  установить и активировать плагин.

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

Шаг 2: подключите свой аккаунт Instagram к плагину

Затем вам нужно связать свою учетную запись Instagram с плагином Smash Balloon. Для этого нажмите кнопку  Instagram Feed  на панели управления WordPress, которая появляется после загрузки и активации плагина.

Вы перейдете на страницу настроек плагина Instagram Feed. Нажмите синюю кнопку  Подключить учетную запись Instagram  .

подключить-instagram-аккаунт

Следуйте инструкциям на экране, чтобы подключить свою учетную запись Instagram.

Первое приглашение спросит вас, хотите ли вы подключить  личную  или  деловую учетную запись Instagram  .

личный бизнес аккаунт

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

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

Выберите тип учетной записи Instagram и нажмите «  Подключиться »  , чтобы продолжить.

Это все! Теперь ваша учетная запись Instagram подключена к плагину Instagram Feed. 

Шаг 3. Выберите контент Instagram для просмотра

На этой же странице вы также можете выбрать, какой тип контента Instagram вы хотите отображать в своем виджете Instagram.

Вы можете выбрать для просмотра:

  • Ваша стандартная лента Instagram
  • Лента с фотографиями определенного общедоступного хэштега
  • Лента с фотографиями, на которых вы отмечены
  • Смешанный корм с несколькими типами корма
instagram-канал-тип

Чтобы просмотреть простую ленту ваших последних публикаций в Instagram, выберите параметр «Учетные записи пользователей» и  нажмите «  Сохранить  изменения »  . 

Шаг 4. Выберите макет для виджета Instagram

Перейдите на  страницу настроек  плагина Instagram Feed и нажмите на вкладку «  Настроить »  .

Разбить карту настройки воздушного шара

На этой странице вы можете решить, как виджет Instagram будет выглядеть в вашем блоге, с такими параметрами настройки, как:

  • Ширина и высота 
  • Фоновый цвет
  • Количество фотографий для показа
  • Показать / скрыть свою биографию в Instagram
  • Добавить кнопку «Подписаться»

Вы также можете выбрать, какой тип макета должен иметь виджет Instagram. Лента Instagram Smash Balloon предлагает 4 различных варианта макета на выбор:

  • Сетка  : стандартная сетка с неподвижными квадратными изображениями.
  • Карусель  : горизонтальная карусель, которую пользователи могут прокручивать.
  • Masonry  — галерея, показывающая фотографии из Instagram в их исходном горизонтальном или вертикальном формате.
  • Выделение  : галерея, в которой определенные фотографии отображаются в сетке крупнее, чтобы выделить их.

Для этого урока мы выберем макет сетки, который выглядит следующим образом:

разбить-воздушный шар-instagram-сетка-макет

Выберите нужный тип макета и  нажмите  Сохранить  изменения  .

Шаг 5: Добавьте виджет Instagram в WordPress

Настало время добавить виджет Instagram в свой блог!

С плагином Instagram Feed от Smash Balloon у вас есть 3 разных способа встраивания вашей ленты.

Давайте посмотрим на каждый из них. 

1. Блок ленты WordPress в Instagram

Чтобы добавить виджет Instagram на новую страницу вашего веб-сайта с помощью редактора блоков WordPress, сначала перейдите в «  Страницы» «Добавить новый»  .

В редакторе блоков WordPress щелкните значок «  Плюс» (+)  , чтобы найти блок WordPress. В строке поиска введите «Instagram», чтобы найти  блок WordPress Feed Instagram  .

wordpress-блок-виджет

Нажмите на блок, чтобы добавить его на свою страницу.

Затем у вас будет предварительный просмотр того, как будет выглядеть ваша лента Instagram на вашем веб-сайте, и вы сможете изменить настройки, если это необходимо.

Опубликуйте  страницу, чтобы ваш виджет ленты Instagram появился в вашем блоге!

Вот пример того, как выглядит готовое изделие:

instagram-feed-smash-balloon

Вы можете использовать тот же метод, чтобы добавить ленту Instagram на любую существующую страницу или публикацию на своем сайте. 

2. Лента шорткодов в Instagram

Если вы используете классический редактор WordPress, вы можете использовать шорткод ленты Instagram, чтобы отобразить ленту в публикации или на странице вашего сайта.

Перейдите на  страницу настроек  ленты Instagram . На вкладке  View your feed  скопируйте предоставленный шорткод.

лента-короткий код

Затем просто вставьте шорткод прямо в свой пост или редактор страницы.

вставка-шорткод

Нажмите  «Опубликовать  », чтобы сохранить изменения и активировать ленту Instagram на своем сайте. 

3. Виджет WordPress для канала Instagram

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

Перейдите в  Внешний вид »Виджеты  из панели управления WordPress. 

Найдите виджет Instagram Feed слева и перетащите его на выбранную вами боковую панель. В этом уроке мы добавим виджет Instagram на главную боковую панель. 

виджет smash-balloon

В настройках можно добавить заголовок. Когда закончите  нажмите  Сохранить   . 

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

боковая панель-instagram-лента

Это заключение!

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

Вы хотите видеть ленту Facebook и в своем блоге? Ознакомьтесь с нашим списком  лучших плагинов Facebook для WordPress  . Вы также можете прочитать наш учебник о  том, как встроить группу Facebook в WordPress  .

И не забудьте  подписаться на нашу электронную рассылку ,  чтобы получать еще больше полезных советов по ведению блога!