Hide Logo Header for certain page

Hi there,

I’ve been trying to add some javascript to hide the logo header for a specific scene, with no success.

This is possible to do via CSS but only for all pages. And before Knack introduced the new header theme a couple months ago it was also possible to do it via Javascript for a specific scene. Was anyone able to?

Here is the code that I would think should work, but doesn’t:

$(document).on("knack-scene-render.scene_1", function(event, scene) {
      $("#knHeader").hide();
});

And here is the CSS code that does work for hiding it everywhere in the app:

.knHeader {
  display: none !important;
}

Thank you!

Hi @MGR try changing #knHeader to .knHeader in your JS code.

1 Like

Thank you for the suggestion Brad!
.knHeader is actually what I tried at first, but doesn’t work either…

Works for me, maybe the scene is a different number?

$(document).on('knack-scene-render.scene_2', function(event, scene) {
  $('.knHeader').hide();
})

Thank you Brad for testing it out. I finally found the reason for this issue. It seems like that javascript code is only triggered when there’s a table or list in the page. In my case I had just text and a menu. And it seems like that doesn’t make the javascript execute. It also doesn’t seem to work if the page only has a form. Strange, not sure if it’s a bug…

Right, that is strange and haven’t heard of that.

You could try it in a view render event then, say the menu?

1 Like

That was actually a good idea, thank you! But surprisingly the same thing happens.

I tried a page with a menu and a table, and linked the javascript to the menu. It works as expected. But as soon as I delete the table, the code stops triggering. If then I add a list or a table the code starts to work again.

I reached Knack Support about this, but it seems like it’s out of their scope to look at issues with custom code.