Отключен JavaScript

У вас отключен JavaScript. Некоторые возможности системы не будут работать. Пожалуйста, включите JavaScript для получения доступа ко всем функциям.

0

Установить Блок Вертикального Меню

Автор emin808, 30 нояб. 2012 19:08

меню дизайн совет

Вперед

Авторизуйтесь для ответа в теме

Сообщений в теме: 41

#1 emin808

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

Пользователи
538 сообщений

Отправлено 30 Ноябрь 2012 - 19:08

Приветствую !
Подскажите пожалуйста , как установить блок вертикального меню их полно всяких разных в интернете (пример: http://yandex.ru/yan...ьное меню&lr=43)

Pа отсутствием опыта самостоятельно сделать не могу.
Подскажите пожалуйста , как устанавливать такие меню, какую лучше меню поставить, )))

Наш сайт: http://asfn.storeland.ru/

БлагоДарю
Эмин

Наверх

#2 emin808

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

Пользователи
538 сообщений

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

Наверх

#3 Vaccina

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

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

Отправлено 01 Декабрь 2012 - 07:23

У вас для каталога уже установлено стандартное раскрывающееся меню. Необходимо лишь изменить стили, думаю нет надобности подгружать то что не факт будет корректно работать. Напишите подробнее что вас не устраивает в отображении меню, и какого вида вы бы хотели достичь.

Выпадающее меню для страниц можно реализовать только путем созданию под меню вручную. Подобный вопрос рассматривался тут http://forum.storela...еста/#entry2072

Наверх

#4 support 2.0

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

Модераторы
4 950 сообщений

Отправлено 01 Декабрь 2012 - 10:19

emin808 (30 Ноябрь 2012 - 19:28) писал:

Подскажите пожалуйста , как устанавливать такие меню, какую лучше меню поставить

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

Наверх

#5 emin808

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

Пользователи
538 сообщений

Отправлено 02 Декабрь 2012 - 11:43

Добрый день, благодарю за отклик . :rolleyes:

Хотелось показать Вам пример меню ^_^

Возможно ли установить такое?!
Описывают как это делать здесь, правда на английском , но с хромом без пробл читается

С наилучшими пожеланиями

Эмин

Мега меню говорят это называется ^_^

Наверх

#6 emin808

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

Пользователи
538 сообщений

Отправлено 02 Декабрь 2012 - 17:35

Наверх

#7 Koderhan

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

Модератоpы
6 227 сообщений

Отправлено 03 Декабрь 2012 - 11:03

emin808 (02 Декабрь 2012 - 11:43) писал:

Добрый день, благодарю за отклик . :rolleyes:

Хотелось показать Вам пример меню ^_^

Возможно ли установить такое?!
Описывают как это делать здесь, правда на английском , но с хромом без пробл читается

С наилучшими пожеланиями

Эмин

Мега меню говорят это называется ^_^

Это меню использует js для отображения.
И нет гарантий что отображение меню будет выглядить корректно в всех браузерах.
Панель администратора, Сайт-> Редактор тем.
Пожалуйста сделайте резервную копию сайта перед внесением изменений.
Как писала уже выше Vaccina, в подменю ссылки придется вставлять вручную.

Открыть файл HTML.
Найти код:

<!-- Каталог товаров -->
		 <div class="nav-container">
			 {%IFNOT catalog_full_empty%}
			 {%FOR catalog_full%}
				 {% IF catalog_full.FIRST %}<ul class="nav">{% ENDIF %}
				 <li class="
				 level{catalog_full.LEVEL}
				 nav-{catalog_full.index}
				 {% IF catalog_full.CURRENT %}active{% ELSEIF catalog_full.CURRENT_PARENT %}active{% ENDIF %}
				 {% IF catalog_full.ISSET_SUB %}parent{% ENDIF %}
				
				 " {% IF catalog_full.HIDE %}style="display:none;"{% ENDIF %}>
				 <a href="{catalog_full.URL}"><span>{catalog_full.NAME}</span></a>
				 {% IF catalog_full.ISSET_SUB=0 %}</li>{% ENDIF %}
				 {% IF catalog_full.LAST %}{%FOR out%}</ul>{%IFNOT catalog_full.out.LAST%}</li>{%ENDIF%}{%ENDFOR%}{% ENDIF %}
			 {%ENDFOR%}
			 {%ENDIF%}
		 </div>
		 <!-- /Каталог товаров -->

Заменить на:

<!-- Каталог товаров -->
		 <div class="nav-container">
