Project

General

Profile

Actions

Feature #99203

open

Re-introduce easy possibility to add paths via TypoScript

Added by Josef Glatz over 1 year ago. Updated about 2 months ago.

Status:
Under Review
Priority:
Should have
Assignee:
-
Category:
TypoScript
Start date:
2022-11-26
Due date:
% Done:

0%

Estimated time:
PHP Version:
Tags:
composer, typo3-composer-installer
Complexity:
Sprint Focus:

Description

Problem/Description

When TYPO3 composer installers v4 and v5 are the defacto standard in the next couple of months a simple TypoScript function OR stdWrap function OR cObject would help a lot when an integrator want to include any™ kind of Text/HTML/... e.g. in the <HEAD /> section of the HTML document.

An example

(found in an long living TYPO3 project where the next TYPO3 version must use TYPO3 Composer Installer v5)

page = PAGE
page {
    headerData {
        100 = TEXT
        100.value = <link rel="preload" as="font" type="font/woff2" href="typo3conf/ext/theme/Resources/Public/Fonts/Inter-Regular.woff2" crossorigin>
        110 = TEXT
        110.value = <link rel="preload" as="font" type="font/woff2" href="typo3conf/ext/theme/Resources/Public/Fonts/Inter-SemiBold.woff2" crossorigin>
        120 = TEXT
        120.value = <link rel="preload" as="font" type="font/woff2" href="typo3conf/ext/theme/Resources/Public/Fonts/orion-font.woff2" crossorigin>
    }
}

Maybe I forgot all my TypoScript skills, but actually I don't know how to easily migrate that to make it bulletproof™

1. ToDo(s)

  • It would be very helpful if an integrator can simple use the EXT:... syntax that the resulting (somehow cryptic) path get's adopted.

Acceptance Criteria

A TYPO3 integrator should have a straight forward solution to add paths for files (in the frontend) which supports the EXT:... syntax.


Related issues 1 (1 open0 closed)

Related to TYPO3 Core - Feature #99340: Add stdWrap to config.additionalHeaders.10.headerNew2022-12-11

Actions
Actions #1

Updated by Dieter Porth over 1 year ago

Typoscript is the wrong way for an integrator, to solve this problem. You can use fluid for this.

A Integrator will have access to the TYPO3-Template:
1. Use headerAssets
https://docs.typo3.org/c/typo3/cms-core/main/en-us/Changelog/8.6/Feature-79409-AutorenderAssetSectionsInFluidTemplateWithController.html
2. use Viewhelper uri.resource
https://docs.typo3.org/other/typo3/view-helper-reference/9.5/en-us/typo3/fluid/latest/Uri/Resource.html

If you really want to use typoscript, use the split-Function and the stdWrap to manually build your string
https://docs.typo3.org/m/typo3/reference-typoscript/main/en-us/Functions/Split.html

Remark: It is often a good suggestion to ask something like this in the slack-channel first.

Actions #2

Updated by Josef Glatz over 1 year ago

sorry for contradicting you: There are enough scenarios where you want to do this with TypoScript. You can not only think of "normal websites" with Fluid.

You mentioned split-Function. Beside that, that this approach could just be a workaround: How do you get the final resulting cryptic public path for your file?

Actions #3

Updated by Josef Glatz over 1 year ago

Dieter Porth wrote in #note-1:

Remark: It is often a good suggestion to ask something like this in the slack-channel first.

I already discussed this with a core team member.

Actions #4

Updated by Chris Müller over 1 year ago

It is already possible today. I am using this with typo3/cms-composer-installers v4 in TYPO3 v11 installations:

page.headerData.10 = TEXT
page.headerData.10 {
  value = <link rel="preload" href="{path : EXT:site/Resources/Public/Fonts/Roboto.woff2}" as="font" type="font/woff2" crossorigin="anonymous">
  insertData = 1
}
Actions #5

Updated by Chris Müller over 1 year ago

I provided also a PR to the docs to make it more clear on how to use:
https://github.com/TYPO3-Documentation/TYPO3CMS-Reference-Typoscript/pull/646

Actions #6

Updated by Helmut Hummel over 1 year ago

While it works with "path:" and for bc should continue to work for a while, neither the code, nor the documentation is clear, what exactly this "path" is meant for. Historically, when all files of a TYPO3 installation were public, this "function" returned a path relative to the TYPO3 installation. Now though, things are a bit more diverse.

Therefore I suggest to add a new function called "url:" that only accepts EXT: syntax and as a clear result, which is a public URL to this file (or an exception when a pubic URL to this file can not be created)

Actions #7

Updated by Josef Glatz over 1 year ago

  • Category changed from Frontend to TypoScript

Helmut Hummel wrote in #note-6:

....
Therefore I suggest to add a new function called "url:" that only accepts EXT: syntax and as a clear result, which is a public URL to this file (or an exception when a pubic URL to this file can not be created)

Hey Helmut,

that's a very good idea from an Integrator's view! However, I should knew the "insertData with curly brace path" as a former certified Integrator :-D

I called Georg and his suggestion was to wait until a larger number of people use the new installer/structure. Maybe the request grows and becomes more specific the next couple of month. Using insertData-stdWrap function looks more like a workaround to me and is beside your valid technical feedback not the real "solution".

Example of having a new stdWrap function "url":

page = PAGE
page {
    headerData {
        100 = TEXT
        100.value = typo3conf/ext/theme/Resources/Public/Fonts/Inter-Regular.woff2
        100.wrap = <link rel="preload" as="font" type="font/woff2" href="|" crossorigin>
        100.url = 1
    }
}

Example of having a new function "url":

