Joomla модуль для слабовидящих B-Accessibility

Joomla модуль для слабовидящих, это продолжение серии уроков по созданию версии сайта для слабовидящих разными способами и для разных движков (cms).

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

Теперь немного конкретизируем и рассмотрим вариант установки модуля для слабовидящих на joomla-сайт.

joomla модуль для слабовидящих

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

Joomla модуль для слабовидящих B-Accessibility

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

  1. изменение размера шрифта
  2. регулировка контрастности
  3. навигация с помощью клавиатуры
  4. массовое подчеркивание ссылок
  5. изменение размера любых тегов добавленных администратором сайта

реализованы в данном расширении.
Найти и скачать модуль B-Accessibility можно на официальном сайте joomla.org.

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

Пропустим моменты скачать и установить, а разберем сразу внутренние параметры.

Основные настройки модуля для слабовидящих B-Accessibility

настройка модуля accessibility

  1. Боковая панель инструментов – отвечает за расположение панели инструментов с настройками для слабовидящих. Возможность показать панель слева

панель модуля слева

Или справа

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

2. Позицию иконки можно показать сверху или снизу. Имеется ввиду позицию по отношению к самому модулю, который появляется при нажатии на саму иконку.

3. Затем идет настройка размера самой иконки.

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

5. И последняя настройка – это значение уменьшения или увеличения шрифта. Начальное значение установлено в 2px. Другими словами- при каждом нажатии на увеличение/уменьшение, значение будет меняться по 2 пикселя в каждую сторону.

Что касается показывать или нет заголовок модуля, то вариант индивидуальный. При невозможности выбора позиции (все заняты или их мало), выбрать необходимо позицию debug, она имеется в каждом шаблоне joomla.

Следующая настройка “привязка к пунктам меню”. Для полноценной работы лучше всего привязать модуль ко всем страницам.

привязка модуля accessibility

Настройка шрифта Awesome модуля для слабовидящих B-Accessibility

Во многих современных шаблонах joomla предустановлена возможность использования специальных иконок и самыми популярными являются иконки сервиса awesome. К слову сказать, все эти иконки редактируются как обыкновенный шрифт.

Вот и данный модуль не является исключением.

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

настройки шрифта accessibility

Настройка сообщения модуля B-Accessibility

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

настройки сообщения accessibility

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

модальное окно модуля accessibility

Joomla модуль для слабовидящих замена иконки на шрифт

Рассмотрим вариант когда иконки Awesome не работают или администратор решил их отключить самостоятельно. Как было уже сказано выше, в этом случае вместо иконки будет выводиться информация из языкового файла модуля, а это название самого модуля.

замена иконки accessibility

Влезать в html код нет смысла, в joomla есть отличная возможность, переопределение констант (расширения/менеджер языков/переопределение констант).

переопределение констант

Все необходимые параметры показаны на скриншоте.

создание переопределения accessibility

В правой части страницы, в поле поиска, добавляем слово которое необходимо изменить, выбираем значение и жмем “Найти”.

поиск значения константы

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

accessibility

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

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

версия для слабовидящих

Joomla модуль для слабовидящих B-Accessibility имеет свои стили и чтобы отредактировать нужные, необходимо открыть файл со стилями в любом редакторе.

http://ваш_сайт/modules/
mod_baccessibility/
asset/css/style.css

Я увеличил только размер шрифта в строке 59 (font-size: 18px) и в строке 87 поменял отступ чтобы не было прилипания (right: -75px;).

Все изменения в стилях будут идентичны как для текста, так и для иконки.

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

Поделиться с друзьями
Эдуард Бунаков

Здравствуйте! Я специалист cms-систем, автор серии обучающих курсов по созданию сайтов на cms-Joomla, WordPress, интернет-магазинов на Opencart.

Оцените автора
( Пока оценок нет )
Добавить комментарий

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

  1. Анонимно

    Мне тоже понравилась. Все получилось как написано.

    Ответить
  2. Михаил

    Спасибо большое, ваша статья очень помогла!!

    Ответить
  3. Вячеслав

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

    Ответить