Restrict Welcome banner to user's homepage

[Discoursenaut]

I have a user asking if it is possible to restrict the banner to the homepage only, so if they have latest bookmarked it doesn’t show? Currently it appears to show in both instances.

[Canapin (Coin-coin le Canapin)]

@Discoursenaut

I have a user asking if it is possible to restrict the banner to the homepage only

Yes, it’s in the Welcome Link Banner settings:

@Discoursenaut

so if they have latest bookmarked it doesn’t show?

Do you mean, if they set a custom page (latest, categories, whatever) as their homepage in their own profile?
Then this arbitrary page is considered as the “homepage” for the user, and thus the welcome banner will appear to them in their new homepage.

If the default homepage of your site is /categories and you want the welcome banner appears only on /categories, regardless of users’ interface preferences, maybe you could set show on to “discovery” or “all” and use javascript to hide the welcome banner on other pages than the one you want to show it on.

But I currently don’t know how to reliably identify the current page we’re on (including when we load a page the first time and when we change the page) to dynamically hide the Welcome Banner.

I’d be happy to try this later (), but maybe this could be a start:

Trigger javascript on clicking any page link, but before the page content loads?

Hey There’s currently no method in the Plugin-API that will allow you to fire a script before a page transition because this has not come up before as far as I recall. That said, you can leverage on the willTransition() action in the application route You would use something that like this in your theme / component // this fires after the transition api.onPageChange((url, title) => { console.log("after transition"); }); // this fires right before the transition api.modifyClass("r…

[Discoursenaut]

Ah, many thanks, yes, some of my community leaders who have default layout set to latest, would prefer for the banner to only show up on the categories page for example. I’ll review the link you shared.

[Canapin (Coin-coin le Canapin)]

Okay, here’s a working solution. In my example, the Welcome Banner will be displayed on the /latest page only, regardless of users’ interface settings. I’ll let you customize it to display it for the /categories page only.

1. Set the Welcome Link Banner show on setting to “all” or “discovery”, depending on the page(s) you want the banner to be displayed.

2. Add this script in your theme:

   <script type="text/discourse-plugin" version="1.4.0">
       //shows the welcome banner only on the /latest page
       api.onPageChange(() => {
           const router = api.container.lookup('service:router');
   
           if (router.currentRoute.name === 'discovery.latest') {
               document.body.classList.add('route-discovery-latest');
           } else {
               document.body.classList.remove('route-discovery-latest');
           }
       });
   </script>
   

3. Add this CSS to your theme:

   body:not(.route-discovery-latest) .welcome-link-banner-connector {
      display: none;
   }
   

---

Reference used:

Is there a way to style the "Latest" page and "Top" page separately?

Yes, @nolo’s solution is a good approach for achieving things quite simply. Using window.location.href you may run into issues with getting the correct url due to Ember’s runloop anyways. To adjust what your doing into the more “Ember” approach would be to do something like this: <script type="text/discourse-plugin" version="1.1.0"> api.onPageChange(() => { const router = api.container.lookup('service:router'); if (router.currentRoute.name === 'discovery.top') { document.quer…

[Discoursenaut]

Thanks for this, many many thanks!