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


Некоректное Отображение На Смартфоне


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

#1 Mamba

Mamba

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

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

Отправлено 13 Апрель 2016 - 21:39

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

или тогда как мне сделать, то что показано на вложенной фото?

1) Вставить свой логотип в левый угол так,что бы он везде отражался правильно и при этом ,что бы он был больше?
2) телефоны ,те что слева они из основных настроек , как их и все что под ними переместить чуть выше? и поставить перед ними иконки телефонов ,как справа?
3) как под время работы поместить почту? и перед ней что бы тоже была иконка?
4) как поместить иконку перед время работы?
5) как удалить контакты , время работы,почту те что справа?

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

  • 2016-04-13 22-06-00 Скриншот экрана.png


#2 Vaccina

Vaccina

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

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

Отправлено 14 Апрель 2016 - 05:10

В шаблоне HTML найдите:
<header role="banner">
	 <div class="hgroup">
	 <h1 title="{SETTINGS_STORE_NAME}"><a href="http://{NET_DOMAIN}/" title="{SETTINGS_STORE_NAME}"><img src="{ASSETS_IMAGES_PATH}logo.png?design=eternity" alt="{SETTINGS_STORE_NAME}" /><br />{SETTINGS_STORE_NAME}</a></h1>
	 <!-- Контактные телефоны -->
	 {% IF SETTINGS_STORE_PHONE_NUMBER1 || SETTINGS_STORE_PHONE_NUMBER2 || SETTINGS_STORE_PHONE_NUMBER3 || SETTINGS_STORE_WORK_TIME || SETTINGS_STORE_SKYPE || SETTINGS_STORE_ICQ %}
		 <div class="contacts">
		 <div class="phone" title="Звоните, мы проконсультируем вас по любым вопросам">
			 <!-- Первый контактный телефон -->
			 {% IF SETTINGS_STORE_PHONE_NUMBER1 %}
			 <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}
			 {% ENDIF %}
			
			 <!-- Второй контактный телефон -->
			 {% IF SETTINGS_STORE_PHONE_NUMBER2 %}
			 <br /><span class="phone-country-code">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}</span>
			 {% IF SETTINGS_STORE_PHONE_CITY_CODE2 %}({SETTINGS_STORE_PHONE_CITY_CODE2}){% ENDIF %}
			 {SETTINGS_STORE_PHONE_NUMBER2}
			 {% ENDIF %}
			
			 <!-- Третий контактный телефон -->
			 {% IF SETTINGS_STORE_PHONE_NUMBER3 %}
			 <br /><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}
			 {% ENDIF %}
		 </div>
		
		 <!-- Время работы магазина -->
		 {% IF SETTINGS_STORE_WORK_TIME %}
			 <div class="work-time" title="Время работы нашего магазина: {SETTINGS_STORE_WORK_TIME}">
			 {SETTINGS_STORE_WORK_TIME}
			 </div>
		 {% ENDIF %}
		
		 <!-- Skype номер -->
		 {% IF SETTINGS_STORE_SKYPE %}
			 <div class="contentTableHeadMainSkype">
			 <a class="valignMiddle" href="skype:{SETTINGS_STORE_SKYPE}?call" title="Свяжитесь с нами по Skype">
				 <img class="valignMiddle" src="{FORALL_IMAGES_PATH}icon/skype.png" width="16" height="16" alt="Свяжитесь с нами по Skype" />
				 <span class="valignMiddle">{SETTINGS_STORE_SKYPE}</span>
			 </a>
			 </div>
		 {% ENDIF %}
		
		 <!-- ICQ номер -->
		 {% IF SETTINGS_STORE_ICQ %}
			 <div class="contentTableHeadMainIcq">
			 <img class="valignMiddle" src="http://wwp.icq.com/scripts/online.dll?icq={SETTINGS_STORE_ICQ_ONLY_DIGITS}&amp;img=27" alt="Статус" width="16" height="16" />
			 <span class="valignMiddle">{SETTINGS_STORE_ICQ}</span>
			 </div>
		 {% ENDIF %}
		 </div>
	 {% ENDIF %}
	 </div>
	 <div class="contacts">
					 <div class="phone" title="Звоните, мы проконсультируем вас по любым вопросам">
						 <img src="http://st.mebel-stan.ru/7/1859/143/telephoneyellow_3564.png">
						 <!-- Первый контактный телефон -->
						 {% IF SETTINGS_STORE_PHONE_NUMBER1 %}
							 <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}
						 {% ENDIF %}
						
						 <!-- Второй контактный телефон -->
						 {% IF SETTINGS_STORE_PHONE_NUMBER2 %}
							 <br /><span class="phone-country-code">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}</span>
							 {% IF SETTINGS_STORE_PHONE_CITY_CODE2 %}({SETTINGS_STORE_PHONE_CITY_CODE2}){% ENDIF %}
							 {SETTINGS_STORE_PHONE_NUMBER2}
						 {% ENDIF %}
						
						 <!-- Третий контактный телефон -->
						 {% IF SETTINGS_STORE_PHONE_NUMBER3 %}
							 <br /><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}
						 {% ENDIF %}
					 </div>
				
					 <!-- Время работы магазина -->
					 {% IF SETTINGS_STORE_WORK_TIME %}
						 <div class="work-time" title="Время работы нашего магазина: {SETTINGS_STORE_WORK_TIME}">
						 <img src="http://st.mebel-stan.ru/6/1859/150/clockyellow_5017.png">
							 {SETTINGS_STORE_WORK_TIME}
						 </div>
					 {% ENDIF %}
				
					 <!-- Почта -->
					 {% IF SETTINGS_STORE_EMAIL_MAIN %}
					 <div class="work-time">
						 <img src="http://st.mebel-stan.ru/6/1859/151/refreshyellow_7348.png">
							 {SETTINGS_STORE_EMAIL_MAIN}
						 </div>
					 {% ENDIF %}
				 </div>
	 <!-- Форма поиска -->
	 <form action="http://{NET_DOMAIN}/search" method="get" onsubmit="if($(this).find('#search').val()=='Поиск по магазину...') return false;" role="search">
	 <div>
		 <input class="search" name="q" type="search" value="{% IF SEARCH_QUERY %}{SEARCH_QUERY}{% ELSE %}Поиск по магазину...{% ENDIF %}" onfocus="if(this.value=='Поиск по магазину...'){this.value='';}" onblur="if(this.value==''){this.value='Поиск по магазину...';}" />
		 <input type="hidden" name="goods_search_field_id" value="0" />
		 <input title="Искать" type="submit" value="Поиск" />
	 </div>
	 </form>
	 <!-- /Форма поиска -->
	 <!-- Если в тарифном плане подключен модуль сравнения товаров -->
	 {% IF TARIFF_FEATURE_GOODS_COMPARE %}
	 <!-- Если не выключен модуль сравнения товаров, то покажем этот блок -->
	 {% IFNOT SETTINGS_COMPARE_DISABLE %}
		 {% IF COMPARE_GOODS_COUNT=0 %}
		 <div class="compare hide">
			 <p>Ваш список сравнения пуст</p>
		 </div>
		 {% ELSE %}
		 <div class="compare">
			 <p><a href="{COMPARE_URL}">Сейчас на сравнении {COMPARE_GOODS_COUNT} товар{COMPARE_GOODS_COUNT | gen_word_end("","а","ов")}.</a></p>
		 </div>
		 {% ENDIF %}
	 {% ENDIF %}
	 {% ENDIF %}
	 <!-- END Если в тарифном плане подключен модуль фильтров по товарам -->
