Get the primary_tag.accent_color information from the current post to use it in defaults.hbs

Themes
1

Hi, after long searching and trying a lot of stuff I feel forced to open a post here in the forum … because nothing worked so far…

Theme: Casper
Ghost Version: 5.58

Inside of the “Brand” Settings there is a accent color set for the site, this accent color is used for the background color of the menu bar for every post.

What I want to Achieve:
That the Background color is dynamically changed for every post, depending on the accent color from the primary tag. So I get like a “Color Code” for my Different Posts … like all Posts with the same primary tag have the menu bar color green and all posts with a mother primary tag have a different color. And when no accent color is set inside the tage, it should use the default one.
So All Posts are Color Coded.

What comes near what I want to achieve is the following:

But it is only used inside post.hbs … I cannot use this for the default.hbs where the menu is build / described … the context is different.
I read about the helpers to get some other information before a site is rendered so I could possibly get the primary_tag.accent_color from the post which the site is going to display and put the accent_color inside the background for the <header id=“gh-head” style="background: … Part of default.hbs.

But I couldn’t got this to work. I tried a lot of variants of:
{{#get “posts” filter="url:{{url absolute='true‘}}“}} to use the absolute url of the site to get the primary tag from the post … with the filter only one should appear while no sites share the same url for the postings …

Maybe someone has some ideas or could help with a solution.
Best regards, thank you for your time.
chloe

2

Take a look at the contentFor and block helpers. That’s how you get info out of the post into the header. :)

2 Likes
3

Thank you, that was the solution I didn’t found … big big thanks.

Heres is the code used in post.hbs:
I populated the already existing part for the primary_tag where the url is put above the article

            {{#primary_tag}}
                <span class="post-card-primary-tag">
                    <a href="{{url}}">{{name}}</a>
                </span>
                {{#contentFor "menucolor"}}
                    {{#if accent_color}}--ghost-accent-color: {{accent_color}}{{/if}}
                {{/contentFor}}
            {{/primary_tag}}

inside of default.hbs is used the following:

<header id="gh-head" style="{{{block "menucolor"}}}"

Now the color of the menu bar will change depending on the chosen color of the primary tag.
So the Postings got color coded now.

Have a nice day

2 Likes