<script type="text/discourse-plugin" version="0.8">
// This is the plugin outlet, followed by a custom name for the component
api.registerConnectorClass("below-site-header", "custom-homepage", {
// Setting up our component
setupComponent(args, component) {
// Next we're getting the site setting 'top_menu',
// splitting the values into an array,
// and adding a leading slash
var topMenuRoutes =
component.siteSettings.top_menu.split('|')
.map(function(route) {return '/' + route});
// The first page listed in the 'top_menu' setting is your homepage
// lets assign it to a variable
var homeRoute = topMenuRoutes[0];
// This calls our code whenever the page changes
api.onPageChange((url) => {
// Check if we're on the homepage
if (url === "/" || url === homeRoute ){
// If it's the homepage add the 'custom-homepage' class to HTML tag
// and set 'displayCustomHomepage' to true
document.querySelector("html").classList.add("custom-homepage");
component.set("displayCustomHomepage", true);
} else {
// If we're not on the homepage remove the class
// and set `displayCustomHomepage` to false
document.querySelector("html").classList.remove("custom-homepage");
component.set("displayCustomHomepage", false);
}
});
}
});
</script>
^ Add this to your head to add a .custom-homepage class to your body tag when you’re on the homepage, then →
.custom-homepage #main-outlet-wrapper {
margin-top: -38px;
}