Is there a module to assign classes to the body for pages? Can't assign class for body in my project.
Weekly office hours
Bring your questions to our weekly virtual office hours, every Wednesday. Everyone is welcome.
Recent topics
Posted 3 hours 8 min ago by (Ernst) in How-To and Troubleshooting
Posted 1 day 11 hours ago by (dd123) in Other
Posted 3 days 4 hours ago by RS Snyder (theflightrs) in Requests and Feedback
Posted 3 days 10 hours ago by (dd123) in Other
Posted 4 days 3 hours ago by RS Snyder (theflightrs) in How-To and Troubleshooting
Recent comments
On the surface this is a fantastic idea. It does require significant costs in time and money. I've found that the models are possibly more knowledgeable about Drupal 7 and Backdrop than Drupal...
An entirely Backdrop/D7-trained AI coding model: What do you think?
With the custom search, that sounds like a bug as the module doesn't have a dependency on language. You could though try enabling that module just to get past the update. There is an...
Migrating from Drupal 7 gives some problems
Block D is from 0900 - 1200 UTC on 2025-04-04. So far, we have a session on privacy and cookies but nothing else. Is there something you would like to talk about? This time block is not great...
Backdrop Live April 2025
Here is an interesting perspective from a site owner that explains why people move to BackdropCMS https://backdropcms.org/showcase/pgsuper-open-source-girder-bridge-design-software#testimony
Is backdrop still developing ?
If you have a "new project" being created from scratch, that isn't already in Drupal, and there is no need to migrate, some of my comments in this post may not be relevant. As an Administrator...
Comments
Hey @backdropnb 👋
There could be a few ways to go about doing that. Are you after adding CSS classes to the body field of content, or the
<body>element in the HTML rendered for pages?If you want to add CSS classes to the body field (or any field), you could do that either via a template in your custom theme, or by using the Field Wrappers module.
If you want to add CSS classes to the
<body>element in the HTML, then you would need to copy thepage.tpl.phptemplate on your theme, and add them there. There is a section in that file that looks like this:<body class="<?php print implode(' ', $classes); ?>"<?php print backdrop_attributes($body_attributes); ?>>...the easiest way to do it is to change that line to something like this instead:
<body class="MY-CUSTOM-CLASS-GOES-HERE <?php print implode(' ', $classes); ?>"<?php print backdrop_attributes($body_attributes); ?>>(^^ add your own class before the
<?php print implode(' ', $classes)bit - make sure there is a space after it, and remember to clear caches each time you make changes to your theme templates).If you are using Paragraphs, then you might find the Classy Paragraphs module useful too.
If you are coming from Drupal 7, is there any module that does this? If so, then you could request for it to be ported to Backdrop. You can check if D7 modules have already been ported here, and you can request new ones to be ported by creating a request here (please search to see if someone else has already made a request for the same module though).
I hope that helps, but please let us know if you have further questions.
CSS classes to the HTML <body> element are often used when developing an individual design or customization of a theme. You can achieve this by editing the page.tpl.php saved in the theme folder as described by @klonos above. This was often done in Drupal, but Drupal lacks the Layout concept.
However, in Backdrop we have Layouts and I prefer to individualize the design by placing my own CSS class not on the HTML body element, but in the outer HTML element of the layout template, for example <div id = "wrapper" class = "some-custom-class"> in layout - custom-layout.tpl.php.
This allows a different design of each layout within the same theme.
In the example above, div id = "wrapper" covers the entire internal content of the body element, but it's CSS class is specific to each layout, used in the website.
Thanks,
I added page.tpl.php in my thame
İf you use page.tpl.php You must visit this link (https://docs.backdropcms.org/api/backdrop/core%21modules%21system%21temp...) There is example in files
I added a new div (<div id="node-<?php print $node->nid; ?>" class = "some-custom-class <?php print implode(' ', $classes); ?>">) but but I can not assign the ids of the page or the class. What am I missing? Is it necessary to activate any module for this?
<html<?php print backdrop_attributes($html_attributes); ?>>
<head>
<?php print backdrop_get_html_head(); ?>
<title><?php print $head_title; ?></title>
<?php print backdrop_get_css(); ?>
<?php print backdrop_get_js(); ?>
</head>
<body class="<?php print implode(' ', $classes); ?>"<?php print backdrop_attributes($body_attributes); ?>>
<div id="node-<?php print $node->nid; ?>" class = "some-custom-class <?php print implode(' ', $classes); ?>">
<?php print $page; ?>
<?php print $page_bottom; ?>
<?php print backdrop_get_js('footer'); ?>
</div>
</body>
</html>
Hello again @backdropnb,
Backdrop already adds the node ID number in the body HTML tag out of the box - you don't need to add it yourself:
If you look at the documentation listing all variables at the top of
page.tpl.php, you will see that$nodeis not included (that template is used for all pages on the site, and not every page is a node), so$node->nidwill not work using that template.If you want to use
$node->nid, then you will need to copy and customizenode.tpl.phpinstead, which includes$nodeas a variable.I hope that the above helps.