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


Кнопка "мы В Социальных Сетях"


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

#1 Ильяc

Ильяc

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

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

Отправлено 02 Февраль 2015 - 10:00

SL-251638
Здравствуйте! Подскажите пожалуйста как и какие установить кнопки "Мы в соцсетях" а не поделиться, в подвале сайта. Искал много вариантов, но ничего подходящего не нашел. Нужна кнопка: твиттера, гугл+ и вконтакте.

Нужно в том месте, где указано на картинке. Желательно чтобы вид кнопок (дизайн) я мог потом поменять . Спасибо!
соц сети.png

#2 Danil

Danil

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

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

Отправлено 02 Февраль 2015 - 10:41

Просмотр сообщенияИльяc (02 Февраль 2015 - 10:00) писал:

SL-251638
Здравствуйте! Подскажите пожалуйста как и какие установить кнопки "Мы в соцсетях" а не поделиться, в подвале сайта. Искал много вариантов, но ничего подходящего не нашел. Нужна кнопка: твиттера, гугл+ и вконтакте.

Нужно в том месте, где указано на картинке. Желательно чтобы вид кнопок (дизайн) я мог потом поменять . Спасибо!
Прикрепленный файл соц сети.png
Здравствуйте.
В шаблоне html после кода
 <!-- <li><a href="{menu.footer3.links.URL}" title="" >{menu.footer3.links.NAME}</a></li>-->
и после него вставьте
<li>
<h4>Мы в соц. сетях</h4>
<a href="ссылка"><img src="ссылка на изображение"></a>
<a href="ссылка"><img src="ссылка на изображение"></a>
<a href="ссылка"><img src="ссылка на изображение"></a>
</li>


#3 Ильяc

Ильяc

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

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

Отправлено 02 Февраль 2015 - 11:58

Просмотр сообщенияDanil (02 Февраль 2015 - 10:41) писал:

Здравствуйте.
В шаблоне html после кода
 <!-- <li><a href="{menu.footer3.links.URL}" title="" >{menu.footer3.links.NAME}</a></li>-->
и после него вставьте
<li>
<h4>Мы в соц. сетях</h4>
<a href="ссылка"><img src="ссылка на изображение"></a>
<a href="ссылка"><img src="ссылка на изображение"></a>
<a href="ссылка"><img src="ссылка на изображение"></a>
</li>

Все вроде получилось. Подскажите как сделать так, чтобы при нажатии на кнопку, страница открывалась на новой вкладке?

#4 MikDark

MikDark

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

  • Модераторы
  • 6 398 сообщений

Отправлено 02 Февраль 2015 - 12:17

Просмотр сообщенияИльяc (02 Февраль 2015 - 11:58) писал:

Все вроде получилось. Подскажите как сделать так, чтобы при нажатии на кнопку, страница открывалась на новой вкладке?

Вместо элемента:
<a href="ссылка">

нужно прописать:
<a href="ссылка" target="_blank">


#5 Ильяc

Ильяc

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

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

Отправлено 02 Февраль 2015 - 12:30

Просмотр сообщенияMikDark (02 Февраль 2015 - 12:17) писал:

Вместо элемента:
<a href="ссылка">

нужно прописать:
<a href="ссылка" target="_blank">
Спасибо! Все работает)

#6 Ильяc

Ильяc

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

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

Отправлено 02 Февраль 2015 - 18:29

Подскажете как поменять на главной странице слово "рублей" на символ рубля?
rub_sign_hires.jpg  2480×3508 .png

#7 MikDark

MikDark

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

  • Модераторы
  • 6 398 сообщений

Отправлено 02 Февраль 2015 - 19:44

Просмотр сообщенияИльяc (02 Февраль 2015 - 18:29) писал:

Подскажете как поменять на главной странице слово "рублей" на символ рубля?
Прикрепленный файл rub_sign_hires.jpg 2480×3508 .png

Вам нужно в шаблоне HTML найти строку:
<span class="price">{index_page_goods.MIN_PRICE_NOW} рублей</span>

и заменить ее на:
<span class="price">{index_page_goods.MIN_PRICE_NOW} <img src="ссылка на картинку рубля" width="20px"></span>


#8 Ильяc

Ильяc

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

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

Отправлено 12 Февраль 2015 - 16:09

