then it shows body and a bunch of codes like this


<!DOCTYPE html>
<html id="XF" lang="{$xf.language.language_code}" dir="{$xf.language.text_direction}"
    data-xf="{$xf.versionVisible}"
    data-app="public"
    {{ ($xf.style.isVariationsEnabled() && $xf.visitor.style_variation) ? 'data-variation="' . $xf.visitor.style_variation . '"' : '' }}
    {{ ($xf.style.isVariationsEnabled() && $xf.visitor.style_variation) ? 'data-color-scheme="' . property_variation('styleType', $xf.visitor.style_variation) . '"' : '' }}
    data-template="{$template}"
    data-container-key="{$containerKey}"
    data-content-key="{$contentKey}"
    data-logged-in="{{ $xf.visitor.user_id ? 'true' : 'false' }}"
    data-cookie-prefix="{$xf.cookie.prefix}"
    data-csrf="{{ csrf_token()|escape('js') }}"
    class="has-no-js {{ $template ? 'template-' . $template : '' }}"
    {{ $xf.runJobs ? ' data-run-jobs=""' : '' }}>
<head>
    <xf:set var="$siteName" value="{$xf.options.boardTitle}" />
    <xf:set var="$h1"><xf:h1 fallback="{$siteName}" /></xf:set>
    <xf:set var="$description"><xf:description /></xf:set>

    <meta charset="utf-8" />
    <title><xf:title formatter="%s | %s" fallback="{$xf.options.boardTitle}" page="{$pageNumber}" /></title>
    <link rel="manifest" href="{{ base_url('webmanifest.php') }}">

    <meta http-equiv="X-UA-Compatible" content="IE=Edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">

    <xf:if is="$xf.style.isVariationsEnabled()">
        <xf:if is="$xf.visitor.style_variation">
            <meta name="theme-color" content="{{ parse_less_color(property_variation('metaThemeColor', $xf.visitor.style_variation)) }}" />
        <xf:else />
            <xf:if is="$xf.style.hasAlternateStyleTypeVariation()">
                <meta name="theme-color" media="(prefers-color-scheme: {{ $xf.style.getDefaultStyleType() }})" content="{{ parse_less_color(property_variation('metaThemeColor', 'default')) }}" />
                <meta name="theme-color" media="(prefers-color-scheme: {{ $xf.style.getAlternateStyleType() }})" content="{{ parse_less_color(property_variation('metaThemeColor', $xf.style.getAlternateStyleTypeVariation())) }}" />
            <xf:else />
                <meta name="theme-color" content="{{ parse_less_color(property_variation('metaThemeColor', 'default')) }}" />
            </xf:if>
        </xf:if>
    <xf:else />
        <meta name="theme-color" content="{{ parse_less_color(property_variation('metaThemeColor', 'default')) }}" />
    </xf:if>

    <meta name="apple-mobile-web-app-title" content="{{ $xf.options.boardShortTitle ?: $xf.options.boardTitle }}">
    <xf:if is="property('publicIconUrl')">
        <link rel="apple-touch-icon" href="{{ base_url(property('publicIconUrl', true)) }}">
        <xf:elseif is="property('publicMetadataLogoUrl')" />
        <link rel="apple-touch-icon" href="{{ base_url(property('publicMetadataLogoUrl')) }}" />
    </xf:if>

    <xf:foreach loop="$head" value="$headTag">
        {$headTag}
    </xf:foreach>

    <xf:if is="!$head.meta_site_name && $siteName is not empty">
        <xf:macro id="metadata_macros::site_name" arg-siteName="{$siteName}" arg-output="{{ true }}" />
    </xf:if>
    <xf:if is="!$head.meta_type">
        <xf:macro id="metadata_macros::type" arg-type="website" arg-output="{{ true }}" />
    </xf:if>
    <xf:if is="!$head.meta_title">
        <xf:macro id="metadata_macros::title" arg-title="{{ page_title() ?: $siteName }}" arg-output="{{ true }}" />
    </xf:if>
    <xf:if is="!$head.meta_description && $description is not empty && $pageDescriptionMeta">
        <xf:macro id="metadata_macros::description" arg-description="{$description}" arg-output="{{ true }}" />
    </xf:if>
    <xf:if is="!$head.meta_share_url">
        <xf:macro id="metadata_macros::share_url" arg-shareUrl="{$xf.fullUri}" arg-output="{{ true }}" />
    </xf:if>
    <xf:if is="!$head.meta_image_url && property('publicMetadataLogoUrl')">
        <xf:macro id="metadata_macros::image_url"
            arg-imageUrl="{{ base_url(property('publicMetadataLogoUrl'), true) }}"
            arg-output="{{ true }}" />
    </xf:if>

    <xf:macro id="helper_js_global::head" arg-app="public" arg-jsState="{$jsState}" />

    <xf:if is="property('publicFaviconUrl')">
        <link rel="icon" type="image/png" href="{{ base_url(property('publicFaviconUrl'), true) }}" sizes="32x32" />
    </xf:if>