Web5X Блог

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

Web5X Блог

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

Поиск по блогу

Анимированный заголовок- виджет Elementor Pro

Обновлено: 19.02.2018
0 комментариев
заставка - виджет анимированный заголовок - конструктор сайта

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

Каким может быть анимированный заголовок? Может быть разным,  во первых мы можем выбрать как нам анимировать выделенную часть, например мы может выбрать подчеркивание (или выделение), а можем выбрать анимацию текста.  Далее, если мы выбрали стиль "Выделенный" мы можем выделить текст не только окружностью как, но и волной, подчеркиванием, зигзагом и даже перечернуть текст. А выбрав анимацию (стиль Вращающийся) мы сможем задать анимацию текста, например эмитировать посимвольный набор текста или появление текста.  В итоге получим интересный анимационный эффект.

виджет анимированный заголовок - конструктор сайта

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

Рассмотрим настройки свойства виджета.

Содержимое

- Заголовок

  • Стиль - стиль анимации (выделенный или вращающийся). Выделенный тип анимации позволяет выделить текст элементом окружности, подчеркиванием, зигзагом или перечернутой чертой. А вращающийся тип анимации, это тип позволяет выполнять анимационные действия непосредственно с текстом, т.е увеличить, уменьшать, эмитировать набор, переворачивать итд. Так же возможно для вращающего типа анимации задать несколько текстов вращения. Форма выделения или тип анимации можно задать ниже после выбора типа анимации (свойство Форма или Анимация)
  • Текст до - текст который мы видим до анимированного текста.
  • Выделенный текст - текст который будет выделятся анимацией при типе "Выделенный"
  • Вращающийся текст - текст который будет анимироваться по заданному эффекту анимации. Можно задать несколько разных текстов для анимации которые будут сменять себя последовательно друг за другом.
  • Текст после - текст который отображается после анимированного текста.
  • Выравнивание - выравнивание заголовка относительно ширины колонки (Лево Центр Право)
  • HTML-тег - тип html тега для заголовка.

 

Стиль (если выбран стиль Выделенный)

- Форма

  • Цвет - цвет формы выделения, например цвет окружности или линии.
  • Ширина - толщина линии формы выделения.
  • На передний план - опция позволяет перенести форму на передний план т.е поверх текста.
  • Закругленные края - опция включает закругления для концов линий формы выделения.

- Заголовок

  • Цвет текста - цвет не анимированного текста т.е текст который до и после анимации.
  • Типографика - цвет, размер, жирность и стиль для текста не анимированного.

Анимированный текст

  • Цвет текста - цвет анимированного текста или текста под анимацией.
  • Типографика - цвет, жирность и стиль для текста анимированного (размер текста общий с не анимированным текстом)

 

Стиль (если выбран стиль Вращающийся)

- Заголовок

  • Цвет текста - цвет не анимированного текста т.е текст который до и после вращающегося текста.
  • Типографика - цвет, размер, жирность и стиль для текста который не вращается.

Анимированный текст

  • Цвет текста - цвет анимированного текста или текста под вращающейся анимацией.
  • Типографика - цвет, жирность и стиль для текста анимированного вращением (размер текста общий с не анимированным текстом)

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

Остались вопросы?
Листай ниже или клик по ссылке выше. Там можно задать вопрос или почитать комментарии других.
Написать комментарий

0 комментариев

Оставьте первый комментарий