Настройка Фильтров
#1
Отправлено 19 Сентябрь 2017 - 21:52
подскажите, пожалуйста, как можно настроить фильтры для вывода товаров в категориях при следующих условиях:
1. Фильтр "СОРТИРОВАТЬ ПО:" - изображению: есть - нет. Этот фильтр будет определяющим по умолчанию всегда
2. Сначала должны идти товары, которые есть в наличии, а последними должны идти товары, которых в наличии нет.
3. Добавить чекбокс "Показать только товары в наличии" https://prnt.sc/gn68xz
#2
Отправлено 20 Сентябрь 2017 - 07:36
Зайдите в раздел Настройки - Основные - выберите необходимый параметр для сортировки по умолчанию.
Для добавления фильтра по наличию товара зайдите в раздел Сайт - Редактор шаблонов - Товары - найдите:
<!-- Фильтры по свойствам товарных модификаций (Например: Цвет, размер, модификация) --> {% FOR filter_prop_list %} <div class="filter"> {filter_prop_list.NAME}:<br /> <select class="inputText" onchange="$(this).attr('name', $(this).find('option:selected').attr('value') == -1 ? '' : $(this).find('option:selected').attr('rel'));this.form.submit();" name="{% FOR values %}{% IF filter_prop_list.values.CHECKED %}form[filter][prop][{filter_prop_list.ID}][{filter_prop_list.values.ID}]{% ENDIF %}{% ENDFOR %}"> <option> - все - </option> {% FOR values %} <option value="1" rel="form[filter][prop][{filter_prop_list.ID}][{filter_prop_list.values.ID}]" {% IF filter_prop_list.values.CHECKED %}selected="selected"{% ENDIF %} {% IF filter_prop_list.values.CHECKED %}checked="checked"{% ELSEIF filter_prop_list.values.NB_GOODS_FILTERED=0 %}disabled="disabled"{% ENDIF %}>{filter_prop_list.values.VALUE}</option> {% ENDFOR %} </select> </div> {% ENDFOR %}
после него вставьте:
<!-- Если есть возможность фильтрации товаров по наличию --> {% IF SHOW_GOODS_REST_FILTER %} <div class="filter"> <div class="contentTbodySearchRestFilterBlock cornerAll"> <input class="valignMiddle" id="filter_only_with_rest" type="checkbox" name="form[filter_only_with_rest]" {% IF FORM_FILTER_ONLY_WITH_REST %}checked="checked"{% ENDIF %} value="1" onclick="this.form.submit();" /><label class="valignMiddle" for="filter_only_with_rest">Только в наличии</label> </div> </div> {% ENDIF %} <!-- END Если есть возможность фильтрации товаров по наличию -->
#3
Отправлено 20 Сентябрь 2017 - 21:23
Vaccina (20 Сентябрь 2017 - 07:36) писал:
Зайдите в раздел Настройки - Основные - выберите необходимый параметр для сортировки по умолчанию.
Для добавления фильтра по наличию товара зайдите в раздел Сайт - Редактор шаблонов - Товары - найдите:
<!-- Фильтры по свойствам товарных модификаций (Например: Цвет, размер, модификация) --> {% FOR filter_prop_list %} <div class="filter"> {filter_prop_list.NAME}:<br /> <select class="inputText" onchange="$(this).attr('name', $(this).find('option:selected').attr('value') == -1 ? '' : $(this).find('option:selected').attr('rel'));this.form.submit();" name="{% FOR values %}{% IF filter_prop_list.values.CHECKED %}form[filter][prop][{filter_prop_list.ID}][{filter_prop_list.values.ID}]{% ENDIF %}{% ENDFOR %}"> <option> - все - </option> {% FOR values %} <option value="1" rel="form[filter][prop][{filter_prop_list.ID}][{filter_prop_list.values.ID}]" {% IF filter_prop_list.values.CHECKED %}selected="selected"{% ENDIF %} {% IF filter_prop_list.values.CHECKED %}checked="checked"{% ELSEIF filter_prop_list.values.NB_GOODS_FILTERED=0 %}disabled="disabled"{% ENDIF %}>{filter_prop_list.values.VALUE}</option> {% ENDFOR %} </select> </div> {% ENDFOR %}
после него вставьте:
<!-- Если есть возможность фильтрации товаров по наличию --> {% IF SHOW_GOODS_REST_FILTER %} <div class="filter"> <div class="contentTbodySearchRestFilterBlock cornerAll"> <input class="valignMiddle" id="filter_only_with_rest" type="checkbox" name="form[filter_only_with_rest]" {% IF FORM_FILTER_ONLY_WITH_REST %}checked="checked"{% ENDIF %} value="1" onclick="this.form.submit();" /><label class="valignMiddle" for="filter_only_with_rest">Только в наличии</label> </div> </div> {% ENDIF %} <!-- END Если есть возможность фильтрации товаров по наличию -->
Вставила код, именно то, что я хотела спасибо большое. А где можно отрегулировать размер шрифта и может быть увеличить размер самого чекбокса? сделать шрифт жирным, чтобы была заметная надпись
и вывести его новой строкой
#4
Отправлено 21 Сентябрь 2017 - 09:41
.sort-by select, .show-by select {color: #808080;background-color: #fff;border: 1px solid #E5E5E5;height: 30px;line-height: 30px;margin: 0;padding: 0 5px;cursor: pointer;}
замените на:
.sort-by select, .show-by select {color: #808080;background-color: #fff;border: 1px solid #E5E5E5;height: 35px;line-height: 35px;margin: 0;padding: 0 5px;cursor: pointer;} .sort-by select {color: #808080;background-color: #fff;border: 1px solid #E5E5E5;height: 35px;line-height: 35px;margin: 0;padding: 0 5px;cursor: pointer;font-weight:bold;font-size:14px;}
#5
Отправлено 21 Сентябрь 2017 - 21:55
metry (21 Сентябрь 2017 - 09:41) писал:
.sort-by select, .show-by select {color: #808080;background-color: #fff;border: 1px solid #E5E5E5;height: 30px;line-height: 30px;margin: 0;padding: 0 5px;cursor: pointer;}
замените на:
.sort-by select, .show-by select {color: #808080;background-color: #fff;border: 1px solid #E5E5E5;height: 35px;line-height: 35px;margin: 0;padding: 0 5px;cursor: pointer;} .sort-by select {color: #808080;background-color: #fff;border: 1px solid #E5E5E5;height: 35px;line-height: 35px;margin: 0;padding: 0 5px;cursor: pointer;font-weight:bold;font-size:14px;}
Изменения внесла но ничего не изменилось(((
#6
Отправлено 22 Сентябрь 2017 - 07:23
Зайдите в раздел Сайт - Редактор шаблонов - Товары - найдите:
<!-- Если есть возможность фильтрации товаров по наличию --> {% IF SHOW_GOODS_REST_FILTER %} <div class="filter"> <div class="contentTbodySearchRestFilterBlock cornerAll"> <input class="valignMiddle" id="filter_only_with_rest" type="checkbox" name="form[filter_only_with_rest]" {% IF FORM_FILTER_ONLY_WITH_REST %}checked="checked"{% ENDIF %} value="1" onclick="this.form.submit();" /><label class="valignMiddle" for="filter_only_with_rest">Только в наличии</label> </div> </div> {% ENDIF %} <!-- END Если есть возможность фильтрации товаров по наличию -->
замените на:
<!-- Если есть возможность фильтрации товаров по наличию --> {% IF SHOW_GOODS_REST_FILTER %} <div class="filter rest_filter"> <div class="contentTbodySearchRestFilterBlock cornerAll"> <input class="valignMiddle" id="filter_only_with_rest" type="checkbox" name="form[filter_only_with_rest]" {% IF FORM_FILTER_ONLY_WITH_REST %}checked="checked"{% ENDIF %} value="1" onclick="this.form.submit();" /><label class="valignMiddle" for="filter_only_with_rest">Только в наличии</label> </div> </div> {% ENDIF %} <!-- END Если есть возможность фильтрации товаров по наличию -->
Далее зайдите в main.css - найдите:
.filters-goods .filter ul {padding: 5px 0;} .filters-goods .filter ul li {padding: 5px 0;} .filters-goods .filter ul li input {vertical-align: middle;width: 15px;height: 12px;margin: 0;padding: 0;} .filters-goods .filter ul li label {vertical-align: middle;word-wrap: break-word;font-size: 13px;}
после него пропишите:
.filters-goods .rest_filter{clear: both;width: 100%; font-weight: bold;}
#7
Отправлено 22 Сентябрь 2017 - 21:04
Vaccina (22 Сентябрь 2017 - 07:23) писал:
Зайдите в раздел Сайт - Редактор шаблонов - Товары - найдите:
<!-- Если есть возможность фильтрации товаров по наличию --> {% IF SHOW_GOODS_REST_FILTER %} <div class="filter"> <div class="contentTbodySearchRestFilterBlock cornerAll"> <input class="valignMiddle" id="filter_only_with_rest" type="checkbox" name="form[filter_only_with_rest]" {% IF FORM_FILTER_ONLY_WITH_REST %}checked="checked"{% ENDIF %} value="1" onclick="this.form.submit();" /><label class="valignMiddle" for="filter_only_with_rest">Только в наличии</label> </div> </div> {% ENDIF %} <!-- END Если есть возможность фильтрации товаров по наличию -->
замените на:
<!-- Если есть возможность фильтрации товаров по наличию --> {% IF SHOW_GOODS_REST_FILTER %} <div class="filter rest_filter"> <div class="contentTbodySearchRestFilterBlock cornerAll"> <input class="valignMiddle" id="filter_only_with_rest" type="checkbox" name="form[filter_only_with_rest]" {% IF FORM_FILTER_ONLY_WITH_REST %}checked="checked"{% ENDIF %} value="1" onclick="this.form.submit();" /><label class="valignMiddle" for="filter_only_with_rest">Только в наличии</label> </div> </div> {% ENDIF %} <!-- END Если есть возможность фильтрации товаров по наличию -->
Далее зайдите в main.css - найдите:
.filters-goods .filter ul {padding: 5px 0;} .filters-goods .filter ul li {padding: 5px 0;} .filters-goods .filter ul li input {vertical-align: middle;width: 15px;height: 12px;margin: 0;padding: 0;} .filters-goods .filter ul li label {vertical-align: middle;word-wrap: break-word;font-size: 13px;}
после него пропишите:
.filters-goods .rest_filter{clear: both;width: 100%; font-weight: bold;}
К сожалению размер чекбокса не увеличился и сам текст тоже, но теперь он заметнее, т.к. шрифт стал жирнее)
#8
Отправлено 23 Сентябрь 2017 - 03:04
Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
.filters-goods .rest_filter{clear: both;width: 100%; font-weight: bold;}
после него пропишите:
.filters-goods .rest_filter div {transform:scale(1.3);margin-left: 40px;}
#9
Отправлено 23 Сентябрь 2017 - 11:14
Vaccina (23 Сентябрь 2017 - 03:04) писал:
Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
.filters-goods .rest_filter{clear: both;width: 100%; font-weight: bold;}
после него пропишите:
.filters-goods .rest_filter div {transform:scale(1.3);margin-left: 40px;}
Увеличить получилось, но только он съезжает( https://prnt.sc/gon9jl
#10
Отправлено 24 Сентябрь 2017 - 20:23
Ribka (23 Сентябрь 2017 - 11:14) писал:
В main.css найдите код
.filters-goods .rest_filter div {transform:scale(1.3);margin-left: 40px;}и замените его на
.filters-goods .rest_filter div {transform:scale(1.3);margin-left: 105px;}а после перенесите под строку
@media all and (min-width: 992px) {
#11
Отправлено 26 Сентябрь 2017 - 08:37
Danil (24 Сентябрь 2017 - 20:23) писал:
В main.css найдите код
.filters-goods .rest_filter div {transform:scale(1.3);margin-left: 40px;}и замените его на
.filters-goods .rest_filter div {transform:scale(1.3);margin-left: 105px;}а после перенесите под строку
@media all and (min-width: 992px) {
Спасибо, все получилось)
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных