Прошу советов по верстке меню (Joomla 1.5)

[Игорёk]

Всем привет!

В общем дали шаблон с горизонтальным меню и индивидуальными картинками к пунктам:

Все просто - картинка сверху, текст снизу...

Сперва впервые сделал на жумле 1.6, там все быстро получилось 0_о, имхо - 1 вариант отображению меню - список и ковыряй...

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

Как бы вопрос скорее к тем, кто делал подобное на жумле...

Edited March 28, 2011 by Игорёk

[tius]

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

[d0ublezer0]

Не получается - что именно и как?

Телепатирую: сама джумла не при чем. Ковыряйте шаблоны модуля меню и их стили.

Ну наверно как-то так можно:

<style type="text/css">
.menu li {float:left}
.menu li img {display:block; margin:0 auto;}
.menu li span {display:block; text-align:center; white-space:nowrap;}
</style>

<ul class="menu">
<li><img src="pic1.jpg" /><span>пуныкт рас</span></li>
<li><img src="pic2.jpg" /><span>пуныкт тфа</span></li>
<li><img src="pic3.jpg" /><span>пуныкт тры</span></li>
</ul>

Хотя думаю, можно и без спана обойтись.

[hexusart]

В настройках пункта меню справа закладка "Параметры - система" есть поле "Картинка меню" в списке нужно выбрать нужный рисунок. А перед этим залей картинки меню в папку твой_сайт/images/stories.

[Игорёk]

Спасибо за телепатическое общение))) В общем вчера решил эту проблему.

1) в настройках модулей жумлы, у меню поставил вид: (Legacy) Плоский список, в другом разделе: Выравнивание картинки меню - слева.

2) у меня жумловская башка <jdoc:include type="head" /> грузилась до моей)) поменял местами на всякий случай.

В итоге генерируемое меню приобретает следующий вид (кусок запостил):

<div id="topNavbar">
<div class="moduletable_menu">
<ul id="mainlevel">
<li><img src="/images/stories/main.gif" border="0" alt="Главная"/> <a href="/index.php?" class="mainlevel" >Главная</a></li>
<li><img src="/images/stories/menu.gif" border="0" alt="Меню"/> <a href="/index.php?" class="mainlevel" id="active_menu">Меню</a></li>
</ul>
</div>
</div>

Ну и дальше ксс:

#mainlevel li
{
  text-align: center;
  float: left;
  padding-right: 65px;
  display:block;
}
	a.mainlevel {
	  display: block;
	}

Получилось вот примерно так:

тестил в IE6, FF4, OPERA1101

Edited March 31, 2011 by Игорёk

[Игорёk]

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

1) Картинки к меню то я сделал на стандартном модуле (mod_mainmenu), только походу у него один существенный недостаток: ссылками являются только текст, а хотелось бы и картинки задействовать. Вывод: ставить другой модуль и не парить мозг???

2) Как Вы видите, шрифт использую не стандартный, генерировал комплект на http://www.fontsquirrel.com/fontface/generator. Короче человеческий вид (сглаживание) он приобретает только в FF4, в опере и ослике жуть:

Возможно из-за того, что в настройках fontsquirrel указал базовую обработку (BASIC. Straight conversion with minimal processing.) С оптимальной чет долго не мог вставить, даже не знаю только как получилось.

3) Если есть достаточно большая картинка для фона (там коробка), то проще и логичнее сделать фиксированный под какое-нибудь разрешение дизайн (не резиновый)???

Заранее благодарен за советы.

[Игорёk]

В общем кажется немного получилось:

Если увеличить размер шрифта до 17px (или 13pt), то все друзья станут более/менее красиво его отображать...

А с белкой шрифтоделкой и правда косяк - если выбрать оптимизации то потом нифига не работает, решил её больше не мучать

Edited April 8, 2011 by Игорёk