Web5X - Готовые сайты

Блог о создании сайта, конструкторе сайтов и Elementor

кнопка конструктора веб сайта

Кнопка — виджет Elementor

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

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

кнопка в конструкторе страниц Elementor

А теперь перейдем к свойствам виджета Кнопка

Содержимое

  • Тип — выбор типа кнопки, а точнее ее цветовое оформление. Представлены 5 типов : по умолчанию, Информация ,Успех,  Предупреждение, Опасность. В зависимости от типа и меняется цвет.
  • Текст — текст на кнопке
  • Ссылка — ссылка для кнопки (доступны доп параметры при нажатии на шестиренку)
  • Выравнивание — выравнивание кнопки. Если выравнять кнопку по ширине, то она растянется во всю ширину колоки.
  • Размер — предустановленные размеры кнопки от маленького до очень большого.
  • Иконка — иконка на кнопке. Возможно выбрать отображение до или после текста. Размер иконки зависит от размера текста.

Стиль

  • Типографика — общая типографика для текста и иконки кнопки
  • Цвет текста — цвет текста для кнопки
  • Цвет фона — цвет фона кнопки
  • Тип границы — тип границы кнопки
  • Скругление углов — скругление углов у кнопки.  0 для кнопки с прямыми углами и
  • Тень объекта — добавление тени для кнопки
  • Отступ внутри — отступ внутри кнопки (отступ от текста внутри кнопки)

=======================================================================
Список всех виджетов Elementor вы можете посмотреть на странице Виджеты
=======================================================================

Кнопка — виджет Elementor: 8 комментариев

  1. Добрый день!
    Спасибо вам за ваг сайт, подскажите я все не могу разобраться, как настроить саму форму обратной связи,то есть когда на кнопку нажимаешь- структурировать строчки заполнения обратной связи???

    1. Здравствуйте. Наверно вы про этот виджет https://blog.web5x.ru/formi-widget-elementor-pro/
      Вот там у каждого элемента (поля формы) втч и конпки отправить, есть свойство «Ширина колонки». Вот это свойство и поможет вам структурировать поля и кнопки обратной связи. Укажите например 50% для поля и 50% для кнопки. В итоге будет на одной строке и поле и кнопка.

  2. Здравствуйте. Нужна помощь. Вставляю ссылку в кнопку. Она перестает работать.
    А вручную не знаю в каком файле искать эту запись.

    1. Здравствуйте. Поясните, как это перестает работать? На вновь созданной странице пробовали виджет? Элементор обновленный? Тема по умолчанию? Никаких варезных модулей и шаблонов не установлено?

  3. Здравствуйте. Задал нужный мне размер кнопки (в elementor показывает нужный мне размер), но когда захожу на сайт кнопка уменьшается. Можно ли как-то задать точный размер?

    1. Здравствуйте. Настройками точный размер указать можно в пользовательских css (вкладка виджета Расширенные, при условии версии ПРО)
      Написав такой код
      selector .elementor-button { width: 300px; }
      получите фиксированную ширину.

      А вообще странно. Лучше глянуть на сайт, чтобы понять кто виноват. Возможно тема у вас какая то хитрая, что переписывает стили элементора. Или возможно вы не обновили кеш браузера и вы видите просто старые данные. Попробуйте нажать CTRL+F5 при просмотре сайта.

  4. Подскажите, а можно из этой кнопки как-то сделать кликабельный номер телефона?

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

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