Отключен JavaScript

У вас отключен JavaScript. Некоторые возможности системы не будут работать. Пожалуйста, включите JavaScript для получения доступа ко всем функциям.

0

Подвал: Добавить Вотсап В Контакты

Автор Andrew S., 13 мая 2015 10:16

Авторизуйтесь для ответа в теме

Сообщений в теме: 5

#1 Andrew S.

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

Пользователи
1 382 сообщений

ГородKhabarovsk

Отправлено 13 Май 2015 - 10:16

Добрый день!

Очень надо, помогите, пожалуйста, добавить WhatsApp в контакты!

Это, наверное, иконка внутрь круга помещается?

Или скажите как сделать иконку, если я ошибся?

Как сделать надпись - видно на изображении справа. Можно текст просто вручную прописать! Желательно пока что не задействовать третий телефон, вдруг понадобится для третьего.

Только у меня шрифт на картинке чуть великоват получился. Всё чтобы было тем же шрифтом, что и есть вокруг везде.

Сообщение отредактировал Andrew S.: 13 Май 2015 - 10:29

Наверх

#2 Danil

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

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

Отправлено 13 Май 2015 - 10:31

Andrew S. (13 Май 2015 - 10:16) писал:

Добрый день!

Очень надо, помогите, пожалуйста, добавить WhatsApp в контакты!

WhatsApp-need.png

Это, наверное, иконка внутрь круга помещается?

whatsapp-16.png

Или скажите как сделать иконку, если я ошибся?

Как сделать надпись - видно на изображении справа. Можно текст просто вручную прописать! Желательно пока что не задействовать третий телефон, вдруг понадобится для третьего.

Здравствуйте.
В шаблоне html найдите код

{% IF SETTINGS_STORE_SKYPE %}

и перед ним вставьте

										<li class="skype">
											<span class="WhatsAppImg"></span>
											<span class="skypeTxt">
												<span>WhatsApp:</span>
												<a href="WhatsApp:Номер">Номер</a>
											</span>
										</li>

Далее в конец main.css добавьте

.WhatsAppImg {
  display: inline-block;
  float: left;
  clear: both;
  width: 30px;
  height: 30px;
  margin-right: .6em;
  text-align: center;
  border: 1px solid #F7F7F7;
  -moz-border-radius: 15px;
  border-radius: 15px;
  background-image: url('Ссылка на иконку');
  background-repeat: no-repeat;
  background-position: -2px -576px;
  -wibkit-border-radius: 15px;
  vertical-align: middle;
  padding-top: 3px;
}

Наверх

#3 Andrew S.

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

Пользователи
1 382 сообщений

ГородKhabarovsk

Отправлено 13 Май 2015 - 12:50

Danil (13 Май 2015 - 10:31) писал:

Здравствуйте.
В шаблоне html найдите код

{% IF SETTINGS_STORE_SKYPE %}

и перед ним вставьте

									 <li class="skype">
										 <span class="WhatsAppImg"></span>
										 <span class="skypeTxt">
											 <span>WhatsApp:</span>
											 <a href="WhatsApp:Номер">Номер</a>
										 </span>
									 </li>

Далее в конец main.css добавьте

.WhatsAppImg {
display: inline-block;
float: left;
clear: both;
width: 30px;
height: 30px;
margin-right: .6em;
text-align: center;
border: 1px solid #F7F7F7;
-moz-border-radius: 15px;
border-radius: 15px;
background-image: url('Ссылка на иконку');
background-repeat: no-repeat;
background-position: -2px -576px;
-wibkit-border-radius: 15px;
vertical-align: middle;
padding-top: 3px;
}

Спасибо! Только подскажите почему иконка не отображается. Может я неправильный размер иконки выбрал? Или ещё что.

Наверх

#4 Danil

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

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

Отправлено 13 Май 2015 - 12:57

Andrew S. (13 Май 2015 - 12:50) писал:

Спасибо! Только подскажите почему иконка не отображается. Может я неправильный размер иконки выбрал? Или ещё что.

код

.WhatsAppImg {
  display: inline-block;
  float: left;
  clear: both;
  width: 30px;
  height: 30px;
  margin-right: .6em;
  text-align: center;
  border: 1px solid #F7F7F7;
  -moz-border-radius: 15px;
  border-radius: 15px;
  background-image: url('http://st.technoimp.ru/6/1655/695/whatsapp-16.png');
  background-repeat: no-repeat;
background-position: -2px -576px;
  -wibkit-border-radius: 15px;
  vertical-align: middle;
  padding-top: 3px;
}

замените на

.WhatsAppImg {
  display: inline-block;
  float: left;
  clear: both;
  width: 30px;
  height: 30px;
  margin-right: .6em;
  text-align: center;
  border: 1px solid #F7F7F7;
  -moz-border-radius: 15px;
  border-radius: 15px;
  background-image: url('http://st.technoimp.ru/6/1655/695/whatsapp-16.png');
  background-repeat: no-repeat;
  background-position: 5px 6px;
  -wibkit-border-radius: 15px;
  vertical-align: middle;
  padding-top: 3px;
}

Наверх

#5 Ibra

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

Пользователи
191 сообщений

Отправлено 18 Май 2016 - 18:24

Danil (13 Май 2015 - 12:57) писал:

код

.WhatsAppImg {
display: inline-block;
float: left;
clear: both;
width: 30px;
height: 30px;
margin-right: .6em;
text-align: center;
border: 1px solid #F7F7F7;
-moz-border-radius: 15px;
border-radius: 15px;
background-image: url('http://st.technoimp.ru/6/1655/695/whatsapp-16.png');
background-repeat: no-repeat;
background-position: -2px -576px;
-wibkit-border-radius: 15px;
vertical-align: middle;
padding-top: 3px;
}

замените на

.WhatsAppImg {
display: inline-block;
float: left;
clear: both;
width: 30px;
height: 30px;
margin-right: .6em;
text-align: center;
border: 1px solid #F7F7F7;
-moz-border-radius: 15px;
border-radius: 15px;
background-image: url('http://st.technoimp.ru/6/1655/695/whatsapp-16.png');
background-repeat: no-repeat;
background-position: 5px 6px;
-wibkit-border-radius: 15px;
vertical-align: middle;
padding-top: 3px;
}

скажите пожалуйста как сделать чтобы ватсап и емайл в шапке сайта не был кликабельный ,а чтобы был как текст