Перейти к содержимому


А Можно Поменять Верхнее Меню С Каталогом Местами


  • Авторизуйтесь для ответа в теме
Сообщений в теме: 545

#61 Flor@@@

Flor@@@

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 822 сообщений
  • Городмосква

Отправлено 13 Ноябрь 2011 - 15:29

тут

<li><a href="/" title="На главную">Главная</a>
<ul>
{% FOR menu %}
{% FOR header1 %}
{% FOR links %}
<li><a href="{menu.header1.links.URL}" {% IF menu.header1.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header1.links.TITLE %}title="{menu.header1.links.TITLE}"{% ENDIF %}>{menu.header1.links.NAME}</a></li>
{% ENDFOR %}
{% ENDFOR %}
{% ENDFOR %}
</ul>
</li>

это один пункт и подпункты.

Из них:

<li><a href="/" title="На главную">Главная</a>
ссылка на пункт а

<ul>
{% FOR menu %}
{% FOR header1 %}
{% FOR links %}
<li><a href="{menu.header1.links.URL}" {% IF menu.header1.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header1.links.TITLE %}title="{menu.header1.links.TITLE}"{% ENDIF %}>{menu.header1.links.NAME}</a></li>
{% ENDFOR %}
{% ENDFOR %}
{% ENDFOR %}
</ul>

- это автоматическое с генерированное меню ссылками на подпункты, данное меню создается в разделе Сайт->Меню
ВОт это автомантическое меню у меня почему-то не создается :(,
хотя блок меню в бэк-офисе я создала.

то есть у меня проблема с прописанием именно корневых ссылок типа: <li><a href="/" title="На главную">Главная</a>
хммм... вот так прописала: первую корневую ссылку:
<li><a href="http://{NET_DOMAIN}/title" title="На главную">Главная</a> и в результате у меня все пункты блока header1 встали в ряд вместо верхнего меню, фото добавлю ниже.

А почему во всех корневых ссылках типа: <li><a href="http://{NET_DOMAIN}/title" title="На главную">Главная</a>
<ul> ставится "На главную"???

Прикрепленные изображения

  • вид сайта 5.jpg


#62 Flor@@@

Flor@@@

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 822 сообщений
  • Городмосква

Отправлено 13 Ноябрь 2011 - 15:38

вот так получилось:

Прикрепленные изображения

  • вид сайта 6.jpg


#63 Flor@@@

Flor@@@

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 822 сообщений
  • Городмосква

Отправлено 13 Ноябрь 2011 - 15:49

вставила вот этот стиль в файл css:
#mainmenu {
width: 100%;
}

#mainmenu li {
     display: block;
     float: left;
}

#mainmenu li ul {
     background: none repeat scroll 0% 0% #000000;
     position: absolute;
     top: 40px;
     z-index: 2;
}

#mainmenu li ul li {
     display: block;
     float: none;
}

#mainmenu li:hover ul {
     display: block;
}

а таже:

#nav{padding:0 0 32px 7px; margin:0; font-size:20px;}

/* Все уровни */
#nav li { text-align:left; position:relative; }
#nav li.over { z-index:999; }
#nav li.parent {}
#nav li a { display:block; text-decoration:none; }
#nav li a:hover { text-decoration:none; }
#nav li a span { display:block; white-space:nowrap; cursor:pointer; }
#nav li ul a span { white-space:normal; }

/* 1й уровень вложенности */
#nav li {}
#nav li a{padding:0 0 0; font-weight:bold; color:#CDCDCD; line-height:normal;}
#nav li a:hover { color:#333333; }
#nav li.over a,
#nav li.active a { color:#333333; }

/* 2й уровень вложенности */
#nav ul { position:absolute; width:15em; top:0px; left:-10000px; border:0; padding:0; background:#B2B2B2; font-size:12px;}
#nav ul li { float:none; border-bottom:1px solid #FFF; }
#nav ul li.last { border-bottom:0; }
#nav ul li a { float:none; padding:3px 9px; font-weight:normal; color:#050505 !important; }
#nav ul li a:hover { color:#FFF !important; background:#333333; }
#nav ul li.active a,
#nav ul li.over a  { color:#FFF !important; background:#333333; }

/* 3й и последующие уровни... Можно писать таких стилей сколько угодно, до бесконечности... */
#nav ul ul { top:0px; }