Здравствуйте! Хочу сделать выбор количества товара как в шаблоне "Цитрус" на картинке показано.

Нужно убрать мою форму
Умные часы Pebble SmartWatch black.png

Добавить форму с шаблона "Цитрус"
IPad.png

#9 Ирина345

Ирина345

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

  • Модераторы
  • 5 673 сообщений

Отправлено 12 Февраль 2015 - 16:29

Просмотр сообщенияИльяc (12 Февраль 2015 - 16:09) писал:

Здравствуйте! Хочу сделать выбор количества товара как в шаблоне "Цитрус" на картинке показано.

Нужно убрать мою форму
Прикрепленный файл Умные часы Pebble SmartWatch black.png

Добавить форму с шаблона "Цитрус"
Прикрепленный файл IPad.png
Здравствуйте, найдите в шаблоне Товар код

<div class="kol"><input type="number" name="form[goods_mod_quantity]" id="qty" class="text" value="1" size="4" maxlength="5">
замените на
<div class="kol">
<div class="wrap-qty number clearfix">
<div class="qty-title"><span>Количество:</span></div>
<div class="qty-set">
<span class="quantity-box">
<input type="button" class="number-down quantity-controls quantity-minus">
<input type="text" name="form[goods_mod_quantity]" id="qty" maxlength="12" value="1" min="1" title="Количество" class="input-text quantity-input qty">
<input type="button" class="number-up quantity-controls quantity-plus">
</span>
</div>
</div>


далее в файле main.js

// Добавление отзыва о товаре. Рейтинг
if(typeof($('.goodsDataOpinionTableRating').stars) == "function" ) {
$('.goodsDataOpinionTableRating').stars({
inputType: "input",
split: 2,
captionEl: $(".goodsDataOpinionMsg"),
cancelShow: false
});
} 
после вставьте

//Regulator Up/Down копки + - в карточке товара при добавлении в корзину
jQuery(document).ready(function(){
$('.number-up').click(function(){
var $value = ($(this).closest('.number').find('input[type="text"]').attr('value'));
$(this).closest('.number').find('input[type="text"]').attr('value', parseFloat($value)+1);
return false;
});
$('.number-down').click(function(){
var $value = ($(this).closest('.number').find('input[type="text"]').attr('value'));
if ($value > 1) {
$(this).closest('.number').find('input[type="text"]').attr('value', parseFloat($value)-1);
}
return false;
});
});

далее в конец main.css

.wrap-qty.number.clearfix {
position: absolute;
margin-left: -194px;
margin-top: 76px;
}
.quantity-box .quantity-controls {background-image: url('{ASSETS_IMAGES_PATH}plus-minus.png?design=orange');background-repeat: no-repeat;width: 25px;height: 25px;border-radius: 100%;background-color: #aaa8a8;display: inline-block;vertical-align:middle;border: none;cursor:pointer;-moz-border-radius: 100%;khtml-border-radius: 100%;-webkit-border-radius: 100%;}
.quantity-box .quantity-input.qty {width: 48px;height: 48px;border-radius: 100%;-moz-border-radius: 100%;khtml-border-radius: 100%;-webkit-border-radius: 100%;border: 1px solid #e5e5e5;text-align: center;margin: 0 2px;font-size: 117%;padding: 0;}
.quantity-box .quantity-controls.quantity-minus {background-position: 5px center;}
.quantity-box .quantity-controls.quantity-plus {background-position: -50px center;}
.quantity-box .quantity-controls.quantity-minus:hover, .quantity-box .quantity-controls.quantity-plus:hover {background-color: #f79242;}

а так же загрузите на сайт, через сайт редактор шаблонов картинку

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

  • plus-minus.png


#10 Ильяc

Ильяc

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

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

Отправлено 12 Февраль 2015 - 16:50

Просмотр сообщенияИрина345 (12 Февраль 2015 - 16:29) писал:

Здравствуйте, найдите в шаблоне Товар код

<div class="kol"><input type="number" name="form[goods_mod_quantity]" id="qty" class="text" value="1" size="4" maxlength="5">
замените на
<div class="kol">
<div class="wrap-qty number clearfix">
<div class="qty-title"><span>Количество:</span></div>
<div class="qty-set">
<span class="quantity-box">
<input type="button" class="number-down quantity-controls quantity-minus">
<input type="text" name="form[goods_mod_quantity]" id="qty" maxlength="12" value="1" min="1" title="Количество" class="input-text quantity-input qty">
<input type="button" class="number-up quantity-controls quantity-plus">
</span>
</div>
</div>


далее в файле main.js

// Добавление отзыва о товаре. Рейтинг
if(typeof($('.goodsDataOpinionTableRating').stars) == "function" ) {
$('.goodsDataOpinionTableRating').stars({
inputType: "input",
split: 2,
captionEl: $(".goodsDataOpinionMsg"),
cancelShow: false
});
} 
после вставьте

//Regulator Up/Down копки + - в карточке товара при добавлении в корзину
jQuery(document).ready(function(){
$('.number-up').click(function(){
var $value = ($(this).closest('.number').find('input[type="text"]').attr('value'));
$(this).closest('.number').find('input[type="text"]').attr('value', parseFloat($value)+1);
return false;
});
$('.number-down').click(function(){
var $value = ($(this).closest('.number').find('input[type="text"]').attr('value'));
if ($value > 1) {
$(this).closest('.number').find('input[type="text"]').attr('value', parseFloat($value)-1);
}
return false;
});
});

далее в конец main.css

.wrap-qty.number.clearfix {
position: absolute;
margin-left: -194px;
margin-top: 76px;
}
.quantity-box .quantity-controls {background-image: url('{ASSETS_IMAGES_PATH}plus-minus.png?design=orange');background-repeat: no-repeat;width: 25px;height: 25px;border-radius: 100%;background-color: #aaa8a8;display: inline-block;vertical-align:middle;border: none;cursor:pointer;-moz-border-radius: 100%;khtml-border-radius: 100%;-webkit-border-radius: 100%;}
.quantity-box .quantity-input.qty {width: 48px;height: 48px;border-radius: 100%;-moz-border-radius: 100%;khtml-border-radius: 100%;-webkit-border-radius: 100%;border: 1px solid #e5e5e5;text-align: center;margin: 0 2px;font-size: 117%;padding: 0;}
.quantity-box .quantity-controls.quantity-minus {background-position: 5px center;}
.quantity-box .quantity-controls.quantity-plus {background-position: -50px center;}
.quantity-box .quantity-controls.quantity-minus:hover, .quantity-box .quantity-controls.quantity-plus:hover {background-color: #f79242;}

а так же загрузите на сайт, через сайт редактор шаблонов картинку

1) Какую картинку нужно закачать?
2) Кнопка "в корзину" съехала немного, нужно выровнить

#11 Ирина345

Ирина345

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

  • Модераторы
  • 5 673 сообщений

Отправлено 12 Февраль 2015 - 17:56

Просмотр сообщенияИльяc (12 Февраль 2015 - 16:50) писал:

1) Какую картинку нужно закачать?
2) Кнопка "в корзину" съехала немного, нужно выровнить
Произведите изменения.

#12 Ильяc

Ильяc

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

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

Отправлено 22 Февраль 2015 - 21:46

Здравствуйте! Как мне сделать текст названия товара на главной странице по центру?
11111.png

Я все это сделал, но в карточке товара тоже текст по центру
как исправить, чтобы в карточке товара было как обычно слева

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

  • 2222.png


#13 Danil

Danil

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

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

Отправлено 23 Февраль 2015 - 09:48

Просмотр сообщенияИльяc (22 Февраль 2015 - 21:46) писал:

Здравствуйте! Как мне сделать текст названия товара на главной странице по центру?
Прикрепленный файл 11111.png

Я все это сделал, но в карточке товара тоже текст по центру
как исправить, чтобы в карточке товара было как обычно слева
Здравствуйте.
В конец main.css добавьте
.goodsDataMainOrder.cornerAll table tbody tr td div ul li {
text-align: left !important;
}


#14 Ильяc

Ильяc

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

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

Отправлено 23 Февраль 2015 - 10:00

Просмотр сообщенияDanil (23 Февраль 2015 - 09:48) писал:

Здравствуйте.
В конец main.css добавьте
.goodsDataMainOrder.cornerAll table tbody tr td div ul li {
text-align: left !important;
}

В коротком описании исправилось, вот только теперь в карточке товара в описании товара текст по центру. Можно исправить?11111.png

#15 Danil

Danil

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

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

Отправлено 23 Февраль 2015 - 10:10

Просмотр сообщенияИльяc (23 Февраль 2015 - 10:00) писал:

В коротком описании исправилось, вот только теперь в карточке товара в описании товара текст по центру. Можно исправить?Прикрепленный файл 11111.png
В main.css найдите код
#tab1 .htmlDataBlock ul li {
width: auto;
height: auto;
float: none;
margin: 0;
padding: 0 8px;
font-size:14px;
color:#2e2e2e;
list-style-image: url("{ASSETS_IMAGES_PATH}list.png");
}
и замените на
#tab1 .htmlDataBlock ul li {
width: auto;
height: auto;
float: none;
margin: 0;
padding: 0 8px;
font-size:14px;
color:#2e2e2e;
text-align:left;
list-style-image: url("{ASSETS_IMAGES_PATH}list.png");
}


