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

Elementor действительно не предлагает каких-либо виджетов или функций для добавления сравнения изображений, но вы можете получить их с помощью надстройки. Есть дополнительные модули Elementor которые предлагают виджет для добавления сравнения изображений. Три из которых:  Основные дополненияСчастливые аддоныи JetElements

В этой статье мы покажем вам, как добавить сравнение изображений в Elementor с помощью ДжетЭлементс.

JetElements сам по себе является надстройкой премиум-класса для Elementor, разработанной Crocoblock. Он является частью семейства JetPlugins. Надстройка поставляется с виджетом под названием Сравнение изображений который вы можете использовать для добавления сравнения изображений на страницу Elementor.

Как добавить сравнение изображений в Elementor

Прежде чем начать, убедитесь, что у вас установлено и активировано дополнение JetElements. Если вы новичок в Elementor, вы можете прочитать нашу предыдущую статью, чтобы узнать как использовать Elementor.

Мы будем напрямую добавлять виджет Сравнение изображений в этой статье.

Прежде чем начать, вы можете подготовить два изображения для сравнения. Например, вы можете подготовить изображение до и изображение после. Когда будете готовы, просто перетащите виджет Сравнение изображений в поле редактирования Elementor.

добавить сравнение изображений в Elementor

По умолчанию виджет JetElements Image Compare создает два сравнения изображений. Если вам просто нужно создать сравнение изображений (два изображения для сравнения), вы можете удалить одно из существующих сравнений изображений.

Читайте также: Elementor: как добавить анимацию Лотти

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

добавить сравнение изображений в Elementor

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

добавить сравнение изображений в Elementor
#image_title

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

  • общий

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

добавить сравнение изображений в Elementor
  • этикетка

Вы можете открыть этот блок для меток сравнения стилей (метка «до» и «после»). Вы можете установить такие параметры, как выравнивание по горизонтали, выравнивание по вертикали, цвет текста, цвет фона, типографику (семейство шрифтов, стиль шрифта, размер шрифта) и т. д.

добавить сравнение изображений в Elementor
  • Обрабатывание

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

Если вы добавите более одного сравнения изображений, вы также можете открыть блоки Карусельные стрелки et Карусельные точки для стилизации стрелок и точек навигации.

Вот и все. Вы можете нажать кнопку ОПУБЛИКОВАТЬ / ОБНОВИТЬ для публиковать /редактируйте свою страницу после того, как закончите ее редактирование.

Получить Elementor Pro сейчас !!!

Заключение

Здесь ! В этой статье рассказывается, как добавить сравнение изображений в Elementor. Если у вас есть какие-либо опасения по поводу того, как туда добраться, сообщите нам об этом в течение Комментарии.

Тем не менее, вы также можете проконсультироваться наши ресурсы, если вам нужно больше элементов для реализации ваших проектов создания интернет-сайтов, обратитесь к нашему руководству по Создание блога на WordPress или Divi: лучшая тема WordPress всех времен.

Но тем временем поделитесь этой статьей в разных социальных сетях.

...