Breadcrumb Overview

The Breadcrumb is an intuitive UI component that allows navigation within a folder structure or web page. It provides an easy way to navigate backwards by one or multiple steps.

Kendo UI for jQuery Kendoka image

The Breadcrumb is part of Kendo UI for jQuery, a professional grade UI library with 100+ components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial.

Initializing the Breadcrumb

To initialize the Breadcrumb, use the <nav> tag.

The following example demonstrates how to initialize the Breadcrumb from an existing <nav> element.

    <nav id="breadcrumb"></nav>

    <script>
        $("#breadcrumb").kendoBreadcrumb({
            items: [
                {
                    type: "rootitem",
                    href: "https://demos.telerik.com/kendo-ui/",
                    text: "All Components",
                    showText: true,
                    icon: "home",
                    showIcon: true
                },
                {
                    type: "item",
                    href: "/breadcrumb",
                    text: "Breadcrumb",
                    showText: true
                },
                {
                    type: "item",
                    href: "/index",
                    text: "Basic Usage",
                    showText: true
                }
            ]
        });
    </script>

Functionality and Features

See Also

In this article
Not finding the help you need? Improve this article