Creating Breadcrumbs in Oracle Apex

Creating Breadcrumbs in Oracle Apex

Written by
Vinish Kapoor is a seasoned software development professional and a fervent enthusiast of artificial intelligence (AI). His impressive career spans over 20 years, marked by a relentless pursuit of innovation and excellence in the field of information technology. As an Oracle ACE, Vinish has distinguished himself as a leading expert in Oracle technologies, a title awarded to individuals who have demonstrated their deep commitment, leadership, and expertise in the Oracle community.

Breadcrumbs are useful for any web application to navigate to the home or parent pages easily. Also, it increases the look and feel of the page by showing the page hierarchy. In this tutorial, you will learn how to create breadcrumbs in Oracle Apex.

Steps to Create Breadcrumbs in Oracle Apex

Open your Oracle Apex application, then click on the Shared Components > Breadcrumbs.

You will find a default Breadcrumb created by Apex. You can choose that or can create a new breadcrumb.

In the existing breadcrumb, you will find a default entry for the home page. Click on that and then create a new Breadcrumb entry as shown in the below image:

Create breadcrumb entry.

For your Oracle Apex application's every page, you will have to create a breadcrumb entry. Below is an example of it.

In the below example, we will create a breadcrumb entry for page 2 (Student Report):

  • Breadcrumb: Select the Breadcrumb from the list
  • Page: 2 - Specify the page number for which you are creating the breadcrumb
  • Parent Entry: Home - Select the parent page
  • Short Name: Specify the breadcrumb name to display
  • Target page: Specify the page number to redirect on click

Breadcrumb entry for a page.

Then click on the Create Breadcrumb Entry button to create the breadcrumb entry. It will start creating the hierarchy as shown below:

Breadcrumb hierarchy.

After creating breadcrumbs for all your pages, you can display them by creating the breadcrumb region on the Global Page (Page 0) to display on all your pages automatically. Follow the below steps:

Open the page 0.

Then click on the Region node and create a region, and set the following properties:

  • Title: Breadcrumbs
  • Type: Breadcrumb
  • Source > Breadcrumb: Breadcrumb
  • Position: Breadcrumb bar
  • Template: Title Bar
  • Template Options: Use the compact style

Below is the screenshot for the above settings:

Create breadcrumb region.

Now save the changes, and the breadcrumbs will be started to show on your pages:

Breadcrumbs on the pages.

If you don't want to show the breadcrumb regions on specific pages, you can specify the comma-separated list of pages to exclude in the server-side condition for the breadcrumb region. Below are the property settings:

  • Server-side Condition > Current page is not in comma-separated list
  • Pages: 5,9

The above setting will prevent the breadcrumbs from displaying on pages 5 and 9.

Related Posts: