The breadcrumb component
A secondary navigation aid that helps users understand their location on a website or mobile application.
Introduced in SQLPage v0.18.0.
Top-level parameters
class
class attribute added to the container in HTML. It can be used to apply custom styling to this item through css. Added in v0.18.0.
id
id attribute added to the container in HTML. It can be used to target this item through css or for scrolling to this item through links (use "#id" in link url).
Row-level parameters
title
REQUIRED. Hyperlink text to display.
active
Whether the link is active or not. Defaults to false.
description
Description of the link. This is displayed when the user hovers over the link.
link
Link to the page to display when the link is clicked. By default, the link refers to the current page, with a 'link' parameter set to the link's title.
Example 1
Basic usage of the breadcrumb component
select
'breadcrumb' as component;
select
'Home' as title,
'/' as link;
select
'Components' as title;
select
'Breadcrumb' as title;Result
Example 2
Description of a link and selection of the current page.
select
'breadcrumb' as component;
select
'Home' as title,
'/' as link,
TRUE as active;
select
'Articles' as title,
'blog.sql' as link,
'Stay informed with the latest news' as description;
select
'No code vs. Low Code' as title,
'/blog.sql?post=SQLPage versus No-Code tools' as link;