Простая галерея изображений с помощью GenerateBlocks

 
Простая галерея изображений с помощью GenerateBlocks

GenerateBlocks 1.7 и GenerateBlocks Pro 1.5 вошли в первый релиз-кандидат и скоро будут доступны для использования на производственных площадках.

С этим важным обновлением плагин, который родился с четырьмя простыми блоками, теперь имеет восемь с добавлением, среди прочего, блока вкладок и блока аккордеона.

Но это обновление намного больше, оно расширяет возможности для создания большего и лучшего. С 220 изменениями файлов и более 10 000 строк обновленного кода, редактор GenerateBlocks стал более оптимизированным, более модульным и, в конечном счете, намного лучше работает. Добавляется больше функций, быстрее и с меньшим количеством кода.

Такова философия его создателя, Тома Усборна:

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

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

И если у Вас есть сомнения в отзывчивости новых блоков GB, The Admin Bar провел сравнение производительности с теми же блоками Kadence, и блоки GB все еще легче. В конце сравнения есть забавная маленькая деталь о весе и преувеличенном количестве запросов, которые добавляются с помощью простого заголовка Elementor.

К работе

С помощью нового блока вкладок Вы можете создать очень красивую и легкую простую галерею изображений, как показывает Майк Оливер, и поскольку я тестировал версию RC, я воспользовался возможностью создать тестовую галерею и оставить здесь заметки о процессе.

1 - Откройте редактор и добавьте блок Tabs.

2 - Выберите нужный Вам шаблон вкладки.

Galeria simple con GenerateBlocks tutorial paso 1

3 - Добавьте необходимое Вам количество вкладок, нажав на +

Galeria simple con GenerateBlocks tutorial pasos 2 y 3

4 - Прокрутите вкладки вниз или вверх в зависимости от того, где Вы хотите показать миниатюры, для этого выберите "Tab Items" и нажмите на стрелку прокрутки.

Galeria simple con GenerateBlocks tutorial paso 4

5 - Выбрав вкладку Tabs, переходим к конфигурации блока с правой стороны и в TAB BUTTON TYPE меняем "Button" на "Container", поскольку мы не можем добавлять изображения внутри кнопок. После этого мы увидим, как кнопки меняют свой значок на значок контейнера.

Galeria simple con GenerateBlocks tutorial paso 5

6 - Удалите стили и тексты с вкладок.

Galeria simple con GenerateBlocks tutorial paso 6

7 - Наконец, мы добавляем изображения как в контейнеры вкладок, так и в соответствующие им поля содержимого.

Galeria simple con GenerateBlocks tutorial paso 7

Хотя у Вас есть тонкие настройки для настольного компьютера, планшета и мобильного телефона, ничего не трогая, эта галерея выглядит идеально в мобильной версии.

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

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

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

YouTube видео

Некоторые ссылки в этом сообщении являются партнерскими ссылками

Подписка по электронной почте

Получайте бесплатные полные статьи без рекламы в свой почтовый ящик сразу после их публикации. Полное содержание ленты отправляется без рекламы через внешний сервис.