How to add Custom Css class to a footer block in Magento 2.3

Question

I want to attach one custom CSS class to a footer block using javascript. How can we do that?

<ul class="footer-links col-lg-5 col-md-5 col-sm-12"> 
<li><a href="/about-us">About Us</a></li> 
<li><a href="/contact">Contact Us</a></li> 
<li><a href="#">Careers</a></li> 
<li><a href="/csmarketplace/account/login/">Sell</a></li> 
<li><a href="/terms-and-conditions">Terms & Conditions</a></li> 
</ul>

• Sumit: Do you want to add CSS class to a specific block or whole container?
• Nafsss: @Sumit. Specific block i.e my custom footer block
• Sumit: Please add your block code here you've put in XML file.
• Nafsss: <ul class="footer-links col-lg-5 col-md-5 col-sm-12"> <li><a href="/about-us">About Us</a></li> <li><a href="/contact">Contact Us</a></li> <li><a href="#">Careers</a></li> <li><a href="/csmarketplace/account/login/">Sell</a></li> <li><a href="/terms-and-conditions">Terms & Conditions</a></li> </ul>
• Sumit: Do you want to add CSS class on the ul element?

Answer 1

As per your screenshot, you can add your custom class in the footer block by copying /vendor/magento/module-theme/view/frontend/templates/html/footer.phtml file in your theme with below content.

<div class="footer-container">
 <div class="footer">
 <?= $block->getChildHtml() ?>
 <p class="bugs"><?= /* @escapeNotVerified */ __('Help Us Keep Magento Healthy') ?> - <a
 href="http://www.magentocommerce.com/bug-tracking"
 target="_blank"><strong><?= /* @escapeNotVerified */ __('Report All Bugs') ?></strong></a>
 </p>
 <address><?= /* @escapeNotVerified */ $block->getCopyright() ?></address>
 </div>
</div>

EDIT:

In /magento/module-catalog-search/view/frontend/templates/result.phtml file in your theme add below content.

<?php
 $class = "";
 $searchProductCount = $block->getResultCount();
 if ($searchProductCount == 0) {
 $class = "custom_class";
 }
?>
<script>
 require([
 'jquery',
 'jquery/ui'
 ],function($){
 jQuery('.page-footer div.footer').addClass(<?= $class; ?>);
 });
</script>

Hope it helps!!!

• Nafsss: My condition is if my serach for a particular product results nothing, i want to add class to the block. I am using /magento/module-catalog-search/view/frontend/templates/ result.phtml file. Is there any way to check in footer.phtml that when my search results with no products?
• Nafsss: Thank you. I will try this
• Nafsss: Getting this error Magento\CatalogSearch\Block\Result doesn't extends Magento\Framework\App\Helper\AbstractHelper
• Nafsss: Again error prnt.sc/p6npam
• Nafsss: I tried and your solution worked well. Thank you. Accepting this ans