Как создать свой сайтУроки Joomla → Урок 9. Наполняем сайт материалами (учимся вставлять html/javascript-код)

Joomla - Урок 9. Учимся вставлять html/javascript-код

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

Итак, создаем материал под названием Контакты (contact). Копируем текст материала, кроме карты, форматируем и сохраняем статью:



Теперь нам надо вставить Google maps. Существую различные способы вставки стороннего html/javascript-кода на сайты, сделанные на Joomla. Я предлагаю один из самых простых, с использованием расширения Joomla - модуля mod_specialhtml_J15.

Итак, скачайте модуль к себе на компьютер. Теперь идем в Расширения - Установка и удаление. Нажимаем на кнопку Обзор, выбираем модуль mod_specialhtml_J15.zip и нажимаем на кнопку Закачать файл (подробно об установке расширений мы говорили в 5 уроке).

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

Для этого мы идем в Расширения - Модули:



и нажимаем на кнопку Новый:



Ставим галочку у Special HTML и нажимаем кнопку Следующая:



На странице настройки модуля указываем следующие параметры:
  • Название, например - Карта Google.
  • Отобразить заголовок - Нет.
  • Включен - Да.
  • Положение - map1. Эту позицию надо набрать вручную. Joomla предлагает в списке те позиции, которые у нее есть в шаблоне, но мы будем вставлять этот модуль в статью, и поэтому положение для него мы определяем сами. (Подробнее об этом мы будем говорить в следующем уроке).
  • В параметрах модуля, на вкладке HTML/JavaScript нам надо указать код нашей карты.



Чтобы получить код карты, мы идем на http://maps.google.com/. В строке поиска набираем название фирмы сайта-образца - Русобои СПб. Появляется карта с местоположением нашей фирмы, нажимаем на кнопку Ссылка и видим HTML-код для добавления на сайт:



Копируем этот код, вставляем его в параметры нашего модуля и сохраняем:



Теперь идем в Статьи - Статьи, выбираем нашу статью Контакты и открываем ее для редактирования. Встаем курсором мыши в то место, где должна быть наша карта и пишем следующую команду: {loadposition map1} :



Таким образом, мы создали модуль с кодом карты (map1), а в статье указали, где этот модуль надо отобразить (loadposition). Сохраняем нашу статью. В следующем уроке мы создадим меню и увидим, как выглядят страницы нашего сайта, а пока подведем итог этого урока:

Чтобы вставлять в Joomla html/JavaScript-код, необходимо:

  • Создать модуль (в Расширения - Модули), выбрать тип (Special HTML), дать модулю название, задать имя его положения и вставить сам код.

  • На странице встать курсором в место, куда будет вставлен модуль и написать команду {loadposition имя_положения_модуля}.





Предыдущий урок Вернуться в раздел Следующий урок уроки joomla

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