Breadcrumb

TsgcHTMLComponent_Breadcrumb — render a breadcrumb trail that shows the user's location in your site, in Delphi, C++ Builder and .NET.

TsgcHTMLComponent_Breadcrumb

A navigation component that emits a Bootstrap <ol class="breadcrumb">. The last item (or one flagged Active) renders as the current page. Add items, then read the HTML property.

Component class

TsgcHTMLComponent_Breadcrumb

Renders

Bootstrap breadcrumb markup

Languages

Delphi, C++ Builder, .NET

Create it, add items, render it

Push one item per trail segment into Items, optionally set a custom Divider, then read HTML.

uses
  sgcHTML_Component_Breadcrumb;

var
  oBreadcrumb: TsgcHTMLComponent_Breadcrumb;
begin
  oBreadcrumb := TsgcHTMLComponent_Breadcrumb.Create(nil);
  try
    oBreadcrumb.Divider := '>';

    with oBreadcrumb.Items.Add do begin Text := 'Home'; Href := '/'; end;
    with oBreadcrumb.Items.Add do begin Text := 'Products'; Href := '/products'; end;
    with oBreadcrumb.Items.Add do begin Text := 'sgcHTML'; Active := True; end;

    WebModule.Response := oBreadcrumb.HTML;   // <ol class="breadcrumb">
  finally
    oBreadcrumb.Free;
  end;
end;
// includes: sgcHTML_Component_Breadcrumb.hpp

TsgcHTMLComponent_Breadcrumb *oBreadcrumb = new TsgcHTMLComponent_Breadcrumb(NULL);
try
{
  oBreadcrumb->Divider = ">";

  TsgcHTMLBreadcrumbItem *oItem = oBreadcrumb->Items->Add();
  oItem->Text = "Home"; oItem->Href = "/";
  oItem = oBreadcrumb->Items->Add(); oItem->Text = "Products"; oItem->Href = "/products";
  oItem = oBreadcrumb->Items->Add(); oItem->Text = "sgcHTML"; oItem->Active = true;

  String html = oBreadcrumb->HTML;   // <ol class="breadcrumb">
}
__finally
{
  delete oBreadcrumb;
}
using esegece.sgcWebSockets;

var breadcrumb = new TsgcHTMLComponent_Breadcrumb();
breadcrumb.Divider = ">";

var item = breadcrumb.Items.Add();
item.Text = "Home"; item.Href = "/";
item = breadcrumb.Items.Add(); item.Text = "Products"; item.Href = "/products";
item = breadcrumb.Items.Add(); item.Text = "sgcHTML"; item.Active = true;

string html = breadcrumb.HTML;   // <ol class="breadcrumb">

Key properties & methods

The members you reach for most often.

Items

Items.Add returns a TsgcHTMLBreadcrumbItem; set its Text and Href for each trail segment, in order.

Current page

The last item, or any item flagged Active, renders as plain text with aria-current="page" instead of a link.

Divider

Divider overrides the separator between items (for example '>' or '/') via the Bootstrap --bs-breadcrumb-divider variable.

Identity

BreadcrumbID sets the id on the wrapping <nav> for styling or scripting hooks.

Output

HTML returns the full <nav aria-label="breadcrumb"> with its ordered list — serve it, or assign it to a page template's BodyContent.

Keep exploring

All sgcHTML ComponentsBrowse the full feature matrix of 60+ components.
Download Free TrialThe 30-day trial ships the 60.HTML demo projects.
PricingSingle, Team and Site licenses with full source code.

Ready to Get Started?

Download the free trial and start building web UIs in Delphi, C++ Builder and .NET.