Hi Rob,

Thank you for reaching out to us.

When it comes to enabling transparent headers on single posts or portfolio items in Salient, the built-in "Force Transparency On Navigation" checkbox is typically only available for pages, not posts. However, there are two ways to achieve the transparent header effect on posts:

-Add a Page Header or Nectar Slider at the top of your post content. This will automatically trigger the transparent header when the “Force Transparency On Navigation” checkbox is enabled in the Page Header Settings metabox.

-You can enable transparency via your child theme’s functions.php file using the nectar_activate_transparent_header filter, like so:

add_filter('nectar_activate_transparent_header', function($active) {
    if (is_single()) { // or use is_singular('portfolio') for portfolio items
        return true;
    }
    return $active;
});

This will force the header to be transparent on all single posts (or portfolio items, depending on the condition used).

After implementing the code, please remember to clear your site cache to see the changes take effect.

Hope this helps! Let us know if you need further assistance.

Thanks,

Hi Rob,

Thank you for the feedback.

The code I provided was too general, causing all posts to have a transparent header. Were you aiming for a specific post to have the transparent header feature while keeping the rest in default?

Thanks,

Hi Rob,

Thank you for getting back to us.

Try disabling the Yoast SEO breadcrumbs for the transparent header effect to work.

Try that and let us know how it goes.

Cheers,

Hi Rob,

Thank you for getting in touch.

I think this is part of your Header(It's a secondary header) as I can see some contents on it.

See attached:

Do you mind checking it out?

Thanks,

Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):

body.single-post.material[data-bg-header=true] .container-wrap{
    padding-top:0px !important;
}

Thanks