<ul id="mega-1" class="mega-menu">
<li><a href="#">Menu Item A</a>
	 <ul>
		 <li><a href="#">Sub-Header 1</a>
			 <ul>
				 <li><a href="#">Menu Link</a></li>
				 <li><a href="#">Menu Link</a></li>
				 <li><a href="#">Menu Link</a></li>
			 </ul>
		 </li>
		 <li><a href="#">Sub-Header 2</a>
			 <ul>
				 <li><a href="#">Menu Link</a></li>
				 <li><a href="#">Menu Link</a></li>
				 <li><a href="#">Menu Link</a></li>
			 </ul>
		 </li>
		 <li><a href="#">Sub-Header 3</a>
			 <ul>
				 <li><a href="#">Menu Link</a></li>
				 <li><a href="#">Menu Link</a></li>
				 <li><a href="#">Menu Link</a></li>
			 </ul>
		 </li>
	 </ul>
</li>
</ul>
		 </div>
		 <!-- /Каталог товаров -->

Добавить в редактор тем файлы.
Скачать на компьютер архив и добавить содержимые файлы в редактор тем.

jquery.hoverIntent.minified2.zip 5,6К 206 Количество загрузок:
Затем подключим файлы к сайту.
Для этого откроем файл html.
И после кода:

<!-- Скрипты магазина -->
  <script type="text/javascript" src="{ASSETS_JS_PATH}main.js"></script>

Код:

<script type='text/javascript' src='{ASSETS_JS_PATH}jquery.hoverIntent.minified.js'></script>
<script type='text/javascript' src='{ASSETS_JS_PATH}query.dcverticalmegamenu.1.3.js'></script>

Файлы подключены.
Теперь откроем файл main.csstemplate.
И допишем в конец файла код:

/* Vertical Mega Menu Styles */
.mega-menu{
font: bold 13px Arial, sans-serif;
line-height: 16px;
background: #333;
border-left: 1px solid #1B1B1B;
position: relative; /* Required */
}
.mega-menu li a {
display: block;
color: #fff;
padding: 12px 38px 12px 25px;
text-shadow: 1px 1px 1px #000;
text-decoration: none;
border-top: 1px solid #555;
border-bottom: 1px solid #222;
border-right: 1px solid #1B1B1B;
}
.mega-menu li a:hover, .mega-menu li.mega-hover a {
background: #4b4b4b;
color: #fff;
border-right: 1px solid #4b4b4b;
}
.mega-menu li a.dc-mega {
position: relative;
}
/* Add arrow icon to parent links */
.mega-menu li a .dc-mega-icon {
display: block;
position: absolute;
top: 18px;
right: 15px;
width: 6px;
height: 8px;
background: url({ASSETS_IMAGES_PATH}arrow_right.png) no-repeat 0 0;
}
/* Mega menu container */
.mega-menu li .sub-container {
position: absolute; /* Required */
background: #4B4B4B;
padding: 10px 10px 0 10px;
overflow: hidden;
border: 1px solid #4b4b4b;
border-left: none;
}
.mega-menu li .sub .row {
width: 100%; overflow: hidden; /* Clear floats */
}
.mega-menu li .sub li {
float: none;
width: 150px;
font-size: 1em;
font-weight: normal;
}
.mega-menu li .sub li.mega-hdr {
float: left; /* Required */
margin: 0 5px 10px 5px;
}
.mega-menu li .sub a, .mega-menu.left li .sub a {
background: none;
border: none;
text-shadow: none;
float: none;
color: #fff;
padding: 7px 10px;
display: block;
text-decoration: none;
font-size: 0.9em;
}
.mega-menu li .sub li.mega-hdr a.mega-hdr-a {
padding: 5px 5px 5px 15px;
margin-bottom: 5px;
background: #E88221;
text-transform: uppercase;
font-weight: bold;
color: #fff;
text-shadow: 1px 1px 1px #333;
}
.mega-menu li .sub li.mega-hdr a.mega-hdr-a:hover {
color: #000;
text-shadow: none;
}
.mega-menu .sub li.mega-hdr li a {
padding: 4px 5px 4px 20px;
background: url({ASSETS_IMAGES_PATH}arrow_white.png) no-repeat 5px 8px;
font-weight: normal;
}
.mega-menu .sub li.mega-hdr li a:hover {
color: #a32403;
background: #efefef url({ASSETS_IMAGES_PATH}arrow_on.png) no-repeat 5px 8px;
}
.mega-menu .sub ul li {
padding-right: 0;
}
/* Styling for menu items with only 2 levels */
.mega-menu li .sub-container.non-mega .sub {
padding: 10px;}
.mega-menu li .sub-container.non-mega li {
padding: 0;
margin: 0;
width: 150px;
}
.mega-menu li .sub-container.non-mega li a {
padding: 7px 5px 7px 22px;
background: url({ASSETS_IMAGES_PATH}arrow_white.png) no-repeat 7px 10px;
}
.mega-menu li .sub-container.non-mega li a:hover {
color: #a32403;
background: #efefef url({ASSETS_IMAGES_PATH}arrow_on.png) no-repeat 7px 10px;
}

