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


Размещение Блока Мы В Соцсетях


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

#1 NikolsoN

NikolsoN

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

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

Отправлено 08 Июль 2022 - 13:48

Здравствуйте, как можно разместить блок "Мы в соцсетях" на сайте справа.

#2 Vaccina

Vaccina

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

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

Отправлено 09 Июль 2022 - 04:34

Здравствуйте.

Уточните пожалуйста, необходимо создать правую колонку и разместить в ней блок или добавить в шапку сайта справа от корзины?

#3 NikolsoN

NikolsoN

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

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

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

Да, в правой колонке разместить блок.

#4 Vaccina

Vaccina

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

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

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

Здравствуйте.

Зайдите в раздел Сайт - Редактор шаблонов - HTML - найдите:
	  <div id="back-top" style="position: fixed; bottom: 0px; right: 0px; cursor: pointer;z-index: 1000;" title="Наверх">
		<img src="{ASSETS_IMAGES_PATH}scroll.png?design=spring" style="width:50px; height:50px">
	  </div>
     
замените на:
				  <div class="social-links _header">
					<a class="social-links__item" href="https://whatsapp.com/" title="Whatsapp.com" target="_blank">
					  <svg class="icon-social _whatsapp" width="30px" height="30px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512.303 512.303"><path d="M256.014.134C114.629.164.038 114.804.068 256.189a256 256 0 0040.479 138.1L.718 497.628c-2.121 5.496.615 11.671 6.111 13.792 1.229.474 2.534.717 3.851.715a10.376 10.376 0 003.584-.619l106.667-38.08c120.012 74.745 277.894 38.048 352.638-81.965s38.048-277.894-81.965-352.638A255.996 255.996 0 00256.014.134z" fill="#4caf50"/><path d="M378.062 299.889s-26.133-12.8-42.496-21.333c-18.517-9.536-40.277 8.32-50.517 18.475a128.368 128.368 0 01-42.816-27.179 128.265 128.265 0 01-27.179-42.816c10.155-10.261 27.968-32 18.475-50.517-8.427-16.384-21.333-42.496-21.333-42.517a10.666 10.666 0 00-9.515-5.867h-21.333c-31.068 5.366-53.657 32.474-53.333 64 0 33.493 40.085 97.835 67.115 124.885s91.371 67.115 124.885 67.115c31.526.324 58.634-22.266 64-53.333v-21.333a10.669 10.669 0 00-5.953-9.58z" fill="#fafafa"/></svg>				   
					</a>
					<a class="social-links__item" href="https://vk.com/" title="VK.com" target="_blank">
					  <svg class="icon-social _vk" width="30px" height="30px" xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 97.75 97.75"><path d="M48.875 0C21.883 0 0 21.882 0 48.875S21.883 97.75 48.875 97.75 97.75 75.868 97.75 48.875 75.867 0 48.875 0zm24.792 54.161c2.278 2.225 4.688 4.319 6.733 6.774.906 1.086 1.76 2.209 2.41 3.472.928 1.801.09 3.776-1.522 3.883l-10.013-.002c-2.586.214-4.644-.829-6.379-2.597-1.385-1.409-2.67-2.914-4.004-4.371-.545-.598-1.119-1.161-1.803-1.604-1.365-.888-2.551-.616-3.333.81-.797 1.451-.979 3.059-1.055 4.674-.109 2.361-.821 2.978-3.19 3.089-5.062.237-9.865-.531-14.329-3.083-3.938-2.251-6.986-5.428-9.642-9.025-5.172-7.012-9.133-14.708-12.692-22.625-.801-1.783-.215-2.737 1.752-2.774 3.268-.063 6.536-.055 9.804-.003 1.33.021 2.21.782 2.721 2.037 1.766 4.345 3.931 8.479 6.644 12.313.723 1.021 1.461 2.039 2.512 2.76 1.16.796 2.044.533 2.591-.762.35-.823.501-1.703.577-2.585.26-3.021.291-6.041-.159-9.05-.28-1.883-1.339-3.099-3.216-3.455-.956-.181-.816-.535-.351-1.081.807-.944 1.563-1.528 3.074-1.528l11.313-.002c1.783.35 2.183 1.15 2.425 2.946l.01 12.572c-.021.695.349 2.755 1.597 3.21 1 .33 1.66-.472 2.258-1.105 2.713-2.879 4.646-6.277 6.377-9.794.764-1.551 1.423-3.156 2.063-4.764.476-1.189 1.216-1.774 2.558-1.754l10.894.013c.321 0 .647.003.965.058 1.836.314 2.339 1.104 1.771 2.895-.894 2.814-2.631 5.158-4.329 7.508-1.82 2.516-3.761 4.944-5.563 7.471-1.656 2.31-1.525 3.473.531 5.479z" data-original="#000000" class="active-path" data-old_color="#000000" fill="#3643A6"/></svg>
					</a>
					<a class="social-links__item" href="https://instagram.com/" title="Instagram.com" target="_blank">
					  <svg class="icon-social _instagram" width="30px" height="30px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><circle cx="256" cy="256" r="256" fill="#ef72ad"/><path d="M256 0c-11.317 0-22.461.744-33.391 2.167C348.216 18.53 445.217 125.933 445.217 256s-97.002 237.47-222.609 253.833A258.556 258.556 0 00256 512c141.385 0 256-114.616 256-256S397.385 0 256 0z" fill="#ee539e"/><g fill="#fff"><path d="M350.84 91.826H161.16c-38.231 0-69.334 31.103-69.334 69.334v189.682c0 38.231 31.103 69.334 69.334 69.334h189.682c38.231 0 69.334-31.103 69.334-69.334V161.16c-.002-38.231-31.105-69.334-69.336-69.334zm52.638 259.014c0 29.025-23.613 52.638-52.638 52.638H161.16c-29.025 0-52.638-23.613-52.638-52.638V161.16c0-29.025 23.613-52.638 52.638-52.638h189.682c29.025 0 52.638 23.613 52.638 52.638v189.68h-.002z"/><path d="M256 169.739c-47.565 0-86.261 38.696-86.261 86.261s38.696 86.261 86.261 86.261 86.261-38.696 86.261-86.261-38.696-86.261-86.261-86.261zm0 155.826c-38.358 0-69.565-31.208-69.565-69.565s31.208-69.565 69.565-69.565 69.565 31.208 69.565 69.565-31.207 69.565-69.565 69.565z"/><circle cx="345.043" cy="155.826" r="22.261"/></g></svg>				   
					</a>
				  </div>
   			  
	  <div id="back-top" style="position: fixed; bottom: 0px; right: 0px; cursor: pointer;z-index: 1000;" title="Наверх">
		<img src="{ASSETS_IMAGES_PATH}scroll.png?design=spring" style="width:50px; height:50px">
	  </div>
    
