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


Как Настроить Нижнее Меню В Футере Темы Сияние?

Автор OMarra, 02 нояб. 2013 13:54

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

#1 OMarra

OMarra

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

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

Отправлено 02 Ноябрь 2013 - 13:54

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

Подскажите, пожалуйста, где и что изменить в редакторе, чтобы получить структуру футера, как на картинке? Кроме того, хочется оттуда убрать ссылку "Вход в бэк-офис", покупателям она не нужна.

Мой сайт http://sunzai.ru/

Заранее благодарю!

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

  • footer_sample.png

#2 support 2.0

support 2.0

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

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

Отправлено 02 Ноябрь 2013 - 17:18

Просмотр сообщенияOMarra (02 Ноябрь 2013 - 13:54) писал:

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

Подскажите, пожалуйста, где и что изменить в редакторе, чтобы получить структуру футера, как на картинке? Кроме того, хочется оттуда убрать ссылку "Вход в бэк-офис", покупателям она не нужна.

Мой сайт http://sunzai.ru/

Заранее благодарю!
в шаблоне HTML найдите
<!-- Подвал сайта -->
<div id="footer">
<div class="left">
	 <p>&copy; 2013 Солнечные Зайцы <a href="http://sunzai.ru/page/about">Данные компании</a></br></p>
	 <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="right"><p>{COPYRIGHT_FOR_DESIGN_SHINE} {SETTINGS_STORE_REGION}</p></div>
<div class="clr"></div>
<div>{SETTINGS_STORE_HTML_CODE}

замените на
<div id="footer"><div class="footer-main">
<div class="left">
	 <p>&copy; 2013 Солнечные Зайцы <a href="http://sunzai.ru/page/about">Данные компании</a></br></p>
	 <div class="menufooter"> <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>

<div class="right"><p>{COPYRIGHT_FOR_DESIGN_SHINE} {SETTINGS_STORE_REGION}</p></div>
<div class="clr"></div> </div>
<div>{SETTINGS_STORE_HTML_CODE}

далее в файле main,css найдите
/*Layout*/
#footer {
background: url({ASSETS_IMAGES_PATH}page_footer.jpg) no-repeat center top;
padding: 10px;
margin: 0px auto;
width: 940px;
height: 230px;
}
#footer p {
margin:0px;
font-size: 10px;
line-height: 18px;
color: #555;
}
/*menu*/

замените на
/*Layout*/
#footer {
background: url({ASSETS_IMAGES_PATH}page_footer.jpg) no-repeat center top;
padding: 10px;
margin: 0px auto;
width: 940px;
height: 230px;
}
#footer div.footer-main {
clear: both;
width: 100%;
background: #485d63;
border-top: 4px solid #64828b;
padding: 10px;
}
.menufooter {
float: left;
background: url({ASSETS_IMAGES_PATH}menufooter-bg.jpg) repeat-x;
width: 750px;
height: 39px;
overflow: hidden;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;}
.menufooter ul { padding-top: 10px;}
.menufooter ul li a {
font: normal 12px Verdana, Geneva, sans-serif;
color: #5d5c5c;
text-decoration: none;
}
#footer div.footer-main a { padding: 5px;}
#footer p {
margin:0px;
font-size: 10px;
line-height: 18px;
color: #FFF;
}
/*menu*/

В раздел сайт -> редактор шаблонов -> загрузите прикрепленное к данному сообщению изображение (разархивируйте архив у себя на компьютере)
Для того, чтобы удалить пункт меню бэк-офиса, зайдите в раздел сайт -> меню -> нижнее -> нажмите крестик у ненужного пункта меню

Прикрепленные файлы


#3 OMarra

OMarra

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

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

Отправлено 02 Ноябрь 2013 - 17:48

Большое спасибо! Получилось, но остались детали. Копирайт и данные о компании хотелось бы сделать именно справа от меню в футере, так, как было в приложенном файле. Кроме того, сейчас область нижнего меню почему-то слегка смещена вниз и вправо. Подскажите, пожалуйста, как ее выровнять относительно голубого фона на сайте?

#4 shnafix

shnafix

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

  • Модератоpы
  • 506 сообщений

Отправлено 02 Ноябрь 2013 - 19:59

Просмотр сообщенияOMarra (02 Ноябрь 2013 - 17:48) писал:

Большое спасибо! Получилось, но остались детали. Копирайт и данные о компании хотелось бы сделать именно справа от меню в футере, так, как было в приложенном файле. Кроме того, сейчас область нижнего меню почему-то слегка смещена вниз и вправо. Подскажите, пожалуйста, как ее выровнять относительно голубого фона на сайте?
В редакторе шаблонов найдите код 
<div class="left">
		 <p>&copy; 2013 Солнечные Зайцы <a href="http://getsunshine.ru/page/about">Данные компании</a></br></p>
и переместите ниже, вставив между тэгами 
</ul>
</div>
которые расположены шестью строчками ниже.
В main.css найдите 
.menufooter {
float: left;
background: url({ASSETS_IMAGES_PATH}menufooter-bg.jpg) repeat-x;
width: 750px;
height: 39px;
overflow: hidden;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;}
и удалите строки 
float: left;
width: 750px;
height: 39px;

В main.css найдите блок 
#footer p {
margin:0px;
font-size: 11px;
line-height: 18px;
color: #999;
}
и добавьте перед последней скобкой 
float: right;

#5 OMarra

OMarra

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

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

Отправлено 03 Ноябрь 2013 - 13:01

К сожалению, получилось совсем не то, что хотелось. А именно: нижнее меню стало вертикальным. Область меню и копирайта не выровнялась по центру, как нужно. Скрин прилагаю. Сайт http://sunzai.ru/
Хочется, чтобы нижнее меню было горизонтальным. При этом строки "2013 Солнечные Зайцы. Данные компании" располагались справа от этого горизонтального меню. И выровнять все так, чтобы оно совместилось с общим голубым фоном внизу.

Заранее спасибо за помощь!

Footer_wrong.png

Просмотр сообщенияshnafix (02 Ноябрь 2013 - 19:59) писал:

В редакторе шаблонов найдите код 
<div class="left">
		 <p>&copy; 2013 Солнечные Зайцы <a href="http://getsunshine.ru/page/about">Данные компании</a></br></p>
и переместите ниже, вставив между тэгами 
</ul>
</div>
которые расположены шестью строчками ниже.
В main.css найдите 
.menufooter {
float: left;
background: url({ASSETS_IMAGES_PATH}menufooter-bg.jpg) repeat-x;
width: 750px;
height: 39px;
overflow: hidden;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;}
и удалите строки 
float: left;
width: 750px;
height: 39px;

В main.css найдите блок 
#footer p {
margin:0px;
font-size: 11px;
line-height: 18px;
color: #999;
}
и добавьте перед последней скобкой 
float: right;

#6 shnafix

shnafix

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

  • Модератоpы
  • 506 сообщений

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

Просмотр сообщенияOMarra (03 Ноябрь 2013 - 13:01) писал:

К сожалению, получилось совсем не то, что хотелось. А именно: нижнее меню стало вертикальным. Область меню и копирайта не выровнялась по центру, как нужно. Скрин прилагаю. Сайт http://sunzai.ru/
Хочется, чтобы нижнее меню было горизонтальным. При этом строки "2013 Солнечные Зайцы. Данные компании" располагались справа от этого горизонтального меню. И выровнять все так, чтобы оно совместилось с общим голубым фоном внизу.

Заранее спасибо за помощь!

Прикрепленный файл Footer_wrong.png
Виноват.
Строку 
<div class="left">
перенесите выше и вставьте перед строкой 
<div class="menufooter">
В main.css найдите блок 
#footer p {
margin:0px;
font-size: 11px;
line-height: 18px;
color: #999;
}
и добавьте в конец, перед скобкой строку 
float: center;
В main.css найдите код 
.menufooter {
background: url({ASSETS_IMAGES_PATH}menufooter-bg.jpg) repeat-x;
overflow: hidden;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
}
и добавьте в конец, перед скобкой, строки 
text-align: center;
width: 58em;

#7 OMarra

OMarra

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

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

Отправлено 04 Ноябрь 2013 - 12:52

Опять не совсем то. Просто копирайт переехал под меню, а не направо. А кроме того, еще и само меню отцентрировалось. Ну и не выровнялось с фоном... Прикладываю скрин результата и еще раз того, чего хочется достичь (footer_sample, нужен, конечно, не цвет, а структура). Благодарю за быстрые ответы!

Просмотр сообщенияshnafix (03 Ноябрь 2013 - 16:05) писал:

Виноват.
Строку 
<div class="left">
перенесите выше и вставьте перед строкой 
<div class="menufooter">
В main.css найдите блок 
#footer p {
margin:0px;
font-size: 11px;
line-height: 18px;
color: #999;
}
и добавьте в конец, перед скобкой строку 
float: center;
В main.css найдите код 
.menufooter {
background: url({ASSETS_IMAGES_PATH}menufooter-bg.jpg) repeat-x;
overflow: hidden;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
}
и добавьте в конец, перед скобкой, строки 
text-align: center;
width: 58em;

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

  • footer_wrong2.png
  • footer_sample.png

#8 empty9228

empty9228

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

  • Модератоpы
  • 618 сообщений

Отправлено 04 Ноябрь 2013 - 13:03

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


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

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

  1. Форум владельцев интернет-магазинов
  2. → Вопросы работы сервиса StoreLand
  3. → Дизайн
  4. → Шаблон Сияние
  5. → Изменение общей стилистики
  6. Privacy Policy