Hot Lightbox - Плагин WordPress

Руководство по настройке Hot Lightbox для фотогалереи WordPress

Hot Lightbox полезен там, где на странице WordPress нужно показать серию изображений компактно: посетитель видит ряд миниатюр, нажимает на одну из них и просматривает крупные версии в затемнённом окне, не уходя со страницы. В этом руководстве разберём не рекламное описание, а практику: как подготовить изображения, где разместить виджет, какие параметры проверить после установки, почему могут не появляться миниатюры или стрелки навигации и когда лучше выбрать другой lightbox-плагин.

Главная особенность Hot Lightbox в том, что он рассчитан не на сборку сложной медиатеки внутри редактора блоков, а на показ изображений из выбранной папки на сервере. По официальной демо-странице HotThemes, плагин работает как виджет: вы указываете папку с изображениями, задаёте размеры и качество миниатюр, а он создаёт подпапку thumbs и выводит lightbox-просмотр. Это удобно для простых портфолио, галерей объектов, отчётов с мероприятий, страниц команды и небольших каталогов работ.

При этом продукт требует аккуратной подготовки. Если папка недоступна для записи, путь указан не так, тема перекрывает стили или на странице дважды подключается jQuery, lightbox может открывать изображение обычной ссылкой, не показывать кнопки управления или вообще не создать миниатюры. Поэтому руководство построено как рабочая карта: сначала проверяем условия, затем настраиваем виджет, после этого тестируем результат и только потом переносим галерею на важную страницу.

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

Где Hot Lightbox действительно решает задачу

Lightbox нужен не просто для красивого затемнения. Он помогает сохранить ритм страницы: миниатюры занимают мало места, а детальный просмотр доступен по клику. Для WordPress это особенно полезно на страницах, где текст и фотографии должны работать вместе: описание услуги, портфолио, фотоотчёт, страница объекта недвижимости, галерея ресторана, раздел с примерами работ или блок с изображениями внизу посадочной страницы.

Hot Lightbox лучше всего подходит для сценариев, где набор изображений уже лежит в одной папке и редко меняется. Администратор не собирает каждую галерею из отдельных блоков, а настраивает один виджет, указывает путь к папке и даёт плагину создать миниатюры. Такой подход прост, но накладывает дисциплину: имена файлов, права на папку, размеры оригиналов и место вывода виджета становятся важнее, чем в современных блоковых галереях.

Подходящие сценарии

На практике Hot Lightbox уместен в нескольких типовых задачах.

• Портфолио с одинаково подготовленными изображениями, где важен быстрый просмотр без перехода на отдельные страницы вложений.
• Страница мероприятия, объекта или услуги, где нужно показать 10-20 фотографий и не перегрузить текст длинной лентой.
• Сайт на теме HotThemes, где виджетные позиции уже предусмотрены макетом и плагин встроен в демо-структуру.
• Небольшая витрина работ, где контент-менеджер загружает изображения в одну папку и редко меняет порядок.
• Технический сайт, где важнее контролировать папку с файлами и миниатюрами, чем использовать визуальный конструктор галерей.

Когда стоит выбрать другое решение

Если на сайте нужны фильтры, альбомы, перетаскивание изображений в админ-панели, интеграция с редактором блоков, WooCommerce-галереи, видео, PDF или автоматическая обработка всех ссылок на медиафайлы, Hot Lightbox может оказаться слишком узким. Его сила в простом выводе изображений из папки, а не в построении современной медиасистемы.

Не стоит усложнять задачу ради одного эффекта. Если редактору удобнее работать с обычным блоком Gallery и выбирать изображения из медиатеки, проверьте, достаточно ли встроенного увеличения по клику или более современного lightbox-плагина из каталога WordPress.

Что проверить перед установкой и первым выводом

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

Папка с изображениями

