<h2>Overview</h2>
<p>The <strong>nextjs-breadcrumbs</strong> is a dynamic and highly customizable breadcrumbs component designed for use specifically within Next.js applications. It offers features such as custom label transformations, omission of root labels, and the ability to style each HTML element of the component individually.</p>
<h2>Features</h2>
<ul>
<li><strong>Dynamic Breadcrumb Navigation:</strong> Generates a breadcrumb navigation based on the current path of the Next router.</li>
<li><strong>Custom List of Characters:</strong> Allows for the customization of characters to be replaced in each label.</li>
<li><strong>Custom Label Transformation:</strong> Provides the option to pass a label transformation function to customize the labels.</li>
<li><strong>Omit Root/Home Label:</strong> Ability to omit the root level label entirely.</li>
<li><strong>Omit Specific Path Indexes:</strong> Users can choose to omit certain path indexes from the breadcrumb navigation.</li>
<li><strong>Custom Styling (CSS):</strong> Enable users to style each HTML element of the component separately.</li>
</ul>
<h3>Prerequisites</h3>
<ul>
<li>To use the default styling, import the CSS file from the package by adding <code>import 'nextjs-breadcrumbs/dist/index.css';</code> at the top of your <code>_app.js</code>.</li>
</ul>
<h3>Usage</h3>
<ol>
<li><strong>Custom Styling:</strong> Use inline styles or assign your classes for styling.</li>
<li><strong>Breadcumb Navigation:</strong> Utilize the dynamic breadcrumb navigation based on the Next router's current path.</li>
<li><strong>Customization Options:</strong> Take advantage of features like custom label transformations and the ability to omit root labels or specific path indexes.</li>
</ol>


Niklasmencke

Nextjs Breadcrumbs