CSS plays an important role in UI/UX
Today, we will learn how to add multiple CSS classes using functions. This helps you design each WordPress post differently using specific classes.
STEP I:- First, define the classes as an array in the functions.php file inside your child-theme folder. It’s very simple. For Example, use class names like (long-form-article, featured-story, and interactive) for a single Div tag.
?php $custom_classes = array( 'longform-article', 'featured-story', 'interactive', );
STEP II:- After defining classes in the functions.php file under the child-theme folder. We have to now call them in the post_class function in the Div tag. Let’s see how it looks.
A core WordPress function called post_class() is used by themes to tell WordPress where to add those default classes for posts and pages.
<div <?php post_class( $custom_classes ); ?>>
The post_class will print out the respective default CSS classes along with your custom CSS class.
RESULT:-
<div class="longform-article featured-story interactive"></div>
Discover more from Wordpress Tutorial for Beginner's
Subscribe to get the latest posts sent to your email.
