Содержание
В данной статье мы рассмотрим бесплатный плагин для Joomla под названием BK-MultiThumb. Данный плагин предназначен для вывода галерей, вывода миниатюр всех изображений определенного размера и всплывающего окна, ну и самое главное, с помощью этого плагина можно накладывать водяной знак на полностью раскрытое изображение. И в данной статье мы рассмотрим только эту возможность — как настроить плагин BK-MultiThumb для вывода водяного знака.
Плагин имеет небольшой недостаток. На темном изображении, не сильно, но все же заметно контур белого фона изображения с текстом. Плагин не умеет встраивать текст – он только смешивает изображения, но делает это очень даже не плохо. Но так как плагин бесплатный, то на это, в большинстве случаев, можно закрыть глаза.
Плюсы плагина BK-MultiThumb для вывода водяного знака:
— Плагин бесплатный
— Не надо настраивать размер каждого изображения в материале, задал размер, и все миниатюры одного размера
— Посетитель сайта, не будет лишний раз крутить колесико мышки, перемещаясь ниже очередного изображения (миниатюры можно задать не большие), а будет читать материал и смотреть миниатюры
— При клике на иконку с миниатюрой появляется изображение в максимальном виде с водяным знаком
— Не надо заранее с каждым изображением или группой картинок проводить процедуру встраивания водяного знака в специальной программе в Windows
— Все изображения на сайте сохраняются в исходном виде (без водяного знака)
Минусы плагина:
— Видно, пускай даже на темных местах изображения, основание текста водяного знака
— Если изображение очень большое, водяной знак, в соответствии с его пикселями, например, 500…550 пикселей, может отображаться небольшой иконкой, а не занимать большую часть изображения
— Нет возможности встроить текст водяного знака, а только наложение изображения
— Необходимость нажимать на изображение для просмотра его в оригинальном размере
Скачиваем и устанавливаем плагин
Итак, перейдите по ссылке extensions.joomla.org или войдите через админ панель Joomla на скачивание и установку расширений. Введите в поисковике BK-MultiThumb и скачайте последнюю версию плагина. На момент написания данной статьи последняя версия была multithumb_3.7.1 (кликнув по ссылке, Вы можете скачать эту версию плагина). Я не буду вдаваться в подробности как устанавливать расширения для Joomla, думаю, Вы и так это знаете, а переду сразу к подготовке изображения с будущим водяным знаком и настройкам плагина.
Стоит сказать лишь о том, что после установки плагина появится окно, в котором нас предупредят о необходимости каждый раз при добавлении новых изображений на сайт очищать кэш Джумла и браузера. Иначе в Вашем браузере Вы будите видеть сохраненные страницы в кэше браузера, а не измененные плагином BK-MultiThumb.
Подготавливаем изображение для водяного знака
Начнем мы с вами с того, что вначале подготовим изображение будущего водяного знака, что бы потом не отвлекаться от настройки плагина.
Так как программ для работы с изображениями много и у каждого есть свои предпочтения, я не буду особо углубляться в подробности как это сделать.
Уточню только один момент, из многочисленных моих экспериментов замечено, что самый оптимальный вариант цвета текста черный, а ширина водяного знака для обычных изображений в материалах 500…550 пикселей. И никакие 3D и эффекты для шрифтов, к сожалению, лучше не использовать т.к. иначе, Вам придется увеличивать процент наложения изображения с водяным знаком и тем самым увеличивать видимое основание последнего.
Для тех, кто пользуется программой Adobe Photoshop, ниже приведу пример оптимальных настроек картинки с будущим водяным знаком. Итак, создаем новый файл с шириной 500…550 пикселей. Вписываем необходимый текст, придаем ему необходимую форму и изгиб.
Для лучшей наглядности, я на примере выделил созданный текст, Вам же этого делать не обязательно.
Далее, в выпадающем меню выбираем «Резкое» и сохраняем файл, например, в формат .jpg
Возникает вопрос, а почему необходимо выбирать именно резкое изображение? По моим наблюдениям только настройка «Резкое» позволяет при минимальном проценте наложения картинки с водяным знаком с исходным изображением получить более четкие очертания текста водяного знака и его наполнение. Впрочем, можете поэкспериментировать…
Настройка плагина BK-MultiThumb
Настало время настроить сам плагин, что мы сейчас и сделаем. Заходим «Расширения», «Менеджер плагинов». Ищем Multithumb и нажимаем по плагину для его настроек.
Далее, переходим во вкладку Article thumb и в строке Thumbs size вручную зададим параметры миниатюр изображения, до которой плагин Multithumb будет уменьшать все изображения на сайте. Можно, конечно, оставить по умолчанию, но я изменю на 200х200.
Так как мы не создаем галерею, нам необходимо настроить плагин так, что бы все изображения находились каждое на своем месте в тексте, а не все в куче. Для этого в той же вкладке Article thumb в строке Thumbnail CSS необходимо изменить выражение (убрать лишнее), а именно убрать float: left;
Должно получиться как на примере ниже
Далее, заходим во вкладку настройки водяного знака Watermark parameters. Настраиваем в строках следующее:
Watermark – Выбираем Full size images only (применить ко всему сайту)
Enable for – Оставляем по умолчанию ALL categories (для всех категорий)
Categories of articles – Так как нам необходимо что бы настройки применились ко всему сайту, оставляем все по умолчанию и ничего не выбираем
Watermark file – Здесь необходимо указать путь к картинке с водяным знаком, при этом, предварительно, картинку необходимо загрузить на Ваш сайт
Horiz. position – Расположение по горизонтали оставляем по умолчанию Center (по центру)
Horiz. shift – Смещение по горизонтали оставляем по умолчанию и ничего не пишем
Vert. position – Расположение по вертикали оставляем по умолчанию Middle
Vertical indent – Смещение по вертикали оставляем по умолчанию и ничего не пишем
Transparency – Данный параметр позволяет настроить где будет находиться изображение с водяным знаком на переднем плане или на заднем. Нам необходимо сделать изображение с водяным знаком на задний план т.к. иначе основание изображения будет закрывать основную картинку. Поэтому, необходимо изменить значение на Transparent background color
Transparent color – Оставляем по умолчанию
Transparency in percent – Процент наложения изображения с водяным знаком на исходное изображение в статье (процент слияния картинок). Тут Вам надо поэкспериментировать. Я же выставлю значение 18 т.к. мне кажется это оптимальный вариант для темных и светлых картинок.
Scrambling image names – Оставляем по умолчанию Нет
На этом настройка плагина закончена. Сохраняем настройки плагина нажав кнопку «Сохранить».
В итоге у Вас должно получится нечто следующее…
Теперь нам осталось только сбросить кэш Джумла и Вашего браузера
Сбрасываем кэш Джумла и браузера
Для того что бы все наши настройки вступили в силу и Вы смогли увидеть изменения на сайте после любой настройки плагина нам необходимо сбросить кэш как в Джумла так и в Вашем браузере. Об этом, кстати, нас и предупреждали сразу после установки плагина BK-MultiThumb. Что мы сейчас и сделаем.
Для сброса кэша Джумла необходимо зайти «Система», «Очистить весь кэш»
В появившемся окне ставим галочку на кэше multithumb_thumbs и нажимаем «Удалить»
Кэш Джумла мы очистили, осталось очистить кэш браузера. Так как я не знаю, каким Вы браузером пользуетесь, то покажу пример в браузере Яндекс Хром. Итак, в верхнем правом углу нажимаем настройки.
В появившемся окне прокручиваем в самый низ и нажимаем кнопку «Показать дополнительные настройки»
Прокручиваем немного ниже и нажимаем кнопку «Очистить историю»
Появится окно, где нужно подтвердить очистку истории нажав кнопку «Очистить историю».
После очистки кэша браузера закрываем вкладку с настройками.
Итак, кэш Джумла и браузера мы очистили. Осталось только обновить страницу сайта. Обновляем страницу сайта и ву-а-ля, все работает…
Важно. Чтобы плагин заработал на настоящем сервере (на хосте), необходимо, в корневой папке вручную создать папку cache. Видемо, из-за какой-то политики безопасности автоматически эта папка не создается…
На этом настройка плагина BK-MultiThumb закончена.