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


Как Изменить Штатный Футер В Шаблоне Карамель

Автор nordix, 02 мая 2017 23:56

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

#1 nordix

nordix

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

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

Отправлено 02 Май 2017 - 23:56

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

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

  • Футер.jpg

#2 Vaccina

Vaccina

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

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

Отправлено 03 Май 2017 - 03:43

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

Зайдите в раздел Сайт - Меню и создайте два блока меню с переменными:
- footer_first
- footer_second

И добавьте в них по два пункта меню, footer_first будет расположен слева, footer_second справа.

Далее зайдите в раздел Сайт - Редактор шаблонов - HTML - найдите:
<div class="col4">
	   <h3 class="footerHeader">Меню<div class="fotterArrows">&dArr;</div></h3>
	   <div class="tgl">
		 {% FOR menu %}
		  {% FOR footer %}
			<div class="menu_main">
			  <ul>
				{% FOR links %}<li><a href="{menu.footer.links.URL}" {% IF menu.footer.links.SELECTED %}class="active"{%ENDIF%} {% IF menu.footer.links.TITLE %}title="{menu.footer.links.TITLE}"{% ENDIF %}>{menu.footer.links.NAME}</a></li>{% ENDFOR %}
			  </ul>
			</div>
		  {% ENDFOR %}
		{% ENDFOR %}
	   </div>
	</div>
	<div class="col4">
	   <h3 class="footerHeader">Аккаунт<div class="fotterArrows">&dArr;</div></h3>
	   <div class="tgl">
		 <div class=" menu_main">
		   <ul>
			 <li><a href="{%IF CLIENT_IS_LOGIN%}{USER_SETTINGS_URL}{%ELSE%}{USER_REGISTER_URL}{%ENDIF%}">Личный кабинет</a></li>		  
			 <li><a href="{CALLBACK_URL}">Обратный звонок</a></li>
		   </ul>
		 </div>
	  </div>
	</div>
	<div class="col4">
	   <h3 class="footerHeader">Новости магазина<div class="fotterArrows">&dArr;</div></h3>
	   <div class="tgl">
		   <div class="menu_main">
			   <ul>
				 <li><a href="{NEWS_SHOP_URL}">Последние Новости</a></li>
				 <li><a href="{NEWS_MASS_MEDIA_URL}">Материалы СМИ</a></li>
				 <li><a href="{NEWS_ARTICLES_URL}">Статьи</a></li>
			   </ul>
		   </div>
	   </div>
	</div>
    
    
Замените на:
<div class="col4">
	   <div class="tgl">
		 {% FOR menu %}
		  {% FOR footer_one %}
			<div class="menu_main">
			  <ul>
				{% FOR links %}<li><a href="{menu.footer_one.links.URL}" {% IF menu.footer_one.links.SELECTED %}class="active"{%ENDIF%} {% IF menu.footer_one.links.TITLE %}title="{menu.footer_one.links.TITLE}"{% ENDIF %}>{menu.footer_one.links.NAME}</a></li>{% ENDFOR %}
			  </ul>
			</div>
		  {% ENDFOR %}
		{% ENDFOR %}
	   </div>
	</div>
	<div class="col4">
	   <div class="tgl">
		 <div class="logo"><a href="http://{NET_DOMAIN}"><img src="#" alt="" /></a></div>
	  </div>
	</div>
	<div class="col4">
	   <div class="tgl">
		 {% FOR menu %}
		  {% FOR footer_second %}
			<div class="menu_main">
			  <ul>
				{% FOR links %}<li><a href="{menu.footer_second.links.URL}" {% IF menu.footer_second.links.SELECTED %}class="active"{%ENDIF%} {% IF menu.footer_second.links.TITLE %}title="{menu.footer_second.links.TITLE}"{% ENDIF %}>{menu.footer_second.links.NAME}</a></li>{% ENDFOR %}
			  </ul>
			</div>
		  {% ENDFOR %}
		{% ENDFOR %}
	   </div>
	</div>
    
В данном блоке в строке:
<div class="logo"><a href="http://{NET_DOMAIN}"><img src="#" alt="" /></a></div>

Измените знак # на ссылку на логотип с надписью.

Далее зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
.col4 {
	width: 100%;
	float: none;
	color: #616161;
	margin-bottom: 10px;
}

после него пропишите:
.footercontent .col4 {
	width: 32%;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	text-align: center;
}
.footercontent .col4 .logo img {
	float: none;
}

#3 nordix

nordix

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

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

Отправлено 03 Май 2017 - 14:48

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

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

Изображение

Мой аккаунт SL-413625.

#4 Danil

Danil

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

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

