Breadcrumb shortcode and Header Title and Breadcrumbs options

Hi Rikard,

meanwhile I managed to achieve the desired result, but by a rather laborious approach based on overwriting some css classes. I generally don’t like hiding unwanted elements by just not displaying them – none-displayed by css they remain in the sourcecode nonetheless. In case of certain meta data (e.g. usernames) this isn’t of much help.

However, here’s what I did to hide breadcrumbs in the header but show them by [bread_crumb] shortcode in a text block elsewhere (but it would be great if there were a much simpler solution).

Unfortunately the source code (used html elements and css classes) resulting from the [bread_crumb] shortcode is exactly the same as used in the header section, so I had to distinguish the shortcode result from the standard code in order to address the standard and the shortcode css classes in different ways (I didn’t want just hide the breadcrumbs in the header, but wanted to style the shortcode results differently).

In order to use [bread_crumb] shortcode at all I added
add_shortcode( 'bread_crumb', 'avia_title' );
to my child theme’s functions.php

Then, to remove the title from the breadcrumb, I added

add_filter('avf_title_args', function($args) {
	$args['html']  = "<div class='{class} title_container'><div class='container'>{additions}</div></div>";
	return $args;
});

to functions.php as well.

Now by adding
add_theme_support('avia_template_builder_custom_css');
to functions.php I turned on custom CSS class field for all ALB elements.

Then I assigned the text block containing the [bread_crumb] shortcode a custom css class (“my_breadcrumb”).

To hide the breadcrumb in the header, I added

.title_container {
	display:none;
}

to my child theme’s style.css.

But since this hides the result from [bread_crumb] shortcode as well, I had to show it again by using my custom css class (and doing some styling on this occasion):

.my_breadcrumb .title_container {
	display:block;
	background: transparent !important;
	padding: 0px !important;
}

Further styling involved:

.my_breadcrumb .title_container .container {
	padding: 0px !important;
	min-height:10px !important;
}
.my_breadcrumb .container_wrap {
	border:none;
}
.my_breadcrumb .title_container .breadcrumb {
	position:relative;
	right:auto;
}

This may be tackling it in a roundabout way, but it finally worked for me.

I’m fine with this now, but it would be great if in future versions the [bread_crumb] shortcode would work independent of the Enfold Header option “Header Title and Breadcrumbs” settings and would create different code.

Thanks,
Stephan