Oro Documentation
Oro Documentation
  • USERS
  • DEVELOPERS
    • Backend Developer Guide
    • Frontend Developer Guide
    • Bundles & Components
    • Web Services API Guide
    • Community Guide
  • CLOUD
  • BLOG
  • ACADEMY
  • Home >
  • Developer Documentation >
  • Backend Developer Guide >
  • Navigation
  • Backend Developer Guide
    • Setup
      • System Requirements
        • Performance Optimization
        • MySQL Optimization
      • Development Environment
        • Community Edition
        • Enterprise Edition
        • Docker & Symfony Server
          • Setup on Ubuntu
          • Setup on macOS
          • Setup on Windows
        • Web Server Configuration
        • Environment Types
        • Infrastructure-Related Configuration Parameters
        • Healthcheck and Data Monitoring
        • Setup From Database Dump
        • Oro Devbox VM
      • Demo Environment
        • Docker
        • VM VirtualBox
        • AWS Cloud Platform
        • Google Cloud Platform
        • Azure Cloud Platform
        • Vagrant Provision
      • Get the Oro Application Source Code
      • Installation
      • Installation in Sub-Folder
      • Post-Install Activities
        • Content Restrictions
        • Flat Pricing
        • Cookies Configuration
        • Protected Cookies
      • Loading Demo Data
      • Launch
      • Upgrade
      • Deploy Changes
      • Reinstall
    • Application Architecture
      • Technology Stack
        • Database
        • File Storage
        • Session Storage
        • Message Queue
        • Search Index
      • Application Structure
      • Application Framework
        • Architecture Principles of Oro Applications
      • Application Customization
      • Differences to Common Symfony Applications
      • Custom Oro Application
    • Bundles and Extensions
      • Create a Bundle
      • Install Extension from the Oro Extensions Store
      • Add an Extension to Oro Extensions Store
    • Entities
      • Create Entities
      • Database Structure Migrations
      • Extend Entities
        • Option Enum Set Fields
        • Extended Associations
        • Multi-Target Extended Associations
        • Serialized Fields
        • Validation for Extended Fields
        • Define Custom Form Type for Fields
        • Extending the Extended Field Rendering
      • Configure Entities
        • Define a New Object Configuration Attribute
        • Implementation
        • Add Configuration Options
        • Access Entities Configuration
      • Create Custom Entities
      • Merge Entities
      • CRUD Operations
      • Custom Field Validation
      • Entity Aliases
      • Entity Activities
      • Entity Fallback Values
      • Entity Manager
      • Entity Name Resolver and Providers
      • Entity Class Name Provider
      • Entity Structure Data Provider
      • Events
      • Dictionaries
      • Doctrine Field Types
      • Partial Indexes
      • Profiler of Duplicated Queries
      • Resolving ORM Query Hints
      • Entity Repositories as a Services
      • Transaction watchers for Default DBAL Connection
      • Attributes Configuration
      • Datagrids
        • Pass Request Parameters to the Grid
        • Enable Entity Pagination
      • Customize Datagrids
        • Backend Datagrid
          • Scopes
          • Datasources
            • Array Datasource
            • ORM Datasource
          • Parameter Binding
          • Extensions
            • Action Extension
            • Board Extension
            • Export Extension
            • Field ACL Extension
            • Formatter Extension
            • Grid Views Extension
            • Inline Editing
            • Mass Action Extension
            • Mode Extension
            • Pager Extension
            • Sorter Extension
            • Toolbar Extension
            • Totals Extension
          • Events
          • Advanced Grid Configuration
          • Editable Datagrid Cells
          • Selected Fields Providers
          • State Providers
          • References in YAML Configuration
        • Frontend Datagrid
          • Mass Action Configuration
      • Protect Entities Using ACLs
      • Entity Attachments
      • Customize CRUD Pages
      • Fixtures
    • Entities Data Management
      • Fixtures and Demo Data
      • Reports & Segments
      • Search Index
        • Configuration
        • Console Commands
        • Query Builder
        • Best Practices
        • Elasticsearch Configuration and Tuning
        • Fuzzy Search
        • Troubleshooting
      • Workflows
        • Introduction
        • Configuration Reference
        • Elements
        • Basic Configuration
        • Transition Forms
        • Translation Wizard
        • Configuration Example
      • Operations (Actions)
        • Glossary
        • Buttons
        • Action Groups
        • Configuration Reference
        • Actions and Conditions
        • Console Commands
      • Processes
      • Data Audit
    • Security
      • Introduction to Security in Oro Applications
      • ACL Manager
      • Custom Permissions
      • Field ACL
      • Configurable Permissions
      • CSRF Protection
      • Access Rules
      • Custom listeners
      • Access Levels and Ownership (Example)
    • Translation and Localization
      • Content and User Interface Translation
      • Translation Configuration
      • Data Fixtures
      • Schema Migrations
      • Localization
    • Integrations
      • Configuration
        • Basic Implementation
        • Configuration Reference
        • Additional Serializable Fields
        • Reverse Synchronization
        • Default Owner for Integration Related Entities
        • Additional Capabilities
      • Import and Export
        • Overview
        • Domain Model
        • Gaufrette
        • Fields Configuration
        • Import and Export Entities
        • Events
        • Extend Entities to Support Bulk Import and Export
        • Accelerate Import
        • Postponing Rows
      • Notification Alerts
    • Dashboards
    • Navigation
    • Emails
    • Message Queue
      • Message Queue Topics
      • Message Queue Jobs
      • Consumer
        • Resetting Container
      • Security Context
      • Logging, Error Handling and Debugging
        • Writing Logs to ELK Stack
      • Testing
      • RabbitMQ (Enterprise Edition Only)
        • Command Lines
        • RabbitMQ Exchanges
        • Divide Queue to Separate Queues
        • Configure RabbitMQ for Production
        • Re-deliver Message with Limited Attempts
        • Backup and Restore
        • Troubleshooting
      • Supervisord
      • Writing Logs to Stackdriver
      • Filtering Messages in the Message Producer
      • Buffering Messages in the Message Producer
      • Delaying Messages
    • Cron
    • WebSocket Notifications
      • Websocket Recipes
        • Use Maintenance Mode Notifications in Oro Applications
        • Use Content Outdated Notifications in Oro Applications
        • Create a Topic and a Handler for Publishing and Subscribing
        • Publish Messages to Existing Topics
        • Use Authentication and Authorization in WebSocket Connections
      • WebSocket Connection Configuration
    • Scopes
    • Feature Toggle
    • Logging
    • System Configuration
    • Configuration Reference
      • Annotations
        • @Acl
        • @AclAncestor
        • @Config
        • @ConfigField
        • @TitleTemplate
      • YAML
        • Bundles’ Configuration
        • Access Control Lists
        • Access Control List Categories
        • Assets
        • Dashboards
        • Datagrids
        • Entity Configuration
        • Navigation
        • Placeholders
        • JS Modules
        • Search Index
        • System Configuration
        • Workflows
    • Extending OroCRM
      • Add OroCommerce Capabilities to an OroCRM Application
    • Extending OroCommerce
      • Create Payment Method Integrations
      • Create Shipping Method Integrations
    • Akeneo Integration
    • Automated Tests
      • End-to-End
      • Integration
      • Functional
    • API Developer Guide
      • CLI Commands
      • Configure Stateless Security Firewalls
      • Configure Feature Depended Firewall Listeners
      • General Configuration
      • Configuration Reference
      • Configuration Extras
      • Configuration Extensions
      • Forms and Validators Configuration
      • Documenting API Resources
      • Actions
      • Request Type
      • Processors
      • Headers
      • Filters
      • Post Processors
      • How to
      • CORS Configuration
      • Testing REST API
      • Storefront REST API
      • Storefront Routes
      • Batch API
Version:
5.0 (latest)
  • 3.1
  • 4.1
  • 4.2
  • 5.1-BETA.1
  • Contents
    • Menus
      • Create Menu Items
      • Organize the Navigation Trees
    • Breadcrumbs
      • Breadcrumb Provider
      • Breadcrumbs Block Type
    • Titles

Navigation

Menus

The OroPlatform and the OroCRM come with a rich user interface. You can access every application part by browsing the provided navigation items.

OroPlatform leverages the famous KnpMenuBundle to provide highly customizable menus. You can add your own menu items to access your project-specific interfaces or even replace existing items.

Mastering the application menu is a two-step process:

  1. Create the new navigation items
  2. Compose trees of navigation items

The OroNavigationBundle automatically processes a YAML configuration file which is named navigation.yml when it is placed in the Resources/config/oro directory of a registered bundle. The menu configuration needs to be placed under the menu_config tree.

Create Menu Items

You can create new navigation under the items key. Each item must be identified by a unique name which acts as a key in the menu configuration:

src/Acme/DemoBundle/Resources/config/oro/navigation.yml
 menu_config:
     items:
         blog:
             label: acme_demo.menu.blog
             uri: '#'
         blog_categories:
             label: acme_demo.menu.blog_categories
             route: acme_demo.blog_categories
         blog_index:
             label: acme_demo.menu.blog_overview
             route: acme_demo.blog_index

The example above defines three menu items:

  • The blog item consists of a label and the URI #. The item will not react to mouse clicks but can be used as a placeholder for nested menus.
  • Both the blog_categories and the blog_index items reference an existing route. Thus, when the user clicks one of these items, they will get to a page rendered by the controller responsible for the configured route.

As you can see, the menu item labels will be translated by default. Hence you can use arbitrary labels here, as long as they can be translated by configured translator service. You can change the translation domain using the translateDomain option (by default, the translator’s default domain will be used).

Organize the Navigation Trees

The next step is composing a tree of the menu items you created. These trees are build under the tree key:

src/Acme/DemoBundle/Resources/config/oro/navigation.yml
 menu_config:
     tree:
         application_menu:
             children:
                 system_tab:
                     children:
                         blog:
                             children:
                                 blog_categories: ~
                                 blog_index: ~

First, you need to decide to which tree the items should be added. The Oro applications come with three predefined menus to which you can add new items:

application_menu

The horizontal main menu on top of the user interface.

usermenu

The menu that pops up when the user clicks on their username in the top right corner of the screen.
shortcuts
The shortcut bar above the main application menu.

In the example above, you can also see that you can add menu items to already existing subtrees. With the given configuration, the blog menu will appear under the application menu’s existing System tab.

If you wanted to create a dedicated blog tab instead, you would have to configure your items as child items of the application_menu entry like this:

src/Acme/DemoBundle/Resources/config/oro/navigation.yml
 menu_config:
     tree:
         application_menu:
             children:
                 blog:
                     children:
                         blog_categories: ~
                         blog_index: ~

Breadcrumbs

The breadcrumb provider’s goal is to show breadcrumbs based on a specific menu defined in navigation.yml. You can get the breadcrumbs through any existing menu alias. The menu can be created and used for the breadcrumbs’ structure only.

Breadcrumb Provider

To use the breadcrumb provider, create a layout update with a predefined breadcrumbs block type and the menu_name option:

CustomerBundle/Resources/views/layouts/blank/imports/oro_customer_page/oro_customer_page.yml
 layout:
     imports:
         -
             id: oro_customer_menu
             root: page_sidebar
     actions:
         - '@add':
             id: breadcrumbs
             parentId: page_main_header
             blockType: breadcrumbs                         #block type
             options:
                 menu_name: "oro_customer_breadcrumbs_menu" #menu alias

Breadcrumbs Block Type

You can avoid using the breadcrumb provider. For that, create a layout update with the predefined breadcrumbs block type and the breadcrumbs option:

WebCatalogBundle/Resources/views/layouts/blank/oro_product_frontend_product_index/product_index.yml
 layout:
     actions:
         - '@setBlockTheme':
             themes: '@OroWebCatalog/layouts/blank/oro_product_frontend_product_index/product_index.html.twig'
         - '@addTree':
             items:
                 category_breadcrumbs:
                     blockType: breadcrumbs
                     options:
                         breadcrumbs: '=data["category_breadcrumbs"].getItems()'

After the breadcrumbs block type rendering, you should see menu labels separated by slashes. All breadcrumb items can be clickable except the last one representing the current page.

Titles

OroNavigationBundle helps manage page titles for all routes and supports title translation. Root titles can be defined in the navigation.yml file:

titles:
    route_name_1: "%parameter% - Title"
    route_name_2: "Edit %parameter% record"
    route_name_3: "Static title"

The title can be defined with an annotation together with route annotation:

@TitleTemplate("Route title with %parameter%")
Oro Documentation
  • Oro inc
  • OroCommerce
  • OroMarketplace
  • OroCRM
  • OroPlatform
  • Partners
  • Services
  • Events
  • Twitter
  • Terms & conditions
  • Privacy policy
  • Contributor license agreement

@2021 Oro, Inc. All Rights Reserved.

Back to top