Отключен JavaScript

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

0

Добавление Иконки Инстаграм И Вк

Автор igorkirin, 14 нояб. 2016 21:32

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

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

#1 igorkirin

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

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

Отправлено 14 Ноябрь 2016 - 21:32

как сделать вместо текста инстаграм или вк картинку?

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

Наверх

#2 Razon

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

Модератоpы
321 сообщений

Отправлено 15 Ноябрь 2016 - 09:27

igorkirin (14 Ноябрь 2016 - 21:32) писал:

как сделать вместо текста инстаграм или вк картинку?

Здравствуйте, в файле HTML найдите:

				  <a class="vk fa fa-vk" href="https://vk.com/casioorig" title="VK.com" target="_blank"><span>vk</span></a>
				  <a class="instagram fa fa-instagram" href="https://www.instagram.com/casioorig/" title="Instagram.com" target="_blank"><span>instagram</span></a>

Замените на:

				  <a class="icon-vk" href="https://vk.com/casioorig" title="VK.com" target="_blank"></a>
				  <a class="icon-instagram" href="https://www.instagram.com/casioorig/" title="Instagram.com" target="_blank"></a>

Наверх

#3 igorkirin

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

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

Отправлено 15 Ноябрь 2016 - 10:16

Ra1zon (15 Ноябрь 2016 - 09:27) писал:

Здравствуйте, в файле HTML найдите:

				 <a class="vk fa fa-vk" href="https://vk.com/casioorig" title="VK.com" target="_blank"><span>vk</span></a>
				 <a class="instagram fa fa-instagram" href="https://www.instagram.com/casioorig/" title="Instagram.com" target="_blank"><span>instagram</span></a>

Замените на:

				 <a class="icon-vk" href="https://vk.com/casioorig" title="VK.com" target="_blank"></a>
				 <a class="icon-instagram" href="https://www.instagram.com/casioorig/" title="Instagram.com" target="_blank"></a>

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

Наверх

#4 Razon

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

Модератоpы
321 сообщений

Отправлено 15 Ноябрь 2016 - 10:23

igorkirin (15 Ноябрь 2016 - 10:16) писал:

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

В конец файла main.css вставьте строку:

.social-links {font-size:20px;}

Где 20px размер шрифта (данные иконки вставлены через шрифт), увеличьте или уменьшите число при необходимости, чтобы соответственно увеличить или уменьшить размерность иконок.

Наверх

#5 igorkirin

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

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

Отправлено 16 Ноябрь 2016 - 09:36

Ra1zon (15 Ноябрь 2016 - 10:23) писал:

В конец файла main.css вставьте строку:

.social-links {font-size:20px;}

Где 20px размер шрифта (данные иконки вставлены через шрифт), увеличьте или уменьшите число при необходимости, чтобы соответственно увеличить или уменьшить размерность иконок.

спасибо

Наверх

#6 Аслан

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

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

Отправлено 12 Январь 2018 - 08:30

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

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

Наверх

#7 metry

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

Модераторы
884 сообщений

Отправлено 12 Январь 2018 - 09:29

Добрый день. Для внесения изменений зайдите в Редактор шаблонов-->main.css и найдите:

.footer-content a {color: #c8c8c8;font-size:120%;}

и замените на:

.footer-content h3.block-title {margin-top:15px;}
.footer-content a {color: #c8c8c8;font-size:120%;margin-bottom:10px}
.footer-content a.icon-instagram,.footer-content a.icon-vk {color: #c8c8c8;font-size:220%;text-align:center;}
.footer-content a.icon-vk {margin-right:10px;margin-left: 15%;}

Наверх

#8 Аслан

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

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

Отправлено 12 Январь 2018 - 09:39

metry (12 Январь 2018 - 09:29) писал:

Добрый день. Для внесения изменений зайдите в Редактор шаблонов-->main.css и найдите:

.footer-content a {color: #c8c8c8;font-size:120%;}

и замените на:

.footer-content h3.block-title {margin-top:15px;}
.footer-content a {color: #c8c8c8;font-size:120%;margin-bottom:10px}
.footer-content a.icon-instagram,.footer-content a.icon-vk {color: #c8c8c8;font-size:220%;text-align:center;}
.footer-content a.icon-vk {margin-right:10px;margin-left: 15%;}

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

Наверх

#9 Аслан

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

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

Отправлено 12 Январь 2018 - 09:51

metry (12 Январь 2018 - 09:29) писал:

Добрый день. Для внесения изменений зайдите в Редактор шаблонов-->main.css и найдите:

.footer-content a {color: #c8c8c8;font-size:120%;}

и замените на:

.footer-content h3.block-title {margin-top:15px;}
.footer-content a {color: #c8c8c8;font-size:120%;margin-bottom:10px}
.footer-content a.icon-instagram,.footer-content a.icon-vk {color: #c8c8c8;font-size:220%;text-align:center;}
.footer-content a.icon-vk {margin-right:10px;margin-left: 15%;}

А как теперь вставить тоже самое только наверх, слева от корзины ?

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

Наверх

#10 metry

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

Модераторы
884 сообщений

Отправлено 12 Январь 2018 - 10:33

Для внесения изменений зайдите в Редактор шаблонов-->HTML и найдите:

				<div class="top-navbar">
				  <button type="button" class="button-navbar two btn-top-navbar" data-toggle="collapse" data-target=".top-navbar .navbar-collapse">
					<span class="text">Меню</span>
				  </button>
				  <div class="navbar-collapse collapse">
					<ul class="top-navbar-links">
					  {% FOR menu %}
						{% FOR header %}
						  {% FOR links %}
							<li><a href="{menu.header.links.URL}" {% IF menu.header.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %}>{menu.header.links.NAME}</a></li>
						  {% ENDFOR %}
						{% ENDFOR %}
					  {% ENDFOR %}
					</ul>
				  </div>
				</div>

после него вставьте:

					<div class="block-content head">
					<a class="icon-vk " href="https://vk.com/skating.store" title="VK.com" target="_blank"></a>
					<a class="icon-instagram" href="https://www.instagram.com/fskating_kzn/" title="Instagram.com" target="_blank"></a>
					</div>

далее зайдите в Редактор шаблонов-->main.css и найдите:

.top-navbar .collapse, .top-navbar .collapsing {background: #fff;border: 0 none;left: 0;margin: 5px -10px 0;padding: 0;position: absolute;top: 50px;z-index: 1002;width:100%;}

после него вставьте:

.block-content.head{float:right;font-size:200%;vertical-align: middle;margin-top: 10px;position:absolute;right:-80%; }

далее найдите:

.header-top .sm-cartpro:hover .block-content {display:none;opacity:0;visible:hidden;}

после него вставьте:

.block-content.head{float:right;font-size:200%;vertical-align: middle;margin-top: 10px;position:absolute;right:-230%; top:75%}

далее найдите:

.Firefox .products-grid .product-image img {width: 100%;}

после него вставьте:

.block-content.head{float:right;font-size:200%;vertical-align: middle;margin-top: 10px;}

Наверх

#11 Аслан

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

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

Отправлено 12 Январь 2018 - 10:47

metry (12 Январь 2018 - 10:33) писал:

Для внесения изменений зайдите в Редактор шаблонов-->HTML и найдите:

			 <div class="top-navbar">
				 <button type="button" class="button-navbar two btn-top-navbar" data-toggle="collapse" data-target=".top-navbar .navbar-collapse">
				 <span class="text">Меню</span>
				 </button>
				 <div class="navbar-collapse collapse">
				 <ul class="top-navbar-links">
					 {% FOR menu %}
					 {% FOR header %}
						 {% FOR links %}
						 <li><a href="{menu.header.links.URL}" {% IF menu.header.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %}>{menu.header.links.NAME}</a></li>
						 {% ENDFOR %}
					 {% ENDFOR %}
					 {% ENDFOR %}
				 </ul>
				 </div>
			 </div>

после него вставьте:

				 <div class="block-content head">
				 <a class="icon-vk " href="https://vk.com/skating.store" title="VK.com" target="_blank"></a>
				 <a class="icon-instagram" href="https://www.instagram.com/fskating_kzn/" title="Instagram.com" target="_blank"></a>
				 </div>

далее зайдите в Редактор шаблонов-->main.css и найдите:

.top-navbar .collapse, .top-navbar .collapsing {background: #fff;border: 0 none;left: 0;margin: 5px -10px 0;padding: 0;position: absolute;top: 50px;z-index: 1002;width:100%;}

после него вставьте:

.block-content.head{float:right;font-size:200%;vertical-align: middle;margin-top: 10px;position:absolute;right:-80%; }

далее найдите:

.header-top .sm-cartpro:hover .block-content {display:none;opacity:0;visible:hidden;}

после него вставьте:

.block-content.head{float:right;font-size:200%;vertical-align: middle;margin-top: 10px;position:absolute;right:-230%; top:75%}

далее найдите:

.Firefox .products-grid .product-image img {width: 100%;}

после него вставьте:

.block-content.head{float:right;font-size:200%;vertical-align: middle;margin-top: 10px;}

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

Наверх

Обратно в Главная

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

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

Добавление Иконки Инстаграм И Вк

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

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

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

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

Войти

Google поиск