Ссылки измените на необходимые. Далее зайдите в main.css - найдите:
#back-top{
  bottom:125px!important;
}

замените:
#back-top{
  bottom:125px!important;
}
.social-links {display: flex;justify-content: space-between;position: absolute;right: 10px;top: 200px;z-index: 90;}
.social-links._header {max-width: 160px;margin-left: auto;}
.social-links._footer {margin-top: 30px;}
.social-links._footer .social-links__item {margin-right: 5px;}
.social-links .social-links__item {display: inline-block;margin-right: 10px;}
.social-links .social-links__item:last-child {margin-right: 0}


#5 NikolsoN

NikolsoN

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

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

Отправлено 14 Июль 2022 - 10:03

Добрый день!
Не понял сначала, что это просто иконки будут. А можно их тогда переместить к контактам в шапку?

#6 Vaccina

Vaccina

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

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

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

Здравствуйте.

Уточните пожалуйста, перед контактами необходимо разместить или после?

#7 NikolsoN

NikolsoN

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

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

Отправлено 15 Июль 2022 - 08:54

Давайте перед контактами.

#8 Vaccina

Vaccina

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

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

Отправлено 15 Июль 2022 - 08:58

Зайдите в раздел Сайт - Редактор шаблонов - HTML - найдите:
								  <div class="social-links _header">
										<a class="social-links__item" href="https://whatsapp.com/" title="Whatsapp.com" target="_blank">
										  <svg class="icon-social _whatsapp" width="30px" height="30px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512.303 512.303"><path d="M256.014.134C114.629.164.038 114.804.068 256.189a256 256 0 0040.479 138.1L.718 497.628c-2.121 5.496.615 11.671 6.111 13.792 1.229.474 2.534.717 3.851.715a10.376 10.376 0 003.584-.619l106.667-38.08c120.012 74.745 277.894 38.048 352.638-81.965s38.048-277.894-81.965-352.638A255.996 255.996 0 00256.014.134z" fill="#4caf50"/><path d="M378.062 299.889s-26.133-12.8-42.496-21.333c-18.517-9.536-40.277 8.32-50.517 18.475a128.368 128.368 0 01-42.816-27.179 128.265 128.265 0 01-27.179-42.816c10.155-10.261 27.968-32 18.475-50.517-8.427-16.384-21.333-42.496-21.333-42.517a10.666 10.666 0 00-9.515-5.867h-21.333c-31.068 5.366-53.657 32.474-53.333 64 0 33.493 40.085 97.835 67.115 124.885s91.371 67.115 124.885 67.115c31.526.324 58.634-22.266 64-53.333v-21.333a10.669 10.669 0 00-5.953-9.58z" fill="#fafafa"/></svg>							
										</a>
										<a class="social-links__item" href="https://vk.com/" title="VK.com" target="_blank">
										  <svg class="icon-social _vk" width="30px" height="30px" xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 97.75 97.75"><path d="M48.875 0C21.883 0 0 21.882 0 48.875S21.883 97.75 48.875 97.75 97.75 75.868 97.75 48.875 75.867 0 48.875 0zm24.792 54.161c2.278 2.225 4.688 4.319 6.733 6.774.906 1.086 1.76 2.209 2.41 3.472.928 1.801.09 3.776-1.522 3.883l-10.013-.002c-2.586.214-4.644-.829-6.379-2.597-1.385-1.409-2.67-2.914-4.004-4.371-.545-.598-1.119-1.161-1.803-1.604-1.365-.888-2.551-.616-3.333.81-.797 1.451-.979 3.059-1.055 4.674-.109 2.361-.821 2.978-3.19 3.089-5.062.237-9.865-.531-14.329-3.083-3.938-2.251-6.986-5.428-9.642-9.025-5.172-7.012-9.133-14.708-12.692-22.625-.801-1.783-.215-2.737 1.752-2.774 3.268-.063 6.536-.055 9.804-.003 1.33.021 2.21.782 2.721 2.037 1.766 4.345 3.931 8.479 6.644 12.313.723 1.021 1.461 2.039 2.512 2.76 1.16.796 2.044.533 2.591-.762.35-.823.501-1.703.577-2.585.26-3.021.291-6.041-.159-9.05-.28-1.883-1.339-3.099-3.216-3.455-.956-.181-.816-.535-.351-1.081.807-.944 1.563-1.528 3.074-1.528l11.313-.002c1.783.35 2.183 1.15 2.425 2.946l.01 12.572c-.021.695.349 2.755 1.597 3.21 1 .33 1.66-.472 2.258-1.105 2.713-2.879 4.646-6.277 6.377-9.794.764-1.551 1.423-3.156 2.063-4.764.476-1.189 1.216-1.774 2.558-1.754l10.894.013c.321 0 .647.003.965.058 1.836.314 2.339 1.104 1.771 2.895-.894 2.814-2.631 5.158-4.329 7.508-1.82 2.516-3.761 4.944-5.563 7.471-1.656 2.31-1.525 3.473.531 5.479z" data-original="#000000" class="active-path" data-old_color="#000000" fill="#3643A6"/></svg>
										</a>
										<a class="social-links__item" href="https://instagram.com/" title="Instagram.com" target="_blank">
										  <svg class="icon-social _instagram" width="30px" height="30px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><circle cx="256" cy="256" r="256" fill="#ef72ad"/><path d="M256 0c-11.317 0-22.461.744-33.391 2.167C348.216 18.53 445.217 125.933 445.217 256s-97.002 237.47-222.609 253.833A258.556 258.556 0 00256 512c141.385 0 256-114.616 256-256S397.385 0 256 0z" fill="#ee539e"/><g fill="#fff"><path d="M350.84 91.826H161.16c-38.231 0-69.334 31.103-69.334 69.334v189.682c0 38.231 31.103 69.334 69.334 69.334h189.682c38.231 0 69.334-31.103 69.334-69.334V161.16c-.002-38.231-31.105-69.334-69.336-69.334zm52.638 259.014c0 29.025-23.613 52.638-52.638 52.638H161.16c-29.025 0-52.638-23.613-52.638-52.638V161.16c0-29.025 23.613-52.638 52.638-52.638h189.682c29.025 0 52.638 23.613 52.638 52.638v189.68h-.002z"/><path d="M256 169.739c-47.565 0-86.261 38.696-86.261 86.261s38.696 86.261 86.261 86.261 86.261-38.696 86.261-86.261-38.696-86.261-86.261-86.261zm0 155.826c-38.358 0-69.565-31.208-69.565-69.565s31.208-69.565 69.565-69.565 69.565 31.208 69.565 69.565-31.207 69.565-69.565 69.565z"/><circle cx="345.043" cy="155.826" r="22.261"/></g></svg>							   
										</a>
								  </div>
                                  
переместите его, поставив после:
		<div class="inner header_wrapper">

		  <div id="logo">
			<a href="{INDEX_PAGE_URL}">
			  <img src="{ASSETS_IMAGES_PATH}logo.png?design=spring" title="" alt="">
			</a>
			<p style="padding-left: 107px; font-size: 12px; font-weight: 400;">Интернет-магазин рулонных штор и карнизов</p>
		  </div>
          
          
Далее зайдите в main.css - найдите:
.social-links {display: flex;justify-content: space-between;position: absolute;right: 10px;top: 200px;z-index: 90;}
.social-links._header {max-width: 160px;margin-left: auto;}
.social-links._footer {margin-top: 30px;}
.social-links._footer .social-links__item {margin-right: 5px;}
.social-links .social-links__item {display: inline-block;margin-right: 10px;}
.social-links .social-links__item:last-child {margin-right: 0}

замените на:
.social-links {display: inline-block;margin: auto;}
.social-links._header {max-width: 160px;margin-left: auto;}
.social-links._footer {margin-top: 30px;}
.social-links._footer .social-links__item {margin-right: 5px;}
.social-links .social-links__item {display: inline-block;margin-right: 10px;}
.social-links .social-links__item:last-child {margin-right: 0}


#9 NikolsoN

NikolsoN

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

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