/* Видимое меню */
#nav li.over ul { left:200px; }
#nav li.over ul li.over ul { left:15em; }
#nav li.over ul ul { left:-10000px; }
#nav li.over .indent-class{margin-left:230px;}
/********** Navigation > */

(куда его вставлять, просто так или в замену чего-либо???)

и вот этот скрипт тоже вставила:

$(document).ready(function(){
  // Действие при наведении на меню категорий, для возможности отображения вложенного подменю
  $('#nav li').hover(
    function () {
      $(this).addClass('over');
    },
    function () {
      $(this).removeClass('over');
    }
  );
});
(тоже не знаю куда конкретно его вставлять, заменяет ли он что-либо??)

после того как вставила оба Css кода и скрипт: сайт стал выглядеть гораздо лучше, но подпункты меню все равно стоят в горизонтальном ряду вместо основного меню. То есть подпункты блока header1 все таки сработали, а вот стиль меню не получается у меня нормальный подобрать, который бы открывал данное меню как выпадающее.

Кроме того я теперь при восстановлении сайта из бэк ап все равно не могу вернуть сайту первичное верхнее меню :(.

Прикрепленные изображения

  • вид сайта 7.jpg


#64 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 14 Ноябрь 2011 - 18:44

Попробуйте добавить стили в main.css

#mainmenu {
width: 100%;
}

#mainmenu li {
display: block;
float: left;
}

#mainmenu li ul {
background: none repeat scroll 0 0 #FF9933;
position: absolute;
top: 185px;
z-index: 2;
display: none;
}

#mainmenu li ul li {
display: block;
float: none;
}

#mainmenu li ul li a {
  width: 92%;
}

#mainmenu li:hover ul {
display: block;
}

#nav{padding:0 0 32px 7px; margin:0; font-size:20px;}

/* Все уровни */
#nav li { text-align:left; position:relative; }
#nav li.over { z-index:999; }
#nav li.parent {}
#nav li a { display:block; text-decoration:none; }
#nav li a:hover { text-decoration:none; }
#nav li a span { display:block; white-space:nowrap; cursor:pointer; }
#nav li ul a span { white-space:normal; }

/* 1й уровень вложенности */
#nav li {}
#nav li a{padding:0 0 0; font-weight:bold; color:#CDCDCD; line-height:normal;}
#nav li a:hover { color:#333333; }
#nav li.over a,
#nav li.active a { color:#333333; }

/* 2й уровень вложенности */
#nav ul { position:absolute; width:15em; top:0px; left:-10000px; border:0; padding:0; background:#B2B2B2; font-size:12px;}
#nav ul li { float:none; border-bottom:1px solid #FFF; }
#nav ul li.last { border-bottom:0; }
#nav ul li a { float:none; padding:3px 9px; font-weight:normal; color:#050505 !important; }
#nav ul li a:hover { color:#FFF !important; background:#333333; }
#nav ul li.active a,
#nav ul li.over a { color:#FFF !important; background:#333333; }

/* 3й и последующие уровни... Можно писать таких стилей сколько угодно, до бесконечности... */
#nav ul ul { top:0px; }

/* Видимое меню */
#nav li.over ul { left:200px; }
#nav li.over ul li.over ul { left:15em; }
#nav li.over ul ul { left:-10000px; }
#nav li.over .indent-class{margin-left:230px;}
/********** Navigation > */


#65 Flor@@@

Flor@@@

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 822 сообщений
  • Городмосква

Отправлено 15 Ноябрь 2011 - 03:52

урррраааааааааааааа! наконец-то!!!!!!!
открывается чуток кривовато, хотелось бы чтобы фон открывающегося меню не загораживал бы весь экран, но ведь оно наконец-то работает!!!
спасибо вам:).

только я все рравно умудрилась немного запутаться:
кнопки верхнего меню в бэк=офисе отличаются от тех что показываются на сайте.
вроде бы в htmlфайл я поставила код для создания выпадающего меню из 3-ей кнопки верхнего меню, но что-то не работает.

Сообщение отредактировал katteee: 15 Ноябрь 2011 - 04:23


#66 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 15 Ноябрь 2011 - 19:37

Цитата

вроде бы в htmlфайл я поставила код для создания выпадающего меню из 3-ей кнопки верхнего меню, но что-то не работает.

