Admin UI: how to autoexpand accordion sections

[gwideman]

Hi folks,

In Magento CE 2.1.2 many of the admin pages have settings collapsed into accordion sections. Clicking to open all of those sections to find settings (since they are reorganized compared to 2.0 apparently and the book I'm reading) is driving me insane.

Is there either some alternate admin theme that just shows all the settings, or at least some way to auto-open all the accordion sections?

Thanks, Graham

[Gabriel Guarino]

Hi @gwideman,

Short answer:

You can customize the Magento 2 admin panel to auto-expand all sections as soon as the page is loaded. Here is a snippet I created for you to expand all sections:

jQuery('.admin__collapsible-block a').each(function()
{
     jQuery(this).click();
});

Long answer:
It is great that people like you think about improvements for Magento 2. Those are very welcomed and the Magento team is always encouraging the community to implement the ideas that we have if we really believe that could improve Magento as platform.

For example, @sherrie shared a lot of great projects from the Magento community in Meet Magento Argentina and Meet Magento Spain this month.
Here you can see the slides from her presentation:
http://www.slideshare.net/SherrieRohde/how-to-get-involved-in-the-magento-community-mm16es

Here is an example from one of the slides:

https://github.com/SnowdogApps/magento2-theme-blank-sass

SnowdogApps implemented the Magento blank theme using SASS and share that with the community in Github.

Since there is no alternative theme for the Magento admin panel, it could be a good idea for you to implement your improvements in a Github project, and the community could give you feedback and collaboration through Github.

Also, if you have feature requests and improvements for Magento 2, you can post that in the Magento Forums as well:

https://community.magento.com/t5/Magento-2-Feature-Requests-and/idb-p/feature-requests

Best regards.
Gabriel

[gwideman]

Hi Gabriel,

Thanks for your answer.  I can see that the snippet of Javascript that you posted might well be the kind of thing that would expand sections.  Obviously one would need to put that JS somewhere so that it gets loaded and activated after page load.

As a new user of Magento 2 who is just trying to find my way around the admin interface using the sample data and various docs, I am nowhere close to understanding enough about the many layers of Magento architecture to even take a guess as to where this code should go.   Perhaps you could give a hint?

Thanks,   Graham

[Gabriel Guarino]

Hi @gwideman,

I understand your point. Javascript (Require JS) is one of the most challenging concepts from Magento 2.

I recommend you to watch the following presentation about Javascript in Magento 2:

Best regards.

Gabriel

[gwideman]

@Gabriel Guarino  I don't think we're making much progress here.  In your first reply you mentioned "You can customize the Magento 2 admin panel" and offered some code. I then asked "where would that code go". You next pointed me to a video about Javascript in general in M2.  I am not really any closer to being able to ascertain where your suggested code would go.

Graham

[Gabriel Guarino]

Hi @gwideman,

In the first response I gave the exact code you should use to auto-expand the accordion sections.

In the second response, I told you the best path to learn how to include that code.

The reality is that if you want to start customizing Magento, you have to learn how to do it. If not, you are going to make critical mistakes, specially when it comes to Javascript in Magento 2.

That being said, I recommend you to read the official Magento 2 documentation, specifically the section related to including JS in Magento 2:

http://devdocs.magento.com/guides/v2.0/javascript-dev-guide/javascript/js_init.html

Best regards.

Gabriel

[gwideman]

Hi @Gabriel Guarino,

My original post, in the Admin & Config forum, asks about solving an end-user issue: auto-collapsing of accordions, using some admin or config setting somewhere.  In order to be able to use Magento more effectively. 

I guess your answer comes down to: "yes, if you get fully up to speed on Magento development and rewrite the bit you don't like".

Which, for a person who just wants to use Magento, and has no plan to change profession to "Magento developer", is the same as "no".

Thanks.

[Gabriel Guarino]

Hi Graham,


Sorry, I thought you were a developer.

As you said, the answer is "no" since that feature is not included by
default in Magento 2 and it would take a developer to customize your store
in order to add that feature.


Best regards.
Gabriel

[gwideman]

---

@Gabriel Guarino wrote:
Hi Graham,  Sorry, I thought you were a developer.

---

Yes, I am a developer. In several domains unrelated to Magento. Hence not wanting to take a detour.

For those who might like to explore an easier path, here's how to implement the function in the browser, for example in  Tampermonkey or Greasemonkey.  the following is for Tampermonkey, and the JavaScript part would be the same for Greasemonkey.

// ==UserScript==
// @name         Magento 2 Admin expand accordions
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Magento 2 Admin expand accordions
// @author       Graham
// @match        http://your.domain.com/back_end/admin/*/*
// @require      http://code.jquery.com/jquery-latest.js
// ==/UserScript==

$(document).ready(function() {
  $('fieldset.admin__collapsible-block[style*="display: none"]').each(function()
    {
      // $(this).css("border", "solid red");
      // $(this).prev().prev().css("border", "solid green");
      $(this).prev().prev().children("a").click();

    });
  }
);

I left in some commented-out lines that are useful for troubleshooting. 

The code is slightly more complicated than Gabriel posted earlier in this thread. That's because we don't want to click on every accordion section, we just want to click on the ones that are closed.  It turns out that, for at least some of the sections, Magento remembers whether you left it open last time, and reproduces that when you revisit the page.  At least, I think that's what it's trying to do, it seemed a bit hit-or-miss to me.  The method for finding the element to click upon works, but it's probably not super robust against changes in theme or updates.

Note you can turn this auto-open feature on or off easily by enabling/disabling the script in Tampermonkey's userscript list. 

Graham