#16 Ася

Ася

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

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

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

Добрый день!

Подскажите пжл куда можно вставить код кнопок соц. сетей, чтобы он был на сайте в 2 местах - слева и с права. С правой стороны должно быть вертикально, как здесь http://www.petshop.ru/catalog/dogs/, а с левой стороны - вместо существующего блока VK.

Аккаунт SL-261332

Код для вставки (не знаю, насколько он правильный по структуре):

<div class="footer-social-container">
  <div class="footer-social-block">
   <div class="footer-social-block-caption">Присоединяйтесь:</div>
   <div class="footer-social-btns">
   <a class="footer-social-btn footer-social-btn--vk" target="_blank" title="" href="http://vk.com/larinarium "></a>
   <a class="footer-social-btn footer-social-btn--facebook" target="_blank" title="" href="http://www.facebook.com/larinarium "></a>
   <a class="footer-social-btn footer-social-btn--ok" target="_blank" title="" href=" https://ok.ru/group/...346443927"></a>
   <a class="footer-social-btn footer-social-btn--instagram" target="_blank" title="" href="https://www.instagram.com/larinarium"></a>      
</div>
</div>
</div>

#17 Mr.Nito

Mr.Nito

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

  • Модераторы
  • 1 337 сообщений

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

Просмотр сообщенияАся (11 Ноябрь 2016 - 16:16) писал:

Добрый день!

Подскажите пжл куда можно вставить код кнопок соц. сетей, чтобы он был на сайте в 2 местах - слева и с права. С правой стороны должно быть вертикально, как здесь http://www.petshop.ru/catalog/dogs/, а с левой стороны - вместо существующего блока VK.

Аккаунт SL-261332

Код для вставки (не знаю, насколько он правильный по структуре):

<div class="footer-social-container">
  <div class="footer-social-block">
   <div class="footer-social-block-caption">Присоединяйтесь:</div>
   <div class="footer-social-btns">
   <a class="footer-social-btn footer-social-btn--vk" target="_blank" title="" href="http://vk.com/larinarium "></a>
   <a class="footer-social-btn footer-social-btn--facebook" target="_blank" title="" href="http://www.facebook.com/larinarium "></a>
   <a class="footer-social-btn footer-social-btn--ok" target="_blank" title="" href=" https://ok.ru/group/...346443927"></a>
   <a class="footer-social-btn footer-social-btn--instagram" target="_blank" title="" href="https://www.instagram.com/larinarium"></a>      
</div>
</div>
</div>
Здравствуйте.
Уточните пожалуйста, справа нужны точно такие же блоки, как на указанном сайте. Только с другими соц сетями и аналогичный блок слева?

#18 Ася

Ася

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

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

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

Просмотр сообщенияMr.Nito (14 Ноябрь 2016 - 13:37) писал:

Здравствуйте.
Уточните пожалуйста, справа нужны точно такие же блоки, как на указанном сайте. Только с другими соц сетями и аналогичный блок слева?

Добрый день! Справа нужны блоки vk,f,ok, instagram в вертикальном состоянии (как на указанном сайте), а слева эти же блоки, только в горизонтальном состоянии. Я слева начала делать, но процесс продвигается медленно, генерирую кнопки соцсетей. А куда вставить с правой стороны, даже не знаю. :blink:

#19 Mr.Nito

