Руководства/Монетизация сайта/Стили кнопок оплаты

Стили кнопок оплаты

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

Фон и цвет текста

Чтобы изменить фон и цвет текста кнопки оплаты, выполните следующие действия.

  1. Нажмите отдельную кнопку в блоке «Платежи».
  2. На боковой панели настройки блоков найдите раздел «Цвет фона и текста».
  3. Щёлкните по разделу Цвет текста, чтобы изменить цвет текста кнопки.
  4. Щёлкните по разделу Фон, чтобы изменить цвет кнопки.

Подробнее о применении цветов к кнопкам.

Как настроить радиус кнопки

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

  1. Нажмите отдельную кнопку в блоке «Платежи».
  2. На боковой панели настройки блоков найдите раздел «Кромка».
  3. Перемещайте ползунок или введите число, чтобы изменить радиус кнопки.
  4. Справа вверху нажмите «Сохранить» или «Опубликовать», чтобы сохранить изменения.

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

Образец того, как при нулевом радиусе кромки кнопка становится квадратной.

Как настроить ширину кнопки

Настройте ширину кнопки, выполнив следующие действия.

  1. Нажмите отдельную кнопку в блоке «Платежи».
  2. На боковой панели настроек блока найдите раздел «Ширина».
  3. Выберите одно из предустановленных значений (25, 50, 75 или 100 %) или задайте произвольную ширину.
  4. Справа вверху нажмите «Сохранить» или «Опубликовать», чтобы сохранить изменения.

Например, можно установить ширину кнопки в 100 %, чтобы создать полноширинную кнопку. Или установить для каждой кнопки значение 50 %, чтобы создать две кнопки на всю ширину области контента, как в этом примере.

Две кнопки с заданной шириной 50 % рядом друг с другом занимают всю ширину области контента.

Как настроить выравнивание кнопок

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

  1. Выберите Представление в виде списка в верхнем левом углу редактора.
  2. Нажмите блок «Кнопка оплаты» в представлении в виде списка.
  3. На появившейся панели инструментов блока нажмите кнопку «Изменить выравнивание элементов».
  4. Выберите один из следующих вариантов:
    • Выравнивание элементов слева: выравнивание всех кнопок по левому краю.
    • Выравнивание элементов по центру: выравнивание всех кнопок по центру.
    • Выравнивание элементов справа: выравнивание всех кнопок по правому краю.
    • Интервал между элементами: создание равных интервалов между кнопками в блоке «Кнопки оплаты».
  5. Справа вверху нажмите «Сохранить» или «Опубликовать», чтобы сохранить изменения.

Применение готовых стилей

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

  1. Нажмите отдельную кнопку в блоке «Платежи».
  2. На боковой панели настроек блока щёлкните по вкладке Стили.
  3. Выберите один из стилей кнопки: Заливка или Контурный.
  4. Справа вверху нажмите «Сохранить» или «Опубликовать», чтобы сохранить изменения.

Как настроить типографику

Чтобы изменить размер шрифта, тип и регистр букв текста кнопки, выполните следующие действия.

  1. Нажмите отдельную кнопку в блоке «Кнопка оплаты».
  2. На боковой панели настроек блока щёлкните по вкладке Стили.
  3. Прокрутите страницу до раздела Типографика.
  4. Измените размер текста кнопки или нажмите три точки (), чтобы активировать опции Шрифт и Регистр букв.
  5. Справа вверху нажмите «Сохранить» или «Опубликовать», чтобы сохранить изменения.

Подробнее о настройках типографики.

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

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

  1. Нажмите отдельную кнопку в блоке «Платежи».
  2. Выделите весь текст кнопки или его часть.
  3. Примените любой из следующих стилей с помощью появившейся панели инструментов блока.
    • Полужирный
    • Курсив
    • Нажав значок Далее, вы увидите следующие опции:
      • Выделение: изменить цвета текста и фона или только текста. Изменить цвет кнопки можно с помощью стилей.
      • Встроенный код
      • Встроенное изображение
      • Стиль ввода с клавиатуры
      • Атрибут «Язык»
      • Зачёркивание
      • Нижний индекс
      • Верхний индекс
  4. Справа вверху нажмите «Сохранить» или «Опубликовать», чтобы сохранить изменения.
Пример выделенного текста, отформатированного курсивом.
Copied to clipboard!