Hello @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
(@zax007)
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?
Hello @zax007
Actually, if you have our Blocksy Pro variant, why don’t you submit a ticket here — 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
(@zax007)
Hey, this isn’t “blocks hooking” feature available in pro version. I’m just hooking manually with code snippets by registering to actions. π
Hi @zax007,
Could you please share a link to your website so we could see the result you are getting?
Thread Starter
Zax
(@zax007)
@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 – 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
Hello @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
(@zax007)
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.
Hello @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!