- 23 Июня 2011 16:32
StalkerAA
Хочется видеть что то более интересное. Может проще делиться знаниями, которые реально пригодятся, а не заниматься плагиатом. Обратите внимание, что на Этом сайте нет практического применения того что нам предлагают в уроках.- 24 Июня 2011 00:38
Svasus
ну если ты не можешь найти практического применения быстрой вёрстке на джумле, то кто ж врач тебе) - 24 Июня 2011 19:43
vladuhliy
Тут на практике применена система комментирования, которая есть в уроках )- 26 Июня 2011 11:29
StalkerAA
Я в курсе, но это единичный случай.
- 7 Апреля 2012 19:17
KonevDN
ага - 7 Апреля 2012 19:17
KonevDN
ну т ы типочек с молоточек, я б тебя об гвоздик - что значит бесполезные уроки, ??? ты глаза открой получше
- 4 Февраля 2012 20:40
lanworks
Подскажите как подключить код к шаблону <style>body{ текст кода } </style> - Комментарий удален
- 23 Июня 2011 15:39
graft
Почему? - 23 Июня 2011 16:12
flasher777
Это серия переводов с сайта http://net.tutsplus.com/ http://net.tutsplus.com/tutorials/site-builds/create-a-template-with-joomla-step-by-step/ И что тот сайт тоже умирает??? - 24 Июня 2011 19:51
vladuhliy
почему умирает? Судя по всему скоро будет форум, вот где жизнь будет кипеть! )- 7 Апреля 2012 19:20
KonevDN
да не, форумы это прошлый век, как IE6 , ну вы че ребятки... сообщества типа соц сети , вто что давно должно уже вытеснить все эти невзрачные форумы
- Комментарий удален
- 25 Июня 2011 22:35
WI_Wind
+1 - поддерживаю!!!
- Метки урока:
- шаблон
- joomla
- css
- web дизайн
Создание шаблона Joomla за 6 шагов. Шаг 4.
Определим, как будет выводиться меню в нашем простом шаблоне.
Преимущество использования правил CSS перед табличной структурой HTML проявляется в меньшем размере кода и более простой верстке. Кроме того, существует большое количество примеров организации различного типа меню на основе CSS, которые достаточно просто адаптировать для использования в шаблоне Joomla.
Рассмотрим типовую структуру меню на основе неупорядоченного списка :
<div id="navcontainer"> <ul id="navlist"> <li id="active"><a href=" #" id="current">Пункт один</a></li> <li><a href="#">Пункт два</a></li> <li><a href="#">Пункт три</a></li> <li><a href="#">Пункт четыре</a></li> <li><a href="#">Пункт пять</a></li> </ul> </div>
Список <ul>
имеет идентификатор navlist и помещен в контейнер <div>
c идентификатором navcontainer. Чтобы воспроизвести такую же структуру в шаблоне Joomla, необходимо организовать внешний контейнер <div>
. Задача решается с помощью суффикса модуля. Модуль с опцией style="xhtml"
будет иметь вид в итоговом коде:
<div class="moduletable"> <h3>...Заголовок модуля...</h3> ...Содержание модуля... </div>
Если установить для модуля суффикс _menu
, то он будет добавлен к названию класса moduletable:
<div class="moduletable_menu"> <h3>...Заголовок модуля...</h3> ...Содержание модуля... </div>
Теперь если вы будете использовать готовый код CSS для меню, то в нем надо будет заменить имя класса navcontainer на moduletable_menu.
Использование суффиксов для модулей позволяет очень гибко настраивать интерфейс шаблона. Например, задавать различные стили для разных меню.
Добавим в файл template.css нашего шаблона следующий код для формирования меню:
.moduletable_menu{ padding:0; color: #333; margin-bottom:1em; } .moduletable_menu h3 { background:#666; color:#fff; padding:0.25em 0; text-align:center; font-size:1.1em; margin:0; border-bottom:1px solid #fff; } .moduletable_menu ul{ list-style: none; margin: 0; padding: 0; } .moduletable_menu li{ border-bottom: 1px solid #ccc; margin: 0; } .moduletable_menu li a{ display: block; padding: 3px 5px 3px 0.5em; border-left: 10px solid #333; border-right: 10px solid #9D9D9D; background-color:#666; color: #fff; text-decoration: none; } html>body .moduletable_menu li a { width: auto; } .moduletable_menu li a:hover,a#active_menu:link,a#active_menu:visited{ border-left: 10px solid #1c64d1; border-right: 10px solid #5ba3e0; background-color: #2586d7; color: #fff; }
Чтобы внешний вид меню изменился, надо для их модулей установить суффикс _menu.
В итоге внешний вид сайта при использовании шаблона станет таким:
Анонс
В следующем уроке будет представлено, как скрывать колонки шаблона, в которые ничего не выводится.
Данный урок подготовлен для вас командой сайта ruseller.com
Источник урока: net.tutsplus.com/tutorials/site-builds/create-a-template-with-joomla-step-by-step/
Перевел: Сергей Фастунов
Урок создан: 22 Июня 2011
Просмотров: 51388
Правила перепечатки
5 последних уроков рубрики "Joomla!"
-
Краткий обзор файла configuration.php для системы Joomla!
При перемещениях или других действиях с сайтом под управлением Joomla частенько требуется решить небольшие проблемы с настройкой путей, паролей, базы данных и других основных моментов конфигурации. Большая часть таких вопросов легко решается прямым редактированием файла конфигурации configuration.php.
-
Использование капчи в Joomla 2.5
Обратной стороной использования популярных систем, таких как Joomla, WordPress или Drupal, является то, что спаммеры знают, как устроено программное обеспечение. Поэтому вполне вероятна ситуация, когда на сайте имеется большое число регистраций для спама.
-
Установка и настройка модуля новостей для Joomla 1.7 AidaNews2 (Чaсть 2)
В данном уроке мы научимся устанавливать и настраивать очень гибкий модуль для отображения новостей на Joomla 1.7
-
Установка и настройка модуля новостей для Joomla 1.7 AidaNews2 (Часть 1)
В данном уроке мы научимся устанавливать и настраивать очень гибкий модуль для отображения новостей на Joomla 1.7
-
Создание шаблона Joomla за 6 шагов. Шаг 6.
В данном уроке мы закончим построение простого шаблона Joomla.
WI_Wind