Пагинация Товаров На Странице Каталога
#21
Отправлено 01 Май 2012 - 00:00
#22
Отправлено 02 Май 2012 - 11:44
katteee (27 Апрель 2012 - 02:17) писал:
Вы спрашивали про пагинацию, я сбросил её код. Целиком код той менюшки выглядел так:
<!-- Верхний блок, изменяющий отображение данных выдачи товаров --> <div class="toolbar"> <form action="" class="OrderFilterForm"> <!-- Список фильтров, которые сейчас действуют на результаты поиска --> {% FOR goods_filters %} <input type="hidden" name="{goods_filters.NAME}" value="{goods_filters.VALUE}" /> {% ENDFOR %} <!-- Блок возможности изменения лимитов выдачи --> <div class="pager"> <p class="amount"> <strong>{GOODS_PAGES_RESULTS} товар{GOODS_PAGES_RESULTS | gen_word_end("","а","ов")} в категории</strong> </p> <div class="limiter"> <label>Показывать по:</label> <select name="per_page" onchange="this.form.submit();"> {% FOR goods_per_page_list %} <option value="{goods_per_page_list.LIMIT}" {% IF goods_per_page_list.SELECTED %}selected="selected"{% ENDIF %}>{goods_per_page_list.LIMIT}</option> {% ENDFOR %} </select> <label>результатов</label> </div> <!-- Страницы --> {% IF show_pages %} <div class="pages"> <strong>Страница:</strong> <ol> {% IF GOODS_PAGES_SHOW_PREVIOUS %} <li> <a class="previous_page" href="{GOODS_PAGINATE_URL | url_amp}&page={GOODS_PAGES_PREVIOUS}" title="Предыдущая страница (← + Ctrl)"> <img src="{ASSETS_IMAGES_PATH}i_pager-prev.gif" alt="Предыдущая" /> </a> </li> {% ENDIF %} {% FOR goods_pages %} {% IF goods_pages.CURRENT %} <li class="current">{goods_pages.PAGE}</li> {% ELSE %} <li><a href="{GOODS_PAGINATE_URL | url_amp}&page={goods_pages.PAGE}">{goods_pages.PAGE}</a></li> {% ENDIF %} {% ENDFOR %} {% IF GOODS_PAGES_SHOW_NEXT %} <li> <a class="next_page" href="{GOODS_PAGINATE_URL | url_amp}&page={GOODS_PAGES_NEXT}" title="Следующая страница (Ctrl + →)"> <img src="{ASSETS_IMAGES_PATH}i_pager-next.gif" alt="Следующая" /> </a> </li> {% ENDIF %} </ol> </div> {% ENDIF %} <!-- /Страницы --> </div> <!-- /Блок возможности изменения лимитов выдачи --> <!-- Блок изменения вида списка и поля сортировки --> <div class="sorter"> <p class="view-mode"> <label>Вид:</label> {% IF GOODS_VIEW_TYPE=2 %} <strong title="Список товаров категории «{% IF CATEGORY_NAME=Каталог товаров %}Каталог товаров{% ELSE %}{CATEGORY_NAME}{% ENDIF %}» сейчас отображается в виде таблицы, по 3 товара на строку">Таблица</strong> <a href="?goods_view_type=1" title="Отображать список товаров в виде списка">Список</a> {% ELSE %} <a href="?goods_view_type=2" title="Отображать список товаров в виде таблицы с 3-мя товарами на одну строку">Таблица</a> <strong title="Список товаров категории «{% IF CATEGORY_NAME=Каталог товаров %}Каталог товаров{% ELSE %}{CATEGORY_NAME}{% ENDIF %}» сейчас отображается в виде списка, где один товар занимает одну строку">Список</strong> {% ENDIF %} </p> <div class="sort-by"> <ul class="OrderFilterFormByURLs"> <!-- цене: Дорогие - Дешевые --> {% IF GOODS_SEARCH_FIELD_ID=1 %} <li class="selected-desc"><a href="?goods_search_field_id=2" title="Товары сейчас отсортированы по цене. Вверху дорогие внизу дешевые. Нажмите ещё раз, если хотите чтобы сортировка товаров производилась наоборот, сначала дешевые, затем дорогие">цене</a></li> <!-- цене: Дешевые - Дорогие --> {% ELSEIF GOODS_SEARCH_FIELD_ID=2 %} <li class="selected-asc"><a href="?goods_search_field_id=1" title="Товары сейчас отсортированы по цене. Вверху дешевые внизу дорогие. Нажмите ещё раз, если хотите чтобы сортировка товаров производилась наоборот, сначала дорогие, затем дешёвые">цене</a></li> <!-- Сортировка отключена --> {% ELSE %} <li><a href="?goods_search_field_id=2" title="Отсортировать товары по убыванию цены. Сверху дорогие, снизу дешевые">цене</a></li> {% ENDIF %} <!-- названию: А - я --> {% IF GOODS_SEARCH_FIELD_ID=3 %} <li class="selected-asc"><a href="?goods_search_field_id=4" title="Товары сейчас отсортированы по алфавиту. Сверху «а», снизу «Я». Нажмите ещё раз, если хотите чтобы сортировка товаров производилась наоборот, сначала «Я», затем «а»">названию</a></li> <!-- названию: я - А --> {% ELSEIF GOODS_SEARCH_FIELD_ID=4 %} <li class="selected-desc"><a href="?goods_search_field_id=3" title="Товары сейчас отсортированы по алфавиту. Сверху «Я», снизу «а». Нажмите ещё раз, если хотите чтобы сортировка товаров производилась наоборот, сначала «а», затем «Я»">названию</a></li> <!-- Сортировка отключена --> {% ELSE %} <li><a href="?goods_search_field_id=3" title="Отсортировать товары по алфавиту. Сверху «а», снизу «Я»">названию</a></li> {% ENDIF %} <!-- рейтингу: Хорошие - Плохие --> {% IF GOODS_SEARCH_FIELD_ID=11 %} <li class="selected-desc"><a href="?goods_search_field_id=12" title="Товары сейчас отсортированы по рейтингу отзывов покупателей. Сверху хорошие товары, снизу плохие. Нажмите ещё раз, если хотите чтобы сортировка товаров производилась наоборот, сначала плохие, затем хорошие">рейтингу</a></li> <!-- рейтингу: Плохие - Хорошие --> {% ELSEIF GOODS_SEARCH_FIELD_ID=12 %} <li class="selected-asc"><a href="?goods_search_field_id=11" title="Товары сейчас отсортированы по рейтингу отзывов покупателей. Сверху плохие товары, снизу хорошие. Нажмите ещё раз, если хотите чтобы сортировка товаров производилась наоборот, сначала хорошие, затем плохие">рейтингу</a></li> <!-- Сортировка отключена --> {% ELSE %} <li><a href="?goods_search_field_id=11" title="Отсортировать товары по рейтингу отзывов покупателей. Сверху хорошие товары, снизу плохие">рейтингу</a></li> {% ENDIF %} </ul> <label>Сортировать по:</label> </div> </div> <!-- /Блок изменения вида списка и поля сортировки --> </form> </div> <!-- /Верхний блок, изменяющий отображение данных выдачи товаров -->
Стили были следующие:
/* Toolbar */ .toolbar {border:1px solid #EAEAEA; padding:8px 10px 9px;} .toolbar .pager {} .toolbar .sorter {} .toolbar-bottom {} /* Pager */ .pager { padding:0 0px 9px 0; margin:0; text-align:center; border-bottom:1px solid #EAEAEA; } .pager .amount { float:left; vertical-align:middle;} .pager .limiter { float:right; vertical-align:middle;} .pager .limiter label { vertical-align:middle;} .pager .limiter select{margin:0 4px 0 4px;vertical-align:middle; width:50px;} .pages { margin:0 135px; vertical-align:middle;} .pages strong {vertical-align:middle;padding-right:3px;} .pages ol { display:inline; } .pages li { display:inline; vertical-align:middle;} .pages li a{} .pages li a img {vertical-align:middle;padding-bottoM:2px;} .pages .current {color:#000;font-weight:bold;} /* Sorter */ .sorter { padding:8px 0 0 0;height:15px; margin:0; } .sorter .view-mode { float:left;padding-right:10px; } .sorter .view-mode a{} .sorter .view-mode strong{color:#000;} .sorter .sort-by { float:right; } .sorter .sort-by label { float:right; } .sorter .link-feed {}
Эти стили написаны для другого шаблона, они могут не подойти под тот, который Вы вставляете. Далее изображения - стрелочки:
#23
Отправлено 02 Май 2012 - 12:10
собственно с этого я и начала общение в этом топе. То есть я просто получается потратила даром свое время????
#24
Отправлено 02 Май 2012 - 21:21
#25
Отправлено 03 Май 2012 - 07:57
Vaccina (02 Май 2012 - 21:21) писал:
Я и начала данный топ, с того, что вставила данный код (для шаблона мокко, по-моемому) и спросила как сделать, чтобы он работал на моем сайте. Вы меня уже проконсультировали уже на эту тему.
Давайте попробуем теперь подставить стили и блоки для моего шаблона, чтобы уж не возвращаться назад, вот эти я вставила сейчас в main.css к доработанному перед этим Вами коду и они соответственно не работают:
/* Toolbar */ .toolbar {border:1px solid #EAEAEA; padding:8px 10px 9px;} .toolbar .pager {} .toolbar .sorter {} .toolbar-bottom {} /* Pager */ .pager { padding:0 0px 9px 0; margin:0; text-align:center; border-bottom:1px solid #EAEAEA; } .pager .amount { float:left; vertical-align:middle;} .pager .limiter { float:right; vertical-align:middle;} .pager .limiter label { vertical-align:middle;} .pager .limiter select{margin:0 4px 0 4px;vertical-align:middle; width:50px;} .pages { margin:0 135px; vertical-align:middle;} .pages strong {vertical-align:middle;padding-right:3px;} .pages ol { display:inline; } .pages li { display:inline; vertical-align:middle;} .pages li a{} .pages li a img {vertical-align:middle;padding-bottoM:2px;} .pages .current {color:#000;font-weight:bold;} /* Sorter */ .sorter { padding:8px 0 0 0;height:15px; margin:0; } .sorter .view-mode { float:left;padding-right:10px; } .sorter .view-mode a{} .sorter .view-mode strong{color:#000;} .sorter .sort-by { float:right; } .sorter .sort-by label { float:right; } .sorter .link-feed {}
выше на скрине, я привела пример того, что мне нужно увидетьна сайте, то есть те части пагинации, которые на скрине отмечены синими стрелочками.
Что необходимо теперь еще добавить и изменить?
#26
Отправлено 03 Май 2012 - 20:04
После необходимо будет подправить стили которые вы вставили из того же сообщения http://forum.storela...dpost__p__20306
#27
Отправлено 04 Май 2012 - 02:46
Vaccina (03 Май 2012 - 20:04) писал:
После необходимо будет подправить стили которые вы вставили из того же сообщения http://forum.storela...dpost__p__20306
Что теперь необходимо подправить?
#28
Отправлено 06 Май 2012 - 08:55
.pager .amount { float: left; vertical-align: middle; }замените на
.pager .amount { float: left; vertical-align: middle; margin: 0; }
далее найти
.sorter .view-mode { float: left; padding-right: 10px; }
заменить на
.sorter .view-mode { float: left; padding-right: 10px; margin: 0; }
далее добавить
.OrderFilterFormByURLs { float: right; }
далее добавить
.sorter .sort-by li { float: left; padding: 0 10px; }
далее найти
.toolbar { border: 1px solid #EAEAEA; padding: 8px 10px 9px; }
заменить на
.toolbar { border: 1px solid #EAEAEA; padding: 8px 10px 9px; margin: 30px 0; }
далее вам необходимо загрузить изображения i_pager-prev.gif и i_pager-next.gif
#30
Отправлено 10 Май 2012 - 17:28
#31
Отправлено 15 Май 2012 - 00:49
Vaccina (10 Май 2012 - 17:28) писал:
не нашла.
#32
Отправлено 15 Май 2012 - 21:03
#34
Отправлено 24 Январь 2013 - 12:47
Нужен код для МОККО...
Если все-таки для МОККО, то куда его вставить? Не могу найти похожего кода в Товарах...
Спасибо))) за ответ заранее!
#35
Отправлено 24 Январь 2013 - 14:24
#36
Отправлено 24 Январь 2013 - 14:50
#37
Отправлено 25 Январь 2013 - 01:44
Что касается стилей в main.css, то если вы какой-то стиль найти не можете в вашем файле стилей, то просто вставляйте стиль на который необходимо было произвести замену.
#38
Отправлено 17 Июль 2014 - 11:36
Заранее весьма благодарен.
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных