Перейти до основного вмісту
9 хвилин читання (1858 слів)

Додавайте та редагуйте галереї зображень як професіонал у Elementor

Додавайте та редагуйте-галереї-зображень-like-a-pro-in-Elementor

 Хоча використання Elementor дуже допомагає під час створення сторінки чи публікації, правда також, що нам може знадобитися більше інструментів, щоб забезпечити ідеальну роботу, одним із цих інструментів, про який важливо згадати, є менеджер галереї, який може дозволити нам покращити вже потужний конструктор сторінок, давайте подивимося, як легко додавати та редагувати галереї за допомогою WP Media folder безпосередньо в Elementor.

Завдяки чудовим інструментам, таким як менеджер галереї та інтеграції з усіма основними Page Builders, WP Media Folder дозволяє нам створювати справді чудові галереї, а також замовляти нашу медіа-бібліотеку всього за кілька кліків!

У цьому підручнику ми створимо галерею з нуля за допомогою менеджера галереї та безпосередньо з Elementor.


Створіть галерею WordPress за допомогою WP Media Folder

Перш за все, ми побачимо, як легко створити галерею за допомогою WP Media Folder Gallery Addon.

Цей менеджер галереї можна знайти після інсталяції WP Media Folder і галереї Addon у розділі Media Library > Media Folder Galleries



На цьому екрані нам потрібно навести курсор на + Додати нову галерею та натиснути + Створити нову медіа-галерею .



Це відкриє модальне вікно, де ми можемо ввести назву галереї та вибрати тему.

Наразі ми назвемо її «Моя галерея» та залишимо тему за умовчанням.



Це приведе нас до інформаційної панелі створення галереї з багатьма параметрами налаштування та створення нашої галереї, спочатку ми додамо зображення до нашої галереї.

Ми помітимо багато варіантів додавання мультимедійних файлів до галереї, основні з яких додають їх із бібліотеки медіафайлів або завантажують безпосередньо з нашого
Провідника файлів на ПК , давайте розглянемо обидва.

Перш за все, у нас є медіа-бібліотеки , яка є піктограмою WordPress, натисніть на неї.



Натиснувши тут, ви відкриєте медіа-бібліотеку, ви помітите, що в моїй медіа-бібліотеці є папки, це завдяки WP Media Folder , яка дозволяє мені впорядкувати всі мої медіа-файли найкращим чином за допомогою медіа-папок і фільтрів, ви можете побачити більше про це тут , але це для іншої публікації ;)

Тепер, щоб додати зображення, все, що нам потрібно зробити тут, це перейти до папки медіафайлів, куди ми додали зображення, які ми хочемо додати, і вибрати зображення за допомогою ctrl + клацніть, щоб вибрати їх, і, нарешті, натиснути « Імпортувати зображення .



Це додасть усі вибрані зображення до менеджера галереї, що дозволить нам використовувати їх і коригувати.

Тепер давайте розглянемо можливість завантажувати зображення безпосередньо з нашого Провідника файлів , для цього натисніть значок папки.



Після цього ваш файловий провідник миттєво відкриється, щоб ви могли переміщатися в папках і вибирати зображення, які ви хочете додати до галереї.

Виберіть зображення, які ви хочете завантажити, а потім натисніть « Відкрити» .


Зробивши це, ми маємо закінчити! Тепер усі зображення в менеджері галереї готові до використання в галереї.



Тепер, коли ми маємо всі зображення, давайте перевіримо налаштування галереї, для цього клацніть другу вкладку Налаштування дисплея та короткий код .



У першому випадку ми бачимо, що у нас є 8 галерей, кожна з яких має власні налаштування.



Давайте подивимося на Masonry , це класична стіна з багатьма зображеннями різних розмірів, як ми можемо бачити на вкладці « Попередній перегляд ».



У налаштуваннях ми можемо вибрати між усіма параметрами, наприклад, розмір зображення та макет masonry , давайте відредагуємо його з поточної вертикалі на горизонтальну та зменшимо зображення.



Зараз перевіряємо вкладку « Попередній перегляд », щоб перевірити, як це виглядає зараз.


Як ви бачите, це дійсно хороший інструмент із чудовими функціями, оскільки він дозволяє нам вносити зміни та перевіряти, як це виглядає, кількома клацаннями миші та за кілька секунд! Створити галерею раніше було не так просто!


Додавання галерей WordPress у Elementor

Тепер, коли ми побачили, як створити галерею за допомогою WP Media Folder Gallery Manager, давайте подивимося, як додати її до нашої публікації чи сторінки за допомогою Elementor .

Щоб зробити це, перейдіть на свою сторінку чи публікацію (або створіть її) і натисніть Редагувати за допомогою Elementor », завантажиться Конструктор сторінок.



У редакторі знайдіть WP Media Folder Addon Gallery та додайте його до свого вмісту.



Завантажиться блок, який сповістить нас про те, що додано блок медіа-галереї.


На лівій вкладці ми зможемо вибрати потрібну галерею, а також налаштувати її.

Перш за все, давайте виберемо галерею, яку ми створили в розділі Вибрати галерею .



Галерея, яку ми створили раніше, автоматично завантажиться на конструкторі сторінок під блоками.



Це показує тему Masonry , яку ми вибрали в менеджері галереї, давайте перевіримо всі параметри, доступні в темах, які можна вибрати безпосередньо з налаштувань блоку.

Masonry

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



За замовчуванням

Ця тема дозволяє показувати зображення класичним способом із заголовком зображення.



Портфоліо

Це дозволяє нам показувати наші зображення, схожі на тему за замовчуванням, але використовуючи інший шрифт, ідеальний для відображення мистецтва.



Повзунок

Класичний повзунок, який дозволяє нам фокусувати кілька зображень на слайді.



Слайд потоку

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



Квадратна сітка

Класична галерея з квадратними зображеннями, яка показує назву зображення при наведенні на нього курсора.



Матеріал

Дійсно чудова тема, яка дозволяє нам показувати квадратні зображення з гарною тінню та заголовками.



Спеціальна сітка

Тема сітки, яка дозволяє нам змінювати розміри зображень, щоб вони виглядали так, як ми хочемо, є найкращим варіантом, коли ми хочемо створити галерею з нашими власними розмірами/розмірами зображень. Давайте швидко подивимося, як це працює в менеджері галереї.



Тепер давайте переглянемо доступні параметри в меню ліворуч для всіх галерей.



По-перше, у нас є навігація галереєю , увімкнення цієї опції дозволить використовувати навігаційні галереї, доступні в WP Media Folder , який також дозволяє нам використовувати батьківські галереї та підгалереї , ви можете переглянути робочу демонстрацію тут



Як другий варіант у нас є Display Image Tag , корисний, коли ми маємо багато зображень у галереї та хочемо дозволити нашим користувачам фільтрувати їх у інтерфейсі за допомогою системи тегів із WP Media Folder .



Потім у нас є селектор тем, який дозволяє нам вибирати між доступними темами (які ми вже показували раніше), а також показуватиме конкретні параметри залежно від вибраної теми, як-от макет і, наприклад, тривалість переходу повзунка.

Ми можемо продовжувати перевірку, і ми знайдемо Вибрати галерею» , яка дозволить нам вибирати між усіма галереями, які ми створили в менеджері медіа-галереї.

Розмір зображення , цей параметр дозволяє нам вибирати між усіма доступними розмірами зображень, дозволяючи нам налаштовувати зображення так, щоб вони виглядали та ідеально відповідали нашому вмісту.



Параметр « Розмір лайтбокса » дозволить нам, як і розмір зображення, вибрати розмір лайтбокса, який відображатиметься, якщо ми виберемо його як дію після клацання.

У нас також буде дія при натисканні , яка дозволить нам вибирати між показом лайтбокса, який є збільшеною версією зображення, переходом на іншу сторінку або просто нічого не робити під час натискання зображення.

І остання опція – це налаштування замовлення, де ми зможемо побачити та вибрати, як ми хочемо показувати наші зображення в галереї.

Звичайно, окрім цього, ми матимемо налаштування для додавання поля між зображеннями, зміни кольору наведення, додавання рамки та тіні.

Як бачите, використовувати Elementor дуже просто, щоб точно налаштувати наші галереї WP Media Folder і зробити їх відповідними нашій сторінці!


Створюйте швидкі галереї за допомогою медіа-папок

Як додаткову тему ми покажемо, як за кілька секунд створювати галереї за допомогою папок, створених WP Media Folder .

Ця функція також дозволить нам автоматично додавати зображення до галереї, коли вони додаються до папки.

Перш за все, перейдіть до галереї медіа-папки в  медіа-бібліотеці , де ми створили галерею раніше, на цій сторінці наведіть вказівник миші на кнопку + Додати нову галерею , а потім натисніть Створити галерею з папки» .


Буде відображено провідник папок, де ми зможемо вибрати папку, яку будемо використовувати.



Після натискання Створити » зображення в папці автоматично завантажуватимуться в галерею, що дозволить нам створити галерею всього за кілька секунд!

Ми також зможемо автоматично додавати зображення, коли їх буде додано до медіа-бібліотеки в тій же папці, яку ми щойно вибрали, що заощадить нам час на перехід до менеджера галереї та додавання зображення вручну.

Щоб скористатися цією опцією, автоматичне додавання зображення в папку , доступне вгорі праворуч під Зберегти ».



І магія зроблена! Папки, які також є зображеннями, що автоматично відображаються у інтерфейсі, що ще нам потрібно? :)  


Почніть використовувати WP Media Folder зі своїм улюбленим конструктором

У нас також є відео, яке пояснює все крок за кроком, щоб ви могли побачити, як плагін працює в реальному часі, перевірте це!



Плагін із чудовими функціями, який дозволить нам не лише створювати галереї, а й упорядковувати наші медіафайли, імпортувати з Google Photos і також розвантажувати їх!

Сумісність із усіма основними розробниками дозволить нам організувати та показувати наші медіа найпрофесійнішим способом лише за кілька кроків, тож чого ви чекаєте? Ідіть сюди та отримайте зараз!

3
Будьте в курсі

Коли ви підпишетеся на блог, ми надішлемо вам електронний лист, коли на сайті з’являться нові оновлення, щоб ви їх не пропустили.

Схожі повідомлення

 

Коментарі

Коментарів поки немає. Будьте першим, хто надіслав коментар
Вже зареєстровані? Увійдіть тут
П'ятниця, 26 квітня 2024 р

Captcha Image