Is there a way to make the topic breadcrumbs load before the content?
Currently, the topic content loads first, then the breadcrumbs are added above. This pushes the already loaded content downwards, which creates a jerky effect on page load.
If there's no way to force the breabcrumbs to load first, perhaps there's some CSS/js that can 'reserve' the space that the breadcrumbs then loads into?
Thanks!
Force breadcrumbs to load before topic content?
-
- Sr. Propeller Head
- Posts: 290
- Joined: Mon Aug 26, 2019 2:11 pm
Re: Force breadcrumbs to load before topic content?
I have my breadcrumbs and toolbar icons in a div together - they're sitting next to each other using Flare's responsive formatting, although that might not be necessary. Essentially the toolbar loads in earlier and is larger than the breadcrumbs, so when the breadcrumbs load in there's already space for them. The code looks like:
And for the CSS, I'm just using the code generated by Flare's responsive formatting feature.
It may also help to have some text before the breadcrumbs (e.g. You are here: ). This will load in first and take up that line, so the rest of the breadcrumbs shouldn't cause distortion when they load in unless they're really long.
Code: Select all
<div class="toolbarcontainer">
<div>
<MadCap:breadcrumbsProxy />
</div>
<div>
<MadCap:topicToolbarProxy data-mc-skin="/Project/Skins/Toolbar.flskn" />
</div>
</div>
It may also help to have some text before the breadcrumbs (e.g. You are here: ). This will load in first and take up that line, so the rest of the breadcrumbs shouldn't cause distortion when they load in unless they're really long.
in hoc foro dolorem ipsum amamus, consectimur, adipisci volumus.
Re: Force breadcrumbs to load before topic content?
This did the trick, thank you!doloremipsum wrote: ↑Wed Jun 14, 2023 7:14 pmIt may also help to have some text before the breadcrumbs (e.g. You are here: ). This will load in first and take up that line, so the rest of the breadcrumbs shouldn't cause distortion when they load in unless they're really long.
I already had a space in the mc-breadcrumbs-prefix CSS setting, but it doesn't register as a space in the output, so the problem persists:
MadCap|breadcrumbsProxy
{
mc-breadcrumbs-prefix: ' ';
}
Solution was to replace the space with the \200b character code, which is a no-width space character.
MadCap|breadcrumbsProxy
{
mc-breadcrumbs-prefix: '\200b';
}
-
- Sr. Propeller Head
- Posts: 290
- Joined: Mon Aug 26, 2019 2:11 pm
Re: Force breadcrumbs to load before topic content?
Nice, good thinking on using the dummy character!
in hoc foro dolorem ipsum amamus, consectimur, adipisci volumus.