Подготовьте отдельную папку для конкретной галереи. Не смешивайте в ней служебные файлы, временные изображения и картинки для других страниц. Чем чище папка, тем проще диагностировать проблему: если в галерее появляется лишний файл или миниатюра не создаётся, вы сразу видите источник.

Лучше использовать простые имена файлов латиницей: project-01.jpg, project-02.jpg, team-event-03.jpg. Это не обязательное правило WordPress, но оно снижает риск ошибок на хостингах, где пробелы, кириллица или спецсимволы в путях обрабатываются нестабильно.

Права доступа и запись миниатюр

Официальная демо-страница HotThemes прямо указывает, что папка с изображениями должна быть доступна для записи, потому что плагин создаёт миниатюры автоматически. В теме поддержки HotThemes также встречались ошибки mkdir() и opendir(), когда плагин не мог создать или прочитать нужную директорию. Для пользователя это выглядит как пустая галерея, предупреждение PHP или ряд битых миниатюр.

Практическая проверка: до вывода галереи убедитесь, что в папке можно создать подпапку thumbs, а сервер не отдаёт файлы скриптов и миниатюр с ошибкой доступа. Если на хостинге включены жёсткие ограничения, лучше уточнить права у администратора, а не ставить чрезмерно широкие разрешения.

Тема и место вывода

Hot Lightbox описан HotThemes как виджет. Поэтому сначала решите, где именно он должен появиться: в боковой колонке, в нижней области, в специальной позиции темы или внутри записи через отдельный механизм вывода виджетов. В демо HotThemes для темы One Page галерея вставлялась в запись через виджетную позицию и дополнительный механизм shortcode для виджетов. Это не значит, что такая же схема обязана быть на любом сайте, но показывает важный принцип: плагин не обязательно появляется как блок в редакторе.

Если ваша тема использует современный редактор виджетов, проверьте, виден ли Hot Lightbox в разделе Appearance - Widgets или в списке доступных устаревших виджетов. Если виджет не отображается, не пытайтесь вставлять произвольный код в запись: сначала убедитесь, что плагин активирован и совместим с текущей админ-панелью.

Установка и первичная проверка в WordPress

Установка зависит от того, как вы получили архив плагина: отдельно, вместе с темой HotThemes или в составе демо-пакета. Общий принцип для WordPress стандартный: загрузить ZIP-архив в разделе плагинов или перенести папку плагина на сервер, затем активировать его в админ-панели. В этом руководстве не рассматриваются покупка, лицензирование и получение архива - только безопасная настройка уже имеющегося файла.

Базовый порядок действий

1. Сделайте резервную копию сайта или хотя бы файлов темы и папки wp-content, если сайт рабочий.
2. Установите плагин через Plugins - Add New - Upload Plugin, если у вас ZIP-архив.
3. Активируйте плагин в разделе Plugins и проверьте, что WordPress не показывает ошибку совместимости или фатальную ошибку PHP.
4. Откройте Appearance - Widgets и найдите виджет Hot Lightbox.
5. Перетащите виджет в тестовую область, которая видна только на черновой или второстепенной странице, если тема позволяет так проверить вывод.
6. Укажите путь к подготовленной папке с изображениями, сохраните виджет и откройте страницу в режиме инкогнито.

На этом этапе не нужно сразу подгонять рамки и цвета. Сначала важнее увидеть три вещи: миниатюры появились, клик по миниатюре открывает крупное изображение в overlay-окне, навигация и закрытие работают без ошибок в консоли браузера.

Проверка после активации

Откройте страницу с галереей и выполните короткую проверку.

• Миниатюры отображаются в нужном месте и не разрывают макет страницы.
• Клик по миниатюре не переводит на прямой URL изображения, а открывает крупный просмотр поверх страницы.
• Кнопки закрытия, перехода к следующему и предыдущему изображению видны и кликабельны.
• После закрытия lightbox страница возвращается в прежнее состояние, без скачка прокрутки и зависшего затемнения.
• В консоли браузера нет ошибок загрузки файлов плагина, запрета доступа или конфликтов jQuery.

