Detecting if front page in common.js

sage
1

Hey folks, sorry if this has been answered earlier. First time using Sage - LOVING it!

Have a header that is different on front page than rest of site. All headers use a very similar bit of js to shrink on scroll, but the front page is a wee bit different.

In the common.js I would like to include an if statement based on if currently on home page or not. Not sure how to go about it. Any help would be appreciated.

2

I would go similar way as the idea behind JS routing used in Sage9 - so I would try to match the css class added to the <body> tag.
Alternatively you can add specific class to the header if is_home() returns true (I believe that this might be a better method in many scenarios).

So anything like (that is a very simplified example, I would solve final code in more elegant way)

if($('body').hasClass('xyz') {
  //do something
}
3

Cheers for that :slight_smile:

I ended up using the following:

common.js

const blacklist = ['home'];
const bodyClasses = Array.from(document.body.classList);

if (!bodyClasses.some(bodyClass => blacklist.includes(bodyClass))) { 
// not front page
} else {
// front page stuff only
}

Source: Execute javascript when NOT in a certain route

4

Props for using ES6 instead of jQuery. We have 2019 and I still do not know if I should advice people in ES6 or “old jQuery way” as many people still have issues with that.

1 Like
5

This topic was automatically closed after 42 days. New replies are no longer allowed.