Today we are going to take advantage of the work we have done in the last two tuesday posts. So we want to add custom Divi Theme Options allowing the user to customize the Admin Style of the WordPress dashboard.
We talked about the ‘et_epanel_tab_names’ filter and how this hook give us the ability to add a custom tab to the Divi Theme Options; then we focused on how to populate our custom tab with custom options just last tuesday. Now is time to go further.
ADD CUSTOM ‘ADMIN STYLE’ OPTIONS
So, first of all we have to write our custom options; this is just a concrete example on how we can take advantage of setting new custom options in Divi, so we just provide four simple options, two about the Divi Theme Options style and two about the WordPress Admin style.
The code in our ‘/epanel/custom_options_divi.php’, thus, will look like this:
RECOVERING DIVI CUSTOM OPTIONS VALUES
Wordpress has a native function ‘get_option()’. In this case, however we take advantage of a Divi native function: ‘et_get_option()’. This is a custom function that Divi has for getting the values stored in the database as arrays about the Divi Theme Options. If you want to know more about this function you will find it in the ‘custom_functions.php’ file.
ANOTHER HOOK ON OUR WAY: ‘admin_head’
If you remember the steps we did in our last post (see here), in our Child Theme’s functions.php file (but we could also put the code in a plugin in order to have greater autonomy) we have already written two custom functions, the first for adding the new tab, the second one to load our ‘custom_options_divi.php’ file.
Now we will add a third function in which we will check for each option we added what is its value and according to this one we change the css style of our Divi Theme Options and WordPress Admin. We will hook our third function with ‘admin_head’ action and our ‘functions.php’ will look now like this:
MORE THAN ONE SUBNAV TAB?
Let’s say we want to separate our custom options for Divi Theme from those for the Admin. We will need more than one subnav tab.
So we just have to modify a little our ‘$options’ code in our ‘epanel/custom_options_divi.php’:
All done! Now we have our custom options working without issues and we can go further customizing what we want of our Divi Admin and Divi website in general. It’s very powerful, but it is also very easy thanks to the complex and very well structured coding system of Divi Theme.
Hope it can be useful. Let me know in the comments.