Не переходите к оформлению, пока эта проверка не пройдена. Визуальные настройки не исправляют неправильный путь, запрет на чтение скрипта или конфликт JavaScript.

Настройка виджета: папка, размеры, качество и рамки

Раздел настройки - центральная часть работы с Hot Lightbox. В отличие от плагинов, которые автоматически применяют lightbox ко всем изображениям в записи, здесь вы настраиваете конкретную галерею как виджет. Это даёт контроль, но требует понимать, на что влияет каждый параметр.

Путь к папке с изображениями

Путь должен указывать на папку, где лежат исходные изображения. В старых материалах HotThemes для аналогичных продуктов подчёркивается относительный путь к папке, а демо WordPress-плагина говорит о выборе директории с изображениями на сервере. На практике безопаснее не угадывать формат, а свериться с подсказкой в вашем виджете: одни установки ожидают путь от корня сайта, другие - путь внутри папки плагина или темы.

Если после сохранения виджета галерея пустая, не меняйте сразу все параметры. Проверьте путь по шагам: существует ли папка, видны ли изображения по прямому URL, может ли сервер читать эти файлы, создалась ли подпапка thumbs. Ошибка пути часто маскируется под проблему дизайна, хотя на самом деле плагин просто не видит исходные файлы.

Ширина и высота области галереи

В демо HotThemes приведён пример, где ширина области задана крупным числом, а высота подогнана под один ряд миниатюр. Для современного сайта лучше начинать осторожнее: если ваша тема адаптивная, проверьте, можно ли задать ширину так, чтобы галерея не выходила за контейнер. Если в вашей версии есть значение 100%, оно обычно безопаснее фиксированной ширины для широких и узких экранов.

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

Размеры миниатюр

Миниатюра - это не просто уменьшенная копия. Она задаёт ритм всей галереи. Для портфолио работ с горизонтальными изображениями удобны широкие миниатюры, для команды или карточек объектов - более близкие к квадрату. Если исходные изображения разного соотношения сторон, заранее решите, готовы ли вы к разной обрезке или лучше подготовить файлы одинакового размера до загрузки.

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

Качество миниатюр

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

Если сайт уже использует оптимизацию изображений, не включайте несколько агрессивных обработок подряд. Подготовьте исходники нормального размера, дайте Hot Lightbox создать миниатюры и после этого измерьте вес страницы. Оптимизация должна улучшать восприятие, а не превращать фотографии в шумные превью.

Рамка, отступы и фон

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

Проверяйте стили в контексте страницы. Одна и та же рамка может хорошо выглядеть на пустом демо, но спорить с кнопками, карточками или соседними блоками на рабочем сайте. Если тема уже задаёт стили для изображений, возможны конфликты: дополнительная тень, лишний border-radius, неподходящие отступы.

Миниатюры и папка thumbs: почему это важно для скорости

Hot Lightbox создаёт миниатюры автоматически и сохраняет их в подпапке thumbs. Это важная механика: страница не должна показывать огромные оригиналы, просто уменьшенные CSS-ом до маленького размера. Если так сделать, посетитель скачивает тяжёлые файлы ещё до открытия lightbox. Миниатюра должна быть отдельным небольшим изображением, а оригинал - открываться только по клику.

Как подготовить исходные изображения

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

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

Когда нужно пересоздать миниатюры

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

Признак проблемы простой: в настройках вы задали одни размеры, а на странице видите старые превью. Ещё один признак - миниатюры открываются, но выглядят не как свежие исходники. В таком случае проверьте дату файлов в thumbs, права на запись и наличие кеша.

Кеш и оптимизаторы изображений

Если на сайте стоит кеширование, минификация или оптимизация изображений, после изменения галереи очистите кеш страницы и кеш оптимизатора. Иначе вы можете смотреть на старые HTML, старые CSS или старые миниатюры. Это особенно заметно, когда вы меняете размеры, а браузер продолжает показывать прежнюю сетку.

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

