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


Хочется Сделать Сверху Основное Меню


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

#1 explosive

explosive

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

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

Отправлено 19 Ноябрь 2016 - 22:17

На сайте: http://zikdom.ru хочется сделать меню сверху, как на картинке в общей стилистике.
Помогите, плз, в реализацией



XJ7MYu-Tl70.jpg

Меню не по каталогу, а типа Главная-Доставка и тп

#2 Danil

Danil

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

  • Пользователи
  • PipPipPipPip
  • 4 645 сообщений

Отправлено 20 Ноябрь 2016 - 10:36

Просмотр сообщенияexplosive (19 Ноябрь 2016 - 22:17) писал:

На сайте: http://zikdom.ru хочется сделать меню сверху, как на картинке в общей стилистике.
Помогите, плз, в реализацией



Прикрепленный файл XJ7MYu-Tl70.jpg

Меню не по каталогу, а типа Главная-Доставка и тп
Здравствуйте.
Изменения Вам произвел, проверьте.

#3 explosive

explosive

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

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

Отправлено 20 Ноябрь 2016 - 11:52

Уже лучше, но чтобы не списком,  а в строчку, пожалуйста

Ну и оперативность! Спасибо!

#4 Mr.Nito

Mr.Nito

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

  • Модераторы
  • 1 364 сообщений

Отправлено 30 Ноябрь 2016 - 09:45

Просмотр сообщенияexplosive (20 Ноябрь 2016 - 11:52) писал:

Уже лучше, но чтобы не списком,  а в строчку, пожалуйста

Ну и оперативность! Спасибо!

Здравствуйте.
Сейчас пункты меню отображаются в строчку.Если необходимо другое расположение( как на скриншоте 2) сообщите нам.

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

  • 30-11-2016 9-42-46.jpg
  • 30-11-2016 9-45-21.jpg


#5 sail12

sail12

    Пользователь

  • Пользователи
  • PipPip
  • 31 сообщений

Отправлено 03 Ноябрь 2017 - 02:33

Подскажите пожалуйста как мне переместить меню, с левой стороны на верх. И хотелось бы что бы   раздел "Статьи" был выпадающим.

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

  • выпадающее меню.png


#6 Vaccina

Vaccina

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

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

Отправлено 03 Ноябрь 2017 - 05:17

Здравствуйте.

Зайдите в раздел Сайт - Редактор шаблонов - HTML - найдите и удалите:
<!-- Блок навигации -->
			{% IFNOT menu_empty %}
			  <ul class="span44 links">
				{% FOR menu %}
				  {% FOR header %}
					{% FOR links %}
	 <li {% IF menu.header.links.first %}class="first"{% ELSEIF menu.header.links.last %}class="last"{% ENDIF %}>
						<a href="{menu.header.links.URL}" {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %}
						  class="{% IF menu.header.links.NAME=Каталог %}catalog{% ELSEIF menu.header.links.NAME=Каталог товаров %}catalog{% ELSEIF menu.header.links.NAME=Оплата %}payment{% ELSEIF menu.header.links.NAME=Акции %}present{% ELSEIF menu.header.links.NAME=Акции магазина %}present{% ELSEIF menu.header.links.NAME=Доставка %}clock{% ELSEIF menu.header.links.NAME=Контакты %}address{% ELSEIF menu.header.links.NAME=Связь с администрацией %}address{% ELSEIF menu.header.links.NAME=Л.Кабинет %}briefcase{% ELSEIF menu.header.links.NAME=Личный кабинет %}briefcase{% ELSEIF menu.header.links.NAME=Выход %}key{% ELSEIF menu.header.links.NAME=Вход в бэк-офис %}key{% ELSEIF menu.header.links.NAME=Войти в ЛК %}key{% ELSEIF menu.header.links.NAME=Вход в личный кабинет %}key{% ELSEIF menu.header.links.NAME=Мои заказы %}tick{% ELSEIF menu.header.links.NAME=История заказов %}tick{% ELSEIF menu.header.links.NAME=Новинки %}label{% ELSEIF menu.header.links.NAME=Хиты %}heart{% ELSEIF menu.header.links.NAME=Хиты продаж %}heart{% ELSEIF menu.header.links.NAME=Статьи %}clipboard{% ELSEIF menu.header.links.NAME=Корзина %}cart{% ELSEIF menu.header.links.NAME=Главная %}home{% ELSEIF menu.header.links.NAME=Лента новостей %}document{% ELSEIF menu.header.links.NAME=Новости магазина %}document{% ELSEIF menu.header.links.NAME=Каталог статей %}document{% ELSEIF menu.header.links.NAME=Новости СМИ %}document{% ELSEIF menu.header.links.NAME=Регистрация %}user{% ELSEIF menu.header.links.NAME=Восстановление пароля %}user{% ENDIF %}{% IF menu.header.links.SELECTED %}-act selected{% ENDIF %}">{menu.header.links.NAME}</a>
					  </li>
							{% ENDFOR %}
				  {% ENDFOR %}
				{% ENDFOR %}
			  </ul>
			{% ENDIF %}
			<div class="clear"></div>
			<!-- Прелоадер изображений которые появляются при наведеннии на ссылку в меню -->
			<div style="position:absolute;top:-9999px;">
			  <div class="header">
				<ul class="links">
				  <li>
					<a class="catalog-act"></a>
					<a class="present-act"></a>
					<a class="briefcase-act"></a>
					<a class="key-act"></a>
					<a class="tick-act"></a>
					<a class="label-act"></a>
					<a class="heart-act"></a>
					<a class="clipboard-act"></a>
					<a class="address-act"></a>
					<a class="clock-act"></a>
					<a class="cart-act"></a>
					<a class="user-act"></a>
					<a class="document-act"></a>
					<a class="home-act"></a>
				  </li>
				</ul>
			  </div>
			</div>
			<!-- /Блок навигации -->
            
далее найдите:
 <!-- Правый блок. Контент сайта -->
	  <div class="span8" style="padding-bottom: 10px;">
	  <div class="row-fluid">