Наверх

#8 emin808

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

Пользователи
538 сообщений

Отправлено 03 Декабрь 2012 - 13:50

Урааа, все получилось !!
Низкий поклон Вам!

Проверил по всем браузерам , все работает , отображается корректно <_<

Чуть чуть разобрался, но вот хотелось бы попросить у Вас помощи в настройке данного меню.
Ссылки и имена разделов Я разобрался как устанавливать , но нам желательно , чтоб меню работало режиме как в примере 1 показано (это не понятно мне как делать)

Пожалуйста подскажите, как настроить?!

http://asfn.storeland.ru/

Наверх

#9 Koderhan

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

Модератоpы
6 227 сообщений

Отправлено 03 Декабрь 2012 - 14:54

emin808 (03 Декабрь 2012 - 13:50) писал:

Урааа, все получилось !!
Низкий поклон Вам!

Проверил по всем браузерам , все работает , отображается корректно <_<

Чуть чуть разобрался, но вот хотелось бы попросить у Вас помощи в настройке данного меню.
Ссылки и имена разделов Я разобрался как устанавливать , но нам желательно , чтоб меню работало режиме как в примере 1 показано (это не понятно мне как делать)

Пожалуйста подскажите, как настроить?!

http://asfn.storeland.ru/

Попробуйте загрузить файлы из архива который ссылка http://forum.storela...&attach_id=3735
Эти файлы у вас подключаются к сайту. Но они почему то пустые.

Наверх

#10 emin808

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

Пользователи
538 сообщений

Отправлено 03 Декабрь 2012 - 15:25

Загрузил, изменений нет

Наверх

#11 emin808

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

Пользователи
538 сообщений

Отправлено 03 Декабрь 2012 - 15:55

тут ещё такая деталь есть

Наверх

#12 Vaccina

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

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

Отправлено 04 Декабрь 2012 - 05:54

У вас отсутствуют следующие подключенные файлы

NetworkError: 404 Not Found - http://asfn.storelan...ent.minified.js
NetworkError: 404 Not Found - http://asfn.storelan...megamenu.1.3.js
NetworkError: 404 Not Found - http://asfn.storelan...megamenu.1.3.js

Проверьте ссылку на данные файлы. Данные файлы подключаются у вас в шаблоне "HTML" примерно так

<script type='text/javascript' src='/web/upload/assets/js/154/153295/jquery.hoverIntent.minified.js'></script>
<script type='text/javascript' src='/web/upload/assets/js/154/153295/query.dcverticalmegamenu.1.3.js'></script>

Вам необходимо загрузить необходимые файлы в разделе редактора тем, и изменить путь к этим файлам в шаблоне "HTML".

Наверх

#13 emin808

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

Пользователи
538 сообщений

Отправлено 04 Декабрь 2012 - 09:47

