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


Html В Шапке Шаблона Лайт


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

#21 Ирина345

Ирина345

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

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

Отправлено 02 Июнь 2015 - 16:06

Просмотр сообщенияNikolay (02 Июнь 2015 - 14:58) писал:

Благодарю, все получилось, помогите пожалуйста еще переместить элементы картинка
Найдите в шаблоне hTML
<div class="header_top">
</div>
замените на

<div class="header_top">
   <!-- Название магазина -->
	<div class="content">		  <div class="logo"><a href="http://{NET_DOMAIN}/">{SETTINGS_STORE_NAME}</a></div>  
			 {% IF SETTINGS_STORE_PHONE_NUMBER1 %}
			   
				 <div class="contentTableHeadMainPhone">
					{SETTINGS_STORE_PHONE_COUNTRY_CODE1} {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}({SETTINGS_STORE_PHONE_CITY_CODE1}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER1}
				  </div> 
			  {% ENDIF %}
				{% IF SETTINGS_STORE_WORK_TIME %}
				
				   <div class="contentTableHeadMainWorkTime">
					{SETTINGS_STORE_WORK_TIME}
				 </div> 
			  {% ENDIF %}
				{% IF TARIFF_FEATURE_CLIENT_ROOM %}
			  <div class="contentTableHeadUserInfo">
				{% IF CLIENT_IS_LOGIN %}
				  Здравствуйте, <a href="{USER_SETTINGS_URL}">{CLIENT_NAME}</a>&nbsp;&nbsp;&nbsp;&nbsp;<a href="{USER_LOGOUT_URL}">Выйти</a><br />
				{% ELSE %}
				  <a href="{USER_LOGIN_URL}">Вход с паролем</a> |
				  <a href="{USER_REGISTER_URL}">Регистрация</a>
				{% ENDIF %}
			  </div>
			{% ENDIF %}</div>
			  
</div>
Добавьте в конец main.css
.header_top .content {

  border:none;
}
.header_top .logo {
  font-size: 2em;
  font-family: Helvetica;
  color: #636363;
  letter-spacing: 0em;
  line-height: 1.1em;
  width: 255px;
   float: left;
}
.header_top .contentTableHeadUserInfo{ float: left;  padding:2px;}
.header_top .contentTableHeadMainWorkTime{float: left;  padding:2px;}
div.contentTableHeadMainPhone {
  float: left;
  color:#fff;
  padding:2px;
}


#22 Nikolay

Nikolay

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

  • Пользователи
  • PipPipPip
  • 89 сообщений
  • ГородМосква

Отправлено 02 Июнь 2015 - 16:16

Просмотр сообщенияИрина345 (02 Июнь 2015 - 16:06) писал:

Найдите в шаблоне hTML
<div class="header_top">
</div>
замените на

<div class="header_top">
<!-- Название магазина -->
<div class="content"> <div class="logo"><a href="http://{NET_DOMAIN}/">{SETTINGS_STORE_NAME}</a></div>
{% IF SETTINGS_STORE_PHONE_NUMBER1 %}

<div class="contentTableHeadMainPhone">
{SETTINGS_STORE_PHONE_COUNTRY_CODE1} {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}({SETTINGS_STORE_PHONE_CITY_CODE1}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER1}
</div>
{% ENDIF %}
{% IF SETTINGS_STORE_WORK_TIME %}

<div class="contentTableHeadMainWorkTime">
{SETTINGS_STORE_WORK_TIME}
</div>
{% ENDIF %}
{% IF TARIFF_FEATURE_CLIENT_ROOM %}
<div class="contentTableHeadUserInfo">
{% IF CLIENT_IS_LOGIN %}
Здравствуйте, <a href="{USER_SETTINGS_URL}">{CLIENT_NAME}</a>&nbsp;&nbsp;&nbsp;&nbsp;<a href="{USER_LOGOUT_URL}">Выйти</a><br />
{% ELSE %}
<a href="{USER_LOGIN_URL}">Вход с паролем</a> |
<a href="{USER_REGISTER_URL}">Регистрация</a>
{% ENDIF %}
</div>
{% ENDIF %}</div>

</div>
Добавьте в конец main.css
.header_top .content {

border:none;
}
.header_top .logo {
font-size: 2em;
font-family: Helvetica;
color: #636363;
letter-spacing: 0em;
line-height: 1.1em;
width: 255px;
float: left;
}
.header_top .contentTableHeadUserInfo{ float: left; padding:2px;}
.header_top .contentTableHeadMainWorkTime{float: left; padding:2px;}
div.contentTableHeadMainPhone {
float: left;
color:#fff;
padding:2px;
}

Благодарю, как выровнить эти элементы, и удалить старые?

#23 Vaccina

Vaccina

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

  • Модераторы
  • 23 788 сообщений