после него вставьте:
<!-- Блок навигации -->
<div class="span12">
			{% IFNOT menu_empty %}
			  <ul class="links">
				{% FOR menu %}
				  {% FOR header %}
					{% FOR links %}
	 <li {% IF menu.header.links.first %}class="first"{% ELSEIF menu.header.links.last %}class="last"{% ENDIF %}>
						<a href="{menu.header.links.URL}" {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %}
						  class="{% IF menu.header.links.NAME=Каталог %}catalog{% ELSEIF menu.header.links.NAME=Каталог товаров %}catalog{% ELSEIF menu.header.links.NAME=Оплата %}payment{% ELSEIF menu.header.links.NAME=Акции %}present{% ELSEIF menu.header.links.NAME=Акции магазина %}present{% ELSEIF menu.header.links.NAME=Доставка %}clock{% ELSEIF menu.header.links.NAME=Контакты %}address{% ELSEIF menu.header.links.NAME=Связь с администрацией %}address{% ELSEIF menu.header.links.NAME=Л.Кабинет %}briefcase{% ELSEIF menu.header.links.NAME=Личный кабинет %}briefcase{% ELSEIF menu.header.links.NAME=Выход %}key{% ELSEIF menu.header.links.NAME=Вход в бэк-офис %}key{% ELSEIF menu.header.links.NAME=Войти в ЛК %}key{% ELSEIF menu.header.links.NAME=Вход в личный кабинет %}key{% ELSEIF menu.header.links.NAME=Мои заказы %}tick{% ELSEIF menu.header.links.NAME=История заказов %}tick{% ELSEIF menu.header.links.NAME=Новинки %}label{% ELSEIF menu.header.links.NAME=Хиты %}heart{% ELSEIF menu.header.links.NAME=Хиты продаж %}heart{% ELSEIF menu.header.links.NAME=Статьи %}clipboard{% ELSEIF menu.header.links.NAME=Корзина %}cart{% ELSEIF menu.header.links.NAME=Главная %}home{% ELSEIF menu.header.links.NAME=Лента новостей %}document{% ELSEIF menu.header.links.NAME=Новости магазина %}document{% ELSEIF menu.header.links.NAME=Каталог статей %}document{% ELSEIF menu.header.links.NAME=Новости СМИ %}document{% ELSEIF menu.header.links.NAME=Регистрация %}user{% ELSEIF menu.header.links.NAME=Восстановление пароля %}user{% ENDIF %}{% IF menu.header.links.SELECTED %}-act selected{% ENDIF %}">{menu.header.links.NAME}</a>
					  </li>
							{% ENDFOR %}
				  {% ENDFOR %}
				{% ENDFOR %}
			  </ul>
			{% ENDIF %}
			<div class="clear"></div>
			<!-- Прелоадер изображений которые появляются при наведеннии на ссылку в меню -->
			<div style="position:absolute;top:-9999px;">
			  <div class="header">
				<ul class="links">
				  <li>
					<a class="catalog-act"></a>
					<a class="present-act"></a>
					<a class="briefcase-act"></a>
					<a class="key-act"></a>
					<a class="tick-act"></a>
					<a class="label-act"></a>
					<a class="heart-act"></a>
					<a class="clipboard-act"></a>
					<a class="address-act"></a>
					<a class="clock-act"></a>
					<a class="cart-act"></a>
					<a class="user-act"></a>
					<a class="document-act"></a>
					<a class="home-act"></a>
				  </li>
				</ul>
			  </div>
			</div>
			
			</div>
			<!-- /Блок навигации -->
            
            
Далее зайдите в шаблон main.css - найдите:
.header .links {font-size:1.2em;}
.header .links li{display:block;float:left;width:102px; padding-bottom:6px;}
.header .links li a{white-space:nowrap;height:20px;line-height:20px;vertical-align:middle;display:block; color:#B2B2B2; text-decoration:none;padding-left:20px;text-align:left;}
.header .links li a:hover,
.header .links li a.hover{text-decoration:none; color:#000;}
.header .links li a.catalog{background:url("{ASSETS_IMAGES_PATH}menu_icon_catalog_16.png?design=tech") left center no-repeat;}
.header .links li a.catalog-act {background:url("{ASSETS_IMAGES_PATH}menu_icon_catalog_16_act.png?design=tech") left center no-repeat;}
.header .links li a.payment{background:url("{ASSETS_IMAGES_PATH}menu_icon_payment_16.png?design=tech") left center no-repeat;}
.header .links li a.payment-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_payment_16_act.png?design=tech") left center no-repeat;}
.header .links li a.present{background:url("{ASSETS_IMAGES_PATH}menu_icon_present_16.png?design=tech") left center no-repeat;}
.header .links li a.present-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_present_16_act.png?design=tech") left center no-repeat;}
.header .links li a.briefcase{background:url("{ASSETS_IMAGES_PATH}menu_icon_briefcase_16.png?design=tech") left center no-repeat;}
.header .links li a.briefcase-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_briefcase_16_act.png?design=tech") left center no-repeat;}
.header .links li a.key{background:url("{ASSETS_IMAGES_PATH}menu_icon_key_16.png?design=tech") left center no-repeat;}
.header .links li a.key-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_key_16_act.png?design=tech") left center no-repeat;}
.header .links li a.tick{background:url("{ASSETS_IMAGES_PATH}menu_icon_tick_16.png?design=tech") left center no-repeat;}
.header .links li a.tick-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_tick_16_act.png?design=tech") left center no-repeat;}
.header .links li a.label{background:url("{ASSETS_IMAGES_PATH}menu_icon_label_16.png?design=tech") left center no-repeat;}
.header .links li a.label-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_label_16_act.png?design=tech") left center no-repeat;}
.header .links li a.heart{background:url("{ASSETS_IMAGES_PATH}menu_icon_heart_16.png?design=tech") left center no-repeat;}
.header .links li a.heart-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_heart_16_act.png?design=tech") left center no-repeat;}
.header .links li a.clipboard{background:url("{ASSETS_IMAGES_PATH}menu_icon_clipboard_16.png?design=tech") left center no-repeat;}
.header .links li a.clipboard-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_clipboard_16_act.png?design=tech") left center no-repeat;}
.header .links li a.address{background:url("{ASSETS_IMAGES_PATH}menu_icon_address_16.png?design=tech") left center no-repeat;}
.header .links li a.address-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_address_16_act.png?design=tech") left center no-repeat;}
.header .links li a.clock{background:url("{ASSETS_IMAGES_PATH}menu_icon_clock_16.png?design=tech") left center no-repeat;}
.header .links li a.clock-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_clock_16_act.png?design=tech") left center no-repeat;}
.header .links li a.cart{background:url("{ASSETS_IMAGES_PATH}menu_icon_cart_16.png?design=tech") left center no-repeat;}
.header .links li a.cart-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_cart_16_act.png?design=tech") left center no-repeat;}
.header .links li a.user{background:url("{ASSETS_IMAGES_PATH}menu_icon_user_16.png?design=tech") left center no-repeat;}
.header .links li a.user-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_user_16_act.png?design=tech") left center no-repeat;}
.header .links li a.document{background:url("{ASSETS_IMAGES_PATH}menu_icon_document_16.png?design=tech") left center no-repeat;}
.header .links li a.document-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_document_16_act.png?design=tech") left center no-repeat;}
.header .links li a.home{background:url("{ASSETS_IMAGES_PATH}menu_icon_home_16.png?design=tech") left center no-repeat;}
.header .links li a.home-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_home_16_act.png?design=tech") left center no-repeat;}


замените на:
.span8 .row-fluid .links {font-size: 1.2em;padding: 5px;background: #fff;}
.span8 .row-fluid .links li{display:inline-block;float:left;width:102px; padding-bottom:6px;}
.span8 .row-fluid .links li a{white-space:nowrap;height:20px;line-height:20px;vertical-align:middle;display:block; color:#B2B2B2; text-decoration:none;padding-left:20px;text-align:left;}
.span8 .row-fluid .links li a:hover,
.span8 .row-fluid .links li a.hover{text-decoration:none; color:#000;}
.span8 .row-fluid .links li a.catalog{background:url("{ASSETS_IMAGES_PATH}menu_icon_catalog_16.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.catalog-act {background:url("{ASSETS_IMAGES_PATH}menu_icon_catalog_16_act.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.payment{background:url("{ASSETS_IMAGES_PATH}menu_icon_payment_16.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.payment-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_payment_16_act.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.present{background:url("{ASSETS_IMAGES_PATH}menu_icon_present_16.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.present-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_present_16_act.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.briefcase{background:url("{ASSETS_IMAGES_PATH}menu_icon_briefcase_16.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.briefcase-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_briefcase_16_act.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.key{background:url("{ASSETS_IMAGES_PATH}menu_icon_key_16.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.key-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_key_16_act.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.tick{background:url("{ASSETS_IMAGES_PATH}menu_icon_tick_16.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.tick-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_tick_16_act.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.label{background:url("{ASSETS_IMAGES_PATH}menu_icon_label_16.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.label-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_label_16_act.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.heart{background:url("{ASSETS_IMAGES_PATH}menu_icon_heart_16.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.heart-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_heart_16_act.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.clipboard{background:url("{ASSETS_IMAGES_PATH}menu_icon_clipboard_16.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.clipboard-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_clipboard_16_act.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.address{background:url("{ASSETS_IMAGES_PATH}menu_icon_address_16.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.address-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_address_16_act.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.clock{background:url("{ASSETS_IMAGES_PATH}menu_icon_clock_16.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.clock-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_clock_16_act.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.cart{background:url("{ASSETS_IMAGES_PATH}menu_icon_cart_16.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.cart-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_cart_16_act.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.user{background:url("{ASSETS_IMAGES_PATH}menu_icon_user_16.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.user-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_user_16_act.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.document{background:url("{ASSETS_IMAGES_PATH}menu_icon_document_16.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.document-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_document_16_act.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.home{background:url("{ASSETS_IMAGES_PATH}menu_icon_home_16.png?design=tech") left center no-repeat;}
.span8 .row-fluid .links li a.home-act{background:url("{ASSETS_IMAGES_PATH}menu_icon_home_16_act.png?design=tech") left center no-repeat;} 


#7 sail12

sail12

    Пользователь

  • Пользователи
  • PipPip
  • 31 сообщений

Отправлено 03 Ноябрь 2017 - 14:53

Как сделать что бы верхнее меню состояло из черных кнопок?

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

  • ццу.png


#8 Danil

Danil

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

  • Пользователи
  • PipPipPipPip
  • 4 645 сообщений

Отправлено 03 Ноябрь 2017 - 16:32

Просмотр сообщенияsail12 (03 Ноябрь 2017 - 14:53) писал:

Как сделать что бы верхнее меню состояло из черных кнопок?
Здравствуйте.
В main.css найдите код
.span8 .row-fluid .links {font-size: 1.2em;padding: 5px;background: #fff;}
.span8 .row-fluid .links li{display:inline-block;float:left;width:102px; padding-bottom:6px;}
.span8 .row-fluid .links li a{white-space:nowrap;height:20px;line-height:20px;vertical-align:middle;display:block; color:#B2B2B2; text-decoration:none;padding-left:20px;text-align:left;}
.span8 .row-fluid .links li a:hover,
.span8 .row-fluid .links li a.hover{text-decoration:none; color:#000;}
и замените на
.span8 .row-fluid .links {font-size: 1.2em;padding: 5px;overflow:hidden;}
.span8 .row-fluid .links li{display:inline-block;float:left;width:102px;background:#000;}
.span8 .row-fluid .links li:hover{background-color: #5bb75b;}
.span8 .row-fluid .links li a{white-space:nowrap;height:20px;line-height:20px;vertical-align:middle;display:block; color:#fff!important; text-decoration:none;padding:10px 10px 10px 30px;text-align:left;}
.span8 .row-fluid .links li a:hover,
.span8 .row-fluid .links li a.hover{text-decoration:none; color:#fff !important;}
так же найдите код
.links li.last { background:none !important; padding-right:0 !important; }
и замените на
.links li.last {padding-right:0 !important; }
.span8 .row-fluid .links li a {background-position-x: 10px !important;}


#9 sail12

sail12

    Пользователь

  • Пользователи
  • PipPip
  • 31 сообщений

Отправлено 03 Ноябрь 2017 - 17:23

Спасибо!
Как убрать иконки с кнопок?

#10 Danil

Danil

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

  • Пользователи
  • PipPipPipPip
  • 4 645 сообщений

Отправлено 03 Ноябрь 2017 - 17:43

Просмотр сообщенияsail12 (03 Ноябрь 2017 - 17:23) писал:

Спасибо!
Как убрать иконки с кнопок?
Изменения Вам произвел, проверьте, пожалуйста.
(удалил классы с условиями, которые добавляют картинки к пунктам меню)

#11 sail12

sail12

    Пользователь

  • Пользователи
  • PipPip
  • 31 сообщений

Отправлено 03 Ноябрь 2017 - 17:49

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

#12 Vaccina

Vaccina

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

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

Отправлено 04 Ноябрь 2017 - 08:22

Здравствуйте.

В раздел Сайт - Новости и статьи добавьте пожалуйста пару новостей.

#13 sail12

sail12

    Пользователь

  • Пользователи
  • PipPip
  • 31 сообщений

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

Создал две статьи но меню не стало выпадающим.

#14 sail12

sail12

    Пользователь

  • Пользователи
  • PipPip
  • 31 сообщений

Отправлено 06 Ноябрь 2017 - 17:27

Статьи у меня располагаются в левом блоке. Как сделать что бы статьи были в выпадающем меню?

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

  • статьи.png


#15 sail12

sail12

    Пользователь

  • Пользователи
  • PipPip
  • 31 сообщений

Отправлено 07 Ноябрь 2017 - 20:49

Блин ну если проблема показать, как сделать вложенную кнопку "статьи". Быть может подскажете как можно сделать, список статей на самой странице?

#16 Ирина345

Ирина345

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

  • Модераторы
  • 5 709 сообщений

Отправлено 08 Ноябрь 2017 - 18:05

Просмотр сообщенияsail12 (06 Ноябрь 2017 - 17:27) писал:

Статьи у меня располагаются в левом блоке. Как сделать что бы статьи были в выпадающем меню?
Здравствуйте, найдите в шаблоне HTML код
  <!-- Если есть список статей магазина и если в тарифном плане подключен модуль новостей -->
			  {% IFNOT news_list_articles_empty && TARIFF_FEATURE_NEWS %}
				<div class="menu_main">
				  <a href="#" class="link_nav" title="Все статьи">Статьи</a>
		   

замените на
  <!-- Если есть список статей магазина и если в тарифном плане подключен модуль новостей -->
			  {% IFNOT news_list_articles_empty && TARIFF_FEATURE_NEWS %}
				<div class="menu_main articles">
				  <a href="#" class="link_nav" title="Все статьи">Статьи</a>
		   

далее в конец файла main.css добавьте
.menu_main.articles:hover ul {
	display: block;
}

.menu_main.articles ul {
	display: none;
	position: absolute;
	border: 1px solid #ededed;
	padding: 10px;
	z-index: 9;
}


#17 sail12

sail12

    Пользователь

  • Пользователи
  • PipPip
  • 31 сообщений

Отправлено 08 Ноябрь 2017 - 20:10

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

#18 Firefly

Firefly

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

  • Модераторы
  • 3 810 сообщений

Отправлено 08 Ноябрь 2017 - 20:43

Просмотр сообщенияsail12 (08 Ноябрь 2017 - 20:10) писал:

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

Здравствуйте.
Перед кодом HTML:
	  <!-- /Блок навигации -->

Добавил код:
	  <div class="clear"></div>

Проверьте сейчас, пожалуйста

#19 sail12

sail12

    Пользователь

  • Пользователи
  • PipPip
  • 31 сообщений

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

Спасибо, с кнопками разобрались.
Как быть со статьями?

#20 Vaccina

Vaccina

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

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

Отправлено 09 Ноябрь 2017 - 06:01

Здравствуйте.

Зайдите в раздел Сайт - Редактор шаблонов - HTML - найдите:
	 {% IFNOT menu_empty %}
	 <ul class="links">
			 {% FOR menu %}
			 {% FOR header %}
					 {% FOR links %}
	 <li {% IF menu.header.links.first %}class="first"{% ELSEIF menu.header.links.last %}class="last"{% ENDIF %}>
							 <a href="{menu.header.links.URL}" {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %}
							 class="{% IF menu.header.links.SELECTED %}-act selected{% ENDIF %}">{menu.header.links.NAME}</a>
					 </li>
									 {% ENDFOR %}
			 {% ENDFOR %}
			 {% ENDFOR %}
	 </ul>
	 {% ENDIF %}


замените на:
{% IFNOT menu_empty %}
<ul class="links">
{% FOR menu %}
{% FOR header %}
{% FOR links %}
<li {% IF menu.header.links.NAME=Статьи %}class="news_link"{% ENDIF %}{% IF menu.header.links.first %}class="first"{% ELSEIF menu.header.links.last %}class="last"{% ENDIF %}>
<a href="{menu.header.links.URL}" {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %}
class="{% IF menu.header.links.SELECTED %}-act selected{% ENDIF %}">{menu.header.links.NAME}</a>
</li>
{% ENDFOR %}
{% ENDFOR %}
{% ENDFOR %}
<li class="news">
<ul>
	 {% FOR news_list_all %}
	 <li><a href="{news_list_all.URL}" title="Перейти к странице &laquo;{news_list_all.TITLE}&raquo;" {% IF news_list_all.ID = NEWS_ID %}class="selected"{%ENDIF%}>{news_list_all.TITLE}</a></li>
	 {% ENDFOR %}
	 {% FOR news_list_shop %}
	 <li><a href="{news_list_shop.URL}" title="Перейти к странице &laquo;{news_list_shop.TITLE}&raquo;" {% IF news_list_shop.ID = NEWS_ID %}class="selected"{%ENDIF%}>{news_list_shop.TITLE}</a></li>
	 {% ENDFOR %}
	 {% FOR news_list_articles %}
	 <li><a href="{news_list_articles.URL}" title="Перейти к странице &laquo;{news_list_articles.TITLE}&raquo;" {% IF news_list_articles.ID = NEWS_ID %}class="selected"{%ENDIF%}>{news_list_articles.TITLE}</a></li>
	 {% ENDFOR %}
	 {% FOR news_list_mass_media %}
	 <li><a href="{news_list_mass_media.URL}" title="Перейти к странице &laquo;{news_list_mass_media.TITLE}&raquo;" {% IF news_list_mass_media.ID = NEWS_ID %}class="selected"{%ENDIF%}>{news_list_mass_media.TITLE}</a></li>
	 {% ENDFOR %}
</ul>
</li>
</ul>
{% ENDIF %}

Далее зайдите в main.css - найдите:
.span8 .row-fluid .links {font-size: 1.2em;padding: 5px;overflow:hidden;}
.span8 .row-fluid .links li{display:inline-block;float:left;width:102px;background:#000;}
.span8 .row-fluid .links li:hover{background-color: #5bb75b;}
.span8 .row-fluid .links li a{white-space:nowrap;height:20px;line-height:20px;vertical-align:middle;display:block; color:#fff!important; text-decoration:none;padding:10px 10px 10px 10px;text-align:center;}
.span8 .row-fluid .links li a:hover,
.span8 .row-fluid .links li a.hover{text-decoration:none; color:#fff !important;}


замените на:
.span8 .row-fluid .links {font-size: 1.2em;padding: 5px;position: relative;}
.span8 .row-fluid .links li{display:inline-block;float:left;width:102px;background:#000;}
.span8 .row-fluid .links li:hover{background-color: #5bb75b;}
.span8 .row-fluid .links li a{white-space:nowrap;height:20px;line-height:20px;vertical-align:middle;display:block; color:#fff!important; text-decoration:none;padding:10px 10px 10px 10px;text-align:center;}
.span8 .row-fluid .links li a:hover,
.span8 .row-fluid .links li a.hover{text-decoration:none; color:#fff !important;}
.span8 .row-fluid .links li.news{display: none;position: absolute;left: 209px; top: 44px;z-index: 10;width: 320px;}
.span8 .row-fluid .links li.news_link:hover ~ li.news, .span8 .row-fluid .links li.news:hover{display: block;}
.span8 .row-fluid .links li.news li{width: 100%; text-align: left;}
.span8 .row-fluid .links li.news li a{text-align: left;}

Результат:
Подставки для цветов из массива ольхи.png




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

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