Mr.Nito

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

  • Модераторы
  • 1 337 сообщений

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

Просмотр сообщенияАся (14 Ноябрь 2016 - 16:06) писал:

Добрый день! Справа нужны блоки vk,f,ok, instagram в вертикальном состоянии (как на указанном сайте), а слева эти же блоки, только в горизонтальном состоянии. Я слева начала делать, но процесс продвигается медленно, генерирую кнопки соцсетей. А куда вставить с правой стороны, даже не знаю. :blink:
Для добавления соц сетей по правому краю

В файл HTML
сразу после
<body style="background: url({ASSETS_IMAGES_PATH}fon.jpg);">

добавьте

<!--Соц сети Fixed-->
<div class="social-bookmarks">
	 <a href="//vk.com/" target="_blank" title="ВКонтакте" class="vk"></a>
	 <a href="//facebook.com" target="_blank" title="Facebook" class="fb"></a>
	 <a href="//odnoklassniki.ru/" target="_blank" title="Одноклассники" class="ok"></a>
	 <a href="//instagram.com/" target="_blank" title="Instagram" class="ig"></a>
</div>
<!--END Coц сети-->

В файле main.css в самом конце добавьте

/*Соц сети Fixed*/
.social-bookmarks {
height: 224px;
margin-top: -112px;
position: fixed;
right: 0;
top: 50%;
z-index: 999;
}
.social-bookmarks a:first-child {
margin-top: 0;
}
.social-bookmarks i {
position: absolute;
}
.social-bookmarks a:hover {
right: 0;
-webkit-transition: linear right .2s;
-moz-transition: linear right .2s;
-o-transition: linear right .2s;
transition: linear right .2s;
}
.social-bookmarks .vk i {
display: inline-block;
vertical-align: top;
background: url({ASSETS_IMAGES_PATH}sprite-bookmarks.png) no-repeat;
width: 18px;
height: 97px;
background-position: -88px -16px;
margin-top: -48.5px;
left: 10px;
top: 50%;
}
.social-bookmarks .vk {
height: 114px;
background-color: #3d6a93;
}
.social-bookmarks a {
display: block;
width: 45px;
height: 32px;
margin-top: 3px;
position: relative;
right: -10px;
-webkit-box-shadow: -1px 1px 1px #767676;
-moz-box-shadow: -1px 1px 1px #767676;
box-shadow: -1px 1px 1px #767676;
}
.social-bookmarks .fb {
background-color: #5475b5;
}
.social-bookmarks .fb i {
display: inline-block;
vertical-align: top;
background: url({ASSETS_IMAGES_PATH}sprite-bookmarks.png) no-repeat;
width: 11px;
height: 19px;
background-position: -144px 0;
margin-top: -9.5px;
left: 10px;
top: 50%;
}
.social-bookmarks .ok {
background-color: #f5821f;
}
.social-bookmarks .ok i {
display: inline-block;
vertical-align: top;
background: url({ASSETS_IMAGES_PATH}sprite-bookmarks.png) no-repeat;
width: 15px;
height: 25px;
background-position: -127px 0;
margin-top: -12.5px;
left: 10px;
top: 50%;
}
.social-bookmarks .ig {
background-color: #ccc;
}
.social-bookmarks .ig i {
display: inline-block;
vertical-align: top;
background: url({ASSETS_IMAGES_PATH}sprite-bookmarks.png) no-repeat;
width: 30px;
height: 30px;
margin-top: -15px;
position: absolute;
background-position: -127px -25px;
left: 4px;
top: 50%;
}
/* END Соц сети Fixed*/

Загрузите изображение прикреплённое к сообщению через кнопку "Добавить файл"

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

  • sprite-bookmarks.png

Сообщение отредактировал Mr.Nito: 15 Ноябрь 2016 - 16:03
Ошибка в инструкции


#20 Ася

Ася

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

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

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

Mr. Nito, спасибо за ответ :) !
1.Кнопочки справа, по расположению, встали, но только на них нет обозначения. Что и куда я не доставила?
2.Как сделать, чтобы слева,по стилю были такие же кнопочки, что и справа? И как мне всю эту левую конструкцию подвинуть немного правее от края? И кнопочки сдвинуть немного вниз от слова "Присоединяйтесь".




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

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