Отправлено 03 Июнь 2015 - 06:21

В шаблоне HTML найдите и удалите:
<!-- Название магазина -->
			<div class="logo"><a href="http://{NET_DOMAIN}/">{SETTINGS_STORE_NAME}</a></div> 
			<!-- Контакты магазина -->
			<table>
			  <!-- Первый контактный телефон -->
			  {% IF SETTINGS_STORE_PHONE_NUMBER1 %}
				<tr>
				  <td class="contentTableHeadMainPhone">
					{SETTINGS_STORE_PHONE_COUNTRY_CODE1} {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}({SETTINGS_STORE_PHONE_CITY_CODE1}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER1}
				  </td>
				</tr>
			  {% ENDIF %}
			 
			  <!-- Второй контактный телефон -->
			  {% IF SETTINGS_STORE_PHONE_NUMBER2 %}
				<tr>
				  <td class="contentTableHeadMainPhone">
					{SETTINGS_STORE_PHONE_COUNTRY_CODE2} {% IF SETTINGS_STORE_PHONE_CITY_CODE2 %}({SETTINGS_STORE_PHONE_CITY_CODE2}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER2}
				  </td>
				</tr>
			  {% ENDIF %}
		   
			  <!-- Третий контактный телефон -->
			  {% IF SETTINGS_STORE_PHONE_NUMBER3 %}
				<tr>
				  <td class="contentTableHeadMainPhone">
					{SETTINGS_STORE_PHONE_COUNTRY_CODE3} {% IF SETTINGS_STORE_PHONE_CITY_CODE3 %}({SETTINGS_STORE_PHONE_CITY_CODE3}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER3}
				  </td>
				</tr>
			  {% ENDIF %}
			  <!-- Время работы магазина -->
			  {% IF SETTINGS_STORE_WORK_TIME %}
				<tr>
				  <td class="contentTableHeadMainWorkTime">
					{SETTINGS_STORE_WORK_TIME}
				  </td>
				</tr>
			  {% ENDIF %}
			 
			  <!-- Skype номер -->
			  {% IF SETTINGS_STORE_SKYPE %}
				<tr>
				  <td 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>
				  </td>
				</tr>
			  {% ENDIF %}
			 
			  <!-- ICQ номер -->
			  {% IF SETTINGS_STORE_ICQ %}
				<tr>
				  <td 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>
				  </td>
				</tr>
			  {% ENDIF %}
			</table>

(начинается со строки 94) и:
{% IF TARIFF_FEATURE_CLIENT_ROOM %}
			  <div class="contentTableHeadUserInfo">
				{% IF CLIENT_IS_LOGIN %}
				  Здравствуйте, <a href="{USER_SETTINGS_URL}">{CLIENT_NAME}</a>&nbsp;&nbsp;&nbsp;&nbsp;<a href="{USER_LOGOUT_URL}">Выйти</a><br />
				{% ELSE %}
				  <a href="{USER_LOGIN_URL}">Вход с паролем</a> |
				  <a href="{USER_REGISTER_URL}">Регистрация</a>
				{% ENDIF %}
			  </div>
			{% ENDIF %}
(начинается со строки 170)

#24 Nikolay

Nikolay

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

  • Пользователи
  • PipPipPip
  • 89 сообщений
  • ГородМосква

Отправлено 03 Июнь 2015 - 17:58

Просмотр сообщенияVaccina (03 Июнь 2015 - 06:21) писал:

В шаблоне HTML найдите и удалите:
<!-- Название магазина -->
		 <div class="logo"><a href="http://{NET_DOMAIN}/">{SETTINGS_STORE_NAME}</a></div>
		 <!-- Контакты магазина -->
		 <table>
			 <!-- Первый контактный телефон -->
			 {% IF SETTINGS_STORE_PHONE_NUMBER1 %}
			 <tr>
				 <td class="contentTableHeadMainPhone">
				 {SETTINGS_STORE_PHONE_COUNTRY_CODE1} {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}({SETTINGS_STORE_PHONE_CITY_CODE1}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER1}
				 </td>
			 </tr>
			 {% ENDIF %}
			
			 <!-- Второй контактный телефон -->
			 {% IF SETTINGS_STORE_PHONE_NUMBER2 %}
			 <tr>
				 <td class="contentTableHeadMainPhone">
				 {SETTINGS_STORE_PHONE_COUNTRY_CODE2} {% IF SETTINGS_STORE_PHONE_CITY_CODE2 %}({SETTINGS_STORE_PHONE_CITY_CODE2}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER2}
				 </td>
			 </tr>
			 {% ENDIF %}
		
			 <!-- Третий контактный телефон -->
			 {% IF SETTINGS_STORE_PHONE_NUMBER3 %}
			 <tr>
				 <td class="contentTableHeadMainPhone">
				 {SETTINGS_STORE_PHONE_COUNTRY_CODE3} {% IF SETTINGS_STORE_PHONE_CITY_CODE3 %}({SETTINGS_STORE_PHONE_CITY_CODE3}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER3}
				 </td>
			 </tr>
			 {% ENDIF %}
			 <!-- Время работы магазина -->
			 {% IF SETTINGS_STORE_WORK_TIME %}
			 <tr>
				 <td class="contentTableHeadMainWorkTime">
				 {SETTINGS_STORE_WORK_TIME}
				 </td>
			 </tr>
			 {% ENDIF %}
			
			 <!-- Skype номер -->
			 {% IF SETTINGS_STORE_SKYPE %}
			 <tr>
				 <td 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>
				 </td>
			 </tr>
			 {% ENDIF %}
			
			 <!-- ICQ номер -->
			 {% IF SETTINGS_STORE_ICQ %}
			 <tr>
				 <td 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>
				 </td>
			 </tr>
			 {% ENDIF %}
		 </table>

