Нужно узнать, как добавить изображение в текст в Elementor ?
Elementor дала возможность каждому стать веб-дизайнером без необходимости владения передовыми навыками CSS. Его визуальный редактор позволяет создать красивую веб-страницу, не написав ни единой строчки кода CSS. Вы можете просто добавить любые элементы дизайна (виджеты), которые захотите, и настроить их на панели настроек.
Тем не менее, наличие некоторых навыков CSS было бы отличным бонусом при использованииElementor. Вы сможете применить уникальные стили к своей веб-странице, используя функцию Пользовательские CSS D 'Elementor. В этой статье мы покажем вам, как добавить изображение в текст в Elementor, используя специальную функцию CSS Elementor.
В некоторых инструменты таких проектов, как GIMP и Photoshop, вам обычно нужно добавить маркер слоя, чтобы добавить изображение в текст. В Elementor вы можете сделать то же самое, добавив код CSS, в котором виджет Elementor Title и текстовый виджет не имеют возможности настройки для добавления изображения в качестве фона.
Добавить изображение к тексту Elementor
Прежде чем начать, убедитесь, что вы обновили свою версию Elementor до версии Pro, если вы этого не сделали, поскольку настраиваемые функции CSS доступны только в Elementor Pro. Когда вы будете готовы, создайте новую страницу или шаблон и отредактируйте его с помощью Elementor. Конечно, вы также можете редактировать существующую страницу или шаблон.
Смотрите также: Elementor: Как добавить оглавление
Добавьте виджет Заголовок в поле редактирования.
Перейдите на панель настроек, чтобы заменить текст по умолчанию под вкладкой Содержание.
Также прочитайте наше руководство по: Elementor: Как использовать палитру цветов
Перейти на вкладку Стиль чтобы персонализировать текст. Вы можете установить размер текста, стиль шрифта и т. Д., Щелкнув значок карандаша в Вариант типографики под блоком Заголовок. Поскольку вы хотите использовать изображение в качестве фона для текста, нет необходимости устанавливать цвет текста.
Затем перейдите на вкладку Передовой и откройте блок На заказ CSS и вставьте следующий код CSS. Замените URL-адрес изображения на свой собственный URL-адрес изображения.
selector .elementor-heading-title
{
background: url("https://www.wppagebuilders.com/wp-content/uploads/2020/05/gradient-progress-bar-elementor.jpg") green repeat 30% 70% ;
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
}
Вот пример.
Получите Elementor Pro прямо сейчас!
Заключение
Вот! Вот и все, что касается этой статьи, в которой показано, как добавить изображение к тексту в Elementor.. Если у вас есть вопросы о том, как туда добраться fдайте нам знать в Комментарии.
Тем не менее, вы также можете проконсультироваться наши ресурсы, если вам нужно больше элементов для реализации ваших проектов создания интернет-сайтов, обратитесь к нашему руководству по Создание блога на WordPress или Divi: лучшая тема WordPress всех времен.
Но тем временем поделитесь этой статьей в разных социальных сетях.
...