Отправлено 03 Май 2017 - 15:23

Просмотр сообщенияnordix (03 Май 2017 - 14:48) писал:

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

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

Изображение

Мой аккаунт SL-413625.
Здравствуйте.
Изменения Вам произвел, проверьте, пожалуйста.
Так же создал бэкапы до и после.

#5 nordix

nordix

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

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

Отправлено 03 Май 2017 - 21:25

Добрый вечер, уважаемый администратор!  

Я благодарю вас за проделанную работу. Все так, как я и хотел.
"Наберусь наглости" и попрошу вас еще сделать нижнюю строчку / меню, контакты, аккаунт, новости /
сделать активными (ссылками), и чтобы они вели на соответствующую страницу или выпадающее окно.

Еще прошу вас чуть - чуть изменить футер и шапку.

Изображение


Изображение


Заранее вам благодарен.

#6 nordix

nordix

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

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

Отправлено 03 Май 2017 - 22:51

Добрый вечер!

Прошу вас немного изменить дизайн Ярлыков (картинок).
Прошу вакс перенести название категории товара в центр
и увеличить картинку по указанным параметрам.

Спасибо. С уважением, Олег.



Изображение

#7 Vaccina

Vaccina

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

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

Отправлено 04 Май 2017 - 05:27

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

Просмотр сообщенияnordix (03 Май 2017 - 14:48) писал:

Спасибо вам за помощь, но к сожалению, это не совсем то, что я хочу.

Зайдите в раздел Сайт - Меню и создайте два блока меню с переменными:
- footer_first
- footer_second

И добавьте в них по два пункта меню, footer_first будет расположен слева, footer_second справа.

Множество пунктов было не так выполнено, так как блоки контакты и подобные должны были удалиться.

Зайдите в раздел Сайт - Редактор шаблонов - HTML - найдите:
<div class="col4">
	 <h3 class="footerHeader">Контакты<div class="fotterArrows">&dArr;</div></h3>
	 <div class="tgl">
		 <div class="contactsWrp">						
			
						 <!-- Первый контактный телефон -->
						 {% IF SETTINGS_STORE_PHONE_NUMBER1 %}						
						 <div>
						 <a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE1} {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}{SETTINGS_STORE_PHONE_CITY_CODE1}{% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER1}">
							 <span class="icon-phone"></span>
							 <span class="phone-country-code">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}</span>
							 {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}({SETTINGS_STORE_PHONE_CITY_CODE1}){% ENDIF %}
							 {SETTINGS_STORE_PHONE_NUMBER1}
							 </a>
						 </div>
						 {% ENDIF %}
						 <!--END Первый контактный телефон -->
						 <!-- Второй контактный телефон -->
						 {% IF SETTINGS_STORE_PHONE_NUMBER2 %}
						 <div>							
							 <a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE2} {% IF SETTINGS_STORE_PHONE_CITY_CODE2 %}{SETTINGS_STORE_PHONE_CITY_CODE2}{% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER2}">
							 <span class="icon-phone"></span>
							 <span class="phone-country-code">{SETTINGS_STORE_PHONE_COUNTRY_CODE2}</span>
							 {% IF SETTINGS_STORE_PHONE_CITY_CODE2 %}({SETTINGS_STORE_PHONE_CITY_CODE2}){% ENDIF %}
							 {SETTINGS_STORE_PHONE_NUMBER2}
							 </a>
						 </div>
						 {% ENDIF %}
						 <!--END Второй контактный телефон -->
						 <!-- Третий контактный телефон -->					
						 {% IF SETTINGS_STORE_PHONE_NUMBER3 %}
						 <div>							
							 <a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE3} {% IF SETTINGS_STORE_PHONE_CITY_CODE3 %}{SETTINGS_STORE_PHONE_CITY_CODE3}{% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER3}">
								 <span class="icon-phone"></span>
								 <span class="phone-country-code">{SETTINGS_STORE_PHONE_COUNTRY_CODE3}</span>
								 {% IF SETTINGS_STORE_PHONE_CITY_CODE3 %}({SETTINGS_STORE_PHONE_CITY_CODE3}){% ENDIF %}
								 {SETTINGS_STORE_PHONE_NUMBER3}
							 </a>
						 </div>
						 {% ENDIF %}
						 <!--END Третий контактный телефон -->
						 <!-- Контакт Skype -->
							 {% IF SETTINGS_STORE_SKYPE %}
							 <div><a href="skype:{SETTINGS_STORE_SKYPE}?call" title="Свяжитесь с нами по Skype"><span class="icon-skype"></span>&nbsp;<span class="valignMiddle">{SETTINGS_STORE_SKYPE}</span></a></div>
							 {% ENDIF %}
						 <!--END Контакт Skype -->
						 <!-- Контакт Skype -->
							 {% IF SETTINGS_STORE_EMAIL_MAIN %}
							 <div><a href="mailto:{SETTINGS_STORE_EMAIL_MAIN}" title="Свяжитесь с нами по электронной почте"><span class="icon-mail"></span>&nbsp;{SETTINGS_STORE_EMAIL_MAIN}</a></div>
							 {% ENDIF %}
						 <!--END Контакт Skype -->
						 <!-- Номер ICQ на сайте -->
						 {% IF SETTINGS_STORE_ICQ %}
							 <div class="ficq">
							 <img src="http://wwp.icq.com/scripts/online.dll?icq={SETTINGS_STORE_ICQ_ONLY_DIGITS}&img=27" alt="Статус" width="16" height="16" />
							 <span>{SETTINGS_STORE_ICQ}</span>
							 </div>
						 {% ENDIF %}
						 <!--END Номер ICQ на сайте -->
						 <!-- Время работы магазина -->
						 {% IF SETTINGS_STORE_WORK_TIME %}
							 <div title="Время работы нашего магазина: {SETTINGS_STORE_WORK_TIME}">
						 <span class="mark">Время работы:</span> {SETTINGS_STORE_WORK_TIME}
							 </div>
						 {% ENDIF %}
						 <!--END Время работы магазина -->
					
		 </div><!--END contactsWrp -->
	 </div>
</div>
	 <div class="col4">
	 <h3 class="footerHeader">Меню<div class="fotterArrows">&dArr;</div></h3>
	 <div class="tgl">
		 {% FOR menu %}
		 {% FOR footer %}
		 <div class="menu_main">
			 <ul>
			 {% FOR links %}<li><a href="{menu.footer.links.URL}" {% IF menu.footer.links.SELECTED %}class="active"{%ENDIF%} {% IF menu.footer.links.TITLE %}title="{menu.footer.links.TITLE}"{% ENDIF %}>{menu.footer.links.NAME}</a></li>{% ENDFOR %}
			 </ul>
		 </div>
		 {% ENDFOR %}
	 {% ENDFOR %}
	 </div>
</div>
	 <div class="col4" id="logo">
				 <div class="logo"><a href="http://{NET_DOMAIN}"><img src="http://st.freeshop24.ru/1/2131/388/logo.png" alt="" /></a></div>
	 </div>
<div class="col4">
	 <h3 class="footerHeader">Аккаунт<div class="fotterArrows">&dArr;</div></h3>
	 <div class="tgl">
		 <div class=" menu_main">
		 <ul>
			 <li><a href="{%IF CLIENT_IS_LOGIN%}{USER_SETTINGS_URL}{%ELSE%}{USER_REGISTER_URL}{%ENDIF%}">Личный кабинет</a></li>		
			 <li><a href="{CALLBACK_URL}">Обратный звонок</a></li>
		 </ul>
		 </div>
	 </div>
</div>
<div class="col4">
	 <h3 class="footerHeader">Новости<div class="fotterArrows">&dArr;</div></h3>
	 <div class="tgl">
		 <div class="menu_main">
			 <ul>
				 <li><a href="{NEWS_SHOP_URL}">Последние Новости</a></li>
				 <li><a href="{NEWS_MASS_MEDIA_URL}">Материалы СМИ</a></li>
				 <li><a href="{NEWS_ARTICLES_URL}">Статьи</a></li>
			 </ul>
		 </div>
	 </div>
</div>

замените на:
<div class="col4">
		   <div class="tgl">
				 {% FOR menu %}
				  {% FOR footer_one %}
						<div class="menu_main">
						  <ul>
								{% FOR links %}<li class="footerHeader"><a href="{menu.footer_one.links.URL}" {% IF menu.footer_one.links.SELECTED %}class="active"{%ENDIF%} {% IF menu.footer_one.links.TITLE %}title="{menu.footer_one.links.TITLE}"{% ENDIF %}>{menu.footer_one.links.NAME}</a></li>{% ENDFOR %}
						  </ul>
						</div>
				  {% ENDFOR %}
				{% ENDFOR %}
		   </div>
		</div>

		<div class="col4" id="logo">
				 <div class="logo"><a href="http://{NET_DOMAIN}"><img src="http://st.freeshop24.ru/1/2131/388/logo.png" alt="" /></a></div>
		</div>	
	<div class="col4">
		   <div class="tgl">
				 {% FOR menu %}
				  {% FOR footer_second %}
						<div class="menu_main">
						  <ul>
								{% FOR links %}<li class="footerHeader"><a href="{menu.footer_second.links.URL}" {% IF menu.footer_second.links.SELECTED %}class="active"{%ENDIF%} {% IF menu.footer_second.links.TITLE %}title="{menu.footer_second.links.TITLE}"{% ENDIF %}>{menu.footer_second.links.NAME}</a></li>{% ENDFOR %}
						  </ul>
						</div>
				  {% ENDFOR %}
				{% ENDFOR %}
		   </div>
		</div>

Далее зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
.footercontent .col4 {
width: 145px;
display: inline-block;
vertical-align: middle;
text-align: center;
z-index: 9;
margin: 0;
}

замените на:
.footercontent .col4 {
width: 32%;
display: inline-block;
vertical-align: middle;
text-align: center;
z-index: 9;
margin: 0;
}

Далее найдите:
.footerHeader {
color: #1c8eac;
position: relative;
display: inline;
z-index: 1;
}

замените на:
.footercontent .menu_main ul {
text-align: center;
}
.footercontent .menu_main li {
display: inline-block;
float: none;
margin: 0 10%;
}
.footerHeader, .footercontent .menu_main li a {
color: #1c8eac;
position: relative;
display: inline;
z-index: 1;
}

.footercontent .menu_main li a {
font: bold 18px Arial;
margin: 0 10px;
}

Далее найдите и удалите:
.footercontent > .col4 > div.tgl {
overflow: hidden;
margin-top: 10px;
position: absolute;
}

Далее найдите:
.footercontent .col4 .logo img {
float: none;
height: auto;
margin-top: -90px;
}

замените на:
.footercontent .col4 .logo img {
float: none;
height: auto;
margin-top: -90px;
max-width: 150px;
}

Далее найдите:
.adapt {
position: relative;
background: white;
border: 1px solid #EEEEEE;
border-radius: 10px;
padding: 0 10px 10px;
margin-bottom: 15px;
}

замените на:
.adapt {
position: relative;
background: white;
border: 1px solid #EEEEEE;
border-radius: 10px;
padding: 0 10px 10px;
margin-bottom: 40px;
}

Если все выполнили правильно, то должен получиться следующий результат:
123.jpg

Весь текст необходимые вам ссылки, настраивать вы сможете их также в разделе Сайт - Меню.

#8 Vaccina

Vaccina

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

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

Отправлено 04 Май 2017 - 05:36

Просмотр сообщенияnordix (03 Май 2017 - 22:51) писал:

Добрый вечер!

Прошу вас немного изменить дизайн Ярлыков (картинок).
Прошу вакс перенести название категории товара в центр
и увеличить картинку по указанным параметрам.

Зайдите в раздел Настройки - Основные - Изображения товаров - найдите:
Максимальный размер по высоте/ширине в пикселях для средних изображений

В данном поле увеличьте значение для размеров фото товара.

Далее зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
.nameWrp{background: none;padding: 0 !important;border-bottom: none !important;width: 150px;margin: -5px 0 5px;float: left;text-align:left;}
.nameWrp a{color:#015B73;font-size: 14px;text-decoration: none;margin-bottom: 5px;font-weight: normal;height: 20px;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;display:block;width:150px;text-align:left;}

замените на:
.nameWrp{background: none;padding: 0 !important;border-bottom: none !important;width: 100%;margin: -5px 0 5px;text-align:center;}
.nameWrp a{color:#015B73;font-size: 14px;text-decoration: none;margin-bottom: 5px;font-weight: normal;height: 20px;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;display:block;width:100%;text-align:center;}

123.jpg

#9 nordix

nordix

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

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

Отправлено 04 Май 2017 - 07:34

Просмотр сообщенияVaccina (04 Май 2017 - 05:27) писал:

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



Зайдите в раздел Сайт - Меню и создайте два блока меню с переменными:
- footer_first
- footer_second

И добавьте в них по два пункта меню, footer_first будет расположен слева, footer_second справа.

Множество пунктов было не так выполнено, так как блоки контакты и подобные должны были удалиться.

Зайдите в раздел Сайт - Редактор шаблонов - HTML - найдите:
<div class="col4">
	 <h3 class="footerHeader">Контакты<div class="fotterArrows">&dArr;</div></h3>
	 <div class="tgl">
		 <div class="contactsWrp">						
			
						 <!-- Первый контактный телефон -->
						 {% IF SETTINGS_STORE_PHONE_NUMBER1 %}						
						 <div>
						 <a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE1} {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}{SETTINGS_STORE_PHONE_CITY_CODE1}{% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER1}">
							 <span class="icon-phone"></span>
							 <span class="phone-country-code">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}</span>
							 {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}({SETTINGS_STORE_PHONE_CITY_CODE1}){% ENDIF %}
							 {SETTINGS_STORE_PHONE_NUMBER1}
							 </a>
						 </div>
						 {% ENDIF %}
						 <!--END Первый контактный телефон -->
						 <!-- Второй контактный телефон -->
						 {% IF SETTINGS_STORE_PHONE_NUMBER2 %}
						 <div>							
							 <a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE2} {% IF SETTINGS_STORE_PHONE_CITY_CODE2 %}{SETTINGS_STORE_PHONE_CITY_CODE2}{% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER2}">
							 <span class="icon-phone"></span>
							 <span class="phone-country-code">{SETTINGS_STORE_PHONE_COUNTRY_CODE2}</span>
							 {% IF SETTINGS_STORE_PHONE_CITY_CODE2 %}({SETTINGS_STORE_PHONE_CITY_CODE2}){% ENDIF %}
							 {SETTINGS_STORE_PHONE_NUMBER2}
							 </a>
						 </div>
						 {% ENDIF %}
						 <!--END Второй контактный телефон -->
						 <!-- Третий контактный телефон -->					
						 {% IF SETTINGS_STORE_PHONE_NUMBER3 %}
						 <div>							
							 <a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE3} {% IF SETTINGS_STORE_PHONE_CITY_CODE3 %}{SETTINGS_STORE_PHONE_CITY_CODE3}{% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER3}">
								 <span class="icon-phone"></span>
								 <span class="phone-country-code">{SETTINGS_STORE_PHONE_COUNTRY_CODE3}</span>
								 {% IF SETTINGS_STORE_PHONE_CITY_CODE3 %}({SETTINGS_STORE_PHONE_CITY_CODE3}){% ENDIF %}
								 {SETTINGS_STORE_PHONE_NUMBER3}
							 </a>
						 </div>
						 {% ENDIF %}
						 <!--END Третий контактный телефон -->
						 <!-- Контакт Skype -->
							 {% IF SETTINGS_STORE_SKYPE %}
							 <div><a href="skype:{SETTINGS_STORE_SKYPE}?call" title="Свяжитесь с нами по Skype"><span class="icon-skype"></span>&nbsp;<span class="valignMiddle">{SETTINGS_STORE_SKYPE}</span></a></div>
							 {% ENDIF %}
						 <!--END Контакт Skype -->
						 <!-- Контакт Skype -->
							 {% IF SETTINGS_STORE_EMAIL_MAIN %}
							 <div><a href="mailto:{SETTINGS_STORE_EMAIL_MAIN}" title="Свяжитесь с нами по электронной почте"><span class="icon-mail"></span>&nbsp;{SETTINGS_STORE_EMAIL_MAIN}</a></div>
							 {% ENDIF %}
						 <!--END Контакт Skype -->
						 <!-- Номер ICQ на сайте -->
						 {% IF SETTINGS_STORE_ICQ %}
							 <div class="ficq">
							 <img src="http://wwp.icq.com/scripts/online.dll?icq={SETTINGS_STORE_ICQ_ONLY_DIGITS}&img=27" alt="Статус" width="16" height="16" />
							 <span>{SETTINGS_STORE_ICQ}</span>
							 </div>
						 {% ENDIF %}
						 <!--END Номер ICQ на сайте -->
						 <!-- Время работы магазина -->
						 {% IF SETTINGS_STORE_WORK_TIME %}
							 <div title="Время работы нашего магазина: {SETTINGS_STORE_WORK_TIME}">
						 <span class="mark">Время работы:</span> {SETTINGS_STORE_WORK_TIME}
							 </div>
						 {% ENDIF %}
						 <!--END Время работы магазина -->
					
		 </div><!--END contactsWrp -->
	 </div>
</div>
	 <div class="col4">
	 <h3 class="footerHeader">Меню<div class="fotterArrows">&dArr;</div></h3>
	 <div class="tgl">
		 {% FOR menu %}
		 {% FOR footer %}
		 <div class="menu_main">
			 <ul>
			 {% FOR links %}<li><a href="{menu.footer.links.URL}" {% IF menu.footer.links.SELECTED %}class="active"{%ENDIF%} {% IF menu.footer.links.TITLE %}title="{menu.footer.links.TITLE}"{% ENDIF %}>{menu.footer.links.NAME}</a></li>{% ENDFOR %}
			 </ul>
		 </div>
		 {% ENDFOR %}
	 {% ENDFOR %}
	 </div>
</div>
	 <div class="col4" id="logo">
				 <div class="logo"><a href="http://{NET_DOMAIN}"><img src="http://st.freeshop24.ru/1/2131/388/logo.png" alt="" /></a></div>
	 </div>
<div class="col4">
	 <h3 class="footerHeader">Аккаунт<div class="fotterArrows">&dArr;</div></h3>
	 <div class="tgl">
		 <div class=" menu_main">
		 <ul>
			 <li><a href="{%IF CLIENT_IS_LOGIN%}{USER_SETTINGS_URL}{%ELSE%}{USER_REGISTER_URL}{%ENDIF%}">Личный кабинет</a></li>		
			 <li><a href="{CALLBACK_URL}">Обратный звонок</a></li>
		 </ul>
		 </div>
	 </div>
</div>
<div class="col4">
	 <h3 class="footerHeader">Новости<div class="fotterArrows">&dArr;</div></h3>
	 <div class="tgl">
		 <div class="menu_main">
			 <ul>
				 <li><a href="{NEWS_SHOP_URL}">Последние Новости</a></li>
				 <li><a href="{NEWS_MASS_MEDIA_URL}">Материалы СМИ</a></li>
				 <li><a href="{NEWS_ARTICLES_URL}">Статьи</a></li>
			 </ul>
		 </div>
	 </div>
</div>

замените на:
<div class="col4">
		 <div class="tgl">
				 {% FOR menu %}
				 {% FOR footer_one %}
					 <div class="menu_main">
						 <ul>
							 {% FOR links %}<li class="footerHeader"><a href="{menu.footer_one.links.URL}" {% IF menu.footer_one.links.SELECTED %}class="active"{%ENDIF%} {% IF menu.footer_one.links.TITLE %}title="{menu.footer_one.links.TITLE}"{% ENDIF %}>{menu.footer_one.links.NAME}</a></li>{% ENDFOR %}
						 </ul>
					 </div>
				 {% ENDFOR %}
			 {% ENDFOR %}
		 </div>
	 </div>

	 <div class="col4" id="logo">
				 <div class="logo"><a href="http://{NET_DOMAIN}"><img src="http://st.freeshop24.ru/1/2131/388/logo.png" alt="" /></a></div>
	 </div>
<div class="col4">
		 <div class="tgl">
				 {% FOR menu %}
				 {% FOR footer_second %}
					 <div class="menu_main">
						 <ul>
							 {% FOR links %}<li class="footerHeader"><a href="{menu.footer_second.links.URL}" {% IF menu.footer_second.links.SELECTED %}class="active"{%ENDIF%} {% IF menu.footer_second.links.TITLE %}title="{menu.footer_second.links.TITLE}"{% ENDIF %}>{menu.footer_second.links.NAME}</a></li>{% ENDFOR %}
						 </ul>
					 </div>
				 {% ENDFOR %}
			 {% ENDFOR %}
		 </div>
	 </div>

Далее зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
.footercontent .col4 {
width: 145px;
display: inline-block;
vertical-align: middle;
text-align: center;
z-index: 9;
margin: 0;
}

замените на:
.footercontent .col4 {
width: 32%;
display: inline-block;
vertical-align: middle;
text-align: center;
z-index: 9;
margin: 0;
}

Далее найдите:
.footerHeader {
color: #1c8eac;
position: relative;
display: inline;
z-index: 1;
}

замените на:
.footercontent .menu_main ul {
text-align: center;
}
.footercontent .menu_main li {
display: inline-block;
float: none;
margin: 0 10%;
}
.footerHeader, .footercontent .menu_main li a {
color: #1c8eac;
position: relative;
display: inline;
z-index: 1;
}

.footercontent .menu_main li a {
font: bold 18px Arial;
margin: 0 10px;
}

Далее найдите и удалите:
.footercontent > .col4 > div.tgl {
overflow: hidden;
margin-top: 10px;
position: absolute;
}

Далее найдите:
.footercontent .col4 .logo img {
float: none;
height: auto;
margin-top: -90px;
}

замените на:
.footercontent .col4 .logo img {
float: none;
height: auto;
margin-top: -90px;
max-width: 150px;
}

Далее найдите:
.adapt {
position: relative;
background: white;
border: 1px solid #EEEEEE;
border-radius: 10px;
padding: 0 10px 10px;
margin-bottom: 15px;
}

замените на:
.adapt {
position: relative;
background: white;
border: 1px solid #EEEEEE;
border-radius: 10px;
padding: 0 10px 10px;
margin-bottom: 40px;
}

Если все выполнили правильно, то должен получиться следующий результат:
Прикрепленный файл 123.jpg

Весь текст необходимые вам ссылки, настраивать вы сможете их также в разделе Сайт - Меню.

