TYPO3 - overwrite styles on a single page
How to overwri开发者_StackOverflowte some styles on a specified site? I would like to do it the css-file way.
Still no answer below works in my case..
Depending on the amount of CSS to apply, you could also consider to just add the page ID as a class on the <body>
, e.g. <body class="uid-456">
:
page.bodyTag >
page.bodyTagCObject = TEXT
page.bodyTagCObject {
field = uid
wrap = <body class="uid-|">
}
Then, in your CSS:
.uid-456 myElement {
myCustomStyle... /* Applies to page ID = 456 only. */
}
UPDATE
Tested with Templavoilà. The following worked (From the Setup
field of the main template):
page = PAGE
page {
typeNum = 0
10 = USER
10.userFunc = tx_templavoila_pi1->main_page
bodyTag >
bodyTagCObject = TEXT
bodyTagCObject {
field = uid
wrap = <body class="uid-|">
}
...
}
Use TypoScript to add CSS rules (using page.cssInline) or additional CSS files (page.includeCSS). See TSref, chapter for PAGE.
I recommend using Typoscript Conditions to add/overwrite (css)files. eg.
page.headerData.10 = TEXT
page.headerData.10.value (
<link rel="stylesheet" href="fileadmin/js_css/style.css" />
)
#### add css to Page ID 1
[globalVar = TSFE:id = 1]
page.headerData.20 = TEXT
page.headerData.20.value (
<link rel="stylesheet" href="fileadmin/js_css/mycustomstyle.css" />
)
[end]
or a dirty but useful way to do so in backend is this little snippet. It uses the abtract field in your page properties where you can add some code into your <head>
.
page.headerData.20 = TEXT
page.headerData.20.data = field:abstract
page.headerData.20.wrap = |
精彩评论