Думаю проблема в том что возможно вы не верно указали имя меню.

menu.header1.links.URL

а именно header1 проверьте.

#67 Flor@@@

Flor@@@

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 822 сообщений
  • Городмосква

Отправлено 15 Ноябрь 2011 - 22:00

 Vaccina (15 Ноябрь 2011 - 19:37) писал:

Думаю проблема в том что возможно вы не верно указали имя меню.

menu.header1.links.URL

а именно header1 проверьте.

верхний блок меню выглядит вот так:

#68 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 16 Ноябрь 2011 - 17:25

Вот тут например у вас видны ошибки

{% FOR menu %}
{% FOR header %}
{% FOR links %}
<li><a href="{menu.header2.links.URL}" {% IF menu.header2.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header2.links.TITLE %}title="{menu.header2.links.TITLE}"{% ENDIF %}>{menu.header2.links.NAME}</a></li>
{% ENDFOR %}
{% ENDFOR %}
{% ENDFOR %}
</ul>
</li>
<li><a href="http://www.otdyh-i-son.ru/page/Сертификаты-1" title="На главную">Сертификаты</a>
<ul>
{% FOR menu %}
{% FOR header %}
{% FOR links %}
<li><a href="{menu.header2.links.URL}" {% IF menu.header2.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header2.links.TITLE %}title="{menu.header2.links.TITLE}"{% ENDIF %}>{menu.header2.links.NAME}</a></li>
{% ENDFOR %}
{% ENDFOR %}
{% ENDFOR %}

у вас цикл

{% FOR header %} дублируется 2 раза. Т.е ссылки будут одинаковы, а вот строки
menu.header2.links.URL
и т.д не верны - в таком случае они должны были выглядеть так
menu.header.links.URL
ведь header у вас массив силок в цикле которого вы перебираете все ссылки.


По идее все должно выглядеть так