Как встроить галерею в реальную страницу

Виджетная природа Hot Lightbox влияет на архитектуру страницы. В обычной боковой колонке всё просто: виджет опубликован в области темы и показывается там, где тема выводит эту область. Сложнее, когда галерея нужна внутри статьи, посадочной страницы или секции портфолио. Тогда нужно понять, поддерживает ли ваша тема отдельную позицию для виджетов или нужен безопасный способ вставить виджет в контент.

Вывод через область виджетов

Если тема имеет подходящую область виджетов рядом с нужным контентом, это самый чистый вариант. Вы размещаете Hot Lightbox в этой области, сохраняете настройки и проверяете страницу. Минус такого подхода - зависимость от макета темы: не каждая область находится именно там, где нужна галерея.

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

Вывод внутри записи или страницы

В демо One Page от HotThemes есть пример, где Hot Lightbox был связан с записью через виджетную позицию и механизм вставки виджетов shortcode-ом. Это подтверждает, что такой сценарий возможен в экосистеме HotThemes, но не делает его универсальной функцией самого Hot Lightbox. На вашем сайте проверьте, есть ли уже установленный безопасный инструмент для вывода виджета в контенте.

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

Связь с Image и Gallery block

Официальная документация WordPress по блокам Image и Gallery показывает, что современные страницы умеют добавлять изображения из медиатеки, задавать подписи, alt-тексты, ссылки на медиафайл и встроенное увеличение по клику. Это не заменяет Hot Lightbox в его папочном сценарии, но важно для выбора инструмента. Если редакторы уже собирают галереи в блоковом редакторе и не хотят работать с папками на сервере, блоковая галерея или современный lightbox-плагин может быть удобнее.

Hot Lightbox стоит использовать там, где папка изображений и виджетный вывод являются преимуществом, а не вынужденным обходом.

Практический пример: фотогалерея объекта на странице услуги

Разберём предметный сценарий. Допустим, на сайте строительной компании есть страница услуги, где нужно показать фотографии готового объекта: общий вид, детали отделки, несколько этапов работ и итоговый результат. Задача - не перегрузить страницу большим количеством полноразмерных фото, но дать посетителю возможность быстро открыть каждую картинку в крупном виде.

Цель

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

Подготовка

1. Создайте отдельную папку для объекта, например wp-content/uploads/object-gallery/ или другую директорию, которую рекомендует ваша установка.
2. Подготовьте 8-12 изображений одинаковой логики: общий вид, детали, процесс, результат.
3. Переименуйте файлы латиницей и уберите дубли, временные версии и изображения с неподходящим соотношением сторон.
4. Проверьте, что папка доступна для чтения, а WordPress или сервер может создать в ней подпапку thumbs.
5. Откройте тестовую страницу или черновик, где можно безопасно проверить виджет без влияния на основную страницу.

Настройка виджета

Перейдите в Appearance - Widgets, добавьте Hot Lightbox в нужную область и заполните параметры. Укажите путь к папке, задайте ширину области так, чтобы галерея помещалась в контейнер, выберите высоту под один ряд миниатюр и установите размеры превью. Если виджет предлагает качество миниатюр, начните со среднего значения, затем оцените резкость и вес страницы.

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

Публикация в контексте страницы

Разместите галерею рядом с разделом, где она нужна по смыслу: после описания объекта или перед блоком результата. Не ставьте её в самый верх, если посетитель ещё не понимает, что смотрит. Хорошая структура: короткий абзац о задаче, затем галерея, затем пояснение, на какие детали стоит обратить внимание.

Проверка результата

• Откройте страницу как обычный посетитель и нажмите на первую миниатюру.
• Проверьте переход к следующему и предыдущему изображению.
• Закройте lightbox кликом по кнопке или затемнённой области, если этот способ поддерживается.
• Измените ширину окна браузера и убедитесь, что галерея не выходит за пределы контейнера.
• Откройте инструменты разработчика и проверьте, нет ли ошибок загрузки файлов плагина, миниатюр или скриптов.

