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


Блок Соцсетей


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

#1 Ася

Ася

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

  • Пользователи
  • PipPip
  • 42 сообщений
  • ГородМосква

Отправлено 24 Февраль 2016 - 15:47

Добрый день! Подскажите пжл:

1. Как сделать кнопки блока соц. сетей немного побольше, а отзывы о товаре немного ниже блока (файл 1);
2. Как вставить в страницу  "мастер-классы" и закрепить внизу монитора  блок соц. сетей  (чтобы страница прокручивалась, а блок сетей оставался внизу монитора  пример: файл 2, файл 3)

Аккаунт  SL-261332

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

  • файл1.jpg
  • файл2.jpg
  • файл3.jpg


#2 Firefly

Firefly

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

  • Модераторы
  • 3 750 сообщений

Отправлено 24 Февраль 2016 - 16:37

Просмотр сообщенияАся (24 Февраль 2016 - 15:47) писал:

Добрый день! Подскажите пжл:

1. Как сделать кнопки блока соц. сетей немного побольше, а отзывы о товаре немного ниже блока (файл 1);
2. Как вставить в страницу  "мастер-классы" и закрепить внизу монитора  блок соц. сетей  (чтобы страница прокручивалась, а блок сетей оставался внизу монитора  пример: файл 2, файл 3)

Аккаунт  SL-261332

Здравствуйте.
1. Зайдите в админ. панель -> Сайт -> Редактор шаблонов -> Стили -> main.css, добавьте в конце код:
.ya-share2__container_size_m .ya-share2__icon {
height: 30px !important;
width: 30px !important;
background-size: 30px 30px !important;
}

2. Зайдите в админ. панель -> Сайт -> Редактор шаблонов -> Шаблоны -> Страница, найдите код:
<!-- Контент страницы -->
<div class="htmlDataBlock">
{PAGE_CONTENT}
</div>

Замените на:
<!-- Контент страницы -->
<div class="htmlDataBlock">
{PAGE_CONTENT}
</div>
{% IF PAGE_NAME=Мастер-Классы %}
<div class="social-buttons-block-fixed social-buttons-block">
<div class="box">
		 <script type="text/javascript" src="//yastatic.net/es5-shims/0.0.2/es5-shims.min.js" charset="utf-8"></script>
		 <script type="text/javascript" src="//yastatic.net/share2/share.js" charset="utf-8"></script>
		 <div class="ya-share2" data-services="vkontakte,facebook,odnoklassniki,moimir,gplus,pinterest" data-image="http://larinarium.ru/" data-counter=""></div>
</div>
</div>
{% ENDIF %}

Зайдите в админ. панель -> Сайт -> Редактор шаблонов -> Стили -> main.css, добавьте в конце код:
.social-buttons-block-fixed {
position: fixed;
bottom: 0;
margin-bottom: 0px;
border-radius: 6px 6px 0 0;
}
.social-buttons-block {
width: 678px;
height: 50px;
z-index: 999;
}
.social-buttons-block .box {
position: relative;
padding: 12px 16px;
margin-bottom: 20px;
background-color: rgba(232,240,246,0.6);
border-radius: 6px;
text-align:center;
}


#3 Ася

Ася

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

  • Пользователи
  • PipPip
  • 42 сообщений
  • ГородМосква

Отправлено 25 Февраль 2016 - 17:18

Добрый день! Спасибо за ответ!!!

1. По 1 вопросу всё проделала как написано в п.1, но ничего не изменилось. Размер у блока остался тот же и расстояние между блоком и нижестоящей строчкой не увеличилось... Что можно ещё попробовать? Кэш чистила.

2. По второму вопросу наверное некорректно объяснила. После манипуляций описанных в п.2 у меня получилась как во вложении "мастер-класс" (блок на самой странице "мастер-класс"), а мне нужно, чтобы блок был в самих мастер-классах, пример во вложенном файле "мастер-класс_2", кнопочки желательно побольше и чтобы блок был по центру и при прокрутке страницы оставался внизу монитора, как здесь http://www.livemaste...-tsvety-solntsa .

Просмотр сообщенияFirefly (24 Февраль 2016 - 16:37) писал:

Здравствуйте.
1. Зайдите в админ. панель -> Сайт -> Редактор шаблонов -> Стили -> main.css, добавьте в конце код:
.ya-share2__container_size_m .ya-share2__icon {
height: 30px !important;
width: 30px !important;
background-size: 30px 30px !important;
}


2. Зайдите в админ. панель -> Сайт -> Редактор шаблонов -> Шаблоны -> Страница, найдите код:
<!-- Контент страницы -->
<div class="htmlDataBlock">
{PAGE_CONTENT}
</div>

Замените на:
<!-- Контент страницы -->
<div class="htmlDataBlock">
{PAGE_CONTENT}
</div>
{% IF PAGE_NAME=Мастер-Классы %}
<div class="social-buttons-block-fixed social-buttons-block">
<div class="box">
		 <script type="text/javascript" src="//yastatic.net/es5-shims/0.0.2/es5-shims.min.js" charset="utf-8"></script>
		 <script type="text/javascript" src="//yastatic.net/share2/share.js" charset="utf-8"></script>
		 <div class="ya-share2" data-services="vkontakte,facebook,odnoklassniki,moimir,gplus,pinterest" data-image="http://larinarium.ru/" data-counter=""></div>
</div>
</div>
{% ENDIF %}

Зайдите в админ. панель -> Сайт -> Редактор шаблонов -> Стили -> main.css, добавьте в конце код:
.social-buttons-block-fixed {
position: fixed;
bottom: 0;
margin-bottom: 0px;
border-radius: 6px 6px 0 0;
}
.social-buttons-block {
width: 678px;
height: 50px;
z-index: 999;
}
.social-buttons-block .box {
position: relative;
padding: 12px 16px;
margin-bottom: 20px;
background-color: rgba(232,240,246,0.6);
border-radius: 6px;
text-align:center;
}

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

  • мастер_клас.jpg
  • мастер_класс 2.jpg


#4 Юля123

Юля123

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

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

Отправлено 26 Февраль 2016 - 12:44

Просмотр сообщенияАся (25 Февраль 2016 - 17:18) писал:

Добрый день! Спасибо за ответ!!!

1. По 1 вопросу всё проделала как написано в п.1, но ничего не изменилось. Размер у блока остался тот же и расстояние между блоком и нижестоящей строчкой не увеличилось... Что можно ещё попробовать? Кэш чистила.

2. По второму вопросу наверное некорректно объяснила. После манипуляций описанных в п.2 у меня получилась как во вложении "мастер-класс" (блок на самой странице "мастер-класс"), а мне нужно, чтобы блок был в самих мастер-классах, пример во вложенном файле "мастер-класс_2", кнопочки желательно побольше и чтобы блок был по центру и при прокрутке страницы оставался внизу монитора, как здесь http://www.livemaste...-tsvety-solntsa .

Здравствуйте, сейчас у Вас блок соцсетей крупный, чтобы добавить отступ снизу к ним, в конце main.css добавьте код:

.ya-share2 {
	margin-bottom: 25px;
}

Чтобы добавить в самих мастер-классах блок соц-сетей, в шаблоне Страница код:

замените на код:

{% IF PAGE_NAME=Делаем кудель кардером ||  PAGE_NAME= Прядение собачьей шерсти на деревянной прялке  %}

если у Вас появится еще страницы с мастер-классами, то в этом коде нужно будет добавлять кода вида:

||  PAGE_NAME= название страницы


следующим образом:

{% IF PAGE_NAME=Делаем кудель кардером ||  PAGE_NAME= Прядение собачьей шерсти на деревянной прялке  ||  PAGE_NAME= название страницы %}


#5 Ася

Ася

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

  • Пользователи
  • PipPip
  • 42 сообщений
  • ГородМосква

Отправлено 26 Февраль 2016 - 13:45

Добрый день!

1. Код добавила, отступ не появился :(

Просмотр сообщенияЮля123 (26 Февраль 2016 - 12:44) писал:

Здравствуйте, сейчас у Вас блок соцсетей крупный, чтобы добавить отступ снизу к ним, в конце main.css добавьте код:

.ya-share2 {
margin-bottom: 25px;
}


2. Кто-то код заменил, но ничего не изменилось, в самих мастер-классах блок не появился. Что делать???

Просмотр сообщенияЮля123 (26 Февраль 2016 - 12:44) писал:

[/CODE]
Чтобы добавить в самих мастер-классах блок соц-сетей, в шаблоне Страница код:

замените на код:

{% IF PAGE_NAME=Делаем кудель кардером || PAGE_NAME= Прядение собачьей шерсти на деревянной прялке %}

если у Вас появится еще страницы с мастер-классами, то в этом коде нужно будет добавлять кода вида:

|| PAGE_NAME= название страницы


следующим образом:

{% IF PAGE_NAME=Делаем кудель кардером || PAGE_NAME= Прядение собачьей шерсти на деревянной прялке || PAGE_NAME= название страницы %}


#6 Danil

Danil

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

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

Отправлено 26 Февраль 2016 - 14:28

Просмотр сообщенияАся (26 Февраль 2016 - 13:45) писал:

Добрый день!

1. Код добавила, отступ не появился :(

[/font][/color]

2. Кто-то код заменил, но ничего не изменилось, в самих мастер-классах блок не появился. Что делать???
Здравствуйте.
1) На данный момент отступ присутствует(см. скриншот)
Screenshot_7.jpg
2) Изменения Вам произвели, виджет появился в мастер классах, но он прикреплен к нижней части экрана.
Если хотите изменить расположение виджета, то укажите на скриншоте, область в которой он должен отображаться.

#7 Ася

Ася

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

  • Пользователи
  • PipPip
  • 42 сообщений
  • ГородМосква

Отправлено 26 Февраль 2016 - 15:02

Спасибо большущее!!! Все как нужно и там где нужно. Подскажите пжл как можно увеличить в 2 раза блок соц сетей и значок "акции и скидки", которые расположены в правом верхнем углу страницы (файл 1) и  блок соц сетей, который расположен внизу страницы (файл 2)


Просмотр сообщенияDanil (26 Февраль 2016 - 14:28) писал:

Здравствуйте.
1) На данный момент отступ присутствует(см. скриншот)
Прикрепленный файл Screenshot_7.jpg
2) Изменения Вам произвели, виджет появился в мастер классах, но он прикреплен к нижней части экрана.
Если хотите изменить расположение виджета, то укажите на скриншоте, область в которой он должен отображаться.

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

  • файл1.jpg
  • файл2.jpg


#8 Danil

Danil

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

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

Отправлено 26 Февраль 2016 - 17:04

Просмотр сообщенияАся (26 Февраль 2016 - 15:02) писал:

Спасибо большущее!!! Все как нужно и там где нужно. Подскажите пжл как можно увеличить в 2 раза блок соц сетей и значок "акции и скидки", которые расположены в правом верхнем углу страницы (файл 1) и  блок соц сетей, который расположен внизу страницы (файл 2)
Чтобы увеличить значок "Акции и скидки", необходимо отредактировать изображение "akcii.png", которое находится в разделе Сайт - Редактор шаблонов - "Изображения".
Чтобы изменить размер иконок соц. сетей, нужно по новой сгенерировать виджет с другими параметрами, а после произвести изменения в коде html:
в html найдите код(встречается 2 раза)
 <script type="text/javascript" src="//yandex.st/share/share.js" charset="utf-8"></script>
<div class="yashare-auto-init" data-yashareL10n="ru" data-yashareType="icon" data-yashareQuickServices="vkontakte,twitter,odnoklassniki,moimir"></div>
и замените на новый.

#9 Ася

Ася

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

  • Пользователи
  • PipPip
  • 42 сообщений
  • ГородМосква

Отправлено 26 Февраль 2016 - 17:10

ОК! Спасибо! Будем пробовать.

Просмотр сообщенияDanil (26 Февраль 2016 - 17:04) писал:

Чтобы увеличить значок "Акции и скидки", необходимо отредактировать изображение "akcii.png", которое находится в разделе Сайт - Редактор шаблонов - "Изображения".
Чтобы изменить размер иконок соц. сетей, нужно по новой сгенерировать виджет с другими параметрами, а после произвести изменения в коде html:
в html найдите код(встречается 2 раза)
 <script type="text/javascript" src="//yandex.st/share/share.js" charset="utf-8"></script>
<div class="yashare-auto-init" data-yashareL10n="ru" data-yashareType="icon" data-yashareQuickServices="vkontakte,twitter,odnoklassniki,moimir"></div>
и замените на новый.





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

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