<!-- Верхний блок навигации -->
<div class="containerin" id="top-menu">
<ul class="pad-box cont620" id="mainmenu">
<li><a href="/" title="На главную">Главная</a>
<ul>
{% FOR menu %}
{% FOR header1 %}
{% FOR links %}
<li><a href="{menu.header1.links.URL}" {% IF menu.header1.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header1.links.TITLE %}title="{menu.header1.links.TITLE}"{% ENDIF %}>{menu.header1.links.NAME}</a></li>
{% ENDFOR %}
{% ENDFOR %}
{% ENDFOR %}
</ul>
</li>
<li><a href="http://www.otdyh-i-son.ru/catalog" title="На главную">Каталог</a>
<ul>
{% FOR menu %}
{% FOR header2 %}
{% FOR links %}
<li><a href="{menu.header2.links.URL}" {% IF menu.header2.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header2.links.TITLE %}title="{menu.header2.links.TITLE}"{% ENDIF %}>{menu.header2.links.NAME}</a></li>
{% ENDFOR %}
{% ENDFOR %}
{% ENDFOR %}
</ul>
</li>
<li><a href="http://www.otdyh-i-son.ru/page/Сертификаты-1" title="На главную">Сертификаты</a>
<ul>
{% FOR menu %}
{% FOR header3 %}
{% FOR links %}
<li><a href="{menu.header3.links.URL}" {% IF menu.header3.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header3.links.TITLE %}title="{menu.header3.links.TITLE}"{% ENDIF %}>{menu.header3.links.NAME}</a></li>
{% ENDFOR %}
{% ENDFOR %}
{% ENDFOR %}
</ul>
</li>
<li><a href="http://otdyh-i-son.ru/page/Скидки-1" title="На главную">Скидки</a>
<ul>
{% FOR menu %}
{% FOR header4 %}
{% FOR links %}
<li><a href="{menu.header4.links.URL}" {% IF menu.header4.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header4.links.TITLE %}title="{menu.header4.links.TITLE}"{% ENDIF %}>{menu.header4.links.NAME}</a></li>
{% ENDFOR %}
{% ENDFOR %}
{% ENDFOR %}
</ul>
</li>
<li><a href="http://otdyh-i-son.ru/page/FAQ-1" title="На главную">FAQ</a>
<ul>
{% FOR menu %}
{% FOR header5 %}
{% FOR links %}
<li><a href="{menu.header5.links.URL}" {% IF menu.header5.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header5.links.TITLE %}title="{menu.header5.links.TITLE}"{% ENDIF %}>{menu.header5.links.NAME}</a></li>
{% ENDFOR %}
{% ENDFOR %}
{% ENDFOR %}
</ul>
</li>
<li><a href="http://otdyh-i-son.ru/page/Пошаговая-инструкция-по-выбору-матраса-1" title="На главную">Помощь</a>
<ul>
{% FOR menu %}
{% FOR header6 %}
{% FOR links %}
<li><a href="{menu.header6.links.URL}" {% IF menu.header6.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header6.links.TITLE %}title="{menu.header6.links.TITLE}"{% ENDIF %}>{menu.header6.links.NAME}</a></li>
{% ENDFOR %}
{% ENDFOR %}
{% ENDFOR %}
</ul>
</li>
<li><a href="http://otdyh-i-son.ru/page/Знаете-ли-вы-1" title="На главную">Знаете ли вы?</a>
<ul>
{% FOR menu %}
{% FOR header7 %}
{% FOR links %}
<li><a href="{menu.header7.links.URL}" {% IF menu.header7.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header7.links.TITLE %}title="{menu.header7.links.TITLE}"{% ENDIF %}>{menu.header7.links.NAME}</a></li>
{% ENDFOR %}
{% ENDFOR %}
{% ENDFOR %}
</ul>
</li>
<li><a href="http://otdyh-i-son.ru/page/Доставка" title="На главную">Доставка</a>
<ul>
{% FOR menu %}
{% FOR header8 %}
{% FOR links %}
<li><a href="{menu.header8.links.URL}" {% IF menu.header8.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header8.links.TITLE %}title="{menu.header8.links.TITLE}"{% ENDIF %}>{menu.header8.links.NAME}</a></li>
{% ENDFOR %}
{% ENDFOR %}
{% ENDFOR %}
</ul>
</li>
<li><a href="http://otdyh-i-son.ru/cart" title="На главную">Корзина</a>
<ul>
{% FOR menu %}
{% FOR header9 %}
{% FOR links %}
<li><a href="{menu.header9.links.URL}" {% IF menu.header9.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header9.links.TITLE %}title="{menu.header9.links.TITLE}"{% ENDIF %}>{menu.header9.links.NAME}</a></li>
{% ENDFOR %}
{% ENDFOR %}
{% ENDFOR %}
</ul>
</li>
<li><a href="http://otdyh-i-son.ru/feedback" title="На главную">Контакты</a>
<ul>
{% FOR menu %}
{% FOR header10 %}
{% FOR links %}
<li><a href="{menu.header10.links.URL}" {% IF menu.header10.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header10.links.TITLE %}title="{menu.header10.links.TITLE}"{% ENDIF %}>{menu.header10.links.NAME}</a></li>
{% ENDFOR %}
{% ENDFOR %}
{% ENDFOR %}
</ul>
</li>
</ul>
</ul>
</li>

<div class="clr"></div>
</div>
<!-- end Верхний блок навигации -->


далее у вас должно быть создано 10 меню с именами header, header1, header2, header3, header4 и т.д

#69 Flor@@@

Flor@@@

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 822 сообщений
  • Городмосква

Отправлено 17 Ноябрь 2011 - 04:24

все исправила, спасибо большое.

#70 Flor@@@

Flor@@@

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 822 сообщений
  • Городмосква

Отправлено 27 Ноябрь 2011 - 04:01

Добавила в блок меню "Доставка" 2 пункта, но почему-то эти пункты не отразились в выпадающем меню. МОжет быть они не сразу пропиываются??

#71 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 28 Ноябрь 2011 - 19:12

Из кода видно что блок с подкаталогом пусты

<li>
<a title="Доставка" href="http://otdyh-i-son.ru/page/Доставка">Доставка</a>
 <ul> </ul>
</li>

Проверьте правильно ли вы ставили блок или его создали в разделе Меню.

#72 Flor@@@

Flor@@@

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 822 сообщений
  • Городмосква

Отправлено 29 Ноябрь 2011 - 08:17

вроде бы что блок меню №1 что блок меню №8 одинаково создавала.

и в коде не вижу между ними разницы:

<li><a href="http://otdyh-i-son.ru/" title="На главную">Главная</a>
<ul>
{% FOR menu %}
{% FOR header1 %}
{% FOR links %}
<li><a href="{menu.header1.links.URL}" {% IF menu.header1.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header1.links.TITLE %}title="{menu.header1.links.TITLE}"{% ENDIF %}>{menu.header1.links.NAME}</a></li>
{% ENDFOR %}
{% ENDFOR %}
{% ENDFOR %}
</ul>
</li>


<li><a href="http://otdyh-i-son.r...а">Доставка</a>
<ul>
{% FOR menu %}
{% FOR header8 %}
{% FOR links %}
<li><a href="{menu.header8.links.URL}" {% IF menu.header8.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header8.links.TITLE %}title="{menu.header8.links.TITLE}"{% ENDIF %}>{menu.header8.links.NAME}</a></li>
{% ENDFOR %}
{% ENDFOR %}
{% ENDFOR %}
</ul>
</li>

в первом случае есть всплывающее меню а во втором - нет, коды на мой взгляд одинаковые, блоки мен смотрите в  скрине:

Прикрепленные изображения

  • вид сайта 17.jpg
  • вид сайта 18.jpg


#73 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 29 Ноябрь 2011 - 16:35

По скриншоту видно что вы задали название такое-же как и обычно, только букву h вы задали в верхнем регистре, а используете в нижнем menu.header8.links.URL. Вам нужно переименовать меню на header8 за место Header8.

#74 ogonek7777

ogonek7777

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 2 109 сообщений
  • ГородМосква

Отправлено 02 Февраль 2012 - 18:47

 Vaccina (29 Ноябрь 2011 - 16:35) писал:

По скриншоту видно что вы задали название такое-же как и обычно, только букву h вы задали в верхнем регистре, а используете в нижнем menu.header8.links.URL. Вам нужно переименовать меню на header8 за место Header8.
Добрый день, также хотелось бы всплывающее меня такого типа http://www.svyaznoy.ru/
Пробовала сама, перечитала все на форуме, но не получается. Помогите, пжл

Сайт в подписи

#75 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 02 Февраль 2012 - 23:14

По поводу раскрывающегося меню вы можете почитать следующую тему форума http://forum.storela...ndpost__p__2072

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

#76 prukon

prukon

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 174 сообщений
  • ГородСанкт-Петербург

Отправлено 14 Февраль 2012 - 00:15

пытаюсь сделать. Всё делал по инструкции. Не получилось к сожалению. Помагите разобраться пожалуйтста.
Вот адрес сайта.

http://s30297.storeland.ru/

#77 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 14 Февраль 2012 - 20:58

Что именно у Вас не получается? Объясните пожалуйста поподробней.

#78 ogonek7777

ogonek7777

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 2 109 сообщений
  • ГородМосква

Отправлено 15 Февраль 2012 - 00:04

 prukon (14 Февраль 2012 - 00:15) писал:

пытаюсь сделать. Всё делал по инструкции. Не получилось к сожалению. Помагите разобраться пожалуйтста.
Вот адрес сайта.

http://s30297.storeland.ru/

+1
съезжает шрифт
если название короткое, то курсор не успевает добежать до открывшихся вложений и становится не активным, а вложения закрываются

#79 prukon

prukon

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 174 сообщений
  • ГородСанкт-Петербург

Отправлено 15 Февраль 2012 - 09:25

 Vaccina (14 Февраль 2012 - 20:58) писал:

Что именно у Вас не получается? Объясните пожалуйста поподробней.

У меня вообще стить css сбился и не появляется всплывающее меню. Сайт - http://gsmoda.ru/

#80 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 15 Февраль 2012 - 21:59

Цитата

У меня вообще стить css сбился и не появляется всплывающее меню. Сайт - http://gsmoda.ru/

Редактор тем - main.css:
#nav li a span {
	cursor: pointer;
	display: block;
	white-space: nowrap;
}
заменить на:
#nav li a span {
	cursor: pointer;
	display: block;
	font-size: 14px;
	white-space: pre-wrap;
}

и не раскрывается по причине того что не добавлен кусок кода в фаил main.js

Цитата

+1
съезжает шрифт
если название короткое, то курсор не успевает добежать до открывшихся вложений и становится не активным, а вложения закрываются
У Вас на данный момент имеются изменения? я просто просматривала Ваш код и ничего не заметила из кода для данного меню




Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных