How to enable custom admin theme in Magento 2

Question

I have followed the instructions here: How to create admin theme for Magento2

and here: How to change backend admin theme in Magento 2.0.7 +

and I still dont understand what I'm supposed to do to get my theme to show up in the backend. I have created my theme in app/design/adminhtml/Vendor/themename and its got a theme.xml and a registration.php (same as my frontend theme, which is working nicely). However, the above instructions talk about about a etc/di.xml which I have no idea where to place (or is that even the solution?)

Googling has got me absolutely nowhere, Magento 2 official docs suck (as always) so no help there.

So, summa summarum: how to enable my custom admin theme?

Answer 1

Thank you @Alex! Your solution worked for me! I can see from the source that admin area is using my theme now.

Steps:

1. create a new theme in app/design/adminhtml/Vendor/Themename. In that directory, create a theme.xml:

<theme xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Config/etc/theme.xsd"> <title>My Theme Tile</title> <parent>Magento/backend</parent> </theme>

And a registration.php:

<?php \Magento\Framework\Component\ComponentRegistrar::register( \Magento\Framework\Component\ComponentRegistrar::THEME, 'adminhtml/Vendor/Themename', __DIR__ );

2. Either create new module for deploying your theme, or use some existing module; either way, in your modules module.xml add the sequence xml element to make sure your theme gets loaded last.

<config> <module name="My_Custommodule" setup_version="2.0.0"> <sequence> <module name="Magento_Theme"/> </sequence> </module> </config>

and in your custom modules etc/di.xml add the fragment that specifies the admin theme to use: <config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd"> <type name="Magento\Theme\Model\View\Design"> <arguments> <argument name="themes" xsi:type="array"> <item name="adminhtml" xsi:type="string">Vendor/Themename</item> </argument> </arguments> </type> </config>

3. run setup:upgrade and voila! Check what theme is being used by viewing source: all css and js files should now be loaded from /pub/static/adminhtml/Vendor/Themename/[language]/....

However, all admin pages seems to be missing styles. I am in developer mode, and did a setup:static-content:deploy [languages] (with no errors) but that did not resolve the issue. I have had this same issue on the frontend as well, but cant remember how I fixed it.. do I need to copy js and css files from magento-backend module to make this work?

ISSUE RESOLVED: it appears I have run into this issue: Correct way to Update a Theme's Parent in Magento 2 where if I install my theme and then change the parent to something else in theme.xml, it will no be updated in the database and it wont take effect. I had initially put Magento/blank in the parent-element, and that obviously did not work at all, and changing it to Magento/backend later did not help either (as per the link above). So I went in the database and set the parent_id for my theme by hand. And just like that, everything works :)

Answer 2

To apply the Admin theme, you need to create a new module and specify it there:

1. Make sure you are in developer mode.
2. Create a separate MyVendor_MyBackendTheme module. (similar to https://github.com/magento/magento2-samples/tree/master/sample-module-minimal for example, but do not forget to edit the module.xml and registration.php if you decide to use it). In module.xml specify that the Magento_Theme module loads before you module by adding:

    <module name="MyVendor_MyBackendTheme" setup_version="2.0.1">
        <sequence>
            <module name="Magento_Theme"/>
        </sequence>
    </module>

3. Add the <module>/etc/di.xml, where add the following node:

<type name="Magento\Theme\Model\View\Design">
    <arguments>
         <argument name="themes" xsi:type="array">
             <item name="adminhtml" xsi:type="string">your_vendor_dir/your_theme_dir</item>
         </argument>
     </arguments> 
</type>

4. Run the magento setup:upgrade command.

5. Open the Admin and view the new theme applied (hopefully:)).