Всем привет, возможно ли изменить ориентацию по горизонтали блоков: интересное, хиты, товары на главной, сделать прокрутку.
Ввиду того что они располагаются по вертикали, приходится долго и упорно прокручивать сайт вниз, чтобы добраться до подвала, это очень не удобно для людей.
или если есть у кого то другие способы, киньте ссылки на тему. кроме стрелки вниз ничего не нашел.
0
Изменение Ориентации Блоков Интересное, Хиты, Товары На Главной
Автор IFullHaus, 06 июня 2019 14:35
Сообщений в теме: 5
#1
Отправлено 06 Июнь 2019 - 14:35
#2
Отправлено 09 Июнь 2019 - 18:32
ап
#3
Отправлено 11 Июнь 2019 - 06:17
#4
Отправлено 13 Июнь 2019 - 12:55
Эта инструкция ведет на другую инструкцию, что делать непонятно, можно ли ТУТ оставить ссылку на скачивание(файлы я себе на сайт залил. Опять же все файлы добавлять?), и коды которые нужно прописать.
Чтобы хиты новинки и интересное были в карусели по 3 товара. И больше никакой воды не писать в теме.
Чтобы хиты новинки и интересное были в карусели по 3 товара. И больше никакой воды не писать в теме.
#5
Отправлено 17 Июнь 2019 - 11:15
ап
#6
Отправлено 21 Июнь 2019 - 06:12
Здравствуйте.
На данном сайте скачайте архив: https://baijs.com/tinycarousel/
Из папки simple в раздел Сайт - Редактор шаблонов загрузите jquery.tinycarousel.min.js
Зайдите в шаблон HTML - найдите:
после него вставьте:
далее найдите:
замените на:
В конец main.css вставьте:
в конце main.js вставьте:
После изменений останется подкорректировать стили для корректного отображения, а в целом карусель появится и будет работать.
На данном сайте скачайте архив: https://baijs.com/tinycarousel/
Из папки simple в раздел Сайт - Редактор шаблонов загрузите jquery.tinycarousel.min.js
Зайдите в шаблон HTML - найдите:
<!-- Скрипты магазина --> <script type="text/javascript" src="{ASSETS_JS_PATH}main.js?design=plastic"></script>
после него вставьте:
<script type="text/javascript" src="{ASSETS_JS_PATH}jquery.tinycarousel.min.js"></script>
далее найдите:
<!-- Вывод каталога списком --> <!-- Список товаров на главной --> {% IFNOT index_page_goods_empty %} {% FOR index_page_goods %} <div class="hr"></div> <div class="box padd"> <div class="titlebox txtalgnlft"> <ul> <li class="blue fnt11b"> <h2><a href="{index_page_goods.URL}" title="Перейти на страницу «{index_page_goods.NAME}»">Интересно</a></h2> </li> <li class="default fnt12b "><a href="{index_page_goods.URL}">{index_page_goods.NAME}</a></li> </ul> </div> <div class="ulproduct"> <div class="img txtalgncnt"> <div class="stikerpro"> </div> <a href="{index_page_goods.URL}"><img src="{% IF index_page_goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-other.png?design=plastic{% ELSE %}{index_page_goods.IMAGE_OTHER}{% ENDIF %}" alt="{index_page_goods.NAME}" /></a> </div> <div class="infoproduct"> <div class="name fnt14b"> <a href="{index_page_goods.URL}">{index_page_goods.NAME}</a> </div> <div class="info fnt11n txtalgnlft"> {index_page_goods.DESCRIPTION_SHORT} </div> <div class="buttons"> {% IF index_page_goods.MAX_REST_VALUE>0 %} <form action="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}" method="post" class="goodsListForm"> <div> <input type="hidden" name="hash" value="{HASH}" /> <input type="hidden" name="form[goods_from]" value="{index_page_goods.GOODS_FROM}" /> <input type="hidden" name="form[goods_mod_id]" value="{index_page_goods.MIN_PRICE_NOW_ID}" /> <button type="submit" class="whtgray">Купить сейчас</button> </div> </form> <a href="{index_page_goods.URL}" title="Перейти на страницу «{index_page_goods.NAME}»" class="whtgray">Подробнее</a> {% ENDIF %} {% IF index_page_goods.MAX_REST_VALUE=0 %} <a href="{index_page_goods.URL}" title="Перейти на страницу «{index_page_goods.NAME}»" class="whtgray">Подробнее</a> {% ENDIF %} </div> <div class="price fnt12b txtalgnlft"> Цена: <span> {% IF index_page_goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT>index_page_goods.MIN_PRICE_NOW %} {index_page_goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT | number_format("0", ",", " ")} {% ELSEIF index_page_goods.MIN_PRICE_OLD>index_page_goods.MIN_PRICE_NOW %} {index_page_goods.MIN_PRICE_OLD | number_format("0", ",", " ")} {% ENDIF %} </span><em class="fnt12b">{index_page_goods.MIN_PRICE_NOW | money_format}</em> </div> </div> <div class="clear"></div> </div> </div> {% ENDFOR index_page_goods %} {% ENDIF %} <!-- end-Список товаров на главной --> <!-- Вывод каталога таблицей --> <!-- Список новинок на главной --> {% IFNOT index_page_new_goods_empty %} <div class="hr"></div> <div class="box padd"> <div class="titlebox fnt11b txtalgnlft"> <ul> <li class="blue fnt11b"> <h2><a href="{CATALOG_NEW_URL}">Новинки</a></h2> </li> </ul> </div> <table class="table" cellpadding="0 " cellspacing="0"> <tr> {% FOR index_page_new_goods %} <td> <div class="tabproduct"> <div class="title fnt12b txtalgncnt"> <a href="{index_page_new_goods.URL}" title="Перейти на страницу «{index_page_new_goods.NAME}»">{index_page_new_goods.NAME}</a> </div> <div class="img txtalgncnt"> <a href="{index_page_new_goods.URL}" title="Перейти на страницу «{index_page_new_goods.NAME}»"><img src="{% IF index_page_new_goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-other.png?design=plastic{% ELSE %}{index_page_new_goods.IMAGE_OTHER}{% ENDIF %}" alt="{index_page_new_goods.NAME}" /></a> </div> <div class="price fnt12b txtalgncnt"> Цена: {% IF index_page_new_goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT>index_page_new_goods.MIN_PRICE_NOW %} <span>{index_page_new_goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT | number_format("0", ",", " ")}</span> {% ELSEIF index_page_new_goods.MIN_PRICE_OLD>index_page_new_goods.MIN_PRICE_NOW %} <span>{index_page_new_goods.MIN_PRICE_OLD | number_format("0", ",", " ")}</span> {% ENDIF %} <em class="fnt12b">{index_page_new_goods.MIN_PRICE_NOW | money_format}</em> </div> <div class="buttons txtalgncnt"> {% IF index_page_new_goods.MAX_REST_VALUE>0 %}<a href="{index_page_new_goods.URL}" class="whtgreen" title="Перейти на страницу «{index_page_new_goods.NAME}»">Подробнее</a> <form action="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}" method="post" class="goodsListForm"> <div> <input type="hidden" name="hash" value="{HASH}" /> <input type="hidden" name="form[goods_from]" value="{index_page_new_goods.GOODS_FROM}" /> <input type="hidden" name="form[goods_mod_id]" value="{index_page_new_goods.MIN_PRICE_NOW_ID}" /> <button type="submit"class="blgreen">Купить</button> </div> </form> {% ENDIF %} {% IF index_page_new_goods.MAX_REST_VALUE=0 %} <a href="{index_page_new_goods.URL}" class="whtgreen" style="margin:0 0 0 70px;" title="Перейти на страницу «{index_page_new_goods.NAME}»">Подробнее</a> {% ENDIF %} </div> </div> </td> {% IFNOT index_page_new_goods.last %}{index_page_new_goods.index | is_divided("2","</tr><tr>","")}{% ENDIF %} {% ENDFOR index_page_new_goods %} </tr> </table> </div> {% ENDIF %} <!-- end Список новинок на главной --> <!-- Вывод каталога таблицей-Конец --> <!-- Вывод каталога списком --> <!-- Список хитов главной --> {% IFNOT index_page_favorites_goods_empty %} {% FOR index_page_favorites_goods %} <div class="hr"></div> <div class="box padd"> <div class="titlebox txtalgnlft"> <ul> <li class="blue fnt11b"> <h2><a href="{index_page_favorites_goods.URL}" title="Перейти на страницу «{index_page_favorites_goods.NAME}»">Интересно</a></h2> </li> <li class="default fnt12b "><a href="{index_page_favorites_goods.URL}">{index_page_favorites_goods.NAME}</a></li> </ul> </div> <div class="ulproduct"> <div class="img txtalgncnt"> <div class="stikerhit"> </div> <a href="{index_page_favorites_goods.URL}"><img {% IF index_page_favorites_goods.IMAGE_EMPTY %}src="{ASSETS_IMAGES_PATH}no-photo-medium.png?design=plastic" width="220"{% ELSE %}src="{index_page_favorites_goods.IMAGE_SMALL}"{% ENDIF %} alt="{index_page_favorites_goods.NAME}" /></a> </div> <div class="infoproduct"> <div class="name fnt14b"> <a href="{index_page_favorites_goods.URL}">{index_page_favorites_goods.NAME}</a> </div> <div class="info fnt11n txtalgnlft"> {index_page_favorites_goods.DESCRIPTION_SHORT} </div> <div class="buttons"> {% IF index_page_favorites_goods.MAX_REST_VALUE>0 %} <form action="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}" method="post" class="goodsListForm"> <div> <input type="hidden" name="hash" value="{HASH}" /> <input type="hidden" name="form[goods_from]" value="{index_page_favorites_goods.GOODS_FROM}" /> <input type="hidden" name="form[goods_mod_id]" value="{index_page_favorites_goods.MIN_PRICE_NOW_ID}" /> <button type="submit" class="whtgray">Купить сейчас</button> </div> </form> <a href="{index_page_favorites_goods.URL}" title="Перейти на страницу «{index_page_favorites_goods.NAME}»" class="whtgray">Подробнее</a> {% ENDIF %} {% IF index_page_favorites_goods.MAX_REST_VALUE=0 %} <a href="{index_page_favorites_goods.URL}" title="Перейти на страницу «{index_page_favorites_goods.NAME}»" class="whtgray">Подробнее</a> {% ENDIF %} </div> <div class="price fnt12b txtalgnlft"> Цена: <span> {% IF index_page_favorites_goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT>index_page_favorites_goods.MIN_PRICE_NOW %} {index_page_favorites_goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT | number_format("0", ",", " ")} {% ELSEIF index_page_favorites_goods.MIN_PRICE_OLD>index_page_favorites_goods.MIN_PRICE_NOW %} {index_page_favorites_goods.MIN_PRICE_OLD | number_format("0", ",", " ")} {% ENDIF %} </span><em class="fnt12b">{index_page_favorites_goods.MIN_PRICE_NOW | money_format}</em> </div> </div> <div class="clear"></div> </div> </div> {% ENDFOR index_page_goods %} {% ENDIF %} <!-- end-Список хитов главной --> <!-- Вывод каталога таблицей --> <!-- Вывод каталога списком-Конец -->
замените на:
{% IFNOT index_page_goods_empty %} <div class="titlebox fnt11b txtalgnlft"> <ul> <li class="blue fnt11b"> <h2>Товары на главной</h2> </li> </ul> </div> <div id="slider1" class="carousel"> <a class="buttons prev" href="#"><</a> <div class="viewport"> <ul class="overview"> {% FOR index_page_goods %} <li> <div class="tabproduct"> <div class="title fnt12b txtalgncnt"> <a href="{index_page_goods.URL}" title="Перейти на страницу «{index_page_goods.NAME}»">{index_page_goods.NAME}</a> </div> <div class="img txtalgncnt"> <a href="{index_page_goods.URL}" title="Перейти на страницу «{index_page_goods.NAME}»"><img src="{% IF index_page_goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-other.png?design=plastic{% ELSE %}{index_page_goods.IMAGE_OTHER}{% ENDIF %}" alt="{index_page_goods.NAME}" /></a> </div> <div class="price fnt12b txtalgncnt"> Цена: {% IF index_page_goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT>index_page_goods.MIN_PRICE_NOW %} <span>{index_page_goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT | number_format("0", ",", " ")}</span> {% ELSEIF index_page_goods.MIN_PRICE_OLD>index_page_goods.MIN_PRICE_NOW %} <span>{index_page_goods.MIN_PRICE_OLD | number_format("0", ",", " ")}</span> {% ENDIF %} <em class="fnt12b">{index_page_goods.MIN_PRICE_NOW | money_format}</em> </div> <div class="buttons txtalgncnt"> {% IF index_page_goods.MAX_REST_VALUE>0 %} <form action="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}" method="post" id="goodsListFormId{index_page_goods.MIN_PRICE_NOW_ID}" class="goodsListForm"> <div> <input type="hidden" name="hash" value="{HASH}" /> <input type="hidden" name="form[goods_from]" value="{index_page_goods.GOODS_FROM}" /> <input type="hidden" name="form[goods_mod_id]" value="{index_page_goods.MIN_PRICE_NOW_ID}" /> <div class="plus_minus_quantity"> <span class="qty-minus">-</span> <input type="text" value="1" size="2" maxlength="5" class="quantity" name="form[goods_mod_quantity]"> <span class="qty-plus">+</span> </div> <div class="clear"></div> <a href="{index_page_goods.URL}" class="whtgreen" title="Перейти на страницу «{index_page_goods.NAME}»">Подробнее</a> <a class="blgreen" onclick="$('#goodsListFormId{index_page_goods.MIN_PRICE_NOW_ID}').submit(); return false;" href="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}?hash={HASH | url_amp}&form%5Bgoods_from%5D={index_page_goods.GOODS_FROM}&form%5Bgoods_mod_id%5D={index_page_goods.MIN_PRICE_NOW_ID}" title="Положить «{index_page_goods.NAME}» в корзину">Купить</a> </div> </form> {% ENDIF %} {% IF index_page_goods.MAX_REST_VALUE=0 %}<a href="{index_page_goods.URL}" class="whtgreen" title="Перейти на страницу «{index_page_goods.NAME}»">Подробнее</a>{% ENDIF %} </div> </div> </li> {% ENDFOR %} </ul> </div> <a class="buttons next" href="#">></a> </div> {% ENDIF %} {% IFNOT index_page_new_goods_empty %} <div class="titlebox fnt11b txtalgnlft"> <ul> <li class="blue fnt11b"> <h2>Новинки</h2> </li> </ul> </div> <div id="slider2" class="carousel"> <a class="buttons prev" href="#"><</a> <div class="viewport"> <ul class="overview"> {% FOR index_page_new_goods %} <li> <div class="tabproduct"> <div class="title fnt12b txtalgncnt"> <a href="{index_page_new_goods.URL}" title="Перейти на страницу «{index_page_new_goods.NAME}»">{index_page_new_goods.NAME}</a> </div> <div class="img txtalgncnt"> <a href="{index_page_new_goods.URL}" title="Перейти на страницу «{index_page_new_goods.NAME}»"><img src="{% IF index_page_new_goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-other.png?design=plastic{% ELSE %}{index_page_new_goods.IMAGE_OTHER}{% ENDIF %}" alt="{index_page_new_goods.NAME}" /></a> </div> <div class="price fnt12b txtalgncnt"> Цена: {% IF index_page_new_goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT>index_page_new_goods.MIN_PRICE_NOW %} <span>{index_page_new_goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT | number_format("0", ",", " ")}</span> {% ELSEIF index_page_new_goods.MIN_PRICE_OLD>index_page_new_goods.MIN_PRICE_NOW %} <span>{index_page_new_goods.MIN_PRICE_OLD | number_format("0", ",", " ")}</span> {% ENDIF %} <em class="fnt12b">{index_page_new_goods.MIN_PRICE_NOW | money_format}</em> </div> <div class="buttons txtalgncnt"> {% IF index_page_new_goods.MAX_REST_VALUE>0 %} <form action="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}" method="post" id="goodsListFormId{index_page_new_goods.MIN_PRICE_NOW_ID}" class="goodsListForm"> <div> <input type="hidden" name="hash" value="{HASH}" /> <input type="hidden" name="form[goods_from]" value="{index_page_new_goods.GOODS_FROM}" /> <input type="hidden" name="form[goods_mod_id]" value="{index_page_new_goods.MIN_PRICE_NOW_ID}" /> <div class="plus_minus_quantity"> <span class="qty-minus">-</span> <input type="text" value="1" size="2" maxlength="5" class="quantity" name="form[goods_mod_quantity]"> <span class="qty-plus">+</span> </div> <div class="clear"></div> <a href="{index_page_new_goods.URL}" class="whtgreen" title="Перейти на страницу «{index_page_new_goods.NAME}»">Подробнее</a> <a class="blgreen" onclick="$('#goodsListFormId{index_page_new_goods.MIN_PRICE_NOW_ID}').submit(); return false;" href="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}?hash={HASH | url_amp}&form%5Bgoods_from%5D={index_page_new_goods.GOODS_FROM}&form%5Bgoods_mod_id%5D={index_page_new_goods.MIN_PRICE_NOW_ID}" title="Положить «{index_page_new_goods.NAME}» в корзину">Купить</a> </div> </form> {% ENDIF %} {% IF index_page_new_goods.MAX_REST_VALUE=0 %}<a href="{index_page_new_goods.URL}" class="whtgreen" title="Перейти на страницу «{index_page_new_goods.NAME}»">Подробнее</a>{% ENDIF %} </div> </div> </li> {% ENDFOR %} </ul> </div> <a class="buttons next" href="#">></a> </div> {% ENDIF %} {% IFNOT index_page_favorites_goods_empty %} <div class="titlebox fnt11b txtalgnlft"> <ul> <li class="blue fnt11b"> <h2>Хиты продаж</h2> </li> </ul> </div> <div id="slider3" class="carousel"> <a class="buttons prev" href="#"><</a> <div class="viewport"> <ul class="overview"> {% FOR index_page_favorites_goods %} <li> <div class="tabproduct"> <div class="title fnt12b txtalgncnt"> <a href="{index_page_favorites_goods.URL}" title="Перейти на страницу «{index_page_favorites_goods.NAME}»">{index_page_favorites_goods.NAME}</a> </div> <div class="img txtalgncnt"> <a href="{index_page_favorites_goods.URL}" title="Перейти на страницу «{index_page_favorites_goods.NAME}»"><img src="{% IF index_page_favorites_goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-other.png?design=plastic{% ELSE %}{index_page_favorites_goods.IMAGE_OTHER}{% ENDIF %}" alt="{index_page_favorites_goods.NAME}" /></a> </div> <div class="price fnt12b txtalgncnt"> Цена: {% IF index_page_favorites_goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT>index_page_favorites_goods.MIN_PRICE_NOW %} <span>{index_page_favorites_goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT | number_format("0", ",", " ")}</span> {% ELSEIF index_page_favorites_goods.MIN_PRICE_OLD>index_page_favorites_goods.MIN_PRICE_NOW %} <span>{index_page_favorites_goods.MIN_PRICE_OLD | number_format("0", ",", " ")}</span> {% ENDIF %} <em class="fnt12b">{index_page_favorites_goods.MIN_PRICE_NOW | money_format}</em> </div> <div class="buttons txtalgncnt"> {% IF index_page_favorites_goods.MAX_REST_VALUE>0 %} <form action="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}" method="post" id="goodsListFormId{index_page_favorites_goods.MIN_PRICE_NOW_ID}" class="goodsListForm"> <div> <input type="hidden" name="hash" value="{HASH}" /> <input type="hidden" name="form[goods_from]" value="{index_page_favorites_goods.GOODS_FROM}" /> <input type="hidden" name="form[goods_mod_id]" value="{index_page_favorites_goods.MIN_PRICE_NOW_ID}" /> <div class="plus_minus_quantity"> <span class="qty-minus">-</span> <input type="text" value="1" size="2" maxlength="5" class="quantity" name="form[goods_mod_quantity]"> <span class="qty-plus">+</span> </div> <div class="clear"></div> <a href="{index_page_favorites_goods.URL}" class="whtgreen" title="Перейти на страницу «{index_page_favorites_goods.NAME}»">Подробнее</a> <a class="blgreen" onclick="$('#goodsListFormId{index_page_favorites_goods.MIN_PRICE_NOW_ID}').submit(); return false;" href="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}?hash={HASH | url_amp}&form%5Bgoods_from%5D={index_page_favorites_goods.GOODS_FROM}&form%5Bgoods_mod_id%5D={index_page_favorites_goods.MIN_PRICE_NOW_ID}" title="Положить «{index_page_favorites_goods.NAME}» в корзину">Купить</a> </div> </form> {% ENDIF %} {% IF index_page_favorites_goods.MAX_REST_VALUE=0 %}<a href="{index_page_favorites_goods.URL}" class="whtgreen" title="Перейти на страницу «{index_page_favorites_goods.NAME}»">Подробнее</a>{% ENDIF %} </div> </div> </li> {% ENDFOR %} </ul> </div> <a class="buttons next" href="#">></a> </div> {% ENDIF %}
В конец main.css вставьте:
/* Tiny Carousel */ .carousel { height: 1%; overflow: hidden; padding: 0 0 10px; } .carousel .viewport { float: left; width: 240px; height: 125px; overflow: hidden; position: relative; } .carousel .buttons { background: #C01313; border-radius: 35px; display: block; margin: 30px 10px 0 0; float: left; width: 35px; height: 35px; position: relative; color: #fff; font-weight: bold; text-align: center; line-height: 35px; text-decoration: none; font-size: 22px; } .carousel .next { margin: 30px 0 0 10px; } .carousel .buttons:hover { color: #C01313; background: #fff; } .carousel .disable { visibility: hidden; } .carousel .overview { list-style: none; position: absolute; padding: 0; margin: 0; width: 240px; left: 0; top: 0; } .carousel .overview li { float: left; margin: 0 20px 0 0; padding: 1px; height: 121px; border: 1px solid #dcdcdc; width: 236px; }
в конце main.js вставьте:
$(document).ready(function() { $('#slider1').tinycarousel(); $('#slider2').tinycarousel(); $('#slider3').tinycarousel(); });
После изменений останется подкорректировать стили для корректного отображения, а в целом карусель появится и будет работать.
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных