Breadcrumb-component (v1)

De component van de Breadcrumb van de Component van de Kern is een navigatiecomponent die een broodkruimel van verbindingen bouwt die op de plaats van de pagina in de inhoudshiërarchie wordt gebaseerd.

Gebruik

De component Breadcrumb geeft de positie van de huidige pagina binnen de sitehiërarchie weer, zodat bezoekers van de pagina vanuit hun huidige locatie kunnen navigeren in de paginahiërarchie. Deze functie is vaak geïntegreerd in kop- en voetteksten van pagina's.

Beschikbare opties, zoals het standaardnavigatieniveau en de mogelijkheid om de huidige pagina of verborgen pagina's weer te geven, kunnen door de sjabloonauteur worden gedefinieerd in het ontwerpdialoogvenster. De inhoudeditor kan dan kiezen of verborgen pagina's wel of niet moeten worden weergegeven en het daadwerkelijke navigatieniveau voor de component in het dialoogvenster bewerken.

Versie en compatibiliteit

In dit document wordt versie 1 van de Breadcrumb Component beschreven, die oorspronkelijk is geïntroduceerd met versie 1.0.0 van de Core Components met AEM 6.3.

In de volgende tabel wordt de compatibiliteit van v1 van de component Breadcrumb weergegeven.

AEM Breadcrumb-component v1
6,3 Compatibel
6,4 Compatibel
LET OP

In dit document wordt versie 1 van de component Breadcrumb beschreven.
Zie het document Breadcrumb Component voor meer informatie over de huidige versie van de Breadcrumb-component.

Uitvoer van voorbeeldcomponent

Het volgende voorbeeld wordt genomen uit We.Retail.

Schermafbeelding

HTML

<div class="cmp cmp-breadcrumb aem-GridColumn aem-GridColumn--default--12">

<ol class="breadcrumb">
    <li class="breadcrumb-item ">
        <a href="/content/we-retail/us.html">
            United States
        </a>
    </li>

    <li class="breadcrumb-item ">
        <a href="/content/we-retail/us/en.html">
            English
        </a>
    </li>

    <li class="breadcrumb-item active">

            Experience

    </li>
</ol>

</div>

JSON

"breadcrumb": {
              "columnClassNames": "aem-GridColumn aem-GridColumn--default--12",
              ":type": "weretail/components/content/breadcrumb"
            }
OPMERKING

Voor JSON-export van de Core Components is release 1.1.0 van de Core Components vereist. Zie compatibiliteitsinformatie voor Core Components v1 voor meer informatie.

Dialoogvenster Bewerken

In het dialoogvenster Bewerken kan de auteur van de inhoud verborgen en actieve pagina's in de broodkruimels onderdrukken, evenals de diepte in de hiërarchie die moet worden weergegeven.

  • Navigatieniveau om te beginnen : waar in de hiërarchie moet de component breadcrumb omlaag gaan naar de huidige pagina. Bijvoorbeeld in We.Retail:

    • 1 begint bij /content/we-retail
    • 2 begint bij /content/we-retail/<country>
  • Verborgen tonen - Pagina's tonen die zijn gemarkeerd als verborgen in de broodkruimel (deze worden standaard niet weergegeven)

  • Huidige verbergen - De huidige pagina in de broodkruimel onderdrukken (standaard wordt deze weergegeven)

Ontwerpdialoogvenster

In het ontwerpdialoogvenster kan de sjabloonauteur definiëren wat de standaardwaarden zijn voor de opties voor het onderdrukken van verborgen en actieve pagina's in de broodkruimels en de diepte in de hiërarchie die moet worden weergegeven.

  • Navigatieniveau om te starten - Definieert de standaardwaarde waar in de hiërarchie de component breadcrumb naar beneden moet lopen naar de huidige pagina wanneer de component breadcrumb aan een pagina wordt toegevoegd.

  • Verborgen tonen - Hiermee definieert u de standaardwaarde van de optie Verborgen tonen wanneer de component breadcrumb aan een pagina wordt toegevoegd.

    • Hiermee wordt de optie voor de auteur niet in- of uitgeschakeld. Hiermee wordt alleen de standaardwaarde ingesteld.
  • Huidige verbergen - Hiermee definieert u de standaardwaarde van de optie Currentotie verbergen wanneer de component breadcrumb aan een pagina wordt toegevoegd.

    • Hiermee wordt de optie voor de auteur niet in- of uitgeschakeld. Hiermee wordt alleen de standaardwaarde ingesteld.

Technische details

De recentste technische documentatie over de Component van Breadcrumb kan op GitHub worden gevonden.

Het volledige kerncomponentenproject kan van GitHub worden gedownload.

Meer details over het ontwikkelen van de Componenten van de Kern kunnen in de ontwikkelaarsdocumentatie van de Componenten van de Kern worden gevonden.

Op deze pagina