Backend customization UI 2.0 for Site app

Supported only in the new UI 2.0 interface

The "Backend customization UI 2.0" plugin works exclusively in the new UI 2.0 of Site app and supports both light and dark backend modes. This tool allows you to customize the interface and speed up work in the administrative part of your site.

What is the purpose of the “Backend customization UI 2.0” plugin?

The “Backend customization UI 2.0” plugin transforms the standard Webasyst interface into a convenient workspace. Instead of unnecessary clicks, you get a familiar sidebar menu on the left in the Site app, instant navigation across sections, clear page titles, and a unified workflow across all applications.

No clutter on the screen, no interface “blinking”, everything appears smoothly and in the right sequence.

Main features of the plugin

1. Sidebar navigation menu for the Site app with the logic of UI 1.3 and the visualization of all major apps, including Shop-Script:

Sidebar menu in the Site UI 2.0 app

• Three display modes: pinned, compact, or on hover.
• Quick access to all sections: Site map (Site structure), Design themes, File manager, Variables/Blocks, Plugins, Settings.
• Smooth performance without annoying “jumps” in the “Variables/Blocks” section.
• “Sub-sidebar” for Site app plugins – installed plugins are always at hand in the left menu, just like in Shop-Script.
• Page headers in the Site app sections – H1 titles are automatically applied, and for key pages (Site structure, Design themes, Settings) the domain name is added, helping you see which site you’re working with.
• Fast domain switching via AJAX with one click in the sidebar, just like in UI 1.3 of the Site app.
• Quickly create a new site – the “+” button in the sidebar next to the domain list.

2. Instant interface language switch in the main navigation menu:

Switch the interface language in any app with a single click – no need to go into the “Team” (Contacts, CRM) profile.

Interface language switcher

3. Color schemes and backend personalization:

• 11 dark themes: from strict to high-contrast:

Improved original WA

Dark green

Dark red

Dark brown

Dark purple

Black with red accents

Black with blue accents

Black with green accents

Black with orange accents

Black with yellow accents

Black with purple accents
• 5 accent colors for the light theme:

Improved original WA

With green accent

With red accent

With orange accent

With purple accent
• Support for custom CSS styles to preserve individual adjustments after Webasyst framework and app updates.

4. Flexible settings for the Site application.

• Enable sidebar menu, adjust content width (All content, “Variables” modal).
• The ability to replace the icon of the Site app with the original one in the Site Map section (Site structure) and on the page editing page.
• "Lazy loading" of rows of the site structure table in the "Site Map" section - with a large number of rows, the page with the site structure will open faster.
• A toggle button for completely hiding and showing all existing pages in the Site app in the Site Map section (Site structure) and on the page editing page.



Compact view of the site map structure


• A full-featured show/hide accordion for the nested pages of the Site application in the Site map section (Site structure), on the editing page of standard pages and block pages of constructor.



Hide/show functionality for nested pages


• Hiding the pages of all applications, except the pages of the Site app, in the Site map section (Site structure) and on the page editing page, displaying the number of subpages and links to edit them for applications with the Pages section.



The Site page editing section of the application

5. Flexible settings for other applications.

• Shop-Script: Setting content width (Product subpages editing, Promotions in Marketing, “Variables” modal, Settings section).
• Blog: Setting content width (All posts and editing).
• Team: Setting content width (All users section, Groups).
• Hub: Setting content width (All topics", "Replies", "Authors", "Filters", "Hubs" and "Settings").
• Mailer: Setting content width ("New campaign", "Template files", "Unsubscribed" and "Drafts").
• Logs: Setting content width (All content).
• Settings (app): Setting content width (General settings, Email settings, SMS providers, Webasyst AI, Web push notifications, Maps settings, Captcha settings, Contact fields, Countries and regions, Backend authorization, Privacy, Database, Sign-in with Webasyst ID).
• Installer: Setting content width (Manage apps section).

Suggestions for adding further UI 2.0 backend usability improvements

First, please review the plugin’s update plan. If your suggestions are not listed there yet, write to our support team, providing as many details as possible about the app and what you would like to improve in UI 2.0 – we will carefully review your proposal and may include it in our checklist.

Attention! After adding new functionality, according to our update plan, the plugin price will increase!

How the “Backend UI 2.0 Customization” plugin can help

• Fast workflow without unnecessary clicks in the Site app – a compact menu and logical headers speed up everyday tasks.
• Multi-site management – domain selection helps instantly switch between projects.
• Visual comfort – dark themes reduce eye strain, while smooth animations avoid discomfort.
• Unified style and logic across the interface – all apps follow the same logic, increasing focus and reducing distractions.

The “Backend UI 2.0 Customization” plugin makes the Webasyst interface as convenient and predictable as possible. It removes unnecessary actions and helps you stay focused, turning the standard Backend UI 2.0 into a native and user-friendly tool.

The plugin has been tested and is fully compatible with PHP versions 7.4.33 - 8.3.15.