Russian TYPO3 community Форум больше не используется. Присоединяйтесь к каналу #community-ru в Slack for TYPO3 community  

Вернуться   Russian TYPO3 community > Обсуждение общих технических вопросов > Общие вопросы

Ответ
 
Опции темы Опции просмотра
Старый 14.05.2015, 14:01   #1
agravin
Senior Member
 
Регистрация: 17.12.2009
Адрес: Moscow
Сообщений: 168
Angry Templavoila и меню

Добрый день. Прошу помощи у форумчан. Уже несколько дней бьюсь с наверное не сложной задачей, но никак не могу одолеть. Прикручивая html-шаблон к движку, с помощью Templavoila, написал такой скрипт:
Код:
lib.menu = HMENU
lib.menu.1 = TMENU
lib.menu.1 {
  expAll = 1
  noBlur = 1
  wrap = |
  NO {         
        allWrap = <li>|</li>    
  }
  IFSUB = 1
  IFSUB {
   allWrap = <li class="with_menu">|<ul class="sub_menu">
   }
    ACT = 1
    ACT.allWrap = <li class="active"> | 
}

lib.menu.2 = TMENU
  lib.menu.2 {
  expAll = 1
  noBlur = 1
  wrap = |</ul></li>
  NO {
wrapItemAndSub = <li>|</li>  
   } 
  
  }
Исходный код, который показывает браузер, соответствует тому, который написал верстальщик:
Код:
<ul>
	<li class="with_menu"><a href="/">Раздел 1</a>
    	<ul class="sub_menu">
        	<li><a href="/">Подраздел 1</a></li>
            <li><a href="/">Подраздел 2</a></li>
        </ul>
    </li>
    <li><a href="/">Раздел 2</a></li>
    <li><a href="/">Раздел 3</a></li>
    <li><a href="/">Раздел 4</a></li>
    <li><a href="/">Раздел 5</a></li>
</ul>
А стили поехали. Я так подозреваю, что допустил ошибку в скрипте, но парсер Templavoila ее пропустил и доделывает меню, но как-то криво. Только ошибки я и не могу найти
agravin вне форума   Ответить с цитированием
Старый 15.05.2015, 00:01   #2
Николай Сипко
Senior Member
 
Регистрация: 17.09.2012
Сообщений: 675
По умолчанию

Стандартный код трехуровневого меню TYPO3:
===========

lib.menu = HMENU
lib.menu {
wrap = <div class="menu menu_ul">|</div>
entryLevel = 0
1 = TMENU
1 {
wrap = <div class="menu_1"><ul>|</ul></div>
target = _top
NO {
wrapItemAndSub = <li>|</li>
}
ACT < .NO
ACT = 1
CUR < .NO
CUR = 1
CUR {
allWrap = <div class="menu_act">|</div>
}
}
2 = TMENU
2 {
expAll = 1
wrap = <div class="menu_2"><ul>|</ul></div>
target = _top
NO {
wrapItemAndSub = <li>|</li>
}
ACT < .NO
ACT = 1
CUR < .NO
CUR = 1
CUR {
allWrap = <div class="menu_act">|</div>
}
}
3 = TMENU
3 {
expAll = 1
wrap = <div class="menu_3"><ul>|</ul></div>
target = _top
NO {
wrapItemAndSub = <li>|</li>
}
ACT < .NO
ACT = 1
CUR < .NO
CUR = 1
CUR {
allWrap = <div class="menu_act">|</div>
}
}
}
Николай Сипко вне форума   Ответить с цитированием
Старый 15.05.2015, 18:28   #3
agravin
Senior Member
 
Регистрация: 17.12.2009
Адрес: Moscow
Сообщений: 168
По умолчанию

Николай, спасибо за ответ.

Ни один из известных мне скриптов меню не помог. Проблема оказалась в том, что парсер выдает исходный код в одну строку, что каким-то образом влияет на верстку. Разлепить теги пока не удалось. Пользовался
Цитата:
Например так работает
wrap(
<li>
|
</li>
)
от Валерия Романчева и
Цитата:
Раздел Установка - пункт 4 All Configuration. Там определи значение для [FE][tidy] = 1
от Полтиников.

В принципе можно вставить в код <wbr> , но хочется найти более красивое решение.
agravin вне форума   Ответить с цитированием
Старый 15.05.2015, 18:56   #4
Николай Сипко
Senior Member
 
Регистрация: 17.09.2012
Сообщений: 675
По умолчанию

Если речь идет о templavoila, то исходный код меню вставляют в setup.ts, например:
=======
config.htmlTag_langKey = ru
config.no_cache = 0
config.disablePrefixComment = 1

page = PAGE
page.typeNum = 0
page.10 = USER
page.10.userFunc = tx_templavoila_pi1->main_page

page.shortcutIcon = favicon.ico

page.includeCSS {
file = fileadmin/templates/ns.css
file.media = all
}
lib.menu = HMENU
lib.menu {
wrap = <div class="menu menu_ul">|</div>
entryLevel = 0
1 = TMENU
1 {
wrap = <div class="menu_1"><ul>|</ul></div>
target = _top
NO {
wrapItemAndSub = <li>|</li>
}
ACT < .NO
ACT = 1
CUR < .NO
CUR = 1
CUR {
allWrap = <div class="menu_act">|</div>
}
}
2 = TMENU
2 {
expAll = 1
wrap = <div class="menu_2"><ul>|</ul></div>
target = _top
NO {
wrapItemAndSub = <li>|</li>
}
ACT < .NO
ACT = 1
CUR < .NO
CUR = 1
CUR {
allWrap = <div class="menu_act">|</div>
}
}
3 = TMENU
3 {
expAll = 1
wrap = <div class="menu_3"><ul>|</ul></div>
target = _top
NO {
wrapItemAndSub = <li>|</li>
}
ACT < .NO
ACT = 1
CUR < .NO
CUR = 1
CUR {
allWrap = <div class="menu_act">|</div>
}
}
}
=======
В templavoila при разметке html лишь указывают путь к этому объекту (lib.menu).

Или я что-то не так понял?

А вообще-то я тоже приверженец templavoila, но сейчас осваиваю FLUIDTEMPLATE и прихожу во все больший восторг. Кстати, примеры и кодов, и их применений можно найти на http://typo3buddy.com/home/

Последний раз редактировалось Николай Сипко; 14.06.2015 в 01:36
Николай Сипко вне форума   Ответить с цитированием
Старый 15.05.2015, 19:38   #5
agravin
Senior Member
 
Регистрация: 17.12.2009
Адрес: Moscow
Сообщений: 168
По умолчанию

Да, я делаю с Templavoila.

Практически решил задачу. Осталось только понять, как сделать правильно ACT и IFSUB. Оказалось, что пример приведенный Валерием работает, но для wrapItemAndSub, wrap и прочее, разный синтаксис. Сейчас пока так
Код:
lib.menu = HMENU
lib.menu.1 = TMENU
lib.menu.1 {
  expAll = 1
  noBlur = 1
  wrap = |
 NO.allStdWrap.noTrimWrap ( 
| 
<li>|</li> 
| 
)  
  IFSUB = 1
  IFSUB {
   allWrap = <li class="with_menu">|<ul class="sub_menu">
   allStdWrap.noTrimWrap (
|
|
|
)
   }
    ACT = 1
    ACT.allWrap = <li class="active"> | </li>
	allStdWrap.noTrimWrap (
|
|
|
)
}

lib.menu.2 = TMENU
  lib.menu.2 {
  expAll = 1
  noBlur = 1
  wrap = |</ul></li>
  NO.allStdWrap.noTrimWrap ( 
| 
<li>|</li> 
| 
)  
   } 
  
  }
Как доделаю подразделы, выложу корректный код.
agravin вне форума   Ответить с цитированием
Старый 15.05.2015, 22:16   #6
Николай Сипко
Senior Member
 
Регистрация: 17.09.2012
Сообщений: 675
По умолчанию

Цитата:
Сообщение от agravin Посмотреть сообщение
Исходный код, который показывает браузер, соответствует тому, который написал верстальщик:
<ul>
<li class="with_menu"><a href="/">Раздел 1</a>
<ul class="sub_menu">
<li><a href="/">Подраздел 1</a></li>
<li><a href="/">Подраздел 2</a></li>
</ul>
</li>
<li><a href="/">Раздел 2</a></li>
<li><a href="/">Раздел 3</a></li>
<li><a href="/">Раздел 4</a></li>
<li><a href="/">Раздел 5</a></li>
</ul>
Если вы про такое меню http://nsf11.ru/index.php?id=1, то сделано оно на основе стандартного кода средствами css.
Или я что-то не понимаю?
Николай Сипко вне форума   Ответить с цитированием
Старый 15.05.2015, 22:43   #7
agravin
Senior Member
 
Регистрация: 17.12.2009
Адрес: Moscow
Сообщений: 168
По умолчанию

