How to Customize 3-Level Category Titles for Better SEO in Browser Tabs?

I want to restructure my Discourse forum’s category titles in the browser tab to be more SEO-friendly for Google search. My forum categorizes topics based on real estate locations using a 3-level hierarchy:

  • For Sale / District / Specific Street
    • For Sale / District 1 / Mac Thi Buoi Street
    • For Sale / District 1 / Bui Thi Xuan Street
  • For Rent / District / Specific Street
    • For Rent / District 1 / Mac Thi Buoi Street
    • For Rent / District 2 / Tran Nao Street

Current Issue:

In the browser tab, Discourse currently displays the category structure as:

js.filters.with_category
%{category}

This results in the Level 2 and Level 3 categories being shown, but excluding Level 1 (For Sale / For Rent):

  • Expected (SEO-Friendly Title): For Sale Mac Thi Buoi Street District 1
  • Current Output: District 1 Mac Thi Buoi Street

Goal:

I want to restructure the title format to be more descriptive and optimized for Google indexing, like this:

:white_check_mark: For Sale Mac Thi Buoi Street District 1
:white_check_mark: For Rent Tran Nao Street District 2

What I’ve Tried:

I attempted modifying the theme component in Admin > Customize > Themes > Edit CSS/HTML > Header, but it didn’t work.

Is there a way to customize the js.filters.with_category variable or adjust Setting/Customize/Text to achieve the desired title structure?