Support Forum
Hello,
where do I define classes to be used in Custom CSS class field in Advanced tab for a Custom field?
I´ve read this article https://metabox.io/style-meta-boxs-custom-fields-using-css/#create-a-css-file-in-your-child-theme but this refers to a different approach. It is not about the use of Custom CSS class option.
Thanks
Hi,
You can add custom classes to a custom field in the Advanced tab, option Custom CSS class, and separate them by space. Screenshot https://monosnap.com/file/JiGv0NOrapjy2NgOXHsnFCml6nZGAa
Hello again.
I understand where to put classes, I don't know, where to define them. It is probably trivial, but I'm stuck here. I've tried some classes I already use globally, but no success.
I'm an Oxygen user, if it's relevant.
Hi,
The classes are used to style the custom fields in the backend or the frontend form in the frontend. If you want to style the field value on the frontend, please add the HTML tags with classes to style them. Or contact Oxygen support to ask for help with this case.
For now I need to style custom fields in the backend. Where or how would you define test-class-1 and test-class-2 as is on your screenshot? Which css stylesheet does it use? Is the problem Oxy-related?
Thank you.
Hi,
You can use add this code to the file functions.php in the theme/child theme folder to apply the custom CSS code in the admin area
add_action('admin_head', 'my_custom_css');
function my_custom_css() {
echo '<style>
.test-class-1 {
background-color: red;
}
</style>';
}
or use the plugin https://wordpress.org/plugins/admin-css-mu/ to apply the CSS code.
Thank you, great response!
I managed it via Scripts Organizer plugin in Oxygen.
I suggest to include this little tutorial into Meta Box documentation.