#1
Отправлено 08 Август 2016 - 15:24
Необходима Ваша помощь в решении проблемы со слайдером. Изначально слайдер был по ширине на всю страницу. Пытались с помощью сёрчинга по форуму в созданных темах подогнать его под требования наши. Хотим, чтоб он автоматически "подстраивался" по ширине под "товары на главной". И хотелось бы чтоб на мониторах с разным разрешением отображалось всё корректно. В связи с "сумбурностью" текстового изложения ТЗ, прикладываю скрин в аттаче! Спасибо!
#2
Отправлено 08 Август 2016 - 16:29
sipsancho (08 Август 2016 - 15:24) писал:
Необходима Ваша помощь в решении проблемы со слайдером. Изначально слайдер был по ширине на всю страницу. Пытались с помощью сёрчинга по форуму в созданных темах подогнать его под требования наши. Хотим, чтоб он автоматически "подстраивался" по ширине под "товары на главной". И хотелось бы чтоб на мониторах с разным разрешением отображалось всё корректно. В связи с "сумбурностью" текстового изложения ТЗ, прикладываю скрин в аттаче! Спасибо!
В стилях изменять ширину и высоту не нужно, поэтому необходимо вернуть стандартные значения:
в main.css найдите код
#slider {position: relative; margin: 0 auto;top: 0px; left: 0px; width: 1920px; height: 599px; overflow: hidden;z-index:1;} .slides_container {cursor: none; position: position; left: 20%; top: 0px; width: 1150px;height: 599px; overflow: hidden;}и замените на
#slider {position: relative; margin: 0 auto;top: 0px; left: 0px; width: 1920px; height: 699px; overflow: hidden;z-index:1;} .slides_container {cursor: move; position: absolute; left: 0px; top: 0px; width: 1920px;height: 699px; overflow: hidden;}В jssor_slider.js найдите код
jssor_slider1.$SetScaleWidth(Math.min(bodyWidth, 1920));изменяйте значение 1920(ширина слайдера в px, высота подстраивается автоматически).
#3
Отправлено 08 Август 2016 - 16:50
Danil (08 Август 2016 - 16:29) писал:
В стилях изменять ширину и высоту не нужно, поэтому необходимо вернуть стандартные значения:
в main.css найдите код
#slider {position: relative; margin: 0 auto;top: 0px; left: 0px; width: 1920px; height: 599px; overflow: hidden;z-index:1;} .slides_container {cursor: none; position: position; left: 20%; top: 0px; width: 1150px;height: 599px; overflow: hidden;}и замените на
#slider {position: relative; margin: 0 auto;top: 0px; left: 0px; width: 1920px; height: 699px; overflow: hidden;z-index:1;} .slides_container {cursor: move; position: absolute; left: 0px; top: 0px; width: 1920px;height: 699px; overflow: hidden;}В jssor_slider.js найдите код
jssor_slider1.$SetScaleWidth(Math.min(bodyWidth, 1920));изменяйте значение 1920(ширина слайдера в px, высота подстраивается автоматически).
Позвольте задать ещё 1 вопрос по сайту:
Хотим изменить в Меню представление "Контактов" нашего магазина. На текущий момент времени, как я понял, оно заполняется из "Настройки".
Мы бы хотели добавить в это меню Реквизиты нашей компании для выгрузки товаров на Яндекс.Маркет.
Спасибо!
#4
Отправлено 08 Август 2016 - 20:00
sipsancho (08 Август 2016 - 16:50) писал:
Позвольте задать ещё 1 вопрос по сайту:
Хотим изменить в Меню представление "Контактов" нашего магазина. На текущий момент времени, как я понял, оно заполняется из "Настройки".
Мы бы хотели добавить в это меню Реквизиты нашей компании для выгрузки товаров на Яндекс.Маркет.
Спасибо!
<div class="col-sm-6 col-xs-12"> <div class="block-title"><h3>Наши контакты</h3></div> <div class="block-contact"> {% IF SETTINGS_STORE_REGION %}<p class="city"><em class="fa fa-map-marker"> </em><span>{SETTINGS_STORE_REGION}</span></p>{% ENDIF %} {% IF SETTINGS_STORE_WORK_TIME %}<p class="worktime"><em class="fa fa-clock-o"> </em><span>{SETTINGS_STORE_WORK_TIME}</span></p>{% ENDIF %} {% IF SETTINGS_STORE_PHONE_NUMBER1 %}<p class="phone"><em class="fa fa-phone"> </em><span><a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE1}{SETTINGS_STORE_PHONE_CITY_CODE1}{SETTINGS_STORE_PHONE_NUMBER1}">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}({SETTINGS_STORE_PHONE_CITY_CODE1}){SETTINGS_STORE_PHONE_NUMBER1}</a></span></p>{% ENDIF %} {% IF SETTINGS_STORE_PHONE_NUMBER2 %}<p class="phone"><em class="fa fa-phone"> </em><span><a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE2}{SETTINGS_STORE_PHONE_CITY_CODE2}{SETTINGS_STORE_PHONE_NUMBER2}">{SETTINGS_STORE_PHONE_COUNTRY_CODE2}({SETTINGS_STORE_PHONE_CITY_CODE2}){SETTINGS_STORE_PHONE_NUMBER2}</a></span></p>{% ENDIF %} {% IF SETTINGS_STORE_PHONE_NUMBER3 %}<p class="fax"><em class="fa fa-fax"> </em><span><a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE3}{SETTINGS_STORE_PHONE_CITY_CODE3}{SETTINGS_STORE_PHONE_NUMBER3}">{SETTINGS_STORE_PHONE_COUNTRY_CODE3}({SETTINGS_STORE_PHONE_CITY_CODE3}){SETTINGS_STORE_PHONE_NUMBER3}</a></span></p>{% ENDIF %} {% IF SETTINGS_STORE_EMAIL_MAIN %}<p class="email"><em class="fa fa-envelope"> </em><span><a href="mailto:{SETTINGS_STORE_EMAIL_MAIN}">{SETTINGS_STORE_EMAIL_MAIN}</a></span></p>{% ENDIF %} {% IF SETTINGS_STORE_SKYPE %}<p class="skype"><em class="fa fa-skype"> </em><span><a href="skype:{SETTINGS_STORE_SKYPE}?call">{SETTINGS_STORE_SKYPE}</a></span></p>{% ENDIF %} </div> </div>и замените на
<div class="col-sm-6 col-xs-12"> <div class="block-title"><h3>Наши контакты</h3></div> <div class="col-sm-6 col-xs-12"> <div class="block-contact"> {% IF SETTINGS_STORE_REGION %}<p class="city"><em class="fa fa-map-marker"> </em><span>{SETTINGS_STORE_REGION}</span></p>{% ENDIF %} {% IF SETTINGS_STORE_WORK_TIME %}<p class="worktime"><em class="fa fa-clock-o"> </em><span>{SETTINGS_STORE_WORK_TIME}</span></p>{% ENDIF %} {% IF SETTINGS_STORE_PHONE_NUMBER1 %}<p class="phone"><em class="fa fa-phone"> </em><span><a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE1}{SETTINGS_STORE_PHONE_CITY_CODE1}{SETTINGS_STORE_PHONE_NUMBER1}">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}({SETTINGS_STORE_PHONE_CITY_CODE1}){SETTINGS_STORE_PHONE_NUMBER1}</a></span></p>{% ENDIF %} {% IF SETTINGS_STORE_PHONE_NUMBER2 %}<p class="phone"><em class="fa fa-phone"> </em><span><a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE2}{SETTINGS_STORE_PHONE_CITY_CODE2}{SETTINGS_STORE_PHONE_NUMBER2}">{SETTINGS_STORE_PHONE_COUNTRY_CODE2}({SETTINGS_STORE_PHONE_CITY_CODE2}){SETTINGS_STORE_PHONE_NUMBER2}</a></span></p>{% ENDIF %} {% IF SETTINGS_STORE_PHONE_NUMBER3 %}<p class="fax"><em class="fa fa-fax"> </em><span><a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE3}{SETTINGS_STORE_PHONE_CITY_CODE3}{SETTINGS_STORE_PHONE_NUMBER3}">{SETTINGS_STORE_PHONE_COUNTRY_CODE3}({SETTINGS_STORE_PHONE_CITY_CODE3}){SETTINGS_STORE_PHONE_NUMBER3}</a></span></p>{% ENDIF %} {% IF SETTINGS_STORE_EMAIL_MAIN %}<p class="email"><em class="fa fa-envelope"> </em><span><a href="mailto:{SETTINGS_STORE_EMAIL_MAIN}">{SETTINGS_STORE_EMAIL_MAIN}</a></span></p>{% ENDIF %} {% IF SETTINGS_STORE_SKYPE %}<p class="skype"><em class="fa fa-skype"> </em><span><a href="skype:{SETTINGS_STORE_SKYPE}?call">{SETTINGS_STORE_SKYPE}</a></span></p>{% ENDIF %} </div> </div> <div class="col-sm-6 col-xs-12"> <span>ВАШ ТЕКСТ</span> </div> </div>Замените "ВАШ ТЕКСТ" на реквизиты.
#6
Отправлено 09 Август 2016 - 14:38
sipsancho (09 Август 2016 - 11:26) писал:
В шаблоне Связь с администрацией найдите блок
<div class="col-sm-6 col-xs-12"> <div class="col-sm-6 col-xs-12"> <div class="block-title"><h3>Наши контакты</h3></div> <div class="col-sm-6 col-xs-12"> <div class="block-contact"> {% IF SETTINGS_STORE_REGION %}<p class="city"><em class="fa fa-map-marker"> </em><span>{SETTINGS_STORE_REGION}</span></p>{% ENDIF %} {% IF SETTINGS_STORE_WORK_TIME %}<p class="worktime"><em class="fa fa-clock-o"> </em><span>{SETTINGS_STORE_WORK_TIME}</span></p>{% ENDIF %} {% IF SETTINGS_STORE_PHONE_NUMBER1 %}<p class="phone"><em class="fa fa-phone"> </em><span><a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE1}{SETTINGS_STORE_PHONE_CITY_CODE1}{SETTINGS_STORE_PHONE_NUMBER1}">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}({SETTINGS_STORE_PHONE_CITY_CODE1}){SETTINGS_STORE_PHONE_NUMBER1}</a></span></p>{% ENDIF %} {% IF SETTINGS_STORE_PHONE_NUMBER2 %}<p class="phone"><em class="fa fa-phone"> </em><span><a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE2}{SETTINGS_STORE_PHONE_CITY_CODE2}{SETTINGS_STORE_PHONE_NUMBER2}">{SETTINGS_STORE_PHONE_COUNTRY_CODE2}({SETTINGS_STORE_PHONE_CITY_CODE2}){SETTINGS_STORE_PHONE_NUMBER2}</a></span></p>{% ENDIF %} {% IF SETTINGS_STORE_PHONE_NUMBER3 %}<p class="fax"><em class="fa fa-fax"> </em><span><a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE3}{SETTINGS_STORE_PHONE_CITY_CODE3}{SETTINGS_STORE_PHONE_NUMBER3}">{SETTINGS_STORE_PHONE_COUNTRY_CODE3}({SETTINGS_STORE_PHONE_CITY_CODE3}){SETTINGS_STORE_PHONE_NUMBER3}</a></span></p>{% ENDIF %} {% IF SETTINGS_STORE_EMAIL_MAIN %}<p class="email"><em class="fa fa-envelope"> </em><span><a href="mailto:{SETTINGS_STORE_EMAIL_MAIN}">{SETTINGS_STORE_EMAIL_MAIN}</a></span></p>{% ENDIF %} {% IF SETTINGS_STORE_SKYPE %}<p class="skype"><em class="fa fa-skype"> </em><span><a href="skype:{SETTINGS_STORE_SKYPE}?call">{SETTINGS_STORE_SKYPE}</a></span></p>{% ENDIF %} </div> </div> <div class="col-sm-6 col-xs-12"> <span>РЕКВИЗИТЫ</span> </div> </div> </div>и замените его на
<div class="col-sm-6 col-xs-12"> <div class="block-title"><h3>Наши контакты</h3></div> <div class="col-sm-6 col-xs-12"> <div class="block-contact"> {% IF SETTINGS_STORE_REGION %}<p class="city"><em class="fa fa-map-marker"> </em><span>{SETTINGS_STORE_REGION}</span></p>{% ENDIF %} {% IF SETTINGS_STORE_WORK_TIME %}<p class="worktime"><em class="fa fa-clock-o"> </em><span>{SETTINGS_STORE_WORK_TIME}</span></p>{% ENDIF %} {% IF SETTINGS_STORE_PHONE_NUMBER1 %}<p class="phone"><em class="fa fa-phone"> </em><span><a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE1}{SETTINGS_STORE_PHONE_CITY_CODE1}{SETTINGS_STORE_PHONE_NUMBER1}">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}({SETTINGS_STORE_PHONE_CITY_CODE1}){SETTINGS_STORE_PHONE_NUMBER1}</a></span></p>{% ENDIF %} {% IF SETTINGS_STORE_PHONE_NUMBER2 %}<p class="phone"><em class="fa fa-phone"> </em><span><a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE2}{SETTINGS_STORE_PHONE_CITY_CODE2}{SETTINGS_STORE_PHONE_NUMBER2}">{SETTINGS_STORE_PHONE_COUNTRY_CODE2}({SETTINGS_STORE_PHONE_CITY_CODE2}){SETTINGS_STORE_PHONE_NUMBER2}</a></span></p>{% ENDIF %} {% IF SETTINGS_STORE_PHONE_NUMBER3 %}<p class="fax"><em class="fa fa-fax"> </em><span><a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE3}{SETTINGS_STORE_PHONE_CITY_CODE3}{SETTINGS_STORE_PHONE_NUMBER3}">{SETTINGS_STORE_PHONE_COUNTRY_CODE3}({SETTINGS_STORE_PHONE_CITY_CODE3}){SETTINGS_STORE_PHONE_NUMBER3}</a></span></p>{% ENDIF %} {% IF SETTINGS_STORE_EMAIL_MAIN %}<p class="email"><em class="fa fa-envelope"> </em><span><a href="mailto:{SETTINGS_STORE_EMAIL_MAIN}">{SETTINGS_STORE_EMAIL_MAIN}</a></span></p>{% ENDIF %} {% IF SETTINGS_STORE_SKYPE %}<p class="skype"><em class="fa fa-skype"> </em><span><a href="skype:{SETTINGS_STORE_SKYPE}?call">{SETTINGS_STORE_SKYPE}</a></span></p>{% ENDIF %} </div> </div> <div class="col-sm-6 col-xs-12"> <span>РЕКВИЗИТЫ</span> </div> </div>
#7
Отправлено 09 Август 2016 - 16:51
Цитата
Спасибо, заработало как надо.
#8
Отправлено 18 Август 2016 - 12:10
Возникла необходимость создать "всплывающее окно" либо при попадании клиента на сайт, либо в момент закрытия вкладки. Есть возможность осуществить подобное?
#9
Отправлено 18 Август 2016 - 15:09
sipsancho (18 Август 2016 - 12:10) писал:
Возникла необходимость создать "всплывающее окно" либо при попадании клиента на сайт, либо в момент закрытия вкладки. Есть возможность осуществить подобное?
Здравствуйте.
Зайдите в админ. панель -> Сайт -> Редактор шаблонов -> Шаблоны -> HTML, найдите код:
</head>
Вставьте перед ним код:
<script src="//yastatic.net/jquery/cookie/1.0/jquery.cookie.min.js"></script> <script type="text/javascript"> $(function() { // Проверяем запись в куках о посещении // Если запись есть - ничего не делаем if (!$.cookie('hideModal')) { // если cookie не установлено появится окно // с задержкой 5 секунд var delay_popup = 5000; setTimeout("document.getElementById('overlay').style.display='block'", delay_popup); } // Запоминаем в куках, что посетитель уже заходил $.cookie('hideModal', true, { // Время хранения cookie в днях expires: 1, path: '/' }); }); </script>
Найдите код:
<body>
Вставьте после него код:
<!-- Модальное Окно --> <div id="overlay"> <div class="popup"> <h2>Модальное Окно!</h2> <p> Текст </p> <button class="close" title="Закрыть" onclick="document.getElementById('overlay').style.display='none';"></button> </div> </div>
Зайдите в админ. панель -> Сайт -> Редактор шаблонов -> Стили -> main.css, в конце добавьте код:
/* Всплывающее окно при загрузке сайта */ /* базовый контейнер, фон затемнения*/ #overlay { position: fixed; top: 0; left: 0; display: none; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.65); z-index: 999; -webkit-animation: fade .6s; -moz-animation: fade .6s; animation: fade .6s; overflow: auto; } /* модальный блок */ .popup { top: 25%; left: 0; right: 0; font-size: 14px; margin: auto; width: 85%; min-width: 320px; max-width: 600px; position: absolute; padding: 15px 20px; border: 1px solid #383838; background: #fefefe; z-index: 1000; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; border-radius: 4px; font: 14px/18px 'Tahoma', Arial, sans-serif; -webkit-box-shadow: 0 15px 20px rgba(0,0,0,.22),0 19px 60px rgba(0,0,0,.3); -moz-box-shadow: 0 15px 20px rgba(0,0,0,.22),0 19px 60px rgba(0,0,0,.3); -ms-box-shadow: 0 15px 20px rgba(0,0,0,.22),0 19px 60px rgba(0,0,0,.3); box-shadow: 0 15px 20px rgba(0,0,0,.22),0 19px 60px rgba(0,0,0,.3); -webkit-animation: fade .6s; -moz-animation: fade .6s; animation: fade .6s; } /* заголовки в модальном блоке */ .popup h2, .popup h3 { margin: 0 0 1rem 0; font-weight: 300; line-height: 1.3; color: #009032; text-shadow: 1px 2px 4px #ddd; } /* кнопка закрытия */ .close { top: 10px; right: 10px; width: 32px; height: 32px; position: absolute; border: none; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; background-color: rgba(0, 131, 119, 0.9); -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); -moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); cursor: pointer; outline: none; } .close:before { color: rgba(255, 255, 255, 0.9); content: "X"; font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-weight: normal; text-decoration: none; text-shadow: 0 -1px rgba(0, 0, 0, 0.9); -webkit-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; } /* кнопка закрытия при наведении */ .close:hover { background-color: rgba(252, 20, 0, 0.8); } /* изображения в модальном окне */ .popup img { width: 100%; height: auto; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); } /* анимация при появлении блоков с содержанием */ @-moz-keyframes fade { from { opacity: 0; } to { opacity: 1 } } @-webkit-keyframes fade { from { opacity: 0; } to { opacity: 1 } } @keyframes fade { from { opacity: 0; } to { opacity: 1 } }
Данное окно будет появляться для пользователя только один раз при посещении сайта (чтобы не мешать при переключении страниц и повторных заходах).
Значение в коде expires: 1 обозначает, что cookies файлы будут хранится 1 сутки, после чего окно снова начнет появляться.
#10
Отправлено 19 Август 2016 - 11:18
Firefly (18 Август 2016 - 15:09) писал:
Значение в коде expires: 1 обозначает, что куки файлы будут хранится 1 сутки, после чего окно снова начнет появляться.
Добрый день! Вроде, сделали всё верно, но окно не появляется. Помогите, пожалуйста, разобраться, где накосячили мы?
#12
Отправлено 22 Август 2016 - 15:17
Vaccina (20 Август 2016 - 07:46) писал:
Спасибо!!!
#13
Отправлено 23 Август 2016 - 15:41
Темы с аналогичным тегами Слайдер размер, ширина
Вопросы работы сервиса StoreLand →
Дизайн →
Шаблон Эталон →
Страница товара →
Пропорции ИзображенийАвтор Гость_Alex-2_* , 03 мая 2022 пропорции, высота, ширина и 1 еще... |
|
|||
Вопросы работы сервиса StoreLand →
Дизайн →
Шаблон Движение →
Главная →
Настройка Автоподбора Ширины Виджета ВкАвтор Гость_GeekGirl_* , 22 нояб. 2014 Движение, Виджет ВК, Виджет VK и 3 еще... |
|
|||
Вопросы работы сервиса StoreLand →
Дизайн →
Шаблон Осень →
Изменение общей стилистики →
Границы СлайдераАвтор Гость_abzaloff_* , 06 нояб. 2013 слайдер размер, границы |
|
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных