Over the past year, we've been working hard to create a new look for DirectAdmin. We've called this new skin Evolution. This new skin has a similar feel to our directadmin.com website.

The changes brought forward with this new skin are far more than just the skin itself, but also how it communicates with DirectAdmin. We've added almost 100% JSON support in DirectAdmin, allowing for in-page editing. This should also open up many options for plugin/script designers as they no longer need to rely only on the CMD_API calls. The GUI CMD_ calls can be used by simply adding json=yes to the request.

I want to use the Evolution skin

Evolution is the default skin in new installations of DirectAdmin. If you have another skin set to be the default one, and would like to change the default to Evolution, including the login page, login as admin, switch to reseller level, go to > Reseller Tools > Skin manager, select the 'evolution' skin and click 'Set Global'.

To change a skin just for you (admin), click the 'Apply to me'. To change a skin for your users (under admin reseller), click on 'Apply to All users'.

Change everyone on the server to Evolution

The following commands will change every admin/reseller/user and all the packages to use the evolution skin instead of enhanced:

cd /usr/local/directadmin/data/users
perl -pi -e 's|skin\=enhanced|skin=evolution|g' ../admin/packages/*.pkg
perl -pi -e 's|skin\=enhanced|skin=evolution|g' */packages/*.pkg
perl -pi -e 's|skin\=enhanced|skin=evolution|g' */user.conf
perl -pi -e 's|docsroot\=./data/skins/enhanced|docsroot=./data/skins/evolution|g' */user.conf
1
2
3
4
5

How to customize the evolution skin

The evolution skin was designed to be extremely flexible for customization, you can change anything in it from a reseller level > Customize Evolution Skin menu. Where you can change sections, icons for user, reseller or admin level pages:

User level

Customizing user level

Reseller level

Customizing reseller level

Main colors

Customizing colors

Customizing logos

Customizing user level

If you are using your own technical support system, you might want to provide a URL to it. This can be done by in Support & Help -> Manage Tickets -> Ticket System Settings, just untick 'Ticket System Enabled' and it will let you input the URL there.

If you have any other external systems you wish to add to the menu, you may do this using the Customize Evolution Skin > Menu: User > Support & Help > [Click on section title] > Add Entry on the right. Just change the radio button from 'Route' to 'Link', then provide a link to your external system, name it, and add an icon.

Looking for more? Check out this forumopen in new window.

How to translate the evolution skin

The Evolution skin uses the gettext system for translation. A .pot file holds the dictionary for translation.

Let's assume you want to create a Russian translation:

Dictionary file should be taken from /usr/local/directadmin/data/skins/evolution/lang/dictionary.pot and then translated using POEdit or alternative software. Then it should be uploaded to the languages folder, for example:

"/usr/local/directadmin/data/skins/evolution/lang/ru.po"
1

Then the skin will start showing it. There is no automatic way to convert old language files to new ones, however, there are many programs that support PO translations, so, it should be easy enough to create a new one by copy-pasting the old translations from the text files.

The login page dictionary file should be taken from /usr/local/directadmin/data/skins/evolution/lang/login-dictionary.pot and when translated, uploaded to languages, e.g., /usr/local/directadmin/data/skins/evolution/lang/login-ru.po.


Internal translation

The directadmin and dataskq binaries have strings hardcoded internally, so other means are needed to load translations. As of DirectAdmin 1.61.1, we will support gettext which is a very common means of translating these types of strings. See this guide on creating your own internal.po translation.

Locales

Note, you can use specific List of Locale ID (LCID) values, just find your specific locale name from the file /usr/local/directadmin/data/skins/evolution/locales.conf. For example, there are several variants of "en", e.g.,

en_CA=English (Canada)
en_GB=English (United Kingdom)
en_IE=English (Ireland)
1
2
3

where you'd use the underscore '_' character (and not the dash '-' as some use). You do not need to use a more specific _XX code for the language, usually just the main one is fine (e.g., 'en'). However, in some cases, the wording may be specific enough such that you would want different language packs for the different countries/dialects, in which case you can use these extra codes for your language pack (e.g., en_CA).


Sharing your translation.

We've added a Weblate website for the DirectAdmin backend, and Evolution skin, ready for community contributions:

https://translate.directadmin.com/open in new window

When you sign up there, we'd need to provide you "write" privileges. At the same time, we'd add the language you'd like to import or participate in 😃 Please note, we'd suggest not importing any 3rd-party translations there, as it might have licensing which may not allow you to do it.

The same internal translations are used for backend. Frontend translation is not gettext/po compatible, and thus it is not available there.

Relevant forum post:

https://forum.directadmin.com/threads/translations-website-https-translate-directadmin-com.62825/open in new window

Custom favicon.png in Evolution skin

Related to the Login page: /images or /assets now support custom override pathsopen in new window feature, you can create a custom favicon.png file in these directories, to affect both when Users are logged in, and for non-logged in paths, if the default skin is Evolution:
/usr/local/directadmin/data/skins/evolution/assets/images/custom/favicon.png
/usr/local/directadmin/data/skins/evolution/login_images/custom/favicon.png
The image can be viewed here for both logged out and logged-in states:
https://your.host.com:2222/images/favicon.png

Last Updated: 6/23/2021, 9:36:08 PM