CSS play an important role for UI/UX
Today we will learn how to add multiple CSS classes using WordPress function. We can design each WordPress post differently using the respective CSS classes.
STEP I:- We have to first define the classes as an array in function.php file in child-theme folder. Let see how we define, it’s very simple. Classes names are (longform-article, featured-story, interactive) for a single Div tag.
<?php $custom_classes = array( 'longform-article', 'featured-story', 'interactive', ); ?>
STEP II:- After defining classes in function.php file under child-theme folder. We have to now call them in the post_class function in Div tag. Let see how it looks like.
A core WordPress function called post_class() is used by themes to tell WordPress where to add those default CSS classes for posts and pages.
<div <?php post_class( $custom_classes ); ?>>
The post_class will print out respective default CSS classes along with your custom CSS class.
<div class="longform-article featured-story interactive"></div>