0

I have a page called footer.php which is included on all of my pages through PHP like so:

<?php require_once "inc/footer.php"; ?>

In the footer, I have a back to top button which I don't want on some of my pages since they are small pages. What I have done so far is shown below.

CSS (applying to all pages):

.footer-btn{
  display: none;
}

I then put the following code in the head on pages where the button shall be displayed:

<style>
.footer-btn{
 display: block;
}
</style>

Although this works, I don't like using internal CSS and I feel there is a better way of doing it through jquery/js (not sure how to use either well). Suggestions are appreciated.

  • You can find out which is current URL with PHP or JS and write logic to show hide element based on that: https://stackoverflow.com/questions/1283327/how-to-get-url-of-current-page-in-php or https://stackoverflow.com/questions/1034621/get-the-current-url-with-javascript , if you do not know JS then you do require_once "inc/footer.php"; just after you write PHP and write logic as: if current URL is not including some pages then do require_once – ikiK Dec 30 '21 at 21:21

1 Answers1

2

just write the name of the page into the body class using php. You can then target that page, using CSS, to hide / show the footer.

<style>
.page-index .footer-btn,
.page-about-us .footer-btn {
   display: none;
}
</style>
<body class="page-about-us">
   <footer>
      <button class="footer-btn">
          Footer Btn
     </button>
  </footer>
</body>
first last
  • 396
  • 2
  • 5