Title: Breadcrumbs below hero section using hooks Last modified: June 28, 2022 --- # Breadcrumbs below hero section using hooks * Resolved [Zax](https://wordpress.org/support/users/zax007/) * (@zax007) * [3 years, 11 months ago](https://wordpress.org/support/topic/breadcrumbs-below-hero-section-using-hooks/) * This code snippet places the breadcrumbs exactly in the place I want but it breaks other content of ct-container. * ``` add_action ('blocksy:single:container:top' , 'add_content_after_hero', 20); function add_content_after_hero() { $breadcrumbs_builder = new Blocksy_Breadcrumbs_Builder(); echo $breadcrumbs_builder->render(); } ``` * Is it the correct place to hook or I’m supposed to hook elsewhere? I want the breadcrumb row to be the same width as ct-container (content + sidebar). Viewing 9 replies - 1 through 9 (of 9 total) * [Eduard](https://wordpress.org/support/users/cteduard/) * (@cteduard) * [3 years, 11 months ago](https://wordpress.org/support/topic/breadcrumbs-below-hero-section-using-hooks/#post-15780208) * Hello [@zax007](https://wordpress.org/support/users/zax007/) * Have you tried using the “blocksy:content:before” hook? It seems to work better than “Blocksy:single:container:top” and you’ll need just a little bit of CSS to stylise things. * Let me know if this works for you. 🙂 * Thanks! * Thread Starter [Zax](https://wordpress.org/support/users/zax007/) * (@zax007) * [3 years, 11 months ago](https://wordpress.org/support/topic/breadcrumbs-below-hero-section-using-hooks/#post-15780332) * I forgot to mention that I’m using style 2 of hero section (with featured image as background and transparent header. So with “blocksy:content:before” it goes on top of whole page, behind the header. * What I’ve tried so far is: - blocksy:single:top blocksy:single:content:top - both place it on top of page text but it doesn’t go above left sidebar. - blocksy:hero:after - this is just below hero but uses the width of hero which is full page in style 2 and I need it to be the same width as ct-container. - Any suggestions? * [Eduard](https://wordpress.org/support/users/cteduard/) * (@cteduard) * [3 years, 11 months ago](https://wordpress.org/support/topic/breadcrumbs-below-hero-section-using-hooks/#post-15780351) * Hello [@zax007](https://wordpress.org/support/users/zax007/) * Actually, if you have our Blocksy Pro variant, why don’t you submit a ticket here — [https://creativethemes.com/blocksy/support/](https://creativethemes.com/blocksy/support/). These forums are only for our free users, and our Pro customers receive premium support through our official channel on our website. * Thanks! * Thread Starter [Zax](https://wordpress.org/support/users/zax007/) * (@zax007) * [3 years, 11 months ago](https://wordpress.org/support/topic/breadcrumbs-below-hero-section-using-hooks/#post-15780378) * Hey, this isn’t “blocks hooking” feature available in pro version. I’m just hooking manually with code snippets by registering to actions. 🙂 * Theme Author [Creative Themes](https://wordpress.org/support/users/creativethemeshq/) * (@creativethemeshq) * [3 years, 11 months ago](https://wordpress.org/support/topic/breadcrumbs-below-hero-section-using-hooks/#post-15780390) * Hi [@zax007](https://wordpress.org/support/users/zax007/), Could you please share a link to your website so we could see the result you are getting? * Thread Starter [Zax](https://wordpress.org/support/users/zax007/) * (@zax007) * [3 years, 11 months ago](https://wordpress.org/support/topic/breadcrumbs-below-hero-section-using-hooks/#post-15780582) * [@creativethemeshq](https://wordpress.org/support/users/creativethemeshq/) * Unfortunately its hosted locally so can’t post the link but generally I’m trying to achieve breadcrumbs placed in this position: [https://imgur.com/a/yI8Jav2](https://imgur.com/a/yI8Jav2)– it seems to be the most popular breadcrumbs placement on most pages today(?) * blocksy:hero:after – places them exactly here but all the way left (full width) blocksy:single:top – good but its same row as sidebar not above blocksy:content: before – its before the hero section, so nope * [Eduard](https://wordpress.org/support/users/cteduard/) * (@cteduard) * [3 years, 11 months ago](https://wordpress.org/support/topic/breadcrumbs-below-hero-section-using-hooks/#post-15780611) * Hello [@zax007](https://wordpress.org/support/users/zax007/) * Well, you can use the Blocksy:hero:after hook and then use a little bit of CSS to stylise things and get them looking the way you want. * Maybe something like this. * ``` .ct-breadcrumbs { max-width: var(--normal-container-max-width); width: var(--container-width); margin: 0 auto; } ``` * This has worked on my end and it looks pretty ok. Plus, you’ll need some CSS to stylise things anyways, since you’re inserting this via PHP, which doesn’t apply all the necessary styles to the feature. * Hope this helps. * Thanks. * Thread Starter [Zax](https://wordpress.org/support/users/zax007/) * (@zax007) * [3 years, 11 months ago](https://wordpress.org/support/topic/breadcrumbs-below-hero-section-using-hooks/#post-15781031) * Exactly what I needed, thanks! Added padding-top: 20px and it looks good now. * I modified the code snippet from my first post to only work on type-2 style: * ``` add_action('blocksy:hero:after', 'add_content_after_hero', 20); function add_content_after_hero() { $type = blocksy_akg_or_customizer('hero_section', blocksy_get_page_title_source()); if ($type == 'type-2') { $breadcrumbs_builder = new Blocksy_Breadcrumbs_Builder(); echo $breadcrumbs_builder->render(); } } ``` * Wondering if it wouldn’t be better to generate breadcrumbs for type-1 separately on different action/event? blocksy:head:end ? Not sure how it would work with sticky header though. * [Eduard](https://wordpress.org/support/users/cteduard/) * (@cteduard) * [3 years, 11 months ago](https://wordpress.org/support/topic/breadcrumbs-below-hero-section-using-hooks/#post-15781273) * Hello [@zax007](https://wordpress.org/support/users/zax007/) * Unfortunately we won’t be able to give specific advice, because everything depends on how you want things to look like. You’ll need to experiment and see what works best, or simply use Blocksy Pro’s visual hooks guide, which does everything automatically for you. 🙂 * Thanks! Viewing 9 replies - 1 through 9 (of 9 total) The topic ‘Breadcrumbs below hero section using hooks’ is closed to new replies. * ![](https://i0.wp.com/themes.svn.wordpress.org/blocksy/2.1.45/screenshot.jpg) * Blocksy * [Support Threads](https://wordpress.org/support/theme/blocksy/) * [Active Topics](https://wordpress.org/support/theme/blocksy/active/) * [Unresolved Topics](https://wordpress.org/support/theme/blocksy/unresolved/) * [Reviews](https://wordpress.org/support/theme/blocksy/reviews/) * 9 replies * 3 participants * Last reply from: [Eduard](https://wordpress.org/support/users/cteduard/) * Last activity: [3 years, 11 months ago](https://wordpress.org/support/topic/breadcrumbs-below-hero-section-using-hooks/#post-15781273) * Status: resolved