Отправлено 04 Август 2022 - 17:18

А как можно добавить еще иконку Телеграмма?

#10 Vaccina

Vaccina

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

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

Отправлено 06 Август 2022 - 06:53

Здравствуйте.

Зайдите в раздел Сайт - Редактор шаблонов - HTML - найдите:
										<a class="social-links__item" href="https://instagram.com/stordom.ig" title="Instagram.com" target="_blank">
										  <svg class="icon-social _instagram" width="30px" height="30px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><circle cx="256" cy="256" r="256" fill="#ef72ad"/><path d="M256 0c-11.317 0-22.461.744-33.391 2.167C348.216 18.53 445.217 125.933 445.217 256s-97.002 237.47-222.609 253.833A258.556 258.556 0 00256 512c141.385 0 256-114.616 256-256S397.385 0 256 0z" fill="#ee539e"/><g fill="#fff"><path d="M350.84 91.826H161.16c-38.231 0-69.334 31.103-69.334 69.334v189.682c0 38.231 31.103 69.334 69.334 69.334h189.682c38.231 0 69.334-31.103 69.334-69.334V161.16c-.002-38.231-31.105-69.334-69.336-69.334zm52.638 259.014c0 29.025-23.613 52.638-52.638 52.638H161.16c-29.025 0-52.638-23.613-52.638-52.638V161.16c0-29.025 23.613-52.638 52.638-52.638h189.682c29.025 0 52.638 23.613 52.638 52.638v189.68h-.002z"/><path d="M256 169.739c-47.565 0-86.261 38.696-86.261 86.261s38.696 86.261 86.261 86.261 86.261-38.696 86.261-86.261-38.696-86.261-86.261-86.261zm0 155.826c-38.358 0-69.565-31.208-69.565-69.565s31.208-69.565 69.565-69.565 69.565 31.208 69.565 69.565-31.207 69.565-69.565 69.565z"/><circle cx="345.043" cy="155.826" r="22.261"/></g></svg>							  
										</a>

после него вставьте:
				<a class="social-links__item" href="https://telegram.com/" title="Telegram.com" target="_blank">
				  <svg class="icon-social _telegram" xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 24 24"><path xmlns="http://www.w3.org/2000/svg" fill="#039be5" d="M12 24c6.629 0 12-5.371 12-12S18.629 0 12 0 0 5.371 0 12s5.371 12 12 12zM5.491 11.74l11.57-4.461c.537-.194 1.006.131.832.943l.001-.001-1.97 9.281c-.146.658-.537.818-1.084.508l-3-2.211-1.447 1.394c-.16.16-.295.295-.605.295l.213-3.053 5.56-5.023c.242-.213-.054-.333-.373-.121l-6.871 4.326-2.962-.924c-.643-.204-.657-.643.136-.953z" data-original="#000000"/></svg>
				</a>


Далее зайдите в main.css - найдите:
.social-links._header {max-width: 160px;margin-left: auto;}

замените на:
.social-links._header {max-width: 180px;margin-left: auto;}


#11 NikolsoN

NikolsoN

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

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

Отправлено 06 Август 2022 - 22:50

Спасибо!!!!!!!!!




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

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