Возвращайте до 18% с пополнений рекламы
  • Все популярные рекламные сети в одном окне
  • Рекламные инструменты — бесплатно
  • Доступ к конструктору лендингов и WebApp-приложений
  • Закрывающие документы точно в срок
ring svg
  1. Главная >
  2. Блог >
  3. Туториалы LPgenerator >
  4. Галерея с увеличением по клику с “пролистыванием” (слайдером). Возможность добавления двух и более галерей на целевой странице

Галерея с увеличением по клику с “пролистыванием” (слайдером). Возможность добавления двух и более галерей на целевой странице

Галерея

Источник изображения

Здравствуйте, уважаемые пользователи LPgenerator!

Обратите внимание: сейчас в нашем редакторе есть готовый виджет, позволяющий создавать слайдеры на лендингах без скриптов. Рекомендуем использовать именно его: Виджет "Галерея" — слайдер изображений с увеличением

Нельзя забывать о важности влияния визуальных образов на посетителя вашего лендинга — понятно, что есть люди, предпочитающие читать текстовые описания вашего оффера. Но таких всегда было, есть и будет исчезающее меньшинство – большинство же предпочтет посмотреть картинки (к тому же, на каждом слайдере можно разместить ровно одну строчку описания функции, опции или ценностного предложения). Для представления одного оффера слайд-шоу, показанное через слайдер, выглядит вполне убедительным методом воздействия на целевую аудиторию.

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

Шаг первый

1. Копируем код, размещенный здесь.

2. Вставляем его через инструмент “Скрипты” в основном меню редактора:

скрипты

задав положение “После тега <BODY>”:

скрипты

3. Сохраняем изменения:

сохранить

Шаг второй

1. Копируем код, размещенный здесь.

2. Вставляем его с помощью инструмента “Произвольный HTML”:

html

3. Редактируем ссылки на увеличенные изображения и миниатюры и названия изображений (“Заголовок”):

заголовок

Изображения вы можете разместить у себя на хостинге, в облачном хранилище или загрузить через редактор в хранилище медиа-файлов LPgenerator через инструмент “Изображение”.

Настоятельно рекомендуем загружать изображения нужного размера!

4. Сохраняем изменения.

Примечания

1. Если изображение в галерее будет единственным, то атрибут rel=”gallery1” следует удалить.

2. Заголовок будет отображаться под всплывающим окном. Если он не не требуется, удалите из кода атрибут title=”Заголовок”.

3. Если требуется разместить 2 и более галерей на одной странице, то для них используйте “gallery2”, “gallery3” и т. д.:

в исходном коде замените значение атрибута rel="gallery1"на rel="gallery2" и т. д., в зависимости от числа создаваемых галерей.

Шаг третий

1. Копируем код, размещенный здесь.

2. Вставляем его через инструмент “Скрипты” в основном меню редактора:

скрипты

задав положение “Перед тегом </BODY>”:

Скрипт

3. Сохраняем изменения:

сохранить

Вот и все! Красивая галерея с “пролистыванием” (“слайдером”) и увеличением из миниатюры по клику готова. Посмотреть галерею в действии можно на странице.

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

Желательно подбирать одинаковые по размеру картинки как для миниатюр так и увеличенных просмотров.

Приятной работы!

С уважением,
служба технической поддержки LPgenerator  

blog comments powered by Disqus
Возвращайте до 18% с пополнений рекламы
  • Все популярные рекламные сети в одном окне
  • Рекламные инструменты — бесплатно
  • Доступ к конструктору лендингов и WebApp-приложений
  • Закрывающие документы точно в срок
ring svg
copyright © 2011–2024 Все права защищены
Запрещено любое копирование материалов ресурса без письменного согласия владельца — ООО "Феникс-Маркетинг". ИНН:7725812838, КПП:772501001, ОГРН: 513774619323915280, Москва, ул. Ленинская слобода, д. 19, стр. 1, этаж/пом 3/25

ООО «Феникс-Маркетинг» — IT-компания с многолетним опытом работы, разрабатывающая инновационные решения для управления процессом лидогенерации (пост-клик маркетинг). Разработанное нами технологическое программное решение LPGENERATOR позволяет создавать целевые страницы в визуальном редакторе и управлять заявками (лидами) в CRM-системе в целях проведения эффективных, высококонверсионных рекламных кампаний