Если Вы посмотрите исходный код меню, в указанном Вами примере, то увидите, что его код идет одной строкой. Почему-то некоторые стили/скрипты этого иногда не любят и отображают меню криво. Как в моем случае. Именно для этого нужно разлепить теги, сделав их читаемыми.
agravin вне форума   Ответить с цитированием
Старый 15.05.2015, 22:59   #8
Николай Сипко
Senior Member
 
Регистрация: 17.09.2012
Сообщений: 675
По умолчанию

Вы первый человек, от которого я узнал, что TYPO3 код своего site-map отображает "криво".

Приятной работы!
Николай Сипко вне форума   Ответить с цитированием
Старый 15.05.2015, 23:48   #9
agravin
Senior Member
 
Регистрация: 17.12.2009
Адрес: Moscow
Сообщений: 168
По умолчанию

Я не говорил, что TYPO3 отображает криво. Я сказал, что отображает в одну строку (проглатывая пробелы и перенос строки). И это в редких случаях плохо.

Доделал скрипт (немного кривоват, но работает).

Можете вставить в свой сетап и посмотреть разницу в исходном коде браузера (Ctrl+U), до и после.
Код:
lib.menu = HMENU
lib.menu.1 = TMENU
lib.menu.1 {
  expAll = 1
  noBlur = 1
  wrap = |
 NO.allStdWrap.noTrimWrap ( 
| 
<li>|</li> 
| 
)  
  IFSUB = 1
  IFSUB {
   allWrap = <li class="with_menu">|<ul class="sub_menu">
   allStdWrap.noTrimWrap (
|
|
|
)
  }
  ACTIFSUB = 1
  ACTIFSUB {
   allWrap = <li class="active with_menu">|<ul class="sub_menu">
   allStdWrap.noTrimWrap (
|
|
|
)
   }
   
    ACT = 1
    ACT.allWrap = <li class="active"> | </li>
	allStdWrap.noTrimWrap (
|
|
|
)
}

lib.menu.2 = TMENU
  lib.menu.2 {
  expAll = 1
  noBlur = 1
  stdWrap.noTrimWrap (
|
|</ul></li> 
|
)
  NO.allStdWrap.noTrimWrap ( 
| 
<li>|</li> 
| 
)  
}
agravin вне форума   Ответить с цитированием
Старый 16.05.2015, 11:04   #10
Николай Сипко
Senior Member
 
Регистрация: 17.09.2012
Сообщений: 675
По умолчанию

Вставил в свой сетап и посмотрел разницу в исходном коде браузера (Ctrl+U), до и после:

До
=======
<div id="menu" class="header"><div class="menu menu_ul"><div class="menu_1"><ul><li><a href="index.php?id=40" target="_top">Естествознание</a></li><li><div class="menu_act"><a href="index.php?id=1" target="_top">Вопросы</a></div><div class="menu_2"><ul><li><a href="index.php?id=2" target="_top">Внушения</a></li><li><a href="index.php?id=3" target="_top">Цель</a></li><li><a href="index.php?id=4" target="_top">Место</a></li><li><a href="index.php?id=5" target="_top">Тела</a></li><li><a href="index.php?id=6" target="_top">Вращения</a></li><li><a href="index.php?id=7" target="_top">Атомы</a></li><li><a href="index.php?id=8" target="_top">Зенон</a></li></ul></div></li><li><a href="index.php?id=9" target="_top">Светила</a></li><li><a href="index.php?id=17" target="_top">Моменты</a></li><li><a href="index.php?id=25" target="_top">Понятия</a></li><li><a href="index.php?id=33" target="_top">Идеи</a></li></ul></div></div></div>

