Project

General

Profile

Actions
Copy link

Feature #93644

closed

includeCSS should have options for rel="preload"

Added by David Bruchmann over 3 years ago. Updated almost 3 years ago.

Status:
Closed
Priority:
Should have
Assignee:
-
Category:
Fluid
Target version:
-
Start date:
2021-03-04
Due date:
% Done:

0%

Estimated time:
PHP Version:
Tags:
Complexity:
Sprint Focus:

Description

Having this desired HTML:

  <link rel="preload" href="/typo3conf/ext/sitepackage/Resources/Public/Fonts/Adelle-Bold.woff" as="font" title="FontHeadingsBold" type="font/woff" crossorigin="anonymous" />
  <link rel="preload" href="/typo3conf/ext/sitepackage/Resources/Public/Fonts/Adelle-Bold.woff" as="font" title="FontHeadingsRegular" type="font/woff" crossorigin="anonymous" />
  <link rel="preload" href="/typo3conf/ext/sitepackage/Resources/Public/Fonts/GothamNarrSSm-Book_Web.woff" as="font" title="FontRegular" type="font/woff" crossorigin="anonymous" />
  <link rel="preload" href="/typo3conf/ext/sitepackage/Resources/Public/Fonts/GothamSSm-Medium_Web.woff" as="font" title="FontBold" type="font/woff" crossorigin="anonymous" />
  <link rel="stylesheet" href="/typo3conf/ext/sitepackage/Resources/Public/Css/fonts.css" crossorigin="anonymous" />

and this content in fonts.css:

@font-face {font-family: "FontRegular"; src: url("/typo3conf/ext/sitepackage/Resources/Public/Fonts/GothamNarrSSm-Book_Web.woff") format("woff"); font-display: swap;}
@font-face {font-family: "FontBold"; src: url("/typo3conf/ext/sitepackage/Resources/Public/Fonts/GothamSSm-Medium_Web.woff") format("woff"); font-display: swap;}
@font-face {font-family: "FontHeadingsRegular"; src: url("/typo3conf/ext/sitepackage/Resources/Public/Fonts/Adelle-Bold.woff") format("woff"); font-display: swap;}
@font-face {font-family: "FontHeadingsBold"; src: url("/typo3conf/ext/sitepackage/Resources/Public/Fonts/Adelle-Bold.woff") format("woff"); font-display: swap;}

I don't see an option how to achive it differently by TypoScript than as comment.

The feature request is to increase the amount of options, so that the desired code can be created in top of the css-files.

Actions
Copy link
 #1

Updated by Christian Hackl over 3 years ago

Just as a hint if you were not yet aware of this:
You can already implement this with FLUID:
https://docs.typo3.org/other/typo3/view-helper-reference/10.4/en-us/typo3/fluid/latest/Asset/Css.html

(In my opinion, it is better to load css and js via FLUID / ViewHelper instead of TypoScript).

Example for fluid.assets :
https://github.com/Hauer-Heinrich/hh_theme_default/tree/master/Resources/Private/Theme/Partials/Assets

Actions
Copy link
 #2

Updated by David Bruchmann over 3 years ago

Thanks, that's a good hint.
I never used fluid yet for the head-area and missed the assets-options.

Actions
Copy link
 #3

Updated by Riccardo De Contardi over 3 years ago

  • Category set to Fluid
  • Status changed from New to Needs Feedback

@David Bruchmann is the answer sufficient for you? Is there still something missing?

Actions
Copy link
 #4

Updated by Christian Kuhn almost 3 years ago

  • Status changed from Needs Feedback to Closed

Hey. I hope it's ok to close here for now since the task can be solved with a different solution already. Feel free to create a fresh issue if you think we took the wrong approach here.

Actions
Copy link

Also available in: Atom PDF