Header with Category IF Statement?

The easiest way would to be to just create a new custom "child" skin, based on the global community skin, change the logo image in the desktop/mobile wrapper, then through the community admin, apply that child skin to that specific community.

If you dont want to create another skin, you could edit your header code to something like

<#if category.id == "Instructor">
<img src="/html/assets/instructor-logo.jpg"/>
<#else>
<img src="/html/assets/community-logo.jpg"/>
</#if>

The better and easier approach here would be the second approach @MoniqueL mentioned, rather than creating and then managing a seperate skin.

The advantage of the skin approach is that it avoids hard-coding category IDs, and doesn't require a code change if you want to change the categories it applies to later.

Skins can inherit from other skins, which will avoid the need for duplication. So I would suggest creating a new skin 'based on' your existing skin, and then overwriting the images/CSS as appropriate.

Thank you all for your input! Due to time constraints and experience, I think I'm going to try and go with the second solution (IF statement). In the future (and with more time) I know a custom skin would be super helpful and my team has already starting discussing it as a plan.

With that being said, I understand the principle behind the IF statement, but I'm a little fuzzy on how to incorporate it into my existing header logo component. Right now, I have two different logo components which will ideally be combined into one.

Here's the main community logo:

<div class='hrb_community_logo<#if page.name == "CommunityPage"> hidelogo</#if>'>
  <a href="/" class="communityLogo" title="The Community">The Community</a>
  <span class="tagline">Looking at life through tax.</span>
</div>

And here's the sub-community logo:

<div class='VIC_community_logo<#if page.name == "CommunityPage"> hidelogo</#if>'>
  <a href="/t5/custom/page/page-id/VIC" class="VICcommunityLogo" title="Virtual Instructor Community">Virtual Instructor Community</a>
</div>

I see how to use IF with <img src>, but I'm unsure where to put it when I'm dealing with <div class>. The only part of the CSS file that I need to change for each image is just the file location itself. They can be the exact same size, alignment, etc.

Thank you all SO much for your help. If I ever meet you at LiNC in the future, I owe you all drinks. :smileyvery-happy:

I dont know what your category id is or the rest of your header code, so this is just an example.

<#if page.name == "CommunityPage"> hidelogo</#if>

<#if category.id == "WHATEVER-YOUR-CATEGORY-ID-IS">
<div class='VIC_community_logo'>
    <a href="/t5/custom/page/page-id/VIC" class="VICcommunityLogo" title="Virtual Instructor Community">Virtual Instructor Community</a>
  <span class="tagline">Looking at life through tax.</span>
</div>
<#else>
<div class='hrb_community_logo'>
      <a href="/" class="communityLogo" title="The Community">The Community</a>
  <span class="tagline">Looking at life through tax.</span>
</div>
</#if>

Hmm. Looks awesome and makes sense to me. Any idea why it would be throwing this as a response though? I did change the category to match mine (Instructor). I know "Instructor" definitely exists.

FreeMarker template error

The following has evaluated to null or missing:
==> category  [in template "preview" at line 3, column 6]

Tip: If the failing expression is known to be legally null/missing, either specify a default value with myOptionalVar!myDefault, or use <#if myOptionalVar??>when-present<#else>when-missing</#if>. (These only cover the last step of the expression; to cover the whole expression, use parenthessis: (myOptionVar.foo)!myDefault, (myOptionVar.foo)??

The failing instruction (FTL stack trace):
----------
==> #if category.id == "Instructor"  [in template "preview" at line 3, column 1]

Thank you!

Perfect. Thank you SO much!!!!