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


Как Изменить Размер И Расположение Надписи Телефона


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

#1 toconsole

toconsole

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

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

Отправлено 17 Июль 2013 - 23:57

как изменить размер и расположение надписи телефона

toconsole.storeland.ru

#2 Vaccina

Vaccina

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

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

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

Для изменения расположения - найдите в файле стилей style.css

.contacts {
	position: absolute;
	right: 2em;
	top: 2.5em;
}

и изменяйте положение путем изменения свойств right и top

Для изменения размера и цвета, найдите

.contacts .phone, .contacts .work-time {
	color: red;
	font-size: 20px;
}

и измените свойства font-size и color

#3 toconsole

toconsole

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

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

Отправлено 21 Июль 2013 - 20:39

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

Для изменения расположения - найдите в файле стилей style.css

.contacts {
position: absolute;
right: 2em;
top: 2.5em;
}

и изменяйте положение путем изменения свойств right и top

Для изменения размера и цвета, найдите

.contacts .phone, .contacts .work-time {
color: red;
font-size: 20px;
}

и измените свойства font-size и color

как изменить стиль шрифта и сдвинуть круглосуточно так чтобы оно было по середине номера

#4 miyako

miyako

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

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

Отправлено 22 Июль 2013 - 08:52

Просмотр сообщенияtoconsole (21 Июль 2013 - 20:39) писал:

как изменить стиль шрифта и сдвинуть круглосуточно так чтобы оно было по середине номера

Добавьте в конц файла style.css:
.contacts .work-time {
padding-left: 13px;
padding-top: 5px;
font-family: arial; /*шрифт*/
}


#5 toconsole

toconsole

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

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

Отправлено 22 Июль 2013 - 13:53

Просмотр сообщенияmiyako (22 Июль 2013 - 08:52) писал:

Добавьте в конц файла style.css:
.contacts .work-time {
padding-left: 13px;
padding-top: 5px;
font-family: arial; /*шрифт*/
}

еще какие то шрифты есть?

#6 support 2.0

support 2.0

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

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

Отправлено 22 Июль 2013 - 18:44

Просмотр сообщенияtoconsole (22 Июль 2013 - 13:53) писал:

еще какие то шрифты есть?

Можете поставить любой из этих стандартных шрифтов(просто вставляйте название шрифта вместо arial)

#7 janjak

janjak

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

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

Отправлено 29 Май 2014 - 13:44

У меня почему-то нет файла style.css:

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

Для изменения расположения - найдите в файле стилей style.css

.contacts {
position: absolute;
right: 2em;
top: 2.5em;
}

и изменяйте положение путем изменения свойств right и top

Для изменения размера и цвета, найдите

.contacts .phone, .contacts .work-time {
color: red;
font-size: 20px;
}

и измените свойства font-size и color

подскажите где искать? мне нужно изменить  
1) местоположение "режима работы" (ниже его подвинуть и немного левее)
2) Цвет, размер и положение"Связаться с нами"
3) Цвет, размер и положение телефона
SL-294500

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

  • шапка1.png


#8 Ирина345

Ирина345

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

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

Отправлено 29 Май 2014 - 15:27

Просмотр сообщенияjanjak (29 Май 2014 - 13:44) писал:

У меня почему-то нет файла style.css:


подскажите где искать? мне нужно изменить  
1) местоположение "режима работы" (ниже его подвинуть и немного левее)
2) Цвет, размер и положение"Связаться с нами"
3) Цвет, размер и положение телефона
SL-294500
Здравствуйте, все необходимые изменения делайте в файле main.css
1. Чтобы сдвинуть режим находим в main.css
 #header .bottommain { height: 40%; width: 100%; }

#header .bottommain .headcent { width: 25%; height:20px; margin-top: 6.5%; padding: 0 1.5%; color:#7B7B7B;font-size: 17px; }
заменяем на
#header .bottommain { height: 51%; width: 100%; }

#header .bottommain .headcent { width: 25%; height:20px; margin-top: 7.5%; padding: 0 1.5%; color:#7B7B7B;font-size: 17px;margin-left: -15px; }
сдвинуть влево можно меняя значение margin-left: -15px;

Связаться с нами
за цвет отвечает
#header .bottommain .headleft ul li.title span, #header .bottommain .headright ul li.title span { color:#767676; font-weight:bold; padding-left:10px; }

#header .bottommain .headleft ul li.title a { color:#767676; }
за цвет отвечает свойство color:#767676, вы можете менять значение 767676

что бы изменить размер добавляем перед "}" значение font-size: 17px; где можете менять размер 17
для телефона найдите цвет это
#header .bottommain .headleft span, #header .bottommain .headright span, #header .bottommain .headleft a { color:#8eac07; }
так же можете увеличить размер через font-size: 17px;
куда вы хотите сдвинуть этот блок?

#9 janjak

janjak

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

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

Отправлено 29 Май 2014 - 16:49

Спасибо за детальный ответ!
Блок "Связаться с нами и тел" сдвинуть ниже - оцентровать его, тоже самое и с блоком "Ваша корзина"
Подскажите, а как "Режим работы" поднять выше, какие значения нужно менять?

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

  • шапка3.png


#10 Ирина345

Ирина345

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

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

Отправлено 29 Май 2014 - 17:02

Просмотр сообщенияjanjak (29 Май 2014 - 16:49) писал:

Спасибо за детальный ответ!
Блок "Связаться с нами и тел" сдвинуть ниже - оцентровать его, тоже самое и с блоком "Ваша корзина"
Подскажите, а как "Режим работы" поднять выше, какие значения нужно менять?
что бы сдвинуть вниз для "Связаться с нами"находим
#header .bottommain .headleft { color:#767676; width: 33.3%; padding: 0.7% 0 0 0; margin-left: 3%; overflow: visible;}
чтобы опустить вниз меняете значение padding: 0.7% 0 0 0
для блока "Ваша корзина" находим
#header .bottommain .headright { width: 29.3%; padding: 0.7% 0 0 0; margin-right: 3%; }
так же меняете значение padding: 0.7% 0 0 0
В первый раз Вы просили опустить блок "Режим работы", Мы опустили, что отменить это найдите
#header .bottommain .headcent { width: 25%; height:20px; margin-top: 7.5%; padding: 0 1.5%; color:#7B7B7B;font-size: 17px;margin-left: -15px; }
margin-top: 7.5%;замените на  margin-top: 6.5%;

#11 janjak

janjak

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

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

Отправлено 29 Май 2014 - 17:30

при изменении размера шрифта - меняется только "с нами", что поправить, чтобы менялся весь блок?

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

  • шапка4.png


#12 Ирина345

Ирина345

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

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

Отправлено 29 Май 2014 - 17:39

Просмотр сообщенияjanjak (29 Май 2014 - 17:30) писал:

при изменении размера шрифта - меняется только "с нами", что поправить, чтобы менялся весь блок?
найдите
#header .bottommain .headleft ul li.title span, #header .bottommain .headright ul li.title span { color:#767676; font-weight:bold;  padding-left:10px; font-size: 17px;}
меняете значение  font-size: 17px;

#13 janjak

janjak

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

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

Отправлено 29 Май 2014 - 18:00

всё исправил, теперь меняется только "связаться" и не меняется "с нами"..
я совсем запутался, это две разные строчки в main.css отвечают за эти два слова или одна?

#14 Ирина345

Ирина345

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

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

Отправлено 29 Май 2014 - 18:15

Просмотр сообщенияjanjak (29 Май 2014 - 18:00) писал:

всё исправил, теперь меняется только "связаться" и не меняется "с нами"..
я совсем запутался, это две разные строчки в main.css отвечают за эти два слова или одна?
Да это два разных кода для слова Связаться
#header .bottommain .headleft ul li.title span, #header .bottommain .headright ul li.title span { color:#767676; font-weight:bold;  padding-left:10px; font-size: 21px;}
для слова С нами и Ваша корзина
#header .bottommain .headright a, #header .bottommain .headleft a, #header .bottommain .headright ul li.title a span { color:#BEDC00; text-decoration:none;font-size: 25px; }


#15 janjak

janjak

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

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

Отправлено 30 Май 2014 - 11:36

А где мне изменить сам текст надписи в режиме работы?

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

  • шапка5.png


#16 Taisia

Taisia

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

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

Отправлено 30 Май 2014 - 17:09

вам нужно в файле HTML (сайт-редактор шаблонов)

найти код
{% IF SETTINGS_STORE_WORK_TIME %}<div class="headcent over fleft txtalgncnt fnt14 fmlptn"><span>Работает {SETTINGS_STORE_WORK_TIME}</span></div>{% ENDIF %}

меняйте в нем слово работает на нужное вам

#17 janjak

janjak

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

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

Отправлено 24 Июнь 2014 - 12:34

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

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

  • адрес шапка.png


#18 Ирина345

Ирина345

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

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

Отправлено 24 Июнь 2014 - 13:56

Просмотр сообщенияjanjak (24 Июнь 2014 - 12:34) писал:

Подскажите, пожалуйста, как добавить фактический адрес магазина (г.Москва, ул...) под номер телефона?
Здравствуйте, найдите в hTML
<li class="phone">
					<span class="phoneNum">
					  {% IF SETTINGS_STORE_PHONE_NUMBER1 %}<a class="tel1" title="Номер телефона: {SETTINGS_STORE_PHONE_COUNTRY_CODE1} {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}({SETTINGS_STORE_PHONE_CITY_CODE1}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER1}" href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE1} {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}{SETTINGS_STORE_PHONE_CITY_CODE1}{% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER1}">{SETTINGS_STORE_PHONE_COUNTRY_CODE1} {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}({SETTINGS_STORE_PHONE_CITY_CODE1}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER1}</a>{%ENDIF%}
					  {% IF SETTINGS_STORE_PHONE_NUMBER2 %}<a class="tel2" title="Номер телефона: {SETTINGS_STORE_PHONE_COUNTRY_CODE2} {% IF SETTINGS_STORE_PHONE_CITY_CODE2 %}({SETTINGS_STORE_PHONE_CITY_CODE2}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER2}" 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="telColor">&nbsp;|&nbsp;</span>{SETTINGS_STORE_PHONE_COUNTRY_CODE2} {% IF SETTINGS_STORE_PHONE_CITY_CODE2 %}({SETTINGS_STORE_PHONE_CITY_CODE2}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER2}</a>{%ENDIF%}
					  {% IF SETTINGS_STORE_PHONE_NUMBER3 %}<a class="tel3" title="Номер телефона: {SETTINGS_STORE_PHONE_COUNTRY_CODE3} {% IF SETTINGS_STORE_PHONE_CITY_CODE3 %}({SETTINGS_STORE_PHONE_CITY_CODE3}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER3}" 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="telColor">&nbsp;|&nbsp;</span>{SETTINGS_STORE_PHONE_COUNTRY_CODE3} {% IF SETTINGS_STORE_PHONE_CITY_CODE3 %}({SETTINGS_STORE_PHONE_CITY_CODE3}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER3}</a>{%ENDIF%}
					</span>
				</li>
замените на

<li class="phone">
					<span class="phoneNum">
					  {% IF SETTINGS_STORE_PHONE_NUMBER1 %}<a class="tel1" title="Номер телефона: {SETTINGS_STORE_PHONE_COUNTRY_CODE1} {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}({SETTINGS_STORE_PHONE_CITY_CODE1}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER1}" href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE1} {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}{SETTINGS_STORE_PHONE_CITY_CODE1}{% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER1}">{SETTINGS_STORE_PHONE_COUNTRY_CODE1} {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}({SETTINGS_STORE_PHONE_CITY_CODE1}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER1}</a>{%ENDIF%}
					  {% IF SETTINGS_STORE_PHONE_NUMBER2 %}<a class="tel2" title="Номер телефона: {SETTINGS_STORE_PHONE_COUNTRY_CODE2} {% IF SETTINGS_STORE_PHONE_CITY_CODE2 %}({SETTINGS_STORE_PHONE_CITY_CODE2}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER2}" 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="telColor">&nbsp;|&nbsp;</span>{SETTINGS_STORE_PHONE_COUNTRY_CODE2} {% IF SETTINGS_STORE_PHONE_CITY_CODE2 %}({SETTINGS_STORE_PHONE_CITY_CODE2}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER2}</a>{%ENDIF%}
					  {% IF SETTINGS_STORE_PHONE_NUMBER3 %}<a class="tel3" title="Номер телефона: {SETTINGS_STORE_PHONE_COUNTRY_CODE3} {% IF SETTINGS_STORE_PHONE_CITY_CODE3 %}({SETTINGS_STORE_PHONE_CITY_CODE3}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER3}" 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="telColor">&nbsp;|&nbsp;</span>{SETTINGS_STORE_PHONE_COUNTRY_CODE3} {% IF SETTINGS_STORE_PHONE_CITY_CODE3 %}({SETTINGS_STORE_PHONE_CITY_CODE3}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER3}</a>{%ENDIF%}
					</span>
<div> Ваш адрес</div>
				</li>


#19 janjak

janjak

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

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

Отправлено 24 Июнь 2014 - 14:27

Спасибо! А как можно изменить размер и цвет шрифта?

#20 Castiel

Castiel

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

  • Модераторы
  • 3 519 сообщений
  • ГородНижний Новгород

Отправлено 24 Июнь 2014 - 17:10

Просмотр сообщенияjanjak (24 Июнь 2014 - 14:27) писал:

Спасибо! А как можно изменить размер и цвет шрифта?


В файле "main.css".
Найти:
#header .bottommain .headleft ul .phone .phoneNum a {
color: #8eac07;
font-size: 100%;
white-space: nowrap;
}

Заменить:
color: #8eac07;  цвет
font-size: 100%;  размер, например 26px




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

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