Нюанс, который часто мешает

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

Адаптивность, стили темы и безопасные улучшения

Hot Lightbox относится к типу плагинов, которые тесно взаимодействуют с темой. Он выводит HTML, миниатюры, стили и JavaScript, а тема уже задаёт ширину контейнера, отступы, поведение изображений и иногда собственные lightbox-эффекты. Поэтому адаптивность нужно проверять не в абстрактном демо, а на вашей реальной странице.

Проверка на узких экранах

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

Если ширина области задана фиксированно, попробуйте значение, которое лучше подчиняется контейнеру темы. На старых реализациях HotThemes в поддержке встречалась рекомендация использовать ширину 100% и дополнительные CSS-ограничения, когда галерея переставала вести себя адаптивно после изменения настроек.

Безопасный CSS без правки плагина

Если галерея шире контейнера или крупное изображение выходит за экран, можно добавить осторожный CSS в Appearance - Customize - Additional CSS или в дочернюю тему. Сначала уточните реальные селекторы через инструменты разработчика. Не правьте файлы самого плагина: при обновлении изменения потеряются, а ошибка в PHP или JavaScript может сломать сайт.

#gallery,
.hot-lightbox-gallery {
  max-width: 100%;
}

#jquery-lightbox,
#lightbox-container-image-box,
#lightbox-image,
#lightbox-container-image-data-box {
  max-width: 100%;
}

#lightbox-container-image-box {
  height: auto;
}

Этот фрагмент - пример направления, а не универсальная вставка для любого сайта. Если в вашей разметке нет #gallery или классы отличаются, адаптируйте селекторы. После добавления CSS проверьте открытие нескольких изображений, закрытие окна, узкий экран и отсутствие влияния на другие галереи.

Как откатить изменение

Перед добавлением CSS сохраните копию исходного фрагмента или используйте встроенную историю редактора CSS, если она доступна. Если после правки пропали кнопки управления, изменился размер всех изображений сайта или lightbox стал обрезаться, удалите добавленный фрагмент и очистите кеш. Откат должен быть таким же простым, как само улучшение.

Скорость, SEO и доступность фотогалереи

Lightbox-галерея может помогать странице, но может и ухудшить её, если загружает слишком много файлов, не содержит понятных alt-текстов или мешает навигации. Для Hot Lightbox особенно важны три направления: вес изображений, смысловые подписи и предсказуемое поведение для посетителя.

Вес страницы

Миниатюры должны быть лёгкими, а оригиналы - разумного размера. Если страница с галереей стала заметно медленнее, проверьте, какие файлы реально загружаются при первом открытии. Идеальная ситуация: браузер получает маленькие миниатюры, а крупные файлы нужны только при просмотре. Если вместо миниатюр загружаются большие оригиналы, вернитесь к настройкам размеров и папке thumbs.

Alt-тексты и подписи

Официальная демо-страница WordPress-плагина Hot Lightbox не подтверждает отдельный интерфейс для alt-текстов, поэтому не стоит обещать, что плагин сам правильно заполнит описания. Если в вашей версии есть поля для подписей или alt, используйте их предметно. Если нет, подготовьте имена файлов и окружающий текст так, чтобы смысл галереи был понятен рядом с изображениями.

Для SEO важнее не повторять ключевые фразы в каждом изображении, а описывать реальное содержание: объект, деталь, этап, результат. Подпись под галереей может объяснить, что показано в серии, без переспама названием продукта или услуги.

Навигация и удобство

Проверьте клавиатуру, закрытие окна, контраст кнопок и читаемость на тёмном overlay. Если кнопки плохо видны на изображениях или тема перекрывает их слоями, посетитель может застрять в lightbox. Это не только неудобно, но и снижает доверие к странице.

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

