[英]magento 2 expand layered navigation
In Magento 2.0, the default has the layered navigation all collapsed except for the first filter, which is Prices for me. 在Magento 2.0中,默认设置是分层导航全部折叠,除了第一个过滤器(对我来说是价格)。 How do I expand all the filters so that each filter option is visible in all filter categories?
如何展开所有过滤器,以便每个过滤器选项在所有过滤器类别中可见?
I see in the code there's aria-expanded="false" and in the HTML somewhere there is class="filter-options-content" with style="display: none;" 我在代码中看到aria-expanded =“ false”,在HTML的某个地方有class =“ filter-options-content”和style =“ display:none;”。
Anyone know where to edit this? 有人知道在哪里编辑吗?
If you are using the Luma theme and want to do this make sure to create your own theme as a child of the Luma theme. 如果您正在使用Luma主题并且要执行此操作,请确保创建自己的主题作为Luma主题的子主题。 You can find more information on that here ( https://community.magento.com/t5/Theming-Layout-Design-Questions/How-to-create-a-Child-Theme-in-Magento-2/mp/33314#M384 )
您可以在此处找到更多信息( https://community.magento.com/t5/Theming-Layout-Design-Questions/How-to-create-a-Child-Theme-in-Magento-2/mp/33314 #M384 )
Then, copy the file located at "vendor\\magento\\theme-frontend-luma\\Magento_LayeredNavigation\\templates\\layer\\view.phtml" into the appropriate area in your child theme. 然后,将位于“ vendor \\ magento \\ theme-frontend-luma \\ Magento_LayeredNavigation \\ templates \\ layer \\ view.phtml”中的文件复制到子主题的相应区域。
You need to change the data-mage-init attribute and the "active" property to be in a format that specifies which filters to open by their index. 您需要将data-mage-init属性和“ active”属性更改为指定通过其索引打开哪些过滤器的格式。 I have 6 filters, so I want that property to read "0 1 2 3 4 5".
我有6个过滤器,所以我希望该属性读取为“ 0 1 2 3 4 5”。
I made a couple of changes between lines 30-45 and it looks like this: 我在第30-45行之间进行了几处更改,如下所示:
<?php $wrapOptions = false; ?>
<?php
$filters = $block->getFilters();
$active_filters_str = implode(' ', range(0, count($filters)-1));
?>
<?php foreach ($filters as $filter): ?>
<?php if ($filter->getItemsCount()): ?>
<?php if (!$wrapOptions): ?>
<div class="filter-options" id="narrow-by-list" data-role="content" data-mage-init='{"accordion":{"openedState": "active", "collapsible": true, "active": "<?php echo $active_filters_str ?>", "multipleCollapsible": true}}'>
<?php $wrapOptions = true; endif; ?>
<div data-role="collapsible" class="filter-options-item">
<div data-role="title" class="filter-options-title"><?php /* @escapeNotVerified */ echo __($filter->getName()) ?></div>
<div data-role="content" class="filter-options-content"><?php /* @escapeNotVerified */ echo $block->getChildBlock('renderer')->render($filter); ?></div>
</div>
<?php endif; ?>
<?php endforeach; ?>
First, make sure to get all of the filters in a variable with "$filters = $block->getFilters();". 首先,确保使用“ $ filters = $ block-> getFilters();”将所有过滤器获取到变量中。 Then, create a string for the active property listing them out by index using the "$active_filters_str = implode(' ', range(0, count($filters)-1));"
然后,使用“ $ active_filters_str = implode('',range(0,count($ filters)-1));为活动属性创建一个字符串,按索引列出它们 Then echo this next to the active property in the mage-init attribute.
然后在mage-init属性中的active属性旁边回显此内容。
Hope this helps :) 希望这可以帮助 :)
https://magento.stackexchange.com/questions/102259/open-category-filters-by-default-in-magento-2 https://magento.stackexchange.com/questions/102259/open-category-filters-by-default-in-magento-2
vendor\\magento\\theme-frontend-luma\\Magento_LayeredNavigation\\templates\\layer\\view.phtml vendor \\ magento \\ theme-frontend-luma \\ Magento_LayeredNavigation \\ templates \\ layer \\ view.phtml
<?php foreach ($block->getFilters() as $filter): ?>
<?php if ($filter->getItemsCount()): ?>
<?php if (!$wrapOptions): ?>
<?php $collapsibleRange = implode(' ', range(0, $filter->getItemsCount())); ?>
<strong role="heading" aria-level="2" class="block-subtitle filter-subtitle"><?php /* @escapeNotVerified */ echo __('Shopping Options') ?></strong>
<div class="filter-options" id="narrow-by-list" data-role="content" data-mage-init='{"accordion":{"openedState": "active", "collapsible": true, "active": "<?php echo $collapsibleRange ?>", "multipleCollapsible": true}}'>
<?php $wrapOptions = true; endif; ?>
<div data-role="collapsible" class="filter-options-item">
<div data-role="title" class="filter-options-title"><?php /* @escapeNotVerified */ echo __($filter->getName()) ?></div>
<div data-role="content" class="filter-options-content"><?php /* @escapeNotVerified */ echo $block->getChildBlock('renderer')->render($filter); ?></div>
</div>
<?php endif; ?>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.