MG 2.1 Expand Navigation Panel

[dds115]

Is there a way to have my media categories always expanded so a user doesn't have to click the categories to see the sub-categories? Thanks for any help!

 

[dds115]

Bump! Any help is greatly appreciated, even if the answer is that it isn't possible.

 

[Nulumia]

Bump! Any help is greatly appreciated, even if the answer is that it isn't possible.

I've had this added into my theme framework for some time - let me grab the code and will post back.

 

[dds115]

I've had this added into my theme framework for some time - let me grab the code and will post back.

I'd appreciate that, thank you @whitesky !!

 

[Nulumia]

Doing this with Jquery, so less customized templates to have to maintain

Add this to to either PAGE_CONTAINER template before the closing </head> tag, or to the bottom of helper_js_global before the closing </xf:macro> tag to have it show up everywhere (Resource category lists, etc):

<xf:js>
    $(".categoryList-toggler, .toggleTarget").each(function() {
        $(this).addClass("is-active");
    });
</xf:js>

If you want it to auto-expand XFMG category lists only, you could add it to xfmg_media_index and xfmg_category_container.

You can also create a custom Style Property to control whether the groups start expanded or not. To do so, enable designer mode and create a custom value/boolean Style Property, say in XFMG: Appearance. After creating the property, change the code earlier to the following:

<xf:if is="property('myCategoryToggleProperty')">
    <xf:js>
        $(".categoryList-toggler, .toggleTarget").each(function() {
            $(this).addClass("is-active");
        });
    </xf:js>
</xf:if>

Then just change the name of the property above (myCategoryToggleProperty) to the one you created.

Let me know if this works for you!

 

[dds115]

Doing this with Jquery, so less customized templates to have to maintain

Add this to to either PAGE_CONTAINER template before the closing </head> tag, or to the bottom of helper_js_global before the closing </xf:macro> tag to have it show up everywhere (Resource category lists, etc):

<xf:js>
    $(".categoryList-toggler, .toggleTarget").each(function() {
        $(this).addClass("is-active");
    });
</xf:js>

If you want it to auto-expand XFMG category lists only, you could add it to xfmg_media_index and xfmg_category_container.

You can also create a custom Style Property to control whether the groups start expanded or not. To do so, enable designer mode and create a custom value/boolean Style Property, say in XFMG: Appearance. After creating the property, change the code earlier to the following:

<xf:if is="property('myCategoryToggleProperty')">
    <xf:js>
        $(".categoryList-toggler, .toggleTarget").each(function() {
            $(this).addClass("is-active");
        });
    </xf:js>
</xf:if>

Then just change the name of the property above (myCategoryToggleProperty) to the one you created.

Let me know if this works for you!

I'll give it a try in the morning and let you know, thank you for helping me!

 

[Nulumia]

I'll give it a try in the morning and let you know, thank you for helping me!

No problem!

 

[dds115]

No problem!

That worked! I really appreciate your help, I'm going to go check out the resources you have out there and see if anything is of interest to purchase. Great community we have here!

 

[dds115]

No problem!

Sorry for another question, but when I click a media category or sub category all of the categories minimize again. When I just got to the media gallery it works as I had hoped. Is there a way to keep them always expanded even when in a category or sub category? I used the first code you posted into xfmg_media_index and xfmg_category_container , if that helps.

 

[BassMan]

There is also another approach by editing the template (or use Template modifications).

Is there a way to keep them always expanded even when in a category or sub category?

In xfmg_category_list_macros:

FIND:
<ol class="categoryList toggleTarget{{ $isActive ? ' is-active' : '' }}">

REPLACE:
<ol class="categoryList toggleTarget is-active">

---

FIND:
<a class="categoryList-toggler{{ $isActive ? ' is-active' : '' }}"

REPLACE:
<a class="categoryList-toggler is-active"

 

[dds115]

There is also another approach by editing the template (or use Template modifications).



In xfmg_category_list_macros:

FIND:
<ol class="categoryList toggleTarget{{ $isActive ? ' is-active' : '' }}">

REPLACE:
<ol class="categoryList toggleTarget is-active">

---

FIND:
<a class="categoryList-toggler{{ $isActive ? ' is-active' : '' }}"

REPLACE:
<a class="categoryList-toggler is-active"

I appreciate it it, that worked, thank you very much!

 

[Twincam]

This is useful, we have very long category names at the bottom level so in the navigation pane they get truncated to the point they are of no use. The plan is to stop the lowest level category from opening in the navigation pane so people look at the full category names list above the child category images. It would be best to remove the toggle at that level but preventing it from opening would do.

 

[Twincam]

I've sorted it so that it no longer shows the toggle at category level 2 and doesn't show the level three categories in the navigation pane. Level three etc. categories are listed above the images and can be selected there.