</header>

замените на:
<header role="banner">
	 <div class="hgroup">
	 <h1 title="{SETTINGS_STORE_NAME}"><a href="http://{NET_DOMAIN}/" title="{SETTINGS_STORE_NAME}"><img src="{ASSETS_IMAGES_PATH}logo.png?design=eternity" alt="{SETTINGS_STORE_NAME}" /></a></h1>
	 <div class="contacts">
					 <div class="phone" title="Звоните, мы проконсультируем вас по любым вопросам">
						 <img src="http://st.mebel-stan.ru/7/1859/143/telephoneyellow_3564.png">
						 <!-- Первый контактный телефон -->
						 {% IF SETTINGS_STORE_PHONE_NUMBER1 %}
							 <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}
						 {% ENDIF %}
						
						 <!-- Второй контактный телефон -->
						 {% IF SETTINGS_STORE_PHONE_NUMBER2 %}
							 <br /><span class="phone-country-code">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}</span>
							 {% IF SETTINGS_STORE_PHONE_CITY_CODE2 %}({SETTINGS_STORE_PHONE_CITY_CODE2}){% ENDIF %}
							 {SETTINGS_STORE_PHONE_NUMBER2}
						 {% ENDIF %}
						
						 <!-- Третий контактный телефон -->
						 {% IF SETTINGS_STORE_PHONE_NUMBER3 %}
							 <br /><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}
						 {% ENDIF %}
					 </div>
				
					 <!-- Время работы магазина -->
					 {% IF SETTINGS_STORE_WORK_TIME %}
						 <div class="work-time" title="Время работы нашего магазина: {SETTINGS_STORE_WORK_TIME}">
						 <img src="http://st.mebel-stan.ru/6/1859/150/clockyellow_5017.png">
							 {SETTINGS_STORE_WORK_TIME}
						 </div>
					 {% ENDIF %}
				
					 <!-- Почта -->
					 {% IF SETTINGS_STORE_EMAIL_MAIN %}
					 <div class="work-time">
						 <img src="http://st.mebel-stan.ru/6/1859/151/refreshyellow_7348.png">
							 {SETTINGS_STORE_EMAIL_MAIN}
						 </div>
					 {% ENDIF %}
				 </div>
	 </div>
	
	 <!-- Форма поиска -->
	 <form action="http://{NET_DOMAIN}/search" method="get" onsubmit="if($(this).find('#search').val()=='Поиск по магазину...') return false;" role="search">
	 <div>
		 <input class="search" name="q" type="search" value="{% IF SEARCH_QUERY %}{SEARCH_QUERY}{% ELSE %}Поиск по магазину...{% ENDIF %}" onfocus="if(this.value=='Поиск по магазину...'){this.value='';}" onblur="if(this.value==''){this.value='Поиск по магазину...';}" />
		 <input type="hidden" name="goods_search_field_id" value="0" />
		 <input title="Искать" type="submit" value="Поиск" />
	 </div>
	 </form>
	 <!-- /Форма поиска -->
	 <!-- Если в тарифном плане подключен модуль сравнения товаров -->
	 {% IF TARIFF_FEATURE_GOODS_COMPARE %}
	 <!-- Если не выключен модуль сравнения товаров, то покажем этот блок -->
	 {% IFNOT SETTINGS_COMPARE_DISABLE %}
		 {% IF COMPARE_GOODS_COUNT=0 %}
		 <div class="compare hide">
			 <p>Ваш список сравнения пуст</p>
		 </div>
		 {% ELSE %}
		 <div class="compare">
			 <p><a href="{COMPARE_URL}">Сейчас на сравнении {COMPARE_GOODS_COUNT} товар{COMPARE_GOODS_COUNT | gen_word_end("","а","ов")}.</a></p>
		 </div>
		 {% ENDIF %}
	 {% ENDIF %}
	 {% ENDIF %}
	 <!-- END Если в тарифном плане подключен модуль фильтров по товарам -->
</header>


В style.css найдите:
header[role="banner"] .hgroup {position: absolute; top: 1em; left: 1em; width: 39.877301%;}
header[role="banner"] h1 {color: #000;font-weight: normal;float: left;}
header[role="banner"] h1 a {height: 127px;width: 150px;display: block;font: normal 10px '';line-height: 50px;color: #000;font-weight: bold;}

замените на:
header[role="banner"] .hgroup {position: absolute; top: 1em; left: 1em; width: 55%;}
header[role="banner"] h1 {color: #000;font-weight: normal;float: left;}
header[role="banner"] h1 a {
height: 100px;
width: 250px;
display: block;
line-height: 110px;
color: #000;
font-weight: bold;
}

далее найдите:
.contacts {
float: right;
position: relative;
color: #000;
width: 58%;
margin-top: 20px;
font-size: 15px;
}

замените на:
.contacts {
float: right;
position: relative;
color: #000;
width: 58%;
margin-top: 5px;
font-size: 15px;
width: 230px;
}

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




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

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