How to structure my content to have shared Header/Footer across my pages?

Hello!

I’m trying to find a way to structure my content so I can have shared Header/Footer Component across my pages in order to not fill header’s and footer’s form again and again.

Is there any way or work around?

Many thanks.

Hello Karen,

yes there is a way. You can link your header and footer stories using options fields and resolve the relations when requesting the stories but there is a limitation to the count of resolvable relations. You can resolve maximal 100 relations in one call using the resolve_relations parameter.
If you’re using the headers and footers in every page it would be worth it to load them once, save the content of them and put both into the positions where they are needed without loading them with every page again. This can save the 100 possible resolved relations per request if you choose to connect other items using those relations for example a slider that is being used sometimes in blog articles etc.

We have an article that explains how to create such global components:
https://www.storyblok.com/tp/global-components-references

Using presets you can define those stories as by standard selected in your option fields when you create a new story/blog entry etc. --> https://www.storyblok.com/cl/new-presets

1 Like

Thanks! All this makes a lot of sense.

1 Like

Just with that, I’ve found another way is to just make the page components both a “content type” and “Nestable” meaning you can get the same thing with that tutorial but with less filtering through nested data.
So in that example, the newsletter section would also be a content type, and you would only need to make a global_reference component.

1 Like