Здравствуйте, уважаемые пользователи!
Все мы знаем, что галерея изображений является неотъемлемой спутницей практически любого лендинга. Наглядная интерактивная демонстрация товара или услуги почти всегда предпочтительней бесконечных строк текста. Преимущества визуального восприятия информации настолько очевидны, что мы не будем углубляться в подробности этой темы и сразу перейдем к событию, которому и посвящена статья.
Сегодня мы представляем вам обновление платформы LPgenerator, которое все так долго ждали. Встречайте — новый виджет визуального редактора целевых страниц «Галерея изображений»!
Галерея предоставляет следующие возможности:
- составные слайды (несколько изображений в одном слайде);
- увеличение изображения по клику;
- автопрокрутка;
- кастомизация стиля (задание размеров, отступов, границ, стрелок переключения слайдов и т. д.).
Пример галереи вы можете посмотреть здесь.
Для того, чтобы разместить на вашем лендинге галерею, нажмите на ее значок на панели виджетов слева в редакторе страницы.
Откроется окно настроек будущей галереи, в которой вы можете указать различные опции на свой вкус.
Вкладка виджета «Разметка»
1. Количество картинок. Укажите количество изображений, одновременно находящихся на одном слайде.
2. Ширина и высота картинки. Укажите размеры изображений.
3. Отступ между картинками и Отступ межу стрелкой и картинкой. Укажите соответствующие отступы между элементами галереи.
Размеры картинки и отступы можно задать с помощью бегунков или введя конкретные значения в соответствующие поля.
4. Изображение. Выберите сами изображения. Щелкните по полю для открытия окна выбора изображения.
5. Приближение. Щелкните по строке «Приближение» для открытия окна выбора изображения, которое будет появляться при щелчке по картинке.
6. Добавление/удаление слайдов. Щелкните по кнопке «+» для добавления слайда, по кнопке «‒» для удаления.
7. Переключатель слайдов. Переключает слайды в соответствии с их номерами.
Вкладка виджета «Стили»
1. Цвет фона. Щелкните по полю для вывода окна выбора цвета фона.
2. Стрелка назад/вперед. Щелкните по строке «Выбрать из галереи» для выбора соответствующих изображений стрелок.
3. Граница картинки и ее округление. Задайте размер границы и ее округление. Значения можно задать с помощью бегунков или введя конкретные значения в соответствующие поля.
4. Стиль границы. Укажите стиль границы (сплошная, пунктирная, точечная) и ее цвет.
После внесения всех необходимых изменений нажмите кнопку «Сохранить». Галерея появится на странице.
Также функционал галереи включает параметр «Автопрокрутка», отвечающий за автоматическое пролистывание слайдов через определенный промежуток времени. Задать его можно в свойствах галереи в правой панели редактора. Время указывается в секундах.
На этом настройка галереи закончена. По всем вопросам пишите на support@lpgenerator.ru, будем рады помочь.
а как сделать автопрокрутку на слайде ?
Здравствуйте, Талгат!
За включение автоматической прокрутки отвечает параметр в настройках галереи, в правой части редактора страницы - он отмечен на скриншоте:
http://prntscr.com/3hln85
Введите желаемый интервал пролистывания слайдов и сохраните страницу.
По всем вопросам, связанным с работой сервиса, обращайтесь в службу поддержки: support@lpgenerator.ru
Максим, я имел ввиду авто прокрутку слайда отзывов. как сделать ? Спасибо )
Виджет "слайдер отзывов" не предусматривает автоматическую прокрутку в текущей реализации.
Вы можете воспользоваться инструкцией по созданию слайдера отзывов, доступной по этой ссылке:
http://lpgenerator.ru/blog/2013/11/26/kak-sdelat-slajder-otzyvov-na-celevoj-stranice/
Этот скриптовый слайдер можно немного изменить и активировать автопрокрутку слайдов - по Вашему обращению в службу поддержки мы подскажем, как это сделать.
как сделать чтобы слайды прокручивались по кругу а не после последнего слайда возвращались к первому...?
возможно ли увеличивать картинки с слайдера при нажатии не нее?
Здравствуйте, Иван!
Виджет слайдера поддерживает прокрутку только в таком режиме, с возвратом к первому слайду. Если необходимо иное поведение - лучше использовать слайдер, созданный при помощи скрипта, описанный в статье по ссылке:
http://lpgenerator.ru/blog/2013/02/26/kak-sdelat-slajder-slajd-shou-galereyu-na-celevyh-stranicah/
Виджет "галерея" можно настроить для увеличения слайдов при нажатии на изображение. Для этого под каждым слайдом есть ссылка "Приближение" - нажав на эту ссылку вы сможете выбрать увеличенное изображение, которое будет появляться при нажатии на слайд.
Здравствуйте. Скажите, как увеличить высоту картинки, ее размер, чтобы было больше 200?
Здравствуйте! Просто введите необходимое значение в соответствующее поле.
Пожалуйста добавьте возможность подписи картинок в галерее в режиме увеличения картинки.
Здравствуйте, Филипп!
Спасибо за предложение, обдумаем возможность такой реализации.
Как вариант, можно использовать галерею, созданную через скрипты - в таком случае будет больше инструментов по управлению параметрами и подписями.
Добрый день.
А как сделать фон изображения(стандартный фон картинки - белый) такого же цвета, что и фон страницы?
Или точнее сказать - как убрать фон у своего изображения? (как в пеинте)
Здравствуйте, Дмитрий!
Не вполне ясен вопрос. Вы хотите сделать прозрачным фон вашего изображения? Тогда вам нужно использовать изображение формата PNG с прозрачностью, а редактировать его в графическом редакторе(Paint.NET, Photoshop) - и в готовом виде загружать в редактор страниц.
Иначе говоря, фон изображения изначально должен быть прозрачным, сделать его прозрачным средствами редактора страниц не представляется возможным.
Если же речь о чём-то другом - уточните вашу мысль, пожалуйста.
Здравствуйте.
Я добавляю картинку с белым фоном. А я хочу чтобы цветы её фона был одинаковым с фоном страницы. Чтобы она не была бельмом.
Дмитрий, тогда вам следует обработать ваше изображение в графическом редакторе, чтобы белый цвет сделать прозрачным. Или разместите это изображение поверх белого блока-подложки, тогда белый фон вашего изображения не будет заметен. Наш редактор предназначен для редактирования лендингов, с обработкой изображений лучше справятся специализированные инструменты.
Почему слайд такой маленький,я вкладываю большое изображение но они маленькие!
Здравствуйте, Райымбек!
Укажите вручную размеры для слайдов - по умолчанию они маленькие, но если воспользоваться ползунком высоты и ширины - их можно сделать больше, а при желании, можно указать размеры вручную.
Ориентируйтесь на скриншот: http://media.lpgenerator.ru/uploads/2014/04/28/image00.jpg - значения высоты и ширины можно указывать напрямую, цифрами, главное - не превышать разумных пределов, например, не выше 600 пикселей и не шире 900 пикселей на изображение.
а подскажите, можно ли реализовать такое, при нажатии на картинку был переход на другой сайт? либо указывать в подписях свои комментарии или ссылки на этот сайт (в моем случае это портфолио созданных сайтов, и хотелось бы что бы человек переходил на созданный сайт при нажатии на картинку)
Здравствуйте, Никита!
Для любого изображения можно задать ссылку, которая будет срабатывать при нажатии на это изображение - просто задайте адрес в поле URL в блоке свойств изображения.
Ориентируйтесь на скриншот: http://take.ms/jjM6X
Если это не решает задачу - пишите нам на support@lpgenerator.ru - обязательно найдём варианты.
Здравствуйте.Можно ли разместить картинки в ряды?Чтобы было несколько рядов в каждом по несколько картинок?
Здравствуйте, Роман!
К сожалению, разместить изображения в несколько рядов в рамках одного виджета не получится, однако Вы всегда можете добавить на страницу несколько виджетов "Галерея" и расположить один виджет под другим.
Здравствуйте! как увеличить максимальное количество картинок в виджете? по умолчанию 10 картинок.
Здравствуйте, Иван!
Виджет "галерея" рассчитан на 10 изображений - это обусловлено тем, что бОльшее количество изображений обычно излишне и негативно сказывается на скорости загрузки страницы.
Вариантов решения два:
1 - использовать несколько виджетов "галерея" - в каждом размещая по 10 изображений.
2 - использовать скриптовое решение для галереи, например, описанное в руководстве по ссылке:
https://lpgenerator.ru/blog/2013/07/23/galereya-s-uvelicheniem-po-kliku-s-prolistyvaniem-slajderom-vozmozhnost-dobavleniya-dvuh-i-bolee-galerej-na-celevoj-stranice/
Либо, если ни один из этих вариантов не подходит, пишите нам в службу поддержки support@lpgenerator.ru - найдём варианты!
Здравствуйте! Как можно убрать стрелки "влево" и "вправо" ?
Здравствуйте, Николай!
Стрелки галереи появляются автоматически, если вы указываете более одного слайда, чтобы посетитель мог понять, что в галерее есть еще фото. Вы можете указывать только один слайд, до 5 фото в нем: http://awesomescreenshot.com/0274p76ree
Также вы можете самостоятельно указать для отображения стрелок изображение, в том числе прозрачное: http://awesomescreenshot.com/01e4p75i14
В этом случае, стрелки просто не будут видны.
Здравствуйте!
У меня в галерее картинки разной высоты и ширины. При этом мне хотелось бы, чтобы расстояние зрительно было между ними одинаковое. А выставляя значение на ползунке "Отступ между картинками", этого добиться не могу.
Здравствуйте!
Отступ, который выставляется в настройках галереи устанавливает равное расстояние между изображениями. Значение можно задать ползунком или прописать вручную - http://prntscr.com/7h4few
Если равное расстояние не получилось установить, напишите нам по адресу support@lpgenerator.ru Посмотрим в чем может быть проблема.
Пожалуйста добавьте возможность подписи картинок в галерее в режиме увеличения картинки
Здравствуйте, Богдан!
Спасибо за предложение, подумаем, как это можно реализовать. Пока же, если подписи к слайдам нужны - обратитесь в нашу службу поддержки по почте support@lpgenerator.ru - попробуем предложить варианты решения, например, через скрипт.
Здравствуйте, Роман!
Сделать стрелки прозрачными можно в любом фоторедакторе, либо можно найти в интернете любое прозрачное изображение маленького размера (10-20 пикселей) и указать его в качестве своей картинки для стрелок:
https://i.imgur.com/ZXEhYjg.png - на скриншоте вы можете увидеть, где это настраивается.