Back to contents

How to add breadcrumbs to the header built with Elementor. Breadcrumbs path customization

Reading this tutorial will help you to add breadcrumbs to the header built with Elementor and display the breadcrumbs path with JetBlocks plugin.

Breadcrumbs widget of JetBlocks plugin allows you to add the trail the visitor has gone to reach a certain page. It’s convenient for the visitor as well for you as a creator. Breadcrumbs can also help search engines to get your site to the first positions.

Breadcrumbs adding

Step 1 – Navigate to the WP Dashboard. Here you should scroll to the bottom and click on Crocoblock > My Library option.

Step 2 – Open the Header tab. Here choose the header you want to be edited (you may have several of them, so select the one you want to be showcased on your site with breadcrumbs).

Header in the Crocoblock library

Step 3 – Click on the Edit with Elementor link and then press the Edit Header button.

Step 4 – Then, look for the Breadcrumbs widget and drop it to the special place on the header section.

Breadcrumbs widget

Step 5 – Navigate to the Content > General settings tab and here you can choose whether to show Page Title and Prefix or not.

Step 6 – You can select the Separator Type: the icon or the Custom one. The last allows you to add any other symbol that you want. Here you are able to set the required alignment.

Step 7 – Go to the Style tab and set the one you like the most. Here you can change the style for the Normal, Hover and Current type of presentation. And surely you are able to change the gap between the components.

Breadcrumbs path customization

Along with the settings that we’ve previously done there are the ones to widen the Breadcrumbs widget’s possibilities. You can customize the trial shown in the breadcrumbs. How to do it? Let’s discover it together.

Step 1 – Proceed to the WP Dashboard and at the left sidebar look for the Elementor option, choose here JetBlocks Settings and click on it.

Step 2 – On the following screen, you should select on the left sidebar the Breadcrumbs Settings option. Follow the link.

Breadcrumbs settings

Step 3 – Here you can set which taxonomy is preferable to be showcased within the breadcrumbs for the post type you’ve chosen. It can be posts types, saved templates, etc.

All in all, there aren’t any difficulties with adding the breadcrumbs using JetBlocks functionality. The great work is done and it’s time to go to the other settings!