Как использовать блок кнопок WordPress

Опубликовано: 2021-08-29

Кнопки на вашем веб-сайте играют важную роль в его внешнем виде и удобстве использования. Они помогают посетителям перемещаться по разным страницам и упрощают выполнение важных действий (например, загрузку контента или подписку на ваш информационный бюллетень). Крайне важно, чтобы у вас был простой, но эффективный способ вставки и настройки этого важного элемента. К счастью, блок WordPress Buttons может помочь.

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

Давайте начнем!

Подпишитесь на наш канал Youtube

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

Чтобы добавить кнопку в свой контент WordPress, сначала перейдите к записи или странице, куда вы хотите ее вставить. Затем щелкните значок « Добавить блок» (1), найдите «кнопки» в текстовом поле и выберите параметр « Кнопки» (2):

Добавление блока кнопок в WordPress.

Вы также можете добавить блок кнопок , набрав «/ buttons» в текстовом редакторе и нажав клавишу Enter на клавиатуре. После вставки блока вы получите доступ к новому меню панели инструментов, о котором мы поговорим ниже.

Настройки и параметры блокировки кнопок

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

Текст и ссылки

При вставке блока кнопок, кнопка по умолчанию будет добавлена с содержанием заполнителя:

Опция «добавить текст» в блок WordPress Button.

Когда вы нажимаете на текстовое поле, вы можете изменить текст на то, что вы хотите, чтобы кнопка говорила. Например, вы можете добавить призыв к действию (CTA), например «Подробнее».

Вторая опция панели инструментов - это значок ссылки, который вы можете использовать, чтобы определить, куда кнопка будет направлять пользователей:

Связывание блока кнопок WordPress.

Вы можете найти внутреннюю страницу, на которую хотите создать ссылку, введя текст в текстовое поле. Вы также можете ввести или скопировать / вставить URL-адрес внешней страницы. Затем вы можете выбрать значок стрелки или нажать Enter, чтобы вставить ссылку.

Обратите внимание, что вы также можете переключить опцию « Открыть в новой вкладке» . Это определит, будут ли пользователи переходить на новую страницу в том же окне или на новую вкладку.

Форматирование кнопок

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

Параметры форматирования блока кнопок.

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

Стили, типографика и цвет

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

Варианты стилизации кнопки в WordPress.

У вас есть два варианта стиля: « Заливка» и « Контур» . Заливка сделает кнопку сплошным цветом, а контур - прозрачной кнопкой с дополнительной цветной рамкой. Вы можете сделать свой выбор, щелкнув значок с предварительным просмотром или выбрав желаемый вид из раскрывающегося меню « Стиль по умолчанию» .

Затем в разделе « Типографика » вы можете выбрать размер шрифта для текста кнопки:

Меню размера шрифта кнопки WordPress.

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

На панели « Цвет» вы можете найти параметры для изменения цвета текста и кнопок. Для обоих вы можете выбрать из списка доступных вариантов или выбрать собственный оттенок:

Кнопки WordPress блокируют параметры цвета.

Обратите внимание, что для цвета фона вы можете выбрать Solid или Gradient :

Настройки цвета в блоке кнопок WordPress.

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

Советы и рекомендации по эффективному использованию блока кнопок

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

  • Читать / узнать больше
  • купить сейчас
  • Скачать
  • Добавить в корзину
  • Заказать сейчас

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

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

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

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

Часто задаваемые вопросы о блоке кнопок

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

Где найти блок кнопок в WordPress?

Вы можете найти этот блок, перейдя к записи или странице (или области виджетов), где вы хотите добавить кнопку. Затем вы можете выполнить поиск «/ buttons» и нажать Enter , либо щелкнуть значок « Добавить блок» и выполнить поиск «кнопок» в текстовом поле.

Что делают кнопки публикации и блоки страниц?

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

Где я могу добавить блок кнопок в WordPress?

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

Заключение

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

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

У вас есть вопросы по использованию блока кнопок ? Дайте нам знать в комментариях ниже!

Лучшее изображение через RobinKhan / shutterstock