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


Многоуровневое Меню В Футере

меню футер

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

#1 PowerTea

PowerTea

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

  • Пользователи
  • PipPipPip
  • 177 сообщений
  • ГородКалининград

Отправлено 20 Декабрь 2015 - 12:07

Подскажите плиз можно ли в шаблоне Сияние реализовать многоуровневое меню в футере? картинку прилагаю.

меню.png

Вот на этот сайт - http://powertea.ru

#2 RedHead

RedHead

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

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

Отправлено 21 Декабрь 2015 - 16:24

Просмотр сообщенияPowerTea (20 Декабрь 2015 - 12:07) писал:

Подскажите плиз можно ли в шаблоне Сияние реализовать многоуровневое меню в футере? картинку прилагаю.

Прикрепленный файл меню.png

Вот на этот сайт - http://powertea.ru

Здравствуйте! Перед внесением изменений, создайте бэкап.

Вам нужно создать в разделе Сайт --> Меню блоки меню footer4, footer3, footer2, footer1 и поместить в них пункты меню.
Далее в шаблоне HTML найдите блок кода:
<!--футер-->
<div style="z-index:1;background: url({ASSETS_IMAGES_PATH}footer.jpg) no-repeat center top; position:relative; padding:0px;height: 252px; ">[/font][/color]
[color=#282828][font=helvetica, arial, sans-serif]<div style="width:900px; margin:0 auto; position:relative; top:40px;overflow: hidden;">
<table style="text-align: left; width: 100%;" >
<tr>
	 <td style="height: 115px; min-width: 300px;"></td>
	 <td></td>
</tr>
<tr>
	 <td style="width: 300px; "></td>
	 <td style=" min-width: 690px; vertical-align: top;">
	 <div class="menufut" >
	 <ul>
	 {% FOR menu %}
		 {% FOR footer %}
		 {% FOR links %}<a href="{menu.footer.links.URL}" style="color:#f1edc8;" class="moder" {% IF menu.footer.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.footer.links.TITLE %}title="{menu.footer.links.TITLE}"{% ENDIF %}>{menu.footer.links.NAME}</a> &nbsp; &nbsp; {% ENDFOR %}
		 {% ENDFOR %}
	 {% ENDFOR %}</div>
	 </ul>
<p style="color:#d5d2c0; font-size:12px;" >&copy; {DATE_YEAR} {SETTINGS_STORE_NAME}. {SETTINGS_STORE_ORG_NAME}. Все права защищены.</p>
<span style="margin-left:120px; color:#f1edc8; font-weight:bold; font-style: Italic; font-size:12px;" >Мы в социальных сетях:
<!-- VK icon -->
<div style="position:relative; left:40%; margin-top:-20px;" >
<a href="http://vk.com/powertearu" onclick="return !window.open(this.href)" title="Вступайте в нашу группу В Контакте" class="rollover"></a>
<!-- OK icon -->
<a style="margin-top:-33px; margin-left:40px;" href="http://ok.ru/group/53189547327596" onclick="return !window.open(this.href)" title="Вступайте в нашу группу в Одноклассниках" class="rollover-ok"></a>
<!-- FB icon -->
<a style="margin-top:-33px; margin-left:79px;" href="https://www.facebook.com/powertearu" onclick="return !window.open(this.href)" title="Вступайте в нашу группу на FaceBook" class="rollover-fb"></a>
</div> </span>

<div>{SETTINGS_STORE_HTML_CODE}</div></td>
</tr>
</table>[/font][/color]
[color=#282828][font=helvetica, arial, sans-serif] </div>

замените его на:
[/font][/color]

<!--футер-->
<div style="z-index:1;background: url({ASSETS_IMAGES_PATH}footer.jpg) no-repeat center top; position:relative; padding:0px;height: 252px; ">

<div style="width:900px; margin:0 auto; position:relative; top:40px;overflow: hidden;">
<table style="text-align: left; width: 100%;" >
<tr>
<td style="height: 115px; min-width: 300px;"></td>
<td></td>
</tr>
<tr>
<td style="width: 300px; "></td>
<td style=" min-width: 690px; vertical-align: top;">
<div id="footer">

<div class="block-menu" style="display: inline;float: left;position: relative;padding-right: 60px;">
<div class="title">Блок 1</div>
<ul>
{% FOR menu %}
{% FOR footer %}
{% FOR links %}<li {% IF menu.footer.links.last %}class="last"{% ENDIF %}><a href="{menu.footer.links.URL}" {% IF menu.footer.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.footer.links.TITLE %}title="{menu.footer.links.TITLE}"{% ENDIF %}>{menu.footer.links.NAME}</a></li>{% ENDFOR %}
{% ENDFOR %}
{% ENDFOR %}
</ul>
</div>
<div class="block-menu" style="display: inline;float: left;position: relative;padding-right: 60px;">
<div class="title">Блок 2</div>
<ul>
{% FOR menu %}
{% FOR footer2 %}
{% FOR links %}<li {% IF menu.footer2.links.last %}class="last"{% ENDIF %}><a href="{menu.footer2.links.URL}" {% IF menu.footer2.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.footer2.links.TITLE %}title="{menu.footer2.links.TITLE}"{% ENDIF %}>{menu.footer2.links.NAME}</a></li>{% ENDFOR %}
{% ENDFOR %}
{% ENDFOR %}
</ul>
</div>
<div class="block-menu" style="display: inline;float: left;position: relative;padding-right: 60px;">
<div class="title">Блок 3</div>
<ul>
{% FOR menu %}
{% FOR footer3 %}
{% FOR links %}<li {% IF menu.footer3links.last %}class="last"{% ENDIF %}><a href="{menu.footer3.links.URL}" {% IF menu.footer3.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.footer3.links.TITLE %}title="{menu.footer3.links.TITLE}"{% ENDIF %}>{menu.footer3.links.NAME}</a></li>{% ENDFOR %}
{% ENDFOR %}
{% ENDFOR %}
</ul>
</div>
<div class="block-menu" style="display: inline;float: left;position: relative;;padding-right: 60px;">
<div class="title">Блок 4</div>
<ul>
{% FOR menu %}
{% FOR footer4 %}
{% FOR links %}<li {% IF menu.footer4.links.last %}class="last"{% ENDIF %}><a href="{menu.footer4.links.URL}" {% IF menu.footer4.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.footer4.links.TITLE %}title="{menu.footer4.links.TITLE}"{% ENDIF %}>{menu.footer4.links.NAME}</a></li>{% ENDFOR %}
{% ENDFOR %}
{% ENDFOR %}
</ul>

</div>
<div class="right"><p>{COPYRIGHT_FOR_DESIGN_SHINE} {SETTINGS_STORE_REGION}</p></div>
<div class="clr"></div>
<div>{SETTINGS_STORE_HTML_CODE}</div>
</div>
<p style="margin-left: 9px;margin-top: 30px;color:#d5d2c0; font-size:12px;">© 2015 Интернет-магазин "Сила Чая". ИП Седых Марьяна Леонидовна. Все права защищены.</p>

<div class="cocial" style=" margin-left: 9px;"><span style="color:#f1edc8; font-weight:bold; font-style: Italic; font-size:11px;" >
Мы в социальных сетях: </span>
<!-- VK icon -->
<div style="position:relative;">
<a style="margin-top:-33px; margin-left:150px;" href="http://vk.com/powertearu" onclick="return !window.open(this.href)" title="Вступайте в нашу группу В Контакте" class="rollover"></a>
<!-- OK icon -->
<a style="margin-top:-33px; margin-left:190px;" href="http://ok.ru/group/53189547327596" onclick="return !window.open(this.href)" title="Вступайте в нашу группу в Одноклассниках" class="rollover-ok"></a>
<!-- FB icon -->
<a style="margin-top:-33px; margin-left:230px;" href="https://www.facebook.com/powertearu" onclick="return !window.open(this.href)" title="Вступайте в нашу группу на FaceBook" class="rollover-fb"></a>

</div>
<div>{SETTINGS_STORE_HTML_CODE}</div></td>
</tr>
</table>
</div>
[color=#282828][font=helvetica, arial, sans-serif]


далее в шаблоне main.css найдите строки:
#footer {
background: url({ASSETS_IMAGES_PATH}footer_bg.jpg) no-repeat center top;
padding: 10px;
margin: 0px auto;
width: 940px;
height: 60px;
}

замените на

#footer {
padding: 10px;
margin: 0px auto;
width: 940px;
height: 60px;
margin-top: -60px;
}
.title {
color: wheat;
}
#footer a {
color: #d5d2c0;
font-size: 12px;
}

Получится примерно так: (см на скриншоте). Отредактируйте стили, в зависимости от количества своих пунктов в меню.
1.png

#3 PowerTea

PowerTea

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

  • Пользователи
  • PipPipPip
  • 177 сообщений
  • ГородКалининград

Отправлено 01 Январь 2016 - 12:49

Спасибо за ответ! Позже попробую реализовать!





Темы с аналогичным тегами меню, футер

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

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