Добрый день!

Я попытался сделать то, что вы рекомендовали, но я не все понял.
Прошу вас написать чуть подробнее, куда и что писать (создавать).

Изображение



Подскажите пожалуйста, могу ли я удалять загруженные файлы (картинки, скрины) с сайта?

Спасибо. С уважением, Олег.

Акк - SL - 413625.

#10 Vaccina

Vaccina

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

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

Отправлено 04 Май 2017 - 07:54

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

Цитата

Подскажите пожалуйста, могу ли я удалять загруженные файлы (картинки, скрины) с сайта?
Если вам они больше не нужны, то вы можете их удалить.

#11 nordix

nordix

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

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

Отправлено 05 Май 2017 - 10:18

Просмотр сообщенияVaccina (04 Май 2017 - 07:54) писал:

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


Если вам они больше не нужны, то вы можете их удалить.

Добрый день! Я вроде все сделал, как вы рекомендовали, но что- то надписи в футере на активные, не работают ссылки. Подскажите пожалуйста, что делать с нижним меню в разделе сайт/ настройка меню? Не будет ли какой - либо "конфликт" между старой версией и переделанной? Спасибо.

#12 Firefly

Firefly

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

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

Отправлено 05 Май 2017 - 10:32

Просмотр сообщенияnordix (05 Май 2017 - 10:18) писал:

Добрый день! Я вроде все сделал, как вы рекомендовали, но что- то надписи в футере на активные, не работают ссылки. Подскажите пожалуйста, что делать с нижним меню в разделе сайт/ настройка меню? Не будет ли какой - либо "конфликт" между старой версией и переделанной? Спасибо.

Здравствуйте.
Проверьте сейчас, пожалуйста.
В шаблоне main.css код:
.footerHeader{color:#1c8eac;position:relative;display:inline;z-index:1;}

Заменил на:
.footerHeader{color:#1c8eac;position:relative;display:inline;z-index:1;cursor: pointer;}

Теперь при наведении на пункт будет появляться указатель ссылки.
При нажатии на пункт - раскрывает подменю.
Проверьте, пожалуйста.

#13 nordix

nordix

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

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

Отправлено 05 Май 2017 - 12:22

Просмотр сообщенияFirefly (05 Май 2017 - 10:32) писал:

Здравствуйте.
Проверьте сейчас, пожалуйста.
В шаблоне main.css код:
.footerHeader{color:#1c8eac;position:relative;display:inline;z-index:1;}

Заменил на:
.footerHeader{color:#1c8eac;position:relative;display:inline;z-index:1;cursor: pointer;}

Теперь при наведении на пункт будет появляться указатель ссылки.
При нажатии на пункт - раскрывает подменю.
Проверьте, пожалуйста.

Здравствуйте! Спасибо большое за вашу помощь. Но похоже произошло непредвиденное. Я тоже сейчас занимаюсь редактирование сайта. Я видел, что ссылки в меню заработали, но после моего "вмешательства" в HTML код, все  нижнее меню "поползло" и ссылки перестали работать. Я старался все делать по вашей инструкции, но где то ошибся. Прошу ваше помощи. Заранее вам благодарен.

Изображение


#14 Firefly

Firefly

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

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

Отправлено 05 Май 2017 - 12:44

Просмотр сообщенияnordix (05 Май 2017 - 12:22) писал:

Здравствуйте! Спасибо большое за вашу помощь. Но похоже произошло непредвиденное. Я тоже сейчас занимаюсь редактирование сайта. Я видел, что ссылки в меню заработали, но после моего "вмешательства" в HTML код, все  нижнее меню "поползло" и ссылки перестали работать. Я старался все делать по вашей инструкции, но где то ошибся. Прошу ваше помощи. Заранее вам благодарен.

Изображение


Внес Вам изменения повторно и создал бэкап (уже с изменениями) - 05.05.2017 12:43:33

#15 nordix

nordix

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

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

Отправлено 05 Май 2017 - 18:04

Просмотр сообщенияFirefly (05 Май 2017 - 12:44) писал:

Внес Вам изменения повторно и создал бэкап (уже с изменениями) - 05.05.2017 12:43:33

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

Изображение

Спасибо. С уважением, Олег.

#16 Firefly

Firefly

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

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

Отправлено 05 Май 2017 - 19:01

Просмотр сообщенияnordix (05 Май 2017 - 18:04) писал:

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

Изображение

Спасибо. С уважением, Олег.

Блок с поиском в шаблоне HTML переместил:
				 <div class="noindex" id="search">
					 <form id="search_mini_form" action="http://{NET_DOMAIN}/search" method="get" onsubmit="if($(this).find('.searchinp').val()=='Поиск...') return false;">				
						 <input class="searchinp" type="text" name="q" value="{% IF SEARCH_QUERY %}{SEARCH_QUERY}{% ELSE %}Поиск...{% ENDIF %}" onfocus="if(this.value=='Поиск...'){this.value='';}" onblur="if(this.value==''){this.value='Поиск...';}" onclick="this.value = &#39;&#39;;"/>
						 <button title="Искать" type="submit" value="Поиск" class="button-search"><span class="icon-search"></span></button>
					 </form>
				 </div>

В main.css добавил код:
.headerTop .phoneNumber {float:left;}
.headerTop .phoneNumber {font-size:20px;}

В шаблон HTML добавил код:
			 <a href="tel://{SETTINGS_STORE_PHONE_COUNTRY_CODE1}{SETTINGS_STORE_PHONE_CITY_CODE1}{SETTINGS_STORE_PHONE_NUMBER1}">
				 <span class="phoneNumber">
				 <span class="phone-country-code">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}</span>
				 {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}({SETTINGS_STORE_PHONE_CITY_CODE1}){% ENDIF %}
				 {SETTINGS_STORE_PHONE_NUMBER1}
				 </span>
			 </a>

Ссылку на логотип в подвале поменял.
Проверьте результат, пожалуйста.

#17 nordix

nordix

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

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

Отправлено 05 Май 2017 - 23:40

Просмотр сообщенияFirefly (05 Май 2017 - 19:01) писал:

Блок с поиском в шаблоне HTML переместил:
				 <div class="noindex" id="search">
					 <form id="search_mini_form" action="http://{NET_DOMAIN}/search" method="get" onsubmit="if($(this).find('.searchinp').val()=='Поиск...') return false;">				
						 <input class="searchinp" type="text" name="q" value="{% IF SEARCH_QUERY %}{SEARCH_QUERY}{% ELSE %}Поиск...{% ENDIF %}" onfocus="if(this.value=='Поиск...'){this.value='';}" onblur="if(this.value==''){this.value='Поиск...';}" onclick="this.value = &#39;&#39;;"/>
						 <button title="Искать" type="submit" value="Поиск" class="button-search"><span class="icon-search"></span></button>
					 </form>
				 </div>

В main.css добавил код:
.headerTop .phoneNumber {float:left;}
.headerTop .phoneNumber {font-size:20px;}

В шаблон HTML добавил код:
			 <a href="tel://{SETTINGS_STORE_PHONE_COUNTRY_CODE1}{SETTINGS_STORE_PHONE_CITY_CODE1}{SETTINGS_STORE_PHONE_NUMBER1}">
				 <span class="phoneNumber">
				 <span class="phone-country-code">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}</span>
				 {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}({SETTINGS_STORE_PHONE_CITY_CODE1}){% ENDIF %}
				 {SETTINGS_STORE_PHONE_NUMBER1}
				 </span>
			 </a>

Ссылку на логотип в подвале поменял.
Проверьте результат, пожалуйста.

У меня просто нет слов. Все отлично. Только осталась самая малость. Чуть-чуть приподнять блок с контентом над логотипом(в футере), что бы "не прилипал"  А все остальное так, как я и хотел. Спасибо вам огромное. С уважением, Олег.

#18 Vaccina

Vaccina

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

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

Отправлено 06 Май 2017 - 01:59

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

Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
.content {
width: 1200px;
margin: 0 auto 20px auto;
}

замените на:
.content {
width: 1200px;
margin: 0 auto 60px auto;
}

Результат:
123.jpg

#19 nordix

nordix

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

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

Отправлено 06 Май 2017 - 23:30

Просмотр сообщенияVaccina (06 Май 2017 - 01:59) писал:

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

Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
.content {
width: 1200px;
margin: 0 auto 20px auto;
}

замените на:
.content {
width: 1200px;
margin: 0 auto 60px auto;
}

Результат:
Прикрепленный файл 123.jpg

Здравствуйте! Спасибо большое.

#20 nordix

nordix

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

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

Отправлено 22 Май 2017 - 03:52

Добрый день! Я убедительно прошу вас подкорректировать расположение логотипа в футере. На некоторых страницах расстояние (отступ) между логотипом и текстом отсутствует. Прошу вас увеличить расстояние между логотипом и контентом страницы. Логотип накладывается на нижнюю часть контента. Этого не должно быть.

Изображение

Изображение

Мой аккаунт: SL - 413625


Заранее вам благодарен. С уважением, Олег.
Обратно в Изменение общей стилистики


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

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

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