page.headerData.10 = TEXT
page.headerData.10 {
  value = <link rel="preload" href="{url : EXT:site/Resources/Public/Fonts/Roboto.woff2}" as="font" type="font/woff2" crossorigin="anonymous">
  insertData = 1
}

Actions #8

Updated by Christoph Lehmann over 1 year ago

This works currently:

page.headerData {
  5 = TEXT
  5 {
    typolink {
      parameter = file:EXT:site/Resources/Public/Fonts/iconfont.woff2
      forceAbsoluteUrl = 1
      returnLast = url
    }
    wrap = <link rel="preload" as="font" type="font/woff2" href="|" crossorigin>
  }
}

See also \TYPO3\CMS\Core\LinkHandling\LegacyLinkNotationConverter::resolve()

Using typolink to resolve file urls is fine in my eyes, but what i really miss with it, is the possibility to add a cache buster since icon font files can change. The files sha1 would be perfect.


What do you think about adding a new Content Object that should ease preloads:

page.headerData.10 = PRELOAD
page.headerData.10.file = EXT:site/Resources/Public/fonts/iconfont.woff2

# or 

page.headerData.10 = PRELOAD
page.headerData.10.file = fonts/iconfont.woff2
page.headerData.10.extension = site

It would add all the the necessary attributes automatically + a cachebuster, if it's a local file

Actions #9

Updated by Christoph Lehmann over 1 year ago

I also like your url example, because it's very short. Maybe "resourceUri" instead url, that always adds a cache buster?

page.headerData.10 = TEXT
page.headerData.10 {
  value = <link rel="preload" href="{resourceUri : EXT:site/Resources/Public/Fonts/Roboto.woff2}" as="font" type="font/woff2" crossorigin="anonymous">
  insertData = 1
}
Actions #10

Updated by Gerrit Code Review over 1 year ago

  • Status changed from New to Under Review

Patch set 1 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #11

Updated by Gerrit Code Review over 1 year ago

Patch set 2 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #12

Updated by Gerrit Code Review over 1 year ago

Patch set 3 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #13

Updated by Christoph Lehmann over 1 year ago

  • Related to Feature #99340: Add stdWrap to config.additionalHeaders.10.header added
Actions #14

Updated by Gerrit Code Review over 1 year ago

Patch set 4 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #15

Updated by Gerrit Code Review over 1 year ago

Patch set 5 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #16

Updated by Gerrit Code Review over 1 year ago

Patch set 6 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #17

Updated by Jan Kiesewetter about 1 year ago

Just found this by searching for preload...
My problem is, that I want to add preload assets to the head by Fluid Template and not by TypoScript.
Why?
95% of my template that I realized formerly with TypoScript moved to Fluid Template and Fluid Templates of my content elements.
I can already use the f:asset.script and f:asset.css ViewHelper to add most of my resources to the site.
There is <f:section name="HeaderAssets"> to add more uncommon content to the head, but only once per Controller/Action context and not for example for many content elements on the same site.

I have to add multiple images for different screens per content element to the head to preload the right one.
https://web.dev/preload-responsive-images/

Actions #18

Updated by Jonas Eberle about 1 year ago

Jan, I think your problem is unrelated to this.
This was about providing the <f:resource.uri> functionality for TypoScript.
You are looking for a way to push stuff into <head> from Content Element templates.

Actions #19

Updated by Jan Kiesewetter about 1 year ago

Hi Jonas, thanks for your reply. My problem is not the exact same as in the post but has the same background.
I have to add resources to the head that have static paths `{f:uri.resource}` or generated `{f:uri.image}`.
Some maybe with a cache busting parameter like versionNumberInFilename.
As it feels more natural to me to use Fluid to add frontend resources, I just wanted to make sure it wasn't forgotten during implementation of such a feature.

Actions #20

Updated by Gerrit Code Review about 1 year ago

Patch set 7 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #21

Updated by Gerrit Code Review about 1 year ago

Patch set 8 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #22

Updated by Gerrit Code Review about 1 year ago

Patch set 9 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #23

Updated by Gerrit Code Review about 1 year ago

Patch set 10 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #24

Updated by Gerrit Code Review about 1 year ago

Patch set 11 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #25

Updated by Gerrit Code Review about 1 year ago

Patch set 12 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #26

Updated by Gerrit Code Review about 1 year ago

Patch set 13 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #27

Updated by Gerrit Code Review 11 months ago

Patch set 14 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #28

Updated by Gerrit Code Review 10 months ago

Patch set 15 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #29

Updated by Gerrit Code Review 10 months ago

Patch set 16 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #30

Updated by Gerrit Code Review 4 months ago

Patch set 17 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #31

Updated by Gerrit Code Review 4 months ago

Patch set 18 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #32

Updated by Gerrit Code Review 4 months ago

Patch set 19 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #33

Updated by Gerrit Code Review 3 months ago

Patch set 20 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #34

Updated by Gerrit Code Review 3 months ago

Patch set 21 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #35

Updated by Gerrit Code Review 3 months ago

Patch set 22 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #36

Updated by Gerrit Code Review 3 months ago

Patch set 23 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #37

Updated by Gerrit Code Review about 2 months ago

Patch set 24 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #38

Updated by Gerrit Code Review about 2 months ago

Patch set 25 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #39

Updated by Gerrit Code Review about 2 months ago

Patch set 26 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #40

Updated by Gerrit Code Review about 2 months ago

Patch set 27 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #41

Updated by Gerrit Code Review about 2 months ago

Patch set 28 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions #42

Updated by Gerrit Code Review about 2 months ago

Patch set 29 for branch main of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/77018

Actions

Also available in: Atom PDF