Да, Я заменил, изменений нет(

Тут еще вот что заметил:
Я заменил логотип, на сайте он изменился, а захожу в редактор, файлы, там жму лого, а там предыдущий логотип

Наверх

#14 Koderhan

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

Модератоpы
6 227 сообщений

Отправлено 04 Декабрь 2012 - 10:29

emin808 (04 Декабрь 2012 - 09:47) писал:

Да, Я заменил, изменений нет(

Тут еще вот что заметил:
Я заменил логотип, на сайте он изменился, а захожу в редактор, файлы, там жму лого, а там предыдущий логотип

Открыть файл HTML (Панель администратора, Сайт -> Редактор тем).
Найти код:

<!-- Скрипты магазина -->
  <script type="text/javascript" src="{ASSETS_JS_PATH}main.js"></script>

Вставить код:

<script type='text/javascript' src='{ASSETS_JS_PATH}jquery.hoverIntent.js'></script>
<script type='text/javascript' src='{ASSETS_JS_PATH}jquery.dcverticalmegamenu.1.2.js'></script>

Наверх

#15 emin808

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

Пользователи
538 сообщений

Отправлено 04 Декабрь 2012 - 12:14

Извините пожалуйста, но у меня Я так понимаю стояла старая версия шаблона "Техника"
Сейчас Я обновил шаблон, (очень нравится)

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

Я надеюсь Я Вас не сильно достал , но подскажите пожалуйста , как же мене сейчас уже на обновлённый шаблон установить это меню.?!

http://asfn.storeland.ru/

Наверх

#16 Koderhan

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

Модератоpы
6 227 сообщений

Отправлено 04 Декабрь 2012 - 13:45

Делаем все тоже самое кроме замены кода в файле HTML.
Найти код:

<div class="span4 footer" style="padding-top: 0px;"> 
		  <div class="menu_main">
			<span class="link_nav"></span><a href="#" class="link_nav">Меню</a>
			<ul>
			<!-- Каталог товаров -->
			  <div class="menu_main">
				<span class="link_nav"></span><a href="#" class="link_nav">Каталог</a>
				<a href="{CATALOG_URL}" title="Каталог" style="text-decoration: none"><h4 class="hidden-phone">Каталог</h4></a>
				{%IFNOT catalog_full_empty%}
				  {%FOR catalog_full%}
					{% IF catalog_full.FIRST %}<ul>{% ENDIF %}
					<li {% IF catalog_full.CURRENT %}class="open"{% ELSEIF catalog_full.CURRENT_PARENT %}class="open"{% ENDIF %}>
					  <a href="{catalog_full.URL}"{% IF catalog_full.CURRENT %}class="selected"{% ENDIF %}>{catalog_full.NAME}</a><span class="icons"{% IFNOT catalog_full.ISSET_SUB %}style="display: none;"{% ENDIF %}></span>
					{% IF catalog_full.ISSET_SUB=0 %}</li>{% ENDIF %}
					{% IF catalog_full.LAST %}{%FOR out%}</ul>{%IFNOT catalog_full.out.LAST%}</li>{%ENDIF%}{%ENDFOR%}{% ENDIF %}
				  {%ENDFOR%}
				{%ENDIF%}
			  </div>
			  <!-- /Каталог товаров -->

Заменить на:

<div class="span4 footer" style="padding-top: 0px;"> 
		  <div >
			<span class="link_nav"></span><a href="#" class="link_nav">Меню</a>
			<ul>
			<!-- Каталог товаров -->
			  <ul id="mega-1" class="mega-menu">
	<li><a href="#">Menu Item A</a>
		<ul>
			<li><a href="#">Sub-Header 1</a>
				<ul>
					<li><a href="#">Menu Link</a></li>
					<li><a href="#">Menu Link</a></li>
					<li><a href="#">Menu Link</a></li>
				</ul>
			</li>
			<li><a href="#">Sub-Header 2</a>
				<ul>
					<li><a href="#">Menu Link</a></li>
					<li><a href="#">Menu Link</a></li>
					<li><a href="#">Menu Link</a></li>
				</ul>
			</li>
			<li><a href="#">Sub-Header 3</a>
				<ul>
					<li><a href="#">Menu Link</a></li>
					<li><a href="#">Menu Link</a></li>
					<li><a href="#">Menu Link</a></li>
				</ul>
			</li>
		</ul>
	</li>
</ul>
			  <!-- /Каталог товаров -->

Наверх

#17 emin808

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

Пользователи
538 сообщений

Отправлено 04 Декабрь 2012 - 14:58

Все установилось отлично, но выпадающая функция так и не работает

http://asfn.storeland.ru/

Наверх

#18 Koderhan

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

Модератоpы
6 227 сообщений

Отправлено 04 Декабрь 2012 - 15:42

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

Наверх

#19 emin808

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

Пользователи
538 сообщений

Отправлено 04 Декабрь 2012 - 16:19

По товарам все устраивает,

нам наши структурные ссылки разместить надо (их много!)
Стандартное меню разделов сайте не выпадающее (идет вниз)

Наверх

#20 emin808

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

Пользователи
538 сообщений

Отправлено 05 Декабрь 2012 - 00:09

Наверх

Вперед

Обратно в Изменение общей стилистики

Темы с аналогичным тегами меню дизайн, совет

	Повышение продаж, продвижение → Общие вопросы → Прошу Совета.. Автор Гость_Daria_* , 10 нояб. 2013 ИМ подскажите, совет, сумки		6 Ответов 1 431 Просмотров	Roman_Latyshev 11 нояб. 2013
	Повышение продаж, продвижение → Общие вопросы → Затруднения С Модификацией (Совет Новичку) Автор Гость_D1gma_* , 11 авг. 2013 модификация, trouble, затруднение и 2 еще...		Популярная тема 10 Ответов 1 583 Просмотров	Vaccina 16 авг. 2013

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

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

Установить Блок Вертикального Меню

Темы с аналогичным тегами меню дизайн, совет

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

Войти

Google поиск