How to change styling of Joomla Collapsible Sidebar in Backend?

Question

I have created sidebar for my custom component by using the documentation -

How do I apply JHtmlSidebar to add a sidebar to my admin view?

I have to add some styling to the Joomla Collapsible Sidebar in admin side. I have searched but nothing found related to this.

As you can see in the image(this is just an example), Now I need to add some styling or change the design/layout of the sidebar.

How to change the styling/layout of the collapsible sidebar?

Also is it possible without hacking core?

Answer 1

Well, as per my answer from the link you provided, you'll need to add the following to your default.php:

<div id="j-sidebar-container" class="span2">
    <?php echo $this->sidebar; ?>
</div>

So you can simply add an extra class after span2, for example:

<div id="j-sidebar-container" class="span2 mySidebar">

Then apply your own custom styling. For example

.mySidebar a {
     color: #FF0
}

if it's structural changes you need to make or adding your own classes inside of the sidebar, you'll need to make a Layout Override for the following file:

ROOT/layouts/joomla/sidebars/submenu.php

Be sure that you override is and do not edit it directly, as this will apply your changes for every extension that calls the Submenu layout.