Docs

Documentation

Settings

Dashboard

Edit child theme info

Status & Tools

Debugger

Debugger options

How to debug

Maintenance mode

Designer

SCSS Compiler options

Global variables

Developer

Assets enqueue

Custom post types

Taxonomies

Custom fields

Customizer

Page preloader

Admin panel

Login page

Code editor

Code editor

Functions and variables

Help

Help center

Code snippets

Developers

Get on Gumroad

Admin panel

Admin panel

Customize admin panel colors, logos and other options.

Enable to customize admin panel sidebar colors and logo, admin topbar styles and admin panel footer info and credits.
On update:
Basic mode: New code will be generated to update the related partial SCSS file and all CSS will be compiled. Related theme mod will be updated.
Advanced mode: Editor code will be used to update the related partial SCSS file and all CSS will be compiled. Related theme mod will not be updated.

On reset:
Admin panel will reset to default styles.
Related partial SCSS file will reset to default template and all CSS compiled. Related theme mod will reset to default values.
Related custom files:
SCSS _admin-panel.scss/custom/scss/_admin-panel.scss
Partial SCSS styles for customizer: Admin panel.
Type: SCSS
Size: 7 KB
Modified: 2026/07/16 11:27:47
Open file in new tab
Related theme mods:
dct_customizer_admin_panel
Customize admin panel colors, logos and other options.
Admin panel customizer dct_customizer_admin_panel 3
{
    "enabled": true,
    "advanced": false,
    "options": {
        "sidebar-background-color": "$primary",
        "sidebar-text-color": "#ffffff",
        "sidebar-submenu-color": "$primary-darker",
        "sidebar-submenu-text-color": "#ffffff",
        "sidebar-featured-color": "$primary-comp",
        "sidebar-featured-text-color": "#FFF",
        "sidebar-image-url": "https://www.dctforwp.com/wp-content/uploads/2026/04/Logo-DCT-for-WP-positiu.svg",
        "sidebar-image-height": "60px",
        "sidebar-folded-image-url": "",
        "sidebar-folded-image-height": "40px",
        "topbar-background-color": "#111212",
        "topbar-text-color": "#f0f0f1",
        "topbar-wp-links": false,
        "footer-text": "Theme by <b>{{AUTHOR}}</b> \u00a9 {{YEAR}}",
        "footer-version-child": true,
        "footer-version-wp": true
    }
}

Admin panel

Switch to advanced mode

Customize admin panel colors, logos and other options.

Enable to customize admin panel sidebar colors and logo, admin topbar styles and admin panel footer info and credits.
On update:
Basic mode: New code will be generated to update the related partial SCSS file and all CSS will be compiled. Related theme mod will be updated.
Advanced mode: Editor code will be used to update the related partial SCSS file and all CSS will be compiled. Related theme mod will not be updated.

On reset:
Admin panel will reset to default styles.
Related partial SCSS file will reset to default template and all CSS compiled. Related theme mod will reset to default values.
Related custom files:
SCSS _admin-panel.scss/custom/scss/_admin-panel.scss
Partial SCSS styles for customizer: Admin panel.
Type: SCSS
Size: 7 KB
Modified: 2026/07/16 11:27:47
Open file in new tab
Related theme mods:
dct_customizer_admin_panel
Customize admin panel colors, logos and other options.
Admin panel customizer dct_customizer_admin_panel 3
{
    "enabled": true,
    "advanced": false,
    "options": {
        "sidebar-background-color": "$primary",
        "sidebar-text-color": "#ffffff",
        "sidebar-submenu-color": "$primary-darker",
        "sidebar-submenu-text-color": "#ffffff",
        "sidebar-featured-color": "$primary-comp",
        "sidebar-featured-text-color": "#FFF",
        "sidebar-image-url": "https://www.dctforwp.com/wp-content/uploads/2026/04/Logo-DCT-for-WP-positiu.svg",
        "sidebar-image-height": "60px",
        "sidebar-folded-image-url": "",
        "sidebar-folded-image-height": "40px",
        "topbar-background-color": "#111212",
        "topbar-text-color": "#f0f0f1",
        "topbar-wp-links": false,
        "footer-text": "Theme by <b>{{AUTHOR}}</b> \u00a9 {{YEAR}}",
        "footer-version-child": true,
        "footer-version-wp": true
    }
}

Admin sidebar

primary
#3fa6a5
primary-dark
#2a6e6d
primary-darker
#153736
primary-light
#6bc6c5
primary-lighter
#a2dbda
primary-comp
#a63f40
primary
#3fa6a5
primary-dark
#2a6e6d
primary-darker
#153736
primary-light
#6bc6c5
primary-lighter
#a2dbda
primary-comp
#a63f40
primary
#3fa6a5
primary-dark
#2a6e6d
primary-darker
#153736
primary-light
#6bc6c5
primary-lighter
#a2dbda
primary-comp
#a63f40
primary
#3fa6a5
primary-dark
#2a6e6d
primary-darker
#153736
primary-light
#6bc6c5
primary-lighter
#a2dbda
primary-comp
#a63f40
primary
#3fa6a5
primary-dark
#2a6e6d
primary-darker
#153736
primary-light
#6bc6c5
primary-lighter
#a2dbda
primary-comp
#a63f40
primary
#3fa6a5
primary-dark
#2a6e6d
primary-darker
#153736
primary-light
#6bc6c5
primary-lighter
#a2dbda
primary-comp
#a63f40

px

px

Admin topbar

primary
#3fa6a5
primary-dark
#2a6e6d
primary-darker
#153736
primary-light
#6bc6c5
primary-lighter
#a2dbda
primary-comp
#a63f40
primary
#3fa6a5
primary-dark
#2a6e6d
primary-darker
#153736
primary-light
#6bc6c5
primary-lighter
#a2dbda
primary-comp
#a63f40

Admin footer

HTML allowed. Use {{TAG}} to replace content: {{AUTHOR}} {{AUTHOR-URL}} {{THEME-NAME}} {{THEME-VERSION}} {{THEME-URL}} {{YEAR}}

Admin panel
Switch to basic mode
 
Customize admin panel colors, logos and other options.
Enable to customize admin panel sidebar colors and logo, admin topbar styles and admin panel footer info and credits.
On update:
Basic mode: New code will be generated to update the related partial SCSS file and all CSS will be compiled. Related theme mod will be updated.
Advanced mode: Editor code will be used to update the related partial SCSS file and all CSS will be compiled. Related theme mod will not be updated.

On reset:
Admin panel will reset to default styles.
Related partial SCSS file will reset to default template and all CSS compiled. Related theme mod will reset to default values.
Related custom files:
 SCSS _admin-panel.scss/custom/scss/_admin-panel.scss
Partial SCSS styles for customizer: Admin panel.
Type: SCSS
Size: 7 KB
Modified: 2026/07/16 11:27:47
 Open file in new tab
Related theme mods:
dct_customizer_admin_panel
Customize admin panel colors, logos and other options.
 Admin panel customizer dct_customizer_admin_panel 3
{
    "enabled": true,
    "advanced": false,
    "options": {
        "sidebar-background-color": "$primary",
        "sidebar-text-color": "#ffffff",
        "sidebar-submenu-color": "$primary-darker",
        "sidebar-submenu-text-color": "#ffffff",
        "sidebar-featured-color": "$primary-comp",
        "sidebar-featured-text-color": "#FFF",
        "sidebar-image-url": "https://www.dctforwp.com/wp-content/uploads/2026/04/Logo-DCT-for-WP-positiu.svg",
        "sidebar-image-height": "60px",
        "sidebar-folded-image-url": "",
        "sidebar-folded-image-height": "40px",
        "topbar-background-color": "#111212",
        "topbar-text-color": "#f0f0f1",
        "topbar-wp-links": false,
        "footer-text": "Theme by <b>{{AUTHOR}}</b> \u00a9 {{YEAR}}",
        "footer-version-child": true,
        "footer-version-wp": true
    }
}
File: 
 SCSS _admin-panel.scss/custom/scss/_admin-panel.scss
Partial SCSS styles for customizer: Admin panel.
Type: SCSS
Size: 7 KB
Modified: 2026/07/16 11:27:47
 Open file in new tab
Toggle editor find & replace panel.
Hotkeys: CTRL + F to open, ESC to close
Copy editor contents to clipboard.
Toggle editor light/dark theme.
Currently using basic mode.
Updating the generator in advanced mode will overwrite basic mode generator options code.

















Dashboard custom widget





Add a custom widget panel with html contents to admin panel dashboard.
Enable dashboard custom widget to edit custom panel html contents.
Useful to add quicklinks to admin panel or forntend pages.
On update: Dashboard custom widget will appear in admin panel dashboard when enabled. Related theme mod will be updated.
On reset: Dashboard custom widget will be disabled and contents reset to default html. Related theme mod will reset to default values.
Related theme mods:
dct_customizer_dashboard_widget
Add a custom widget panel with html contents to admin panel dashboard.
 Dashboard custom widget dct_customizer_dashboard_widget 3
{
    "enabled": true,
    "advanced": false,
    "options": {
        "title": "Quick links",
        "content": "<h4>Contents</h4>\n<a class=\"button button-large button-primary\" href=\"post-new.php\">New post</a>\n<a class=\"button button-large\" href=\"edit.php\">Posts</a>\n<a class=\"button button-large\" href=\"edit.php?post_type=page\">Pages</a>\n<hr>\n<p>Settings & Appearance</p>\n<a class=\"button button-primary\" href=\"options-general.php\">General</a>\n<a class=\"button\" href=\"nav-menus.php\">Menus</a>\n<a class=\"button\" href=\"admin.php?page=dct-settings\">Child theme</a>"
    }
}





Dashboard widget
 
Add a custom widget panel with html contents to admin panel dashboard.
Enable dashboard custom widget to edit custom panel html contents.
Useful to add quicklinks to admin panel or forntend pages.
On update: Dashboard custom widget will appear in admin panel dashboard when enabled. Related theme mod will be updated.
On reset: Dashboard custom widget will be disabled and contents reset to default html. Related theme mod will reset to default values.
Related theme mods:
dct_customizer_dashboard_widget
Add a custom widget panel with html contents to admin panel dashboard.
 Dashboard custom widget dct_customizer_dashboard_widget 3
{
    "enabled": true,
    "advanced": false,
    "options": {
        "title": "Quick links",
        "content": "<h4>Contents</h4>\n<a class=\"button button-large button-primary\" href=\"post-new.php\">New post</a>\n<a class=\"button button-large\" href=\"edit.php\">Posts</a>\n<a class=\"button button-large\" href=\"edit.php?post_type=page\">Pages</a>\n<hr>\n<p>Settings & Appearance</p>\n<a class=\"button button-primary\" href=\"options-general.php\">General</a>\n<a class=\"button\" href=\"nav-menus.php\">Menus</a>\n<a class=\"button\" href=\"admin.php?page=dct-settings\">Child theme</a>"
    }
}
Add HTML contents to dashboard custom widget
Code: HTML
Toggle editor find & replace panel.
Hotkeys: CTRL + F to open, ESC to close
Copy editor contents to clipboard.
Toggle editor light/dark theme.
Quick links
Contents

New post
Posts
Pages



Settings & Appearance

General
Menus
Child theme