XF 2.2 Move thread filter options outside of dropdown menu

tomnjerry74

Member
In forum_view, I'm trying to remove the drop-down menu aspect of the thread filters and instead display the contents of the drop-down at all times.

1650916263835.png


The code for the filter menu is referenced in the "forum_view" template, but I'm not sure how to make it not a drop-down.

HTML:
<a class="filterBar-menuTrigger" data-xf-click="menu" role="button" tabindex="0" aria-expanded="false" aria-haspopup="true">{{ phrase('filters') }}</a>
                    <div class="menu menu--wide" data-menu="menu" aria-hidden="true"
                        data-href="{{ link('forums/filters', $forum, $filters) }}"
                        data-load-target=".js-filterMenuBody">
                        <div class="menu-content">
                            <h4 class="menu-header">{{ phrase('show_only:') }}</h4>
                            <div class="js-filterMenuBody">
                                <div class="menu-row">{{ phrase('loading...') }}</div>
                            </div>
                        </div>
                    </div>
 
Solution
Found a workaround in forum_filters by replacing
HTML:
<xf:foreach loop="$sortOptions" key="$sortKey" value="$null">
                    <xf:option value="{$sortKey}">{{ phrase_dynamic('forum_sort.' . $sortKey) }}</xf:option>
                </xf:foreach>
with custom options. Now they populate just like the other menus. 🤷‍♂️

tomnjerry74

Member
The problem is any time I include the forum_filters template elswhere in forum_view like so:
HTML:
<xf:include template="forum_filters" />
The "Sort By" dropdown doesn't populate and is blank. The other menus still function properly though.

Does anyone know how to do this correctly?
 

tomnjerry74

Member
Found a workaround in forum_filters by replacing
HTML:
<xf:foreach loop="$sortOptions" key="$sortKey" value="$null">
                    <xf:option value="{$sortKey}">{{ phrase_dynamic('forum_sort.' . $sortKey) }}</xf:option>
                </xf:foreach>
with custom options. Now they populate just like the other menus. 🤷‍♂️
 
Solution

CavySpirit

Member
Could you possibly include a screenshot of what your results look like? The finished version. I want to make the filters more prevalent and am not sure how I want it to look yet. Thanks!! ❤️
 

tomnjerry74

Member
Could you possibly include a screenshot of what your results look like? The finished version. I want to make the filters more prevalent and am not sure how I want it to look yet. Thanks!! ❤️

Sure. It's a very stripped-down, simplistic setup inspired by Reddit. I've only kept two drop-downs and they're located just above the quickthread title bar in place of the original "Filters" button.

1651159293352.png
1651159317626.png
1651159333574.png
 
Last edited:
Top