В данной статье мы рассмотрим бесплатный плагин для Joomla под названием BK-MultiThumb. Данный плагин предназначен для вывода галерей, вывода миниатюр всех изображений определенного размера и всплывающего окна, ну и самое главное, с помощью этого плагина можно накладывать водяной знак на полностью раскрытое изображение. И в данной статье мы рассмотрим только эту возможность - как настроить плагин BK-MultiThumb для вывода водяного знака.

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

Плюсы плагина BK-MultiThumb для вывода водяного знака:
- Плагин бесплатный
- Не надо настраивать размер каждого изображения в материале, задал размер, и все миниатюры одного размера
- Посетитель сайта, не будет лишний раз крутить колесико мышки, перемещаясь ниже очередного изображения (миниатюры можно задать не большие), а будет читать материал и смотреть миниатюры
- При клике на иконку с миниатюрой появляется изображение в максимальном виде с водяным знаком
- Не надо заранее с каждым изображением или группой картинок проводить процедуру встраивания водяного знака в специальной программе в Windows
- Все изображения на сайте сохраняются в исходном виде (без водяного знака)

Минусы плагина:
- Видно, пускай даже на темных местах изображения, основание текста водяного знака
- Если изображение очень большое, водяной знак, в соответствии с его пикселями, например, 500…550 пикселей, может отображаться небольшой иконкой, а не занимать большую часть изображения
- Нет возможности встроить текст водяного знака, а только наложение изображения
- Необходимость нажимать на изображение для просмотра его в оригинальном размере

 

Скачиваем и установливаем плагин

Итак, перейдите по ссылке extensions.joomla.org или войдите через админ панель Joomla на скачивание и установку расширений. Введите в поисковике BK-MultiThumb и скачайте последнюю версию плагина. На момент написания данной статьи последняя версия была multithumb_3.7.1 (кликнув по ссылке, Вы можете скачать эту версию плагина). Я не буду вдаваться в подробности как устанавливать расширения для Joomla, думаю, Вы и так это знаете, а переду сразу к подготовке изображения с будущим водяным знаком и настройкам плагина.

Стоит сказать лишь о том, что после установки плагина появится окно, в котором нас предупредят о необходимости каждый раз при добавлении новых изображений на сайт очищать кэш Джумла и браузера. Иначе в Вашем браузере Вы будите видеть сохраненные страницы в кэше браузера, а не измененные плагином BK-MultiThumb.

003 01 01

 

Подготавливаем изображение для водяного знака

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

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

Уточню только один момент, из многочисленных моих экспериментов замечено, что самый оптимальный вариант цвета текста черный, а ширина водяного знака для обычных изображений в материалах 500…550 пикселей. И никакие 3D и эффекты для шрифтов, к сожалению, лучше не использовать т.к. иначе, Вам придется увеличивать процент наложения изображения с водяным знаком и тем самым увеличивать видимое основание последнего.

Для тех, кто пользуется программой Adobe Photoshop, ниже приведу пример оптимальных настроек картинки с будущим водяным знаком. Итак, создаем новый файл с шириной 500…550 пикселей. Вписываем необходимый текст, придаем ему необходимую форму и изгиб.

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

003 01 02 

Далее, в выпадающем меню выбираем «Резкое» и сохраняем файл, например, в формат .jpg

003 01 03

Возникает вопрос, а почему необходимо выбирать именно резкое изображение? По моим наблюдениям только настройка «Резкое» позволяет при минимальном проценте наложения картинки с водяным знаком с исходным изображением получить более четкие очертания текста водяного знака и его наполнение. Впрочем, можете поэкспериментировать…

 

Настройка плагина BK-MultiThumb

Настало время настроить сам плагин, что мы сейчас и сделаем. Заходим «Расширения», «Менеджер плагинов». Ищем Multithumb и нажимаем по плагину для его настроек.

003 01 04

Далее, переходим во вкладку Article thumb и в строке Thumbs size вручную зададим параметры миниатюр изображения, до которой плагин Multithumb будет уменьшать все изображения на сайте. Можно, конечно, оставить по умолчанию, но я изменю на 200х200.

003 01 05

Так как мы не создаем галерею, нам необходимо настроить плагин так, что бы все изображения находились каждое на своем месте в тексте, а не все в куче. Для этого в той же вкладке Article thumb в строке Thumbnail CSS необходимо изменить выражение (убрать лишнее), а именно убрать float: left;

Должно получиться как на примере ниже

003 01 06

Далее, заходим во вкладку настройки водяного знака 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 – Оставляем по умолчанию Нет

На этом настройка плагина закончена. Сохраняем настройки плагина нажав кнопку «Сохранить».

В итоге у Вас должно получится нечто слудущее...

003 01 07

Теперь нам осталось только сбросить кэш Джумла и Вашего браузера

 

Сбрасываем кэш Джумла и браузера

Для того что бы все наши настройки вступили в силу и Вы смогли увидеть изменения на сайте после любой настройки плагина нам необходимо сбросить кэш как в Джумла так и в Вашем браузере. Об этом, кстати, нас и предупреждали сразу после установки плагина BK-MultiThumb. Что мы сейчас и сделаем.

Для сброса кэша Джумла необходимо зайти «Система», «Очистить весь кэш»

003 01 08

В появившемся окне ставим галочку на кэше multithumb_thumbs и нажимаем «Удалить»

003 01 09

Кэш Джумла мы очистили, осталось очистить кэш браузера. Так как я не знаю, каким Вы браузером пользуетесь, то покажу пример в браузере Яндекс Хром. Итак, в верхнем правом углу нажимаем настройки.

003 01 10

В появившемся окне прокручиваем в самый низ и нажимаем кнопку «Показать дополнительные настройки»

003 01 11

Прокручиваем немного ниже и нажимаем кнопку «Очистить историю»

003 01 12

Появится окно, где нужно подтвердить очистку истории нажав кнопку «Очистить историю».

003 01 13

После очистки кэша браузера закрываем вкладку с настройками.

Итак, кэш Джумла и браузера мы очистили. Осталось только обновить страницу сайта. Обновляем страницу сайта и ву-а-ля, все работает…

Важно. Чтобы плагин заработал на настоящем сервере (на хосте), необходимо, в корневой папке вручную создать папку cache. Видемо, из-за какой-то политики безопасности автоматически эта папка не создается…

На этом настройка плагина BK-MultiThumb закончена.

Комментарии  

#1 Виктория 06.05.2015 16:47
Какая версия BK-MultiThumb больше подходит для Joomla 2.5?
Спасибо
Цитировать