Частые проблемы и диагностика

Диагностику лучше вести от простого к сложному: путь, права, миниатюры, кеш, JavaScript, тема. Не меняйте одновременно десять параметров. Иначе вы не поймёте, что именно помогло, и проблема вернётся при следующем обновлении.

Миниатюры не появились

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

Проверьте, открывается ли исходный файл по прямому URL, существует ли подпапка thumbs, нет ли PHP-предупреждений о mkdir() или opendir(). Если папка недоступна для записи, исправьте права через панель хостинга или обратитесь к администратору. Не ставьте максимально открытые права как быстрый обход: это ухудшает безопасность.

Клик открывает картинку как обычную ссылку

Если lightbox не запускается, чаще всего не отработал JavaScript. Откройте консоль браузера и проверьте ошибки. В поддержке HotThemes встречались случаи конфликтов с другим модулем и двойным подключением jQuery. Для WordPress логика такая же: если тема, другой плагин или оптимизатор ломает порядок скриптов, эффект может не сработать.

Отключите на тестовой копии объединение и отложенную загрузку JavaScript, затем проверьте галерею снова. Если заработало, настройте исключение для файлов lightbox или измените режим оптимизации. Если в вашей версии Hot Lightbox есть параметр подключения jQuery, проверьте его осторожно: на сайте не должно быть нескольких конкурирующих копий jQuery.

Не видны стрелки, кнопка закрытия или иконки

Симптом может быть связан с незагруженными файлами плагина, ошибкой доступа, конфликтом CSS или тем, что элементы управления оказались под другим слоем темы. В одном из обсуждений HotThemes причиной был запрет доступа к JavaScript-файлу и рекомендация проверить права файлов и папок.

Проверьте вкладку Network в инструментах разработчика: нет ли ответов 403 или 404 для файлов плагина. Затем временно отключите минификацию CSS/JS на тестовой странице. Если кнопки появляются, настройте исключение в оптимизаторе.

Галерея ломает адаптивную верстку

Симптом: миниатюры выходят за край, крупное изображение не помещается в окно или контейнер получает фиксированную ширину. Начните с ширины области виджета и размеров миниатюр. Если в настройке можно использовать относительную ширину, проверьте её. Затем добавьте точечный CSS только для блока галереи.

Откатывайте CSS, если он влияет на обычные изображения сайта. Не используйте глобальное правило для всех img, если проблема локальна в lightbox: оно может испортить логотипы, иконки и изображения в других блоках.

На одной странице две галереи мешают друг другу

В поддержке HotThemes есть обсуждения конфликтов при нескольких lightbox-галереях на одной странице. Для WordPress это тоже разумная зона риска: если два экземпляра используют одинаковые идентификаторы, одни и те же селекторы или общий набор скриптов, навигация может листать не ту серию или останавливаться после первого изображения.

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

Когда Hot Lightbox будет удачным выбором

Hot Lightbox стоит использовать, если вам нужна понятная фотогалерея из папки изображений, выводимая через виджет, с автоматическим созданием миниатюр и простым lightbox-просмотром. Он особенно логичен на сайтах, где уже применяются темы HotThemes или макет предусматривает виджетные позиции под галереи.

Перед запуском проверьте три вещи: папка с изображениями доступна и записываема, миниатюры создаются в thumbs, а JavaScript не конфликтует с темой и оптимизаторами. После этого можно настроить размеры, качество, рамки и аккуратно встроить галерею в страницу. Если вам подходит такой сценарий, можно скачать установочный файл и проверить его на копии сайта или второстепенной странице.

Если же редакторам нужны блоковые галереи, автоматическое применение lightbox ко всем изображениям, поддержка видео, WooCommerce или развитый конструктор альбомов, лучше сразу сравнить Hot Lightbox с современными альтернативами. Правильный выбор здесь не самый популярный плагин, а тот, который соответствует реальному способу работы с изображениями на вашем сайте.