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


Установка Вконтакте


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

#21 RayLi

RayLi

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

  • Модераторы
  • 2 864 сообщений

Отправлено 14 Октябрь 2014 - 22:16

Просмотр сообщенияboktar (14 Октябрь 2014 - 21:35) писал:

мне не надо редактировать стиль виджета, мне надо просто, чтобы между виджититами вк и инста было расстояние такое же как между виджитом вк в верхней части и блоком каталога, а не впритык и чтобы виджет инста располагался по центру относительно виджета вк, без смещения влево.
Попробуйте сделать следующее:
Найдите в шаблоне html следующий код:
<!-- VK Widget -->
<div id="vk_groups"></div>
<script type="text/javascript">
VK.Widgets.Group("vk_groups", {mode: 0, width: "200", height: "350", color1: 'FFFFFF', color2: '2B587A', color3: '5B7FA6'}, 66703149);
</script>
<style>.ig-b- { display: inline-block; }
.ig-b- img { visibility: hidden; }
.ig-b-:hover { background-position: 0 -60px; } .ig-b-:active { background-position: 0 -120px; }
.ig-b-v-24 { width: 137px; height: 24px; background: url(//badges.instagram.com/static/images/ig-badge-view-sprite-24.png) no-repeat 0 0; }
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
.ig-b-v-24 { background-image: url(//badges.instagram.com/static/images/ig-badge-view-sprite-24@2x.png); background-size: 160px 178px; } }</style>
<a href="http://instagram.com/flybirdsup?ref=badge" class="ig-b- ig-b-v-24"><img src="//badges.instagram.com/static/images/ig-badge-view-24.png" alt="Instagram" /></a>
<!-- www.instget.com -->
<iframe src="http://www.instget.com/widget/?w=9ad471cf3e973010b09e4742d3aca62f" allowTransparency="true" frameborder="0" scrolling="no" style="border: none; overflow: hidden; width: 205px; height: 205px;"></iframe>

И замените кодом:
<!-- VK Widget -->
<div class="vkgr"><div id="vk_groups"></div></div>
<script type="text/javascript">
VK.Widgets.Group("vk_groups", {mode: 0, width: "200", height: "350", color1: 'FFFFFF', color2: '2B587A', color3: '5B7FA6'}, 66703149);
</script>
<style>.ig-b- { display: inline-block; }
.ig-b- img { visibility: hidden; }
.ig-b-:hover { background-position: 0 -60px; } .ig-b-:active { background-position: 0 -120px; }
.ig-b-v-24 { width: 137px; height: 24px; background: url(//badges.instagram.com/static/images/ig-badge-view-sprite-24.png) no-repeat 0 0; }
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
.ig-b-v-24 { background-image: url(//badges.instagram.com/static/images/ig-badge-view-sprite-24@2x.png); background-size: 160px 178px; } }</style>
<div class="vkgr">
<a href="http://instagram.com/flybirdsup?ref=badge" class="ig-b- ig-b-v-24"><img src="//badges.instagram.com/static/images/ig-badge-view-24.png" alt="Instagram" style="margin-bottom: 10px;"/></a>
</div>
<div class="vkgr">
<!-- www.instget.com -->
<iframe src="http://www.instget.com/widget/?w=9ad471cf3e973010b09e4742d3aca62f" allowTransparency="true" frameborder="0" scrolling="no" style="border: none; overflow: hidden; width: 205px; height: 205px;"></iframe>
</div>

Так же добавьте в main.css следующий код:
.vkgr {
margin-bottom: 10px;
}


#22 boktar

boktar

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

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

Отправлено 14 Октябрь 2014 - 22:34

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

#23 RayLi

RayLi

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

  • Модераторы
  • 2 864 сообщений

Отправлено 14 Октябрь 2014 - 22:50

Просмотр сообщенияboktar (14 Октябрь 2014 - 22:34) писал:

Спасибо, почти получилось, но можно ли виджет "смотреть в инста" отцентровать относительно виджета в вк. и что бы расстояние снизу и сверху от виджета "смотреть в инста" до виджитов было одинаковым?
Найдите последний код в шаблоне html:
<!-- VK Widget -->
<div class="vkgr"><div id="vk_groups"></div></div>
<script type="text/javascript">
VK.Widgets.Group("vk_groups", {mode: 0, width: "200", height: "350", color1: 'FFFFFF', color2: '2B587A', color3: '5B7FA6'}, 66703149);
</script>
<style>.ig-b- { display: inline-block; }
.ig-b- img { visibility: hidden; }
.ig-b-:hover { background-position: 0 -60px; } .ig-b-:active { background-position: 0 -120px; }
.ig-b-v-24 { width: 137px; height: 24px; background: url(//badges.instagram.com/static/images/ig-badge-view-sprite-24.png) no-repeat 0 0; }
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
.ig-b-v-24 { background-image: url(//badges.instagram.com/static/images/ig-badge-view-sprite-24@2x.png); background-size: 160px 178px; } }</style>
<div class="vkgr">
<a href="http://instagram.com/flybirdsup?ref=badge" class="ig-b- ig-b-v-24"><img src="//badges.instagram.com/static/images/ig-badge-view-24.png" alt="Instagram" style="margin-bottom: 10px;"/></a>
</div>
<div class="vkgr">
<!-- www.instget.com -->
<iframe src="http://www.instget.com/widget/?w=9ad471cf3e973010b09e4742d3aca62f" allowTransparency="true" frameborder="0" scrolling="no" style="border: none; overflow: hidden; width: 205px; height: 205px;"></iframe>
</div>
И замените его данным кодом:
<!-- VK Widget -->
<div class="vkgr"><div id="vk_groups"></div></div>
<script type="text/javascript">
VK.Widgets.Group("vk_groups", {mode: 0, width: "200", height: "350", color1: 'FFFFFF', color2: '2B587A', color3: '5B7FA6'}, 66703149);
</script>
<style>.ig-b- { display: inline-block; }
.ig-b- img { visibility: hidden; }
.ig-b-:hover { background-position: 0 -60px; } .ig-b-:active { background-position: 0 -120px; }
.ig-b-v-24 { width: 137px; height: 24px; background: url(//badges.instagram.com/static/images/ig-badge-view-sprite-24.png) no-repeat 0 0; }
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
.ig-b-v-24 { background-image: url(//badges.instagram.com/static/images/ig-badge-view-sprite-24@2x.png); background-size: 160px 178px; } }</style>
<div class="vkgr">
<a href="http://instagram.com/flybirdsup?ref=badge" class="ig-b- ig-b-v-24; style="display:block; margin: 0 auto;"><img src="//badges.instagram.com/static/images/ig-badge-view-24.png" alt="Instagram"/></a>
</div>
<div class="vkgr">
<!-- www.instget.com -->
<iframe src="http://www.instget.com/widget/?w=9ad471cf3e973010b09e4742d3aca62f" allowTransparency="true" frameborder="0" scrolling="no" style="border: none; overflow: hidden; width: 205px; height: 205px;"></iframe>
</div>


#24 boktar

boktar

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

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

Отправлено 14 Октябрь 2014 - 23:15


Спасибо.

#25 boktar

boktar

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

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

Отправлено 15 Октябрь 2014 - 00:02

Удалите ссылки пожалуйста.




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

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