Системні повідомлення в Joomla є важливим інструментом для взаємодії з відвідувачем. Зовнішній вигляд стандартного блоку з повідомленнями залишає бажати кращого. У цій маленькій замітці, я опишу показу повідомлень у спливаючому вікні. Трохи забіжу вперед: зроблено це буде за допомогою jQuery fancyBox.
При відображенні стандартних системних повідомлень на сторінках сайту під керуванням Joomla, генерується наступний HTML-код:
До системних повідомленнями, зокрема, відноситься повідомлення, яке з'являється після відправки даних через форму зворотного зв'язку на сторінці з компонентом com_contact. Місце де воно з'являється визначається в шаблоні сайту. Для його вставки використовується наступна директива:
Стандартний вид повідомлення не дуже привабливий і, як правило, не збігається з дизайном сторінок вашого сайту. Його, звичайно ж, можна стилізувати за допомогою CSS, але я пропоную, крім стилізації, ще й показувати його у спливаючому вікні. При цьому вміст сторінки має бути затемнено. З цим чудово впорається легендарний jQuery-інструмент під назвою fancyBox.
Завантажити його і підключимо в ваш шаблон сайту. З завантаженого архіву вам знадобляться файли: jquery.fancybox.pack.js. jquery.fancybox.css. Вони знаходяться в папці source завантаженого архіву. Крім них, візьмемо все зображення і разархивируем їх в папку images вашого шаблону. Файли jquery.fancybox.pack.js і jquery.fancybox.css перенесіть у відповідні папки script і css. Причому файл jquery.fancybox.pack.js можна перейменувати в jquery.fancybox.js.
У файлі jquery.fancybox.css не забудьте замінити шляхи до зображень на ваші. Потім підключимо перераховані файли в шаблоні сайту (файл - index.php).
Файл jquery.fancybox.pack.js підключаємо після підключення бібліотеки jQuery.
Розміщуємо цей код в файл і зберігаємо його. Я назвав його script.js і розмістив в тій же папці (script), куди розпакувати jquery.fancybox.js. Підключити цей файл в шаблоні сайту необхідно наступним рядком після підключення jquery.fancybox.js.
Тепер після виконаної роботи, ми вже можемо побачити результат. Системне повідомлення після заповнення і відправки форми зворотного зв'язку має відкритися за допомогою fancyBox. Якщо, звичайно, ви все правильно зробили.
Залишилося тільки трохи стилізувати блок з повідомленням, додавши трохи CSS. У мене вийшов наступний набір CSS-правил:
Ви можете прикрашати блок на свій смак. Ось таким простим способом ми змогли організувати показ системних повідомлень на сайті під керуванням Joomla у спливаючому вікні.
Пропоную наступні послуги:
- Верстка шаблону сайту з дизайн-макету для CMS «1С-Бітрікс Управління сайтом» і CMS "Joomla"
- Створення форм різної складності (зворотний зв'язок, анкети і тп) для зазначених CMS
- Налагодження та кастомизация компонентів і модулів для зазначених CMS
- Доопрацювання модулів і компонентів для зазначених CMS, додавання нестандартного функціонала
- Розробка Лендінзі (landing-pages)
За все про надання через форму зворотного зв'язку
Пропоную Вашій увазі: