Digital Team
About UsEdit in Gitbook
  • Welcome
  • Getting started
    • Life on the Digital team
      • Meetings
      • Communication
      • Software engineering working agreement
    • Contributing to Boston.gov
    • Using GitBook
  • Standards & best practices
    • Digital Team Release Notes
    • Working with Partners
    • Accessibility at COB
      • Developers
      • Content Editors
        • How to guide
      • Resources
      • Working with Iterators
    • Analytics and Metrics
    • Code of Conduct
    • General
    • Code reviews
    • Project Management
    • Git / GitHub
      • Contacts at Github
      • Git Command Tips
      • GitHub Service Accounts
    • Code quality
      • Automated tests & static analysis
      • Code comments
      • Style guides
        • Drupal/PHP
          • D8 Dependency Injection (DI)
        • React/TypeScript
    • Technical documentation
    • Hosting and monitoring
    • Deployment
  • Guides
    • Technology stack and technologies used
      • Web applications
    • Drupal - boston.gov
      • Custom Development & Configuration
        • On Demand Instances
          • Acquia Environment setup checklist
        • Continuous Deployment Process
        • Developer Onboarding
          • Step 1: Local Dev Environments
          • Step 2: Version control
          • Step 3: Introduction to Drupal
          • (to be sorted)
            • Development environment
              • PHP CodeSniffer
              • VSCode IDE Setup
              • AWS for Developers
              • Using Windows
            • Installation instructions
              • Typical build output
              • Lando 101
              • Verify Installation
                • Local Patterns installation
              • Windows install
              • PhpStorm settings configurations
          • Step 4: Site Building in Drupal 8
        • Site Development Notes
          • Git Best Practices - Drupal
          • Drupal Cache
          • Drupal Config
          • Custom Modules
            • Custom Themes
              • Front-end Theme (bos_theme)
                • Site Breadcrumbs
              • Back-end Theme (bos_admin)
            • Adding Templates to Custom Modules
            • Custom Content Types
              • D7 -> D8 Conversion
              • Content Editor UX
                • Content Moderation
              • In-page Navigation Menu
            • Custom Paragraphs
              • D7 -> D8 Conversion
            • Custom Taxonomies
            • WebApps
          • Drupal UX-specific
            • Image Styles & UX
            • Example Content Pages
          • PHPStorm IDE
        • CKEditor
      • Drupal Apps/Content Types
        • Budget Website
        • Building Housing
          • BH Drupal Entities
          • BH Map Webpage
          • BH Property Webpage
            • BH Project Timeline
          • BH Salesforce Sync
            • Salesforce Contributed Module
        • Contact Form
        • Election results
        • Google reCAPTCHA
        • My Neighborhood Lookup
        • Metrolist
        • Metrolist (Drupal)
        • Project Tracker
          • Content Types (& Paragraphs)
          • Taxonomies
          • Views
          • Developer Notes
      • Drupal Features & Components
        • Single Sign On (SSO)
          • Drupal SAML Knowledgebase
          • SamlAuth
        • Maps on boston.gov
        • Charts on boston.gov
          • Quick Overview
          • Chart Data
          • Chart Configuration
          • Advanced Concepts and Techniques
          • Charts on boston.gov (legacy)
          • Useful Resources
      • Drupal micro-services (API end-points)
        • Integrating with Boston.gov
        • Assessing Forms Endpoint
        • Bos311 API
        • Cityscore
          • Knowledge Base
        • PDF Manager Module
        • PostMark Email Services
          • Postmark Knowledgebase
        • Upaknee Email List Services
        • Public Notices
        • Site Alerts
          • CodeRed Subscription
      • Drupal - Weekly Maintenance
      • Drupal - Periodic Maintenance
    • Digital Webapps
      • Libraries and Tools
        • Emotion
        • Storybook
        • Rollbar
      • Services
        • AWS-hosted Microservices
          • SQL Proxy API (DBConnector)
            • Developer Notes
          • PDFToolkit API (DB Connector)
            • Developer Notes
      • Webapps - Maintenance
      • Webapps
        • Boston Family Days
        • Property Tax Calculator
        • Access-Boston
          • Updating IAMDIR/Group Management/LDAP certificates
          • Node Server
          • Portal App Tile Configurations
          • Ownership of Concerns
          • Updating SAML Certificates
          • Applications/Services
            • Group Management
            • Confirm ID/ID Verification
            • Preferred Name
        • Sanitation Scheduling
        • Registry-Certs
          • Marriage Intention
      • DevOps
        • New service setup
          • Non-Monorepo Service Setup
        • Service Configuration
          • Editing a project’s configuration using Cyberduck
        • Managing AWS
          • Production Overview
          • AWS Bastion Access
          • Terraform
            • Updating the ECS cluster AMI
          • Restarting an ECS service
          • Encrypting service configuration for S3
          • Mounting AWS SFTP as a Drive (Mac)
        • Webapp Deployment
          • Deploy to AWS 2021
            • Deploy Tool (cob_ecrDeploy)
    • Fleet - Pattern Library
      • Patterns Library Architecture
      • Icon Library Architecture
      • Developers
        • Local Development for Drupal Developers
      • Patterns Library Maintenance
    • Legacy Website - cityofboston.gov
      • Animal Control
        • Dog Licenses
      • No Tow
        • Street Sweeping Reminders
        • Street Occupancy Alerts
        • Towing Alerts
        • Towing Search
        • Subscription Search
        • Proposed Restructure
          • Backend
        • Reillys Notes
      • Workers' Compensation Inquiry Form
      • Streetbook
      • Legacy Website - Maintenance
        • Animal Control Maintenance
        • Assessing Online (AOL) Maintenance
          • Knowledge-base
          • Disclosure Period
          • Annual PDF Initialization
          • Database Tables
        • No-Tow Maintenance
    • AgilePoint
      • AgilePoint: Adding Users
      • Migrating AGP Applications from one platform to another
    • The Hub - hub.boston.gov
      • The Hub - Maintenance
    • Maintenance
      • Updating SSL Certificates
    • Redirects
      • Redirecting from cityofboston.gov
      • URL redirects versus URL aliases - Drupal
      • DNS Redirects
    • Decommissioned Apps or Services
      • Archived Forms Information
      • CodeRed
      • Drupal 7
        • Deployment (2019)
          • Why do we peer-review pull-requests ?
      • Rentsmart
      • SnowStats
      • Ruby
    • Weglot translation
      • What to do in Weglot
      • What to do on the website or page
        • Softr
        • Drupal Powered Pages
        • Custom Pages
  • Projects
    • Project: Patterns Library Cleanup
      • Project: Refactoring Legacy CSS
        • Strategy
        • Regression Testing
        • Maintenance
    • Project: Upaknee
    • Project: Everbridge API + UI
    • Project: 311 CRM Upgrade
      • Project: City Worker Upgrade to City Worker 5
      • Project: Lagan 311 CRM upgrade to 15r4
    • Project: Fleet (Pattern Library Design System)
    • Project: Monorepo Decoupling
    • Inactive projects
      • Project: 311 (Salesforce Upgrade)
      • Project: Access Boston
        • General/Historical Documentation
          • Edit Config and Upload Icons
        • Processes
          • Process: Adding New Icon to Access Boston Website
          • Process: Non-icon Access Boston Feature or Bug Requests
          • Self-Service
      • Project: Alexa Skill
      • Project: Assessing Online
        • 2022 Notes
      • Project: Boards and commissions
      • Project: City Hall Appointment Scheduler
      • Project: CityScore
      • Project: Mobile Apps
      • Project: Permit Finder
      • Project: Public Notice Signage
      • Project: Registry Suite
        • Birth certificates
        • Marriage Certificates
        • Marriage Intention
        • Death Certificates
      • Project: Work With U.S. Digital Response Team
      • Project: TDM Points App
      • Project: Translation on boston.gov
  • External resources
    • Learning resources
    • Reference links
    • Applications and extensions
Powered by GitBook
On this page
  • Drupal Core Breadcrumb Functionality
  • CoB Theme extension for breadcrumbs

Was this helpful?

Export as PDF
  1. Guides
  2. Drupal - boston.gov
  3. Custom Development & Configuration
  4. Site Development Notes
  5. Custom Modules
  6. Custom Themes
  7. Front-end Theme (bos_theme)

Site Breadcrumbs

Breadcrumbs are an informative device which appear on many pages on the site. Breadcrumbs provide the user a sense of location within the site and a way to logically navigate back to the homepage.

A breadcrumb is an ordered collection of crumbs, with each crumb having a title and a link.

Drupal Core Breadcrumb Functionality

Drupal has a built-in breadcrumbs methodology, which will attempt to build out a pathway based on the URI (e.g. /departments/housing/metrolist) defined by the pages (i.e. nodes) URL Alias.

It does not matter if the URL Alias is set manually or automatically, the value shown in the back-end editor form once the node is saved is used to build out the breadcrumb.

The Drupal core process creates the breadcrumb by scanning the path represented by the URI, and testing if a local page exists for each path element. It stops adding crumbs when a path element does not resolve.

FOR EXAMPLE an article is created with a URI (as defined in its URL Alias): /departments/housing/boston/housing-information-in-boston.

When the page is rendered, Drupal scans the articles URI and

  • if we have a breadcrumb setting which stipulates that the homepage should always be shown as the first crumb, then a crumb of home with a link to https://site is created, then

  • checks if /departments is a valid URI. https://site/departments is a valid URI, so it creates a crumb of "departments" with a link to https://site/departments , then

  • checks if /departments/housing is a valid URI. https://site/departments/housing is a valid URI, so it creates a crumb of "housing" with a link to https://site/department/housing , then

  • checks if /departments/housing/boston is a valid URI. https://site/departments/housing/boston is NOT a valid URI - there is no page with that name on https://site so the breadcrumb scanner stops evaluating at this point, but

  • if we have a breadcrumb setting to display the actual page in the breadcrumb then a final crumb of housing information in boston is added, with no link (because this is the page showing).

The final breadcrumb in this instance would be HOME > DEPARTMENTS > HOUSING > HOUSING INFORMATION IN BOSTON with links on the first 3 crumbs.

When evaluating if a page exists on the site, Drupal only considers URL Aliases and does not check URL Redirects. So in the example above, the boston crumb/link still would not appear in the breadcrumb even if a place_profile page for Boston existed with the URL Alias of /places/boston and a URL Redirect for /departments/housing/boston.

CoB Theme extension for breadcrumbs

Where Drupal core cannot build out its own breadcrumb trail, there is some additional custom code intended to help make a logical breadcrumb.

The custom breadcrumb code only functions when it determines that Drupal has not built out the entire breadcrumb.

If Drupal has been able to build out all parts of the URI path, then the Drupal breadcrumb is used.

Scans Redirects

The custom code scans URL redirects as well as URL Aliases when building out the breadcrumbs.

Care: Redirects which are manually made on the page admin/config/search/redirect are usually considered "external" by default. Breadcrumbs which use an external link may behave unexpectedly when clicked.

Example: the breadcrumb on d8-dev.boston.gov may open a page on www.boston.gov when clicked.

Solution: Do not create redirects for internal (i.e. Drupal hosted) pages on in the admin/config/search/redirect page. Instead create redirects using the redirect function on the "advanced" tab of the editor form for a page.

Custom Replacements

Some URI paths are hard-coded to build specific breadcrumbs.

For example pages which have a URI path starting with government/cabinet . The custom code ignores the "government/cabinets" part of the path and then build the breadcrumb from the remainder of the path.

The custom breadcrumb object is built here: bos_theme/bos_theme.theme::bos_theme_preprocess_breadcrumb()

The breadcrumb is styled here: bos_theme/templates/navigation/breadcrumb.html.twig

PreviousFront-end Theme (bos_theme)NextBack-end Theme (bos_admin)

Last updated 2 years ago

Was this helpful?