Feature: #107056 - Introduce headerData and footerData ViewHelpers
See forge#107056
Description
Two new Fluid ViewHelpers have been introduced to allow injecting arbitrary
content into the HTML
<head> or before the closing
</ tag
of a rendered page:
<f:- injects content into thepage. header Data> <head>section<f:- injects content before the closingpage. footer Data> </tagbody>
The ViewHelpers internally use the
Page
API and are useful when existing ViewHelpers such as
<f: or
<f: do not support all required
attributes or use cases (for example,
dns-,
preconnect,
tracking scripts, or inline JavaScript).
Example usage for
<f::
<f:page.headerData>
<link
rel="preload"
href="/fonts/myfont.woff2"
as="font"
type="font/woff2"
crossorigin="anonymous"
>
<link rel="dns-prefetch" href="//example-cdn.com">
<link rel="preconnect" href="https://example-cdn.com">
</f:page.headerData>
Example usage for
<f::
<f:page.footerData>
<script>
var _paq = window._paq = window._paq || [];
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u = "https://your-matomo-domain.example.com/";
_paq.push(['setTrackerUrl', u + 'matomo.php']);
_paq.push(['setSiteId', '1']);
var d = document,
g = d.createElement('script'),
s = d.getElementsByTagName('script')[0];
g.async = true;
g.src = u + 'matomo.js';
s.parentNode.insertBefore(g, s);
})();
</script>
</f:page.footerData>
Both ViewHelpers output the given content as-is. Any user-supplied input passed to these ViewHelpers must be escaped manually to prevent Cross-Site Scripting (XSS) vulnerabilities.
Impact
Extension authors and integrators can now use the new ViewHelpers to add raw
HTML content, such as
<link> or
<script> tags, directly into
the rendered page output.