Все для начинающих интернет-предпринимателей

Добавление кнопки призыва к действию в WordPress (без кода)

knopka-priziva-k-deistviy

Приветствуем вас! Призыв к действию (CTA) — это элемент на сайте, который просит людей сделать что-то конкретное. Это может быть просто какой-то заметный текст, или это может быть выделенная кнопка или форма регистрации. В любом случае, CTA должен быть хорошо продуман и аккуратно размещен, если вы хотите, чтобы он был максимально эффективным для получения желаемого ответа.

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

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

Шаг 1. Добавление кнопок в сообщения / страницы с помощью редактора по умолчанию

Этот метод проще и рекомендуется для большинства пользователей. Мы будем использовать встроенный блок Button в новом редакторе WordPress гутенберг. Если вы все еще используете старый классический редактор, то можете перейти к следующему разделу.

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

knopka-1

У вас появится новый блок кнопок, добавленный в редактор контента.

knopka-2

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

knopka-3

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

knopka-4

Далее вы можете настроить стиль кнопок, изменить цвет фона и цвет текста на панели настроек блока с правой стороны.

knopka-5

Вы можете выбрать один из трех стилей кнопок: по умолчанию, контур и квадрат. Раздел «Настройки цвета» включает в себя пять цветовых вариаций как для фона кнопки, так и для текста кнопки. Но также вы можете использовать пользовательский цвет, нажав на опцию «Произвольный цвет».

knopka-6

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

knopka-7

Шаг 2. Создание кнопки WordPress в классическом редакторе

Хотя блок-редактор Gutenberg быстрее и проще, многие пользователи по-прежнему предпочитают старый классический редактор. Первое, что вам нужно сделать, это установить и активировать плагин Forget About Shortcode Buttons.

Как только вы активировали плагин, создайте новый пост или отредактируйте существующий. В редакторе вы увидите новую кнопку с надписью «Вставить кнопку».

knopka-8

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

knopka-9

Во-первых, вам нужно добавить текст кнопки и URL. Когда вы добавляете текст своей кнопки, вы можете увидеть предварительный просмотр в поле ниже. Затем вы можете добавить тег nofollow к своей ссылке и открыть ссылку на новой вкладке, установив флажки ниже.

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

knopka-10

knopka-11

Далее, вы можете выбрать цвет текста и цвет фона для вашей кнопки, нажав на иконку Color box.

knopka-12

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

knopka-13

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

knopka-14

Как только вы будете удовлетворены внешним видом, просто нажмите кнопку «Обновить».

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

knopka-15

Двойной щелчок по кнопке вызовет всплывающее окно «Вставить кнопку», и вы можете отредактировать свою кнопку, если хотите.

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

knopka-16

Ну вот и все. Мы показали вам самые простые способы добавления кнопки призыва к действию. Мы надеемся наша статья была вам полезна. А у нас на этом все. Всем пока!

С уважением Вячеслав и Валерия!

Понравился материал? Поделитесь с друзьями!

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

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