После
=======
<div id="menu" class="header">
<li class="with_menu"><a href="index.php?id=40">Естествознание</a><ul class="sub_menu">
<li><a href="index.php?id=39">Администрация</a></li>
</ul></li>
<li class="active with_menu"><a href="index.php?id=1">Вопросы</a><ul class="sub_menu">
<li><a href="index.php?id=2">Внушения</a></li>
<li><a href="index.php?id=3">Цель</a></li>
<li><a href="index.php?id=4">Место</a></li>
<li><a href="index.php?id=5">Тела</a></li>
<li><a href="index.php?id=6">Вращения</a></li>
<li><a href="index.php?id=7">Атомы</a></li>
<li><a href="index.php?id=8">Зенон</a></li>
</ul></li>
<li class="with_menu"><a href="index.php?id=9">Светила</a><ul class="sub_menu">
<li><a href="index.php?id=10">Парадоксы</a></li>
<li><a href="index.php?id=11">Модели</a></li>
<li><a href="index.php?id=12">Маятники</a></li>
<li><a href="index.php?id=13">Аналеммы</a></li>
<li><a href="index.php?id=14">Мироздание</a></li>
<li><a href="index.php?id=15">Свет</a></li>
<li><a href="index.php?id=16">Человек</a></li>
</ul></li>
<li class="with_menu"><a href="index.php?id=17">Моменты</a><ul class="sub_menu">
<li><a href="index.php?id=18">Коперник</a></li>
<li><a href="index.php?id=19">Кеплер</a></li>
<li><a href="index.php?id=20">Галилей</a></li>
<li><a href="index.php?id=21">Ньютон</a></li>
<li><a href="index.php?id=22">Исчисление</a></li>
<li><a href="index.php?id=23">Гравитация</a></li>
<li><a href="index.php?id=24">Законы</a></li>
</ul></li>
<li class="with_menu"><a href="index.php?id=25">Понятия</a><ul class="sub_menu">
<li><a href="index.php?id=26">Кинетика</a></li>
<li><a href="index.php?id=27">Масса</a></li>
<li><a href="index.php?id=28">Энергия</a></li>
<li><a href="index.php?id=29">Начала</a></li>
<li><a href="index.php?id=30">Энтропия</a></li>
<li><a href="index.php?id=31">Материя</a></li>
<li><a href="index.php?id=32">Отношения</a></li>
</ul></li>
<li class="with_menu"><a href="index.php?id=33">Идеи</a><ul class="sub_menu">
<li><a href="index.php?id=34">Вымыслы</a></li>
<li><a href="index.php?id=35">Аналогии</a></li>
<li><a href="index.php?id=36">Кванты</a></li>
<li><a href="index.php?id=37">Излучения</a></li>
<li><a href="index.php?id=38">Движущее</a></li>
</ul></li>
</div>
=======

Поясните, пожалуйста, что это дает?

И, как "написал верстальщик:
Код:
<ul>
<li class="with_menu"><a href="/">Раздел 1</a>
<ul class="sub_menu">
<li><a href="/">Подраздел 1</a></li>
<li><a href="/">Подраздел 2</a></li>
</ul>
</li>
<li><a href="/">Раздел 2</a></li>
<li><a href="/">Раздел 3</a></li>
<li><a href="/">Раздел 4</a></li>
<li><a href="/">Раздел 5</a></li>
</ul>"

Задача "верстальщика" не решена.

Может проще тогда, не мурдствуя лукаво, повставлять везде элемент site-map и вперед к css типа:

.csc-sitemap li a{
text-decoration:none;
text-shadow: 1px 4px 3px rgba(0,0,0,0.2), 0px -5px 35px rgba(255,255,255,0.3);
}
.csc-sitemap a:hover {
color: #fff;
text-shadow:
-1px -1px 0 #000,
1px -1px 0 #000,
-1px 1px 0 #000,
1px 1px 0 #000,
1px 4px 3px rgba(0,0,0,0.2), 0px -5px 35px rgba(255,255,255,0.3);
}

Последний раз редактировалось Николай Сипко; 17.05.2015 в 16:39
Николай Сипко вне форума   Ответить с цитированием
Ответ

Опции темы
Опции просмотра

Ваши права в разделе
Вы не можете создавать новые темы
Вы не можете отвечать в темах
Вы не можете прикреплять вложения
Вы не можете редактировать свои сообщения

BB code is Вкл.
Смайлы Вкл.
[IMG] код Вкл.
HTML код Выкл.

Быстрый переход

Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Двухуровневое меню в разных div vip1321 Общие вопросы 5 03.05.2011 10:54
Глюк с меню TemplaVoila agravin Общие вопросы 1 07.11.2010 21:41
TemplaVoila и выпадающее меню djpicasso Общие вопросы 5 15.10.2009 16:50
Рендеринг меню в таблицу AleXUnder Общие вопросы 3 26.03.2009 17:55
Разметка каскадного вложенного меню в TemplaVoila maaboo Общие вопросы 7 27.07.2008 17:11


Часовой пояс GMT +4, время: 14:34.


Работает на vBulletin® версия 3.8.1.
Copyright ©2000 - 2022, Jelsoft Enterprises Ltd.
Перевод: zCarot

Хостинг и техническая поддержка: TYPO3 Лаборатория