(начинается со строки 94) и:
{% IF TARIFF_FEATURE_CLIENT_ROOM %}
			 <div class="contentTableHeadUserInfo">
			 {% IF CLIENT_IS_LOGIN %}
				 Здравствуйте, <a href="{USER_SETTINGS_URL}">{CLIENT_NAME}</a>&nbsp;&nbsp;&nbsp;&nbsp;<a href="{USER_LOGOUT_URL}">Выйти</a><br />
			 {% ELSE %}
				 <a href="{USER_LOGIN_URL}">Вход с паролем</a> |
				 <a href="{USER_REGISTER_URL}">Регистрация</a>
			 {% ENDIF %}
			 </div>
		 {% ENDIF %}
(начинается со строки 170)

Благодарю, а где можно выравнивать те элементы которые которые в шапке вставили?

#25 Danil

Danil

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

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

Отправлено 03 Июнь 2015 - 18:12

Просмотр сообщенияNikolay (03 Июнь 2015 - 17:58) писал:

Благодарю, а где можно выравнивать те элементы которые которые в шапке вставили?
Здравствуйте.
В main.css найдите
.header_top .contentTableHeadUserInfo {
  float: left;
  padding: 2px;
}
и замените на
.header_top .contentTableHeadUserInfo {
  float: right;
  padding: 2px;
  margin-top: 10px;
}
найдите
.header_top .contentTableHeadMainWorkTime {
  float: left;
  padding: 2px;
}
и замените на
.header_top .contentTableHeadMainWorkTime {
  float: left;
  padding: 2px;
  margin-left: 112px;
  margin-top: 10px;
}
так же найдите
div.contentTableHeadMainPhone {
  float: left;
  color: #fff;
  padding: 2px;
}
и замените на
div.contentTableHeadMainPhone {
  float: left;
  color: #fff;
  padding: 2px;
  margin-top: 8px;
  margin-left: 200px;
}


#26 Nikolay

Nikolay

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

  • Пользователи
  • PipPipPip
  • 89 сообщений
  • ГородМосква

Отправлено 03 Июнь 2015 - 18:56

Просмотр сообщенияDanil (03 Июнь 2015 - 18:12) писал:

Здравствуйте.
В main.css найдите
.header_top .contentTableHeadUserInfo {
float: left;
padding: 2px;
}
и замените на
.header_top .contentTableHeadUserInfo {
float: right;
padding: 2px;
margin-top: 10px;
}
найдите
.header_top .contentTableHeadMainWorkTime {
float: left;
padding: 2px;
}
и замените на
.header_top .contentTableHeadMainWorkTime {
float: left;
padding: 2px;
margin-left: 112px;
margin-top: 10px;
}
так же найдите
div.contentTableHeadMainPhone {
float: left;
color: #fff;
padding: 2px;
}
и замените на
div.contentTableHeadMainPhone {
float: left;
color: #fff;
padding: 2px;
margin-top: 8px;
margin-left: 200px;
}

Спасибо, все получилось, а где изменить цвета и размер можно?

#27 Dars

Dars

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

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

Отправлено 03 Июнь 2015 - 19:18

Просмотр сообщенияNikolay (03 Июнь 2015 - 18:56) писал:

Спасибо, все получилось, а где изменить цвета и размер можно?
Здравствуйте!
В main.css нужно добавлять следующее:

1)для названия магазина:

.logo a {color:black; font-size:14px; font-weight:bolder;}

где black - цвет, 14px - размер шрифта, а font-weight: bolder делает текст более жирным.

2) для телефона найдите код:

div.contentTableHeadMainPhone {
  float: left;
  color: #fff;
  padding: 2px;
  margin-top: 8px;
  margin-left: 200px;
}

здесь изменяйте/добавляйте параметры, описанные в пункте 1.

3) для времени работы найдите код:

.header_top .contentTableHeadMainWorkTime {float: left;padding: 2px;margin-left: 112px;margin-top: 10px;}

изменения аналогичны вышеописанным.

4) для входа и регистрации найдите код:

.header_top .contentTableHeadUserInfo {float: right;padding: 2px;margin-top: 10px;}

изменения аналогичны вышеописанным.

#28 Nikolay

Nikolay

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

  • Пользователи
  • PipPipPip
  • 89 сообщений
  • ГородМосква

Отправлено 03 Июнь 2015 - 22:15

Просмотр сообщенияDars (03 Июнь 2015 - 19:18) писал:

Здравствуйте!
В main.css нужно добавлять следующее:

1)для названия магазина:

.logo a {color:black; font-size:14px; font-weight:bolder;}

где black - цвет, 14px - размер шрифта, а font-weight: bolder делает текст более жирным.

2) для телефона найдите код:

div.contentTableHeadMainPhone {
float: left;
color: #fff;
padding: 2px;
margin-top: 8px;
margin-left: 200px;
}

здесь изменяйте/добавляйте параметры, описанные в пункте 1.

3) для времени работы найдите код:

.header_top .contentTableHeadMainWorkTime {float: left;padding: 2px;margin-left: 112px;margin-top: 10px;}

изменения аналогичны вышеописанным.

4) для входа и регистрации найдите код:

.header_top .contentTableHeadUserInfo {float: right;padding: 2px;margin-top: 10px;}

изменения аналогичны вышеописанным.

не совсем понял, а каком месте main.css нужно добавлять?

#29 Vaccina

Vaccina

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

  • Модераторы
  • 23 788 сообщений

Отправлено 04 Июнь 2015 - 04:18

Можно добавлять данные блоки стилей в самом конце файла main.css

#30 Nikolay

Nikolay

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

  • Пользователи
  • PipPipPip
  • 89 сообщений
  • ГородМосква

Отправлено 04 Июнь 2015 - 10:19

Просмотр сообщенияVaccina (04 Июнь 2015 - 04:18) писал:

Можно добавлять данные блоки стилей в самом конце файла main.css

разобрался только к п.1 и 2.

где здесь менять цвет не понимаю:
.header_top .contentTableHeadMainWorkTime {float: left;padding: 2px;margin-left: 112px;margin-top: 10px;}
.header_top .contentTableHeadUserInfo {float: right;padding: 2px;margin-top: 10px;}

#31 Firefly

Firefly

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

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

Отправлено 04 Июнь 2015 - 11:03

Просмотр сообщенияNikolay (04 Июнь 2015 - 10:19) писал:

разобрался только к п.1 и 2.

где здесь менять цвет не понимаю:
.header_top .contentTableHeadMainWorkTime {float: left;padding: 2px;margin-left: 112px;margin-top: 10px;}
.header_top .contentTableHeadUserInfo {float: right;padding: 2px;margin-top: 10px;}

Зайдите в админ. панель -> Сайт -> Редактор шаблонов -> Стили -> main.css, найдите код:
.contentTableHeadMainWorkTime	 {text-align:center;color:#888;font-size:1.1em;}
Изменяйте значение кода цвета #888 на необходимое.

Чтобы изменить цвет разделителя ( | )найдите код:
.contentTableHeadUserInfo		 {text-align:center;width:220px;overflow:hidden;}

Замените на:
.contentTableHeadUserInfo		 {text-align:center;width:220px;overflow:hidden;color: #fff;}

Чтобы изменить цвет "Вход с паролем" и "Регистрация" в конце main.css, добавьте код:
.contentTableHeadUserInfo a {color: #fff;}
#fff - белый цвет, можете изменить на необходимый.

#32 Nikolay

Nikolay

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

  • Пользователи
  • PipPipPip
  • 89 сообщений
  • ГородМосква

Отправлено 04 Июнь 2015 - 12:36

Просмотр сообщенияFirefly (04 Июнь 2015 - 11:03) писал:

Зайдите в админ. панель -> Сайт -> Редактор шаблонов -> Стили -> main.css, найдите код:
.contentTableHeadMainWorkTime	 {text-align:center;color:#888;font-size:1.1em;}
Изменяйте значение кода цвета #888 на необходимое.

Чтобы изменить цвет разделителя ( | )найдите код:
.contentTableHeadUserInfo		 {text-align:center;width:220px;overflow:hidden;}

Замените на:
.contentTableHeadUserInfo		 {text-align:center;width:220px;overflow:hidden;color: #fff;}

Чтобы изменить цвет "Вход с паролем" и "Регистрация" в конце main.css, добавьте код:
.contentTableHeadUserInfo a {color: #fff;}
#fff - белый цвет, можете изменить на необходимый.

Спасибо, все получилось.




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

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