Change typo3 template with a language condition, how to write this?

Question

I try to make a typo3 template condition that will change pert of the html template depending on the language.
I have three languages id: 0, 2 and 3.
I use:
Typo3 12.4.9
Bootstrap 14.0.7

I have tried this and similar variants, but don't really have a clue what I need to do.

<f:if condition="{siteLanguage.languageId}=={1}"> 
    <f:then>
        <div>language 1</div>
    </f:then>
    <f:if else>
        <div>language 2</div>
    </f:if else>
    <f:else>
        <div>default language</div>
    </f:else>
</f:if>

Please can someone help me solve this?
Thanks

Answer 1

First you can check if the variable siteLanguage is available in your Fluid Template:

<f:debug>{siteLanguage}</f:debug>

will output die siteLanguage object (if available, otherwise "null")

<f:debug>{_all}</f:debug>

will output all variables that are available so you can also see if siteLanguage is listed there.

Second, the condition should be

<f:if condition="{siteLanguage.languageId}==1">

as you are comparing a variable with a number - the number must not be in curly brackets.

If you do not have the siteLanguage variable available in the Fluid template, you'll need to pass the siteLanguage to your FLUIDTEMPLATE TypoScript settings as a variable first, so that it becomes available in the Fluid template. Here's how you can do this in TypoScript:

page.10 = FLUIDTEMPLATE
page.10 {

  // ... your other FLUIDTEMPLATE settings ...
   
  variables {
    languageUid = TEXT
    languageUid.data = site:languageId
  }
}

Then, in your Fluid template, you can use languageUid to make conditional checks like so:

<f:section name="Main">
  <f:if condition="{languageUid} == 0">
    <!-- Content for default language (id: 0) -->
  </f:if>
  <f:if condition="{languageUid} == 2">
    <!-- Content for second language (id: 2) -->
  </f:if>
  <f:if condition="{languageUid} == 3">
    <!-- Content for third language (id: 3) -->
  </f:if>
      
  <!-- Other content... -->
</f:section>

Answer 2

Your FLUID syntax is not correct.
As there is no elseif you need to cascade indvidual if conditions:

here an indention with related f:if, f:then and f:else on one level:

<f:if condition="{siteLanguage.languageId}==1"> 
<f:then>
    <div>language 1</div>
</f:then>
<f:else>
    <f:if condition="{siteLanguage.languageId}==2>
    <f:then>
        <div>language 2</div>
    </f:then>
    <f:else>
        <div>default language</div>
    </f:else>
    </f:if>
</f:else>
</f:if>

Answer 3

Diferent markup for different values of a variable/placeholder

As the question is on checking a variabe against multiple values and having dedicated content per value, with a fallback I'd suggest to switch to the <f:switch /> conditional switch instead if if/if-else/then constructs. [1] switch viewhelper

<f:switch expression="{siteLanguage.languageId}">
    <f:case value="0"><!-- Content for default language (id: 0) --></f:case>
    <f:case value="1"><!-- Content for second language (id: 1) --></f:case>
    <f:case value="3"><!-- Content for third language (id: 3) --></f:case>
    <f:defaultCase><!-- Default content for other languages --></f:defaultCase>
</f:switch>

Site and SiteLanguage in Templates

The site and siteLanguage are not available in a fluid template by default. So depending in which context / template you require this, there are different options available or options which needs to be used to provide it first:

• content elements with fluid templates (FLUIDTEMPLATE): Use the [2] SiteProcessor and [3] SiteLanguageProcessor to set them to the template
• ExtbasePlugins: Assign the site and siteLanguage as variable to the view
• Create a custom ViewHelper which registers the site/siteLanguage in the rendering context as variable (NOT returning it !!!!)

For an extbase plugin, you could add following to your controller action:

public function detailAction(): ResponseInterface
{
   $request = $this->request;
   $site = $request->getAttribute('site');
   $siteLanguage = $request->getAttribute('language');
   $this->view()->$view->assignMultiple([
     'site' => $site,
     'siteLanguage' => $siteLanguage,
   ]);
}

Or with a custom ViewHelper:

<?php

declare(strict_types=1);

namespace MyVendor\MyExt\ViewHelpers\Site;

use Psr\Http\Message\ServerRequestInterface;
use TYPO3Fluid\Fluid\Core\Rendering\RenderingContextInterface;
use TYPO3Fluid\Fluid\Core\ViewHelper\AbstractViewHelper;
use TYPO3Fluid\Fluid\Core\ViewHelper\Traits\CompileWithRenderStatic;

class CustomViewHelper extends AbstractViewHelper
{
    use CompileWithRenderStatic;

    /**
     * @var boolean
     */
    protected $escapeOutput = false;

    /**
     * @param array $arguments
     * @param \Closure $renderChildrenClosure
     * @param RenderingContextInterface $renderingContext
     * @return mixed
     */
    public static function renderStatic(
        array $arguments,
        \Closure $renderChildrenClosure,
        RenderingContextInterface $renderingContext
    ) {
        $request = $renderingContext->getRequest()
          ?? $GLOBALS['TYPO3_REQUEST']
          ?? null;
        if ($request instanceof ServerRequest) {
          $site = $request->getAttribute('site');
          $siteLanguage = $request->getAttribute('language');
          $variableContainer = $renderingContext
            ->getVariableContainer();
          $variableContainer->add('site', $site);
          $variableContainer->add('siteLanguage', $siteLanguage);
        }
        return '';
    }
}

adding the viewhelper namespace to your template and simply calling it:

<html
 xmlns:m="http://typo3.org/ns/MyVendor\MyExtension\ViewHelpers"
 data-namespace-typo3-fluid="true"
>
  <m:custom />
  <f:debug inline="1">{site}</f:debug>
  <f:debug inline="1">{siteLanguage}</f:debug>
</html>

• [1] switch viewhelper: https://docs.typo3.org/other/typo3/view-helper-reference/main/en-us/typo3fluid/fluid/latest/Switch.html
• [2] SiteProcessor
• [3] SiteLanguageProcessor