Display a hierarchical representation of navigation links and make your site’s navigation easier to follow, add breadcrumbs to your site to improve the user’s experience, and yeah It's good for SEO too.

Content Options

BreadCrumbs

Show Custom Home

Enable this option If you want to show a Custom Text for the Home Link.

Show Home Icon

Enable this option If you want to show an Icon along with the Text of Home link. You'll see an Icon Picker where you can choose any icon from Divi Icon Library for your Home Link.

Custom Separator Icon

Enable this option If you want to set a Custom Icon for the Separator. You'll see an Icon Picker where you can choose any icon from Divi Icon Library for your Separator.

Design Options

Alignment

Here you can change the Alignment of the Breadcrumbs, enable the responsive option to set a different alignment for Mobile Devices.

Items

Here you can design the Items/Links in the Breadcrumbs, you can add Background Color, Padding, Border Radius, Box Shadow and more.

Item Background Color

Here you can define a custom Color for the Links/Items in the Breadcrumb.

Bottome Gap

Add a gap between Breadcrumbs Items/Links if the structure of the Breadcrumbs is longer than the space given to it.

Items Padding

Set a padding around the Item/Link from here, useful If you've added a Background color to the Item.

You can design the Item/Link color, font size and more.

Rounded Corners and Borders

Add Rounded Corners or Borders to the Item/Link here.

Box Shadow

Set a custom Shadow to show for the Links/Items in the Breadcrumbs. Enable Hover option to show shadow on Hover.

Home Icon

Here you'll be able to design the Home Icon If you've enabled it.

Icon Color

Here you can change the Color of the Home Icon. If you've enabled the option (Show Home Icon) in the Content tab.

Icon Size

Here can define a custom size for the Home Icon.

Separators

Here you'll be able to design the Separator in the Breadcrumbs.

Separators Background Color

Here you can define a custom Color for the Separator in the Breadcrumb.

Bottome Gap

Add a gap to Separator if you feel there is a need of it.

Items Padding

Set a padding around the Separator from here, useful If you've added a Background color to the Separator.

You can design the Item/Link color, font size and more.

Rounded Corners and Borders

Add Rounded Corners or Borders to the Separator here.

Box Shadow

Set a custom Shadow to show for the Separators in the Breadcrumbs.

Current

Here you'll be able to set custom design values for the Current Item in the breadcrumbs.

Item Background Color

Here you can define a custom Color for the Current Links/Items in the Breadcrumb.

Bottome Gap

Add a gap between Breadcrumbs Current Items/Links if the structure of the Breadcrumbs is longer than the space given to it.

Items Padding

Set a padding around the Current Item/Link from here, useful If you've added a Background color to the Item.

You can also design the Current Item/Link color, font size and more.

Rounded Corners and Borders

Add Rounded Corners or Borders to the Current Item/Link here.

Box Shadow

Set a custom Shadow to show for the Current Links/Items in the Breadcrumbs. Enable Hover option to show shadow on Hover.

Advanced Options

Use the advanced options to give your Breadcrumbs module custom CSS ID’s and Classes. Add some custom CSS for advanced styling and designate the module’s visiblity on certain devices.