# Breadcrumb Trail - Keep Account settings

**URL:** <https://forums.knack.com/t/breadcrumb-trail-keep-account-settings/17257>\
**Category:** API & Custom Code\
**Created:** [May 23, 2024, 1:31am UTC](https://forums.knack.com/t/breadcrumb-trail-keep-account-settings/17257 "2024-05-23T01:31:24Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![SteveRobin63604](https://avatars.discourse-cdn.com/v4/letter/s/d07c76/32.png) [@SteveRobin63604](https://forums.knack.com/u/SteveRobin63604)\
**Post date:** [May 23, 2024, 1:31am UTC](https://forums.knack.com/t/breadcrumb-trail-keep-account-settings/17257/1 "2024-05-23T01:31:24Z")

</div>

Hi All

I have used the following code to remove the breadcrumb trail at the top of the screen.

$(document).on(‘knack-scene-render.any’, function(event, scene) {  
$(“.kn-crumbtrail”).hide();  
});

However this changes the position of the account settings that I would like to retain on the RHS.

Any ideas on what I would need to add here?

---

<div class="post-metadata">

**Author:** ![StephenChapman](https://sea2.discourse-cdn.com/flex020/user_avatar/forums.knack.com/stephenchapman/32/1759_2.png) [@StephenChapman](https://forums.knack.com/u/StephenChapman)\
**Post date:** [May 23, 2024, 2:09am UTC](https://forums.knack.com/t/breadcrumb-trail-keep-account-settings/17257/2 "2024-05-23T02:09:48Z")

</div>

Hey @SteveRobin63604, instead of JS, you can do this a lot simpler in the CSS code, assuming you want to always hide the crumbtrail.  
Using `visbility:hidden` will hide it, and won’t shift other elements.

```auto
.kn-crumbtrail {
  visibility: hidden;
}

```

If you want to apply it to particular scenes only, you can use your existing JS method with a minor tweak:

```auto
$(document).on(‘knack-scene-render.scene_xx’, function(event, scene) {
  $('.kn-crumbtrail').css('visibility','hidden');
});

```

---

<div class="post-metadata">

**Author:** ![SteveRobin63604](https://avatars.discourse-cdn.com/v4/letter/s/d07c76/32.png) [@SteveRobin63604](https://forums.knack.com/u/SteveRobin63604)\
**Post date:** [May 23, 2024, 2:29am UTC](https://forums.knack.com/t/breadcrumb-trail-keep-account-settings/17257/3 "2024-05-23T02:29:28Z")

</div>

> [@StephenChapman](#):
>
> ```auto
> .kn-crumbtrail {
> visibility: hidden;
> }
> 
> ```

I have tried using the suggested css and it doesn’t appear to work?

---

<div class="post-metadata">

**Author:** ![StephenChapman](https://sea2.discourse-cdn.com/flex020/user_avatar/forums.knack.com/stephenchapman/32/1759_2.png) [@StephenChapman](https://forums.knack.com/u/StephenChapman)\
**Post date:** [May 23, 2024, 2:48am UTC](https://forums.knack.com/t/breadcrumb-trail-keep-account-settings/17257/4 "2024-05-23T02:48:09Z")

</div>

Hmm, maybe try adding `!important` like so?:

```auto
.kn-crumbtrail {
  visibility: hidden !important;
}

```

---

<div class="post-metadata">

**Author:** ![SteveRobin63604](https://avatars.discourse-cdn.com/v4/letter/s/d07c76/32.png) [@SteveRobin63604](https://forums.knack.com/u/SteveRobin63604)\
**Post date:** [May 23, 2024, 3:17am UTC](https://forums.knack.com/t/breadcrumb-trail-keep-account-settings/17257/5 "2024-05-23T03:17:51Z")

</div>

> [@StephenChapman](#):
>
> ```auto
> .kn-crumbtrail {
> visibility: hidden !important;
> }
> 
> ```

Unfortunately this hasn’t worked either!!

---

<div class="post-metadata">

**Author:** ![StephenChapman](https://sea2.discourse-cdn.com/flex020/user_avatar/forums.knack.com/stephenchapman/32/1759_2.png) [@StephenChapman](https://forums.knack.com/u/StephenChapman)\
**Post date:** [May 23, 2024, 3:22am UTC](https://forums.knack.com/t/breadcrumb-trail-keep-account-settings/17257/6 "2024-05-23T03:22:09Z")

</div>

That’s definitely the right code, and I’ve tested it in my CSS with success.  
Maybe try:

- Pressing Ctrl+F5 to reload your live app
- Clicking the Save Code button on CSS page a couple of times
- Checking that there’s no other code in your CSS/JS that is interfering with `.kn-crumbtrail`

---

<div class="post-metadata">

**Author:** ![SteveRobin63604](https://avatars.discourse-cdn.com/v4/letter/s/d07c76/32.png) [@SteveRobin63604](https://forums.knack.com/u/SteveRobin63604)\
**Post date:** [May 23, 2024, 3:40am UTC](https://forums.knack.com/t/breadcrumb-trail-keep-account-settings/17257/7 "2024-05-23T03:40:46Z")

</div>

I have very little CSS or JS stored on the app which I have checked and still not getting this to function as expected. I did have success removing the crumbtrail using JS as per my original post but the problem was the account settings moving from the RHS to the LHS. I am thinking that I need to find a solution to push this back to its original position.

---

<div class="post-metadata">

**Author:** ![StephenChapman](https://sea2.discourse-cdn.com/flex020/user_avatar/forums.knack.com/stephenchapman/32/1759_2.png) [@StephenChapman](https://forums.knack.com/u/StephenChapman)\
**Post date:** [May 23, 2024, 3:45am UTC](https://forums.knack.com/t/breadcrumb-trail-keep-account-settings/17257/8 "2024-05-23T03:45:01Z")

</div>

@SteveRobin63604 just sent you a direct message with a Zoom link if you’d like me to quickly diagnose for you.

---

<div class="post-metadata">

**Author:** ![StephenChapman](https://sea2.discourse-cdn.com/flex020/user_avatar/forums.knack.com/stephenchapman/32/1759_2.png) [@StephenChapman](https://forums.knack.com/u/StephenChapman)\
**Post date:** [May 23, 2024, 3:54am UTC](https://forums.knack.com/t/breadcrumb-trail-keep-account-settings/17257/9 "2024-05-23T03:54:54Z")

</div>

For everyone else, we solved it by removing some stray curly braces `{}` in the CSS code.

---

<div class="post-metadata">

**Author:** ![Simon](https://sea2.discourse-cdn.com/flex020/user_avatar/forums.knack.com/simon/32/779_2.png) [@Simon](https://forums.knack.com/u/Simon)\
**Post date:** [November 8, 2025, 9:50pm UTC](https://forums.knack.com/t/breadcrumb-trail-keep-account-settings/17257/10 "2025-11-08T21:50:09Z")

</div>

In the Next-gen app, this CSS code snippet worked for me

`/* Hide Breadcrumps */`  
`.kn-breadcrumbs {`  
`display: none !important;`  
`}`
