Many believe that breadcrumbs have a good impact on search engine optimization. That is why many website owners want to add breadcrumbs to their websites. In Elementor, you can add breadcrumbs to your website using the Breadcrumbs widget.
In dynamic websites such as blogs or news portals, breadcrumbs are commonly added to the single posts. In Elementor itself, you can add breadcrumbs to any part of your website. Be it pages, single post templates to archive pages. In this post, we will show you how to add breadcrumbs to the single post template.
The Breadcrumbs widget is not available in Elementor by default. To get this widget, you need to install the Yoast plugin first. Go to the Plugins -> Add New to install the plugin. Once installed and activated, go to SEO -> Search Appearance.
In the Search Appearance page, go to the Breadcrumbs tab and enable breadcrumbs by sliding the button.
Don’t forget to click the Save Changes button on the bottom side to apply the change. Before clicking the button, you can also make the settings to set how your breadcrumbs will look like. You can set things like the separator, taxonomy to show and so on.
We already have a single post template created with Elementor and want to use it as an example. You can visit this post to learn how to create a custom single post template in WordPress with Elementor. To edit an existing single post template, you can go to Templates -> Theme Builder.
Find your single post template on the Single tab. Hover your mouse over it and click Edit.
You will be directed to the Elementor editor. Drag the Breadcrumbs widget to the part where you want to add it.
Once the Breadcrumbs widget is added, you can go to the left panel to customize it. The first setting you want to make probably is the alignment.
To set more advanced customization, you can go to the Style tab. You can click the pencil icon on the Typography section to set the font style and font size. While to set the font color you can click the color selector on the Text Color section.
Publish your page (or update if you edit an existing template) to apply the breadcrumbs.