XF 2.2 How do I hide header image and logo from guests?

[GrowLabz]

how do I add a conditional to the header image and logo to hide it from guests and members who are not logged in? what conditional do I use and where do I add it?

 

[Dixie McCall]

Perhaps rather than use the regular header and logo properties, you could possibly combine your header and logo into one (via photoshop or whatever) and use XF ad system instead. This way you can hide both from guests simultaneously via ad properties.

Or use a floating notice instead, just insert it as an image and set parameters.

 

[XDinc]

how do I add a conditional to the header image and logo to hide it from guests and members who are not logged in? what conditional do I use and where do I add it?

Open your PAGE_CONTAINER template,
Like as,



Find following codes, (Line numbers help to you)

<header class="p-header" id="header">
    <div class="p-header-inner">
        <div class="p-header-content">

            <div class="p-header-logo p-header-logo--image">
                <a href="{{ ($xf.options.logoLink && $xf.homePageUrl) ? $xf.homePageUrl : link('index') }}">
                    <img src="{{ base_url(property('publicLogoUrl')) }}" srcset="{$srcset}" alt="{$xf.options.boardTitle}"
                        width="{{ property('publicLogoWidth') ?: '' }}" height="{{ property('publicLogoHeight') ?: '' }}" />
                </a>
            </div>

            <xf:ad position="container_header" />
        </div>
    </div>
</header>

Add this conditional for your request,

<xf:if is="$xf.visitor.user_id">
The codes above.
</xf:if>

 

[Paul B]

Add this to the extra.less template if you just want to hide it without editing a template:

[data-logged-in="false"]
{
    .p-header-logo
    {
        display: none;
    }
}

 

[GrowLabz]

Add this to the extra.less template if you just want to hide it without editing a template:

[data-logged-in="false"]
{
    .p-header-logo
    {
        display: none;
    }
}

thanks that worked great at removing the logo! however the header image is still showing, what should I do to the .css to hide the header image from guests also?

 

[Paul B]

Which header image?

What is the link to your site?

Try changing .p-header-logo to .p-header .

[data-logged-in="false"]
{
    .p-header
    {
        display: none;
    }
}

 

[GrowLabz]

Try changing .p-header-logo to .p-header .

that did it, thanks!

 

[oO5 Dynasty]

Looking to remove the entire logo block from the top of profile pages.
Can not figure out how to do it in the extra.less

 

[Chromaniac]

can't find the template to add fetchpriority=high to forum logo code... this is not part of style properties of course.

reference: https://web.dev/priority-hints/

 

[Nicolas FR]

PAGE_CONTAINER around lines 127 and 146 (desktop logo and mobile logo)

 

[Chromaniac]

ah cool. i added the code only in the first bit which seems to be for mobile and was checking the code on desktop. fixed now. thanks!

 

[Nicolas FR]

The first one is for desktop, the second one for mobile.