templates/public/head.html.twig line 1

Open in your IDE?
  1. <title>{{ title|default('Klaravik') }}</title>
  2. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  3. <meta name="keywords" content="{{ keywords|default('')|escape }}">
  4. <meta name="description" content="{{ description|default('')|escape }}">
  6. {# Canonical URL - prevents duplicate content issues #}
  7. {# Include curpage parameter in canonical URL when pagination exists #}
  8. {% set baseCanonical = canonicalUrl|default(app.request.schemeAndHttpHost ~ app.request.pathInfo) %}
  9. {% set curpage = app.request.query.get('curpage') %}
  10. {% if curpage and curpage > 1 %}
  11.     {% set canonicalWithPage = baseCanonical ~ '?curpage=' ~ curpage %}
  12. {% else %}
  13.     {% set canonicalWithPage = baseCanonical %}
  14. {% endif %}
  15. <link rel="canonical" href="{{ canonicalWithPage }}" />
  17. {% if app.request.attributes.get('requestParams').page is defined and app.request.attributes.get('requestParams').page is same as 'vendor' %}
  18.     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, viewport-fit=cover" />
  19. {% else %}
  20.     <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=10, user-scalable=1, viewport-fit=cover">
  21. {% endif %}
  23. <meta name="format-detection" content="telephone=no" />
  24. {# Open Graph Meta Tags #}
  25. <meta property="og:title" content="{{ shortTitle|default(title|default('Klaravik')) }}" />
  26. <meta property="og:type" content="{{ ogType|default('website') }}" />
  27. <meta property="og:url" content="{{ canonicalWithPage }}" />
  28. <meta property="og:description" content="{{ description|default('')|escape }}" />
  29. <meta property="og:site_name" content="Klaravik" />
  30. <meta property="og:locale" content="{{ app.request.locale|default('sv_SE') }}" />
  32. {% if products_id is defined and products_id is not empty %}
  33.     <meta property="og:image" content="{{ ogImage }}" />
  34.     <meta property="og:image:width" content="900" />
  35.     <meta property="og:image:height" content="675" />
  36.     <meta property="og:image:alt" content="{{ shortTitle|default('')|escape }}" />
  37. {% elseif ogImage is defined and ogImage is not empty %}
  38.     <meta property="og:image" content="{{ ogImage }}"/>
  39.     <meta property="og:image:width" content="200" />
  40.     <meta property="og:image:height" content="200" />
  41. {% else %}
  42.     <meta property="og:image" content="{{ app.request.schemeAndHttpHost }}/images/klaravik-og-default.png" />
  43.     <meta property="og:image:width" content="1200" />
  44.     <meta property="og:image:height" content="630" />
  45. {% endif %}
  47. {# Twitter Card Meta Tags #}
  48. <meta name="twitter:card" content="{{ twitterCardType|default('summary_large_image') }}" />
  49. <meta name="twitter:title" content="{{ shortTitle|default(title|default('Klaravik')) }}" />
  50. <meta name="twitter:description" content="{{ description|default('')|escape }}" />
  51. {% if products_id is defined and products_id is not empty %}
  52.     <meta name="twitter:image" content="{{ ogImage }}" />
  53.     <meta name="twitter:image:alt" content="{{ shortTitle|default('')|escape }}" />
  54. {% elseif ogImage is defined and ogImage is not empty %}
  55.     <meta name="twitter:image" content="{{ ogImage }}" />
  56. {% endif %}
  58. {% if not constant('DEV_MODE') %}
  59.     <script type="text/JavaScript" data-cookieconsent="ignore">
  60.         window.addEventListener('CookiebotOnDialogInit', () => {
  61.           window.addEventListener('CookiebotOnAccept', () => {
  62.               location.reload()
  63.           })
  64.         })
  65.     </script>
  66. {% endif %}
  68. {# This script makes it possible to use Fontawesome Pro icons #}
  69. <script src="https://kit.fontawesome.com/aa499cc0ce.js" crossorigin="anonymous"></script>
  71. {# Slick Carousel CSS #}
  72. <link rel="stylesheet" href="{{ getFileVersion('/css/slick.css') }}">
  74. {# UI Tooltip CSS  #}
  75. <link rel="stylesheet" type="text/css" media="screen" href="{{ getFileVersion('/css/tool-tip.css') }}" />
  77. {# TODO: use remixicon via NPM package when possible #}
  78. <link rel="preload" href="/fonts/RemixIcon/remixicon.woff2" as="font" type="font/woff2" crossorigin>
  80. <link rel="preload" href="/fonts/KlaravikSans/KlaravikSans-Light.woff2" as="font" type="font/woff2" crossorigin>
  81. <link rel="preload" href="/fonts/KlaravikSans/KlaravikSans-Regular.woff2" as="font" type="font/woff2" crossorigin>
  82. <link rel="preload" href="/fonts/KlaravikSans/KlaravikSans-SemiBold.woff2" as="font" type="font/woff2" crossorigin>
  83. <link rel="preload" href="/fonts/KlaravikSans/KlaravikSans-Bold.woff2" as="font" type="font/woff2" crossorigin>
  84. <link rel="preload" href="/fonts/KlaravikSans/KlaravikSans-ExtraBold.woff2" as="font" type="font/woff2" crossorigin>
  86. <link rel="stylesheet" href="/fonts/RemixIcon/remixicon.css?v=1">
  87. <link rel="stylesheet" type="text/css" href="/fonts/Authenia-Textured/stylesheet.css">
  88. <link rel="stylesheet" type="text/css" media="screen" href="{{ getFileVersion('/css/foundation.css') }}" />
  89. <link rel="stylesheet" type="text/css" media="screen" href="{{ getFileVersion('/css/uni-form.css') }}" />
  90. <link rel="stylesheet" type="text/css" media="screen" href="{{ getFileVersion('/css/default.uni-form.css') }}" id="formStyle" />
  92. {% if (currentPage is same as "auction" and products_id is defined) or currentPage is same as "vendor" %}
  93.     <link rel="stylesheet" type="text/css" media="all" href="{{ getFileVersion('/dist/css/fancybox.css') }}" />
  94.     <link rel="stylesheet" type="text/css" media="all" href="{{ getFileVersion('/dist/css/carousel.css') }}" />
  95. {% endif %}
  97. <link rel="stylesheet" type="text/css" media="all" href="{{ getFileVersion('/dist/css/stylesheet.css') }}" />
  98. {# apple-touch-icon defines an icon for adding Klaravik to the homescreen for iPhone/iPad #}
  99. <link rel="apple-touch-icon" sizes="80x80" href="/klaravik-web-icon-80x80.png">
  100. <link rel="apple-touch-icon" sizes="120x120" href="/klaravik-web-icon-120x120.png">
  101. <link rel="apple-touch-icon" sizes="152x152" href="/klaravik-web-icon-152x152.png">
  102. <link rel="apple-touch-icon" sizes="167x167" href="/klaravik-web-icon-167x167.png">
  103. <link rel="apple-touch-icon" sizes="180x180" href="/klaravik-web-icon-180x180.png">
  104. <link rel="apple-touch-icon" sizes="192x192" href="/klaravik-web-icon-192x192.png">
  105. <link rel="icon" type="image/png" href="{{ getFileVersion('/favicon-32x32.png') }}" sizes="32x32">
  106. <link rel="icon" type="image/png" href="{{ getFileVersion('/favicon-16x16.png') }}" sizes="16x16">
  107. {# Manifest link defines "add to homescreen" (PWA) attributes for Android #}
  108. <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#008540">
  109. {% for css in includedCSS|default([]) %}
  110.     <link rel="stylesheet" type="text/css" media="{{ css["media"] }}" href="{{ getFileVersion(css["url"]) }}" />
  111. {% endfor %}
  112. {{ manifestAssets.renderCss() }}
  113. <meta name="theme-color" content="#ffffff">
  115. <style>
  116.     @media only screen and (max-width: 1024px) {
  117.     {# Label the data for mybids table #}
  118.         body .mybids td:nth-of-type(1):before { content: "{{ 'ALIAS_BUYER_TH_PRODUCT'|trans }}"; }
  119.         body .mybids td:nth-of-type(2):before { content: "{{ 'ALIAS_BUYER_TH_AUCTIONEND'|trans }}"; }
  120.         body .mybids td:nth-of-type(3):before { content: "{{ 'ALIAS_BUYER_TH_YOURMAXBID'|trans }}"; }
  121.         body .mybids td:nth-of-type(4):before { content: "{{ 'ALIAS_BUYER_TH_YOURBID'|trans }}"; }
  122.         body .mybids td:nth-of-type(5):before { content: "{{ 'ALIAS_BUYER_TH_HIGHBID'|trans }}"; }
  123.         body .mybids td:nth-of-type(6):before { content: "{{ 'ALIAS_BUYER_TH_RESPRICE'|trans }}"; }
  124.         body .mybids td:nth-of-type(7):before { content: "{{ 'ALIAS_BUYER_TH_STATUS'|trans }}"; }
  126.     {# Label the data for myorders table #}
  127.         body .myorders td:nth-of-type(1):before { content: "{{ 'ALIAS_BUYER_TH_PRODUCT'|trans }}"; }
  128.         body .myorders td:nth-of-type(2):before { content: "{{ 'ALIAS_BUYER_TH_AUCTIONEND'|trans }}"; }
  129.         body .myorders td:nth-of-type(3):before { content: "{{ 'ALIAS_BUYER_TH_YOURMAXBID'|trans }}"; }
  130.         body .myorders td:nth-of-type(4):before { content: "{{ 'ALIAS_BUYER_TH_YOURBID'|trans }}"; }
  131.         body .myorders td:nth-of-type(5):before { content: "{{ 'ALIAS_BUYER_TH_HIGHBID'|trans }}"; }
  132.         body .myorders td:nth-of-type(6):before { content: "{{ 'ALIAS_BUYER_TH_RESPRICE'|trans }}"; }
  133.         body .myorders td:nth-of-type(7):before { content: "{{ 'ALIAS_BUYER_TH_INVOICE'|trans }}"; }
  134.         body .myorders td:nth-of-type(8):before { content: "{{ 'ALIAS_BUYER_TH_PAYMENT'|trans }}"; }
  135.         body .myorders td:nth-of-type(9):before { content: "{{ 'ALIAS_BUYER_TH_RECIEPT'|trans }}"; }
  136.         body .myorders td:nth-of-type(10):before { content: "{{ 'info_label_app-index_myorders-object-picked-up'|trans }}"; }
  137.     }
  138. </style>
  140. {# Google Tag Manager #}
  141. {% if GTM_SERVERSIDE is defined and GTM_SERVERSIDE %}
  142. <script>
  143.     (function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
  144.             new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
  145.         j=d.createElement(s);j.async=true;j.src=
  146.         "https://load.ss.klaravik.se/6ksghucrnc.js?"+i;f.parentNode.insertBefore(j,f);
  147.     })(window,document,'script','dataLayer','3pab=CgpPJCElSiNVPSRRTSRBBV5cXFJTDAlOCAITERQeDhhNHRc%3D');
  148. </script>
  149. {% elseif GTM_ID is defined and GTM_ID is not empty %}
  150. <script>
  151.     (function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
  152.       new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
  153.     j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
  154.     'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
  155.   })(window,document,'script','dataLayer', '{{ GTM_ID }}');
  156. </script>
  157. {% endif %}
  158. {# End Google Tag Manager #}
  160. <script src="https://challenges.cloudflare.com/turnstile/v0/api.js" async defer></script>
  162. {# Structured Data (JSON-LD) for SEO/AIO #}
  163. {# On product pages, we skip Organization schema (product location differs from Klaravik HQ) #}
  164. {# Product pages output their own Product, Breadcrumb, and Event schemas #}
  165. {# Note: Address intentionally omitted as auction items are not at Klaravik's physical location #}
  166. {# Contact info comes from centralized .env configuration #}
  167. {% set instance = instance|default('se') %}
  168. {% set isProductPage = products_id is defined and products_id is not empty %}
  169. {% if not isProductPage %}
  170. <script type="application/ld+json">
  171. {
  172.     "@context": "https://schema.org",
  173.     "@graph": [
  174.         {
  175.             "@type": "Organization",
  176.             "name": "Klaravik",
  177.             "url": "{{ app.request.schemeAndHttpHost }}",
  178.             "logo": {
  179.                 "@type": "ImageObject",
  180.                 "url": "{{ app.request.schemeAndHttpHost }}/images/klaravik-logo.svg",
  181.                 "width": 200,
  182.                 "height": 60
  183.             },
  184.             {% if instance == 'se' %}
  185.             "description": "Klaravik är Skandinaviens ledande onlineauktionshus för begagnade maskiner, fordon och utrustning.",
  186.             "sameAs": [
  187.                 "https://www.facebook.com/Klaravik.se",
  188.                 "https://www.linkedin.com/company/klaravikab/",
  189.                 "https://www.instagram.com/klaravik.se/"
  190.             ]
  191.             {% elseif instance == 'dk' %}
  192.             "description": "Klaravik er Skandinaviens førende online auktionshus for brugte maskiner, køretøjer og udstyr.",
  193.             "sameAs": [
  194.                 "https://www.facebook.com/klaraviknetauktion",
  195.                 "https://www.linkedin.com/company/klaravik-danmark/",
  196.                 "https://www.instagram.com/klaravik.dk/"
  197.             ]
  198.             {% endif %}
  199.             {% if contactPhone is defined and contactEmail is defined %}
  200.             ,"contactPoint": {
  201.                 "@type": "ContactPoint",
  202.                 "telephone": "{{ contactPhone }}",
  203.                 "contactType": "customer service",
  204.                 "email": "{{ contactEmail }}",
  205.                 "availableLanguage": {% if instance == 'se' %}["Swedish", "English"]{% elseif instance == 'dk' %}["Danish", "English"]{% else %}["English"]{% endif %}
  207.             }
  208.             {% endif %}
  209.         },
  210.         {
  211.             "@type": "WebSite",
  212.             "name": "Klaravik",
  213.             "url": "{{ app.request.schemeAndHttpHost }}",
  214.             "potentialAction": {
  215.                 "@type": "SearchAction",
  216.                 "target": {
  217.                     "@type": "EntryPoint",
  218.                     "urlTemplate": "{{ url('app.legacy.auction.listing') }}?q={search_term_string}"
  219.                 },
  220.                 "query-input": "required name=search_term_string"
  221.             }
  222.         }
  223.     ]
  224. }
  225. </script>
  226. {% endif %}