Как создать горизонтальное меню в 2 строчки?

[Bayushi]

Здравствуйте!
Имеется "макет" сайта http://ariadna-kazan.ru/ariadna1/index.htm
Пытаюсь изобразить тоже самое на joomle.
пока получилось следующее http://ariadna-kazan.ru/
Подскажите пожалуйста как создать или хотя бы где почитать(поиск не помог) горизонтальное меню в 2 строчки?
Или можно переопределить как-то расположение одного из стандартных меню.

[Bayushi]

Добавил

Код:

<jdoc:include type="modules" name="main-menu" />
       <div class="table">
<table cols="3" width="40%" height="7" cellpadding="10" cellspacing="50" bordercolor="ffd700" frame="border" border="0">
  <tr>
    <td align="center" width="20%" height="25"><a href="index.htm" class="a"/>Главная</td>
    <td align="center" width="20%" height="25"><a href="gallery.htm" class="a"/>Галерея</td>
    <td align="center" width="20%" height="25"><a href="contact.htm" class="a"/>Контакты</td>
  </tr>
  <tr>
    <td align="center" width="20%" height="25"><a href="index.htm" class="a"/>Глав</td>
    <td align="center" width="20%" height="25"><a href="gallery.htm" class="a"/>Гал</td>
    <td align="center" width="20%" height="25"><a href="contact.htm" class="a"/>Кон</td>
  </tr>
</table>

</div>

пункты меню появились но на правила CSS не реагирует. Что делаю не так?

Код:

#table {
        padding-left: 310px;
        padding-top:  140px;
      
}

В templateDetails.xml прописан <position>main-menu</position>. Появилось меню, но как теперь его разделить на 2 строчки? Или сделать 2 меню?

[Romawka]

А не легче поставить меню в 1 ряд?если да то можеш сделать и так

[Romawka]

http://demo123.ru/?tp=1 после команды которую допишеш к сайту  ?tp=1 тебе покажет позицыи как можно меню ставить и где хочеш

[beliyadm]

Не надо никаких таблиц, делаете плоский список, для UL задаете фиксированную ширину и позиционируете справа, для LI задаете ширину в 33% от UL, делаем 6 пунктов меню, выходит две строки по 3 в каждом.
Внутри LI делаем text-align: center

[Bayushi]

Не надо никаких таблиц, делаете плоский список, для UL задаете фиксированную ширину и позиционируете справа, для LI задаете ширину в 33% от UL, делаем 6 пунктов меню, выходит две строки по 3 в каждом.
Внутри LI делаем text-align: center

А можно по подробнее? Я убрал таблицу, оставил только джумловское меню. Где нужно прописать ul и li?

[beliyadm]

Где нужно прописать ul и li?

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

Код

ul.menu {width: 400px;}
ul.menu li {display: block; float: left; list-style:none; width: 100px; text-align: center;}

И смотрим что получается

[Bayushi]

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

Код

ul.menu {width: 400px;}
ul.menu li {display: block; float: left; list-style:none; width: 100px; text-align: center;}

И смотрим что получается

Здорово!
Все получилось. Только я заменил на

Код

ul.menu {width: 300px;}

Осталось только подвинуть вправо.

И еще такой вопрос:
Можно ли ссылки заменить кнопками?

[beliyadm]

Можно ли ссылки заменить кнопками?

Да, варианты есть разные, зависит от дизайна
Иногда достаточно для ul.menu li a указать фоновую картинку кнопки, если она фиксированная.
Если подложка резиновая (растягивается) - там чуть сложнее, придется указывать фон и для li и для a и возможно еще внедрять span

[Bayushi]

Да, варианты есть разные, зависит от дизайна
Иногда достаточно для ul.menu li a указать фоновую картинку кнопки, если она фиксированная.
Если подложка резиновая (растягивается) - там чуть сложнее, придется указывать фон и для li и для a и возможно еще внедрять span

Фоновый рисунок фиксированный.
А где можно по подробнее почитать про ul.menu li a? Я пока с ними еще не разобрался...
И можно ли кнопки как-то раздвинуть по ширине? А то близко расположены.

[beliyadm]

А где можно по подробнее почитать про ul.menu li a? Я пока с ними еще не разобрался...
И можно ли кнопки как-то раздвинуть по ширине? А то близко расположены.

и то и другое - изучайте CSS
ul.menu li a - описание ссылки внутри элемента списка с классом menu, его можно сделать фиксированным и присвоить фон с заданными параметрами ширины высоты
Например

Код

ul.menu li a {
display: block; width: 100px; height: 40px; background: url(../images/menu.png) no-repeat 0px 0px;
}

Где ширина и высота - размеры картинки menu.png
Ну а дальше через margin для a либо для li управлять позицией
Это как бы базовые основы CSS, не для данного форума

[Bayushi]

и то и другое - изучайте CSS
ul.menu li a - описание ссылки внутри элемента списка с классом menu, его можно сделать фиксированным и присвоить фон с заданными параметрами ширины высоты
Например

Код

ul.menu li a {
display: block; width: 100px; height: 40px; background: url(../images/menu.png) no-repeat 0px 0px;
}

Где ширина и высота - размеры картинки menu.png
Ну а дальше через margin для a либо для li управлять позицией
Это как бы базовые основы CSS, не для данного форума

Спасибо большое. Буду пробывать.

[Bayushi]

Помогите пожалуйста с еще одной проблемой. Сайт http://ariadna-kazan.ru/
В центральной области не отображаются материалы, хотя

Код:

<jdoc:include type="component"/>

присутствует.

Вот собственно весь index.php

Код:

<?php defined ('_JEXEC') or die ('Restricted access');?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" dir="<?php echo $this->direction; ?>" >
<html>
<head>
<jdoc:include type="head"/>
<?php JHTML::_('behavior.mootools'); ?>
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template;?>/css/template.css" type="text/css"/>
</head>
<body>
<div id="content">
   <div id="header">
      <div id="logo">
         <img src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template;?>/images/logo123.png" border="0" alt="<?php echo JText::_(''); ?>"  />
      </div>
      <div id="main-menu"><jdoc:include type="modules" name="main-menu" />
      </div>
   </div>
<jdoc:include type="component"/>
</div> 
</div>
   </div> 
   </div>
   <div id="content-area"><jdoc:include type="message"/>
   <div id="second-menu"><jdoc:include type="modules" name="second-menu" style="none"/></div>
</div>
<div id="footer">&copy;<?php echo date("Y"); ?> <?php echo $mainframe->getCfg('sitename'); ?></div>
</body>
</html>

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

[Bayushi]

Помогите пожалуйста, котелок уже не соображает... Книжка Берри Норта тоже не сильно помогает в этом вопросе...

[Bayushi]

вот есть такой jdoc

Код:

<jdoc:include type="component" />

Который вставляет материал на страницу, разбирая стандартые шаблоны я не нашел того как сказать  этому jdoc'у куда нужно вставлять.
есть еще вот такой url, но тут используются таблицы, а я не хочу их использовать. Есть еще варианты?

Проставлюсь на пиво тому кто поможет!

[FerrumLogic]

попробуйте <jdoc:include type="component" /> в <div> обернуть

[Bayushi]

попробуйте <jdoc:include type="component" /> в <div> обернуть

Не помогло
Пробывал

Код:

<div id="component"><jdoc:include type="component"/></div>

и

Код:

<div><jdoc:include type="component"/></div>

А сам jdoc во что должен быть вложен?