Add new class to body tag in wordpress
Add new class to body tag in wordpress
Through many examples, we will learn how to resolve the "Add new class to body tag in wordpress".
-
--PATH wp-content\themes\<yourTheme>\header.php
<?php body_class('new-class'); ?>
You can add a new class to the body tag in wordpress using body_class() function. You have to add this code to your body tag of the page or template file. It will display all classes with the new class which you pass to body_class() function. You can find body tag in header.php file as per new wordpress version 5.2 or you can use it to your own created template file. -
--PATH wp-content\themes\<yourTheme>\header.php
<?php body_class(['new-class', 'another-class']); ?>
You can pass multiple classes to body tag in wordpress in array form when you want to add more than one class to your page or template. Your code will look like this after code implementation
<body <?php body_class(['new-class', 'another-class']); ?>>
. -
--PATH wp-content\themes\<yourTheme>\functions.php
add_filter('body_class', 'my_body_class'); function my_body_class( $classes ) { $classes[] = 'new-class'; return $classes; }
You can add a new class to the body tag in wordpress using the body_class filter method. You have to pass the class name to the array $classes and return it. This code can be used in your theme's functions.php or within your plugin. -
--PATH wp-content\themes\<yourTheme>\functions.php
add_filter('body_class', 'my_body_classes'); function my_body_classes( $classes ) { $classes[] = 'class-name'; $classes[] = 'class-name-two'; return $classes; }
You can add multiple classes to the body tag in wordpress using body_class by filter method. -
--PATH wp-content\themes\<yourTheme>\functions.php
add_filter('body_class','my_body_classes'); function my_body_classes( $classes ) { if ( is_home() ) { $classes[] = 'class-name'; $classes[] = 'class-name-two'; } return $classes; }
Conditions can be used in your body_class filter method. You can add class to body tag as per your condition like if you want to add class to your home page then you can add class to home page using is_home() function. is_home() function returns true if the current page is homepage else it returns false. This class will not be added to your other inner pages or posts body tag. -
--PATH wp-content\themes\<yourTheme>\functions.php
function wc_add_body_class_desktop_view( $classes ) { if ( !wp_is_mobile() ) { $classes[] = 'desktop'; } return $classes; } add_filter( 'body_class', 'wc_add_body_class_desktop_view');
You can add class to desktop view using wp_is_mobile() method. This method is very useful when you want to add class to the body as per different device's native name in user agent string. This function did not work on the viewport of devices.
If you like what you are reading, please consider buying us a coffee ( or 2 ) as a token of appreciation.
Don't forget to share this article! Help us spread the word by clicking the share button below.
We appreciate your support and are committed to providing you valuable and informative content.
We are thankful for your never ending support.
Random Code Snippet Queries: Wordpress
- Replace Live Site Url with Local Site URL in wordpress database
- Fatal error: Allowed memory size of 33554432 bytes exhausted (tried to allocate 2348617 bytes) in /home/xxx/public_html/wp-includes/plugin.php on line xxx
- Custom post type in wordpress
- Create a accordion plugin in wordpress
- How to hide PHP Warnings and Notices in WordPress?
- Show template file name in wordpress
- Function to get the post id in while (have_posts()) : the_post();
- Remove class from body tag in wordpress
- Create shortcode in wordpress functions php
- Remove every class and ID from the wp_nav_menu
- How to display author avatar in Wordpress 5
- How to use shop in product category and product permalink in woocommerce