I get the images for a slider via data = level media:-1,slide
On a news-single-page I want to use the news-images instead of. So I put the code for this in conditions [globalVar = GP:tx_news_pi1|news > 0] and get the images of the news. All ok. But I want to show the level media, if there is no news-image. How can I do this?
Here’s the TypoScript:
lib.keyVisual = COA
lib.keyVisual {
10 = FILES
10 {
references {
data = levelmedia:-1,slide
}
renderObj = COA
renderObj.10 = IMAGE
renderObj.10 {
file {
import.data = file:current:uid
treatIdAsReference = 1
width = {$keyVisualWidth}
#width.field >
height = {$keyVisualHeight}
}
}
renderObj.20 = COA
renderObj.20 {
1 = TEXT
1 {
data = file:current:title
required = 1
wrap = <h3>|</h3>
}
2 = TEXT
2 {
data = file:current:description
required = 1
wrap = <p>|</p>
}
stdWrap.wrap = <div class="imageCaptionBox">|</div>
stdWrap.required = 1
}
renderObj.wrap = <li>|</li>
}
wrap = <section id="keyvisual" class="keyvisual fullWidth"><ul class="slider nav">|</ul></section>
}
[globalVar = GP:tx_news_pi1|news > 0]
lib.keyVisual {
10 {
references {
data >
table = tx_news_domain_model_news
uid.data = GP:tx_news_pi1|news
fieldName = fal_media
}
# only images with showinpreview
renderObj.if {
value = 1
equals.data = file:current:showinpreview
}
}
}
[global]
Work with the ifEmpty stdWrap option.
If your COA is empty you can render the default image with this option.
simple example to explain:
[globalVar = GP:tx_news_pi1|news > 0]
lib.keyVisual {
stdWrap.ifEmpty.cObject < .10
#overrides for news picture
10 {
...
}
}
[global]
all conditions have an [else] so you do not need to redefine.
[globalVar = GP:tx_news_pi1|news > 0]
lib.keyVisual {
... from news...
}
[else]
lib.keyVisual {
... from levelmedia ...
}
[global]
then you need to distinguish wether an image is availabel for the news.
[globalVar = GP:tx_news_pi1|news > 0]
lib.keyVisual = COA
lib.keyVisual {
10 = CONTENT
10 {
// get news record and then get file
... from news...
if.empty.field = media
}
20 = FILES
20 {
... from levelmedia ...
if {
empty.field = media
negate = 1
}
}
}
[else]
lib.keyVisual {
... from levelmedia ...
}
[global]
that could be optimized by using a temp object for the levelmedia usage which gets copied.
temp.levelmediaImage {
...
}
[globalVar = GP:tx_news_pi1|news > 0]
kib.keyVisual = COA
lib.keyVisual {
10 = CONTENT
10 {
// get news record and then get file
... from news...
if.empty.field = media
}
20 < temp.levelmediaImage
20 {
if {
empty.field = media
negate = 1
}
}
}
[else]
lib.keyVisual < temp.levelmediaImage
[global]
Related
I did a upgrade from 9.5 to 10.4 and i guess Typoscript is not working right. There are no errors displayed (also the log files..)
The Header is rendering right but the Body-Tag stays empty.
I'm kinda lost right now.. it's always a pleasure upgrading Typo3.
Any Idea? Are there any Typoscript Tags which are out of date?
config {
absRefPrefix = /
disableBodyTag = 1
metaCharset = utf-8
prefixLocalAnchors = all
contentObjectExceptionHandler = 0
}
# HEADER MAINNAV MENU
headermainnav = HMENU
headermainnav {
entryLevel = 0
1 = TMENU
1 {
wrap = <ul>|</ul>
NO = 1
NO {
wrapItemAndSub = <li>|</li>
}
ACT = 1
ACT {
wrapItemAndSub = <li class="active">|</li>
}
}
2 < .1
}
# LANGUAGE SELECTOR
languagemenu = COA
languagemenu {
20 = HMENU
20 {
special = language
special.value = 0,2
special.normalWhenNoLanguage = 0
wrap =
1 = TMENU
1 {
noBlur = 1
NO = 1
NO {
doNotLinkIt = 1
linkWrap = <li>|</li>
stdWrap.override = DE || EN
stdWrap {
typolink {
parameter.data = page:uid
additionalParams = &L=0 || &L=2
ATagParams = hreflang="de-DE" || hreflang="en-GB"
addQueryString = 1
addQueryString.exclude = L,id,no_cache
addQueryString.method = GET
no_cache = 0
}
}
}
ACT < .NO
ACT.linkWrap = <li class="active">|</li>
USERDEF1 < .NO
USERDEF1 {
linkWrap = <li class="text-muted">|</li>
stdWrap.typolink >
}
USERDEF2 < .ACT
USERDEF2 {
linkWrap = <li class="text-muted">|</li>
stdWrap.typolink >
}
}
}
wrap = <ul id="language_menu" class="language-menu">|</ul>
}
# FOOTER MAINNAV MENU
footermainnav = HMENU
footermainnav {
entryLevel = 0
excludeUidList = 2,3,4,5,6
1 = TMENU
1 {
wrap = <ul>|</ul>
NO = 1
NO {
wrapItemAndSub = <li>|</li>
}
ACT = 1
ACT {
wrapItemAndSub = <li class="active">|</li>
}
}
2 < .1
}
page = PAGE
page {
# set baseURL on the flow
headerData.5 = TEXT
headerData.5.data=getIndpEnv:HTTP_HOST
headerData.5.wrap = <base href="{$websiteConfig.protocol}://|/"></base>
meta {
description = page:description
viewport = width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no
X-UA-Compatible = IE=edge
X-UA-Compatible.attribute = http-equiv
}
shortcutIcon = fileadmin/t3/img/favicon.png
includeCSS {
googlefontscss = https://fonts.googleapis.com/css?family=Fira+Sans:400,400i,600,600i,800,800i|Oswald:500
googlefontscss.external = 1
file1 = fileadmin/t3/css/normalize.css
file2 = fileadmin/t3/css/grid12.css
file3 = fileadmin/t3/css/slick.min.css
file4 = fileadmin/t3/css/style.css
file5 = fileadmin/t3/custom.css
}
includeJS {
file1 = fileadmin/t3/js/jquery.min.js
}
includeJSFooter {
file2 = fileadmin/t3/js/lottie.min.js
file3 = fileadmin/t3/js/slick.min.js
file4 = fileadmin/t3/script.js
file5 = fileadmin/t3/js/custom.js
}
10 = TEMPLATE
10 {
template = FILE
template.file = fileadmin/t3/layout.html
relPathPrefix = fileadmin/t3/
workOnSubpart = DOCUMENT
substMarksSeparately = 1
marks {
COPYRIGHT = TEXT
COPYRIGHT {
data = date : U
strftime = %Y
noTrimWrap = |© | TYPO3 All Rights Reserved.|
}
BODYTAG = TEXT
BODYTAG.insertData = 1
BODYTAG.dataWrap = <body class="no-touch" data-page="{tsfe:id}">
CONTACTFORM = CONTENT
CONTACTFORM {
table = tt_content
select {
pidInList = 23
includeRecordsWithoutDefaultTranslation = 1
}
}
HEADERMAINNAV < headermainnav
LANGUAGESELECTOR < languagemenu
FOOTERMAINNAV < footermainnav
CONTENT = CONTENT
CONTENT {
table = tt_content
select {
languageField = 1
orderBy = sorting
includeRecordsWithoutDefaultTranslation = 1
}
}
NEWSBANNER = CONTENT
NEWSBANNER {
table = tt_content
select {
pidInList = 47
includeRecordsWithoutDefaultTranslation = 1
}
}
COOKIEHINTCONTENT = CONTENT
COOKIEHINTCONTENT {
table = tt_content
select {
pidInList = 14
includeRecordsWithoutDefaultTranslation = 1
}
}
IMPRINTCONTENT = CONTENT
IMPRINTCONTENT {
table = tt_content
select {
pidInList = 16
includeRecordsWithoutDefaultTranslation = 1
}
}
PRIVACYCONTENT = CONTENT
PRIVACYCONTENT {
table = tt_content
select {
pidInList = 17
includeRecordsWithoutDefaultTranslation = 1
}
}
JOBROWS = CONTENT
JOBROWS {
table = tt_content
select {
pidInList = 27
orderBy = sorting
includeRecordsWithoutDefaultTranslation = 1
}
}
DOWNLOADS_DE = CONTENT
DOWNLOADS_DE {
table = tt_content
select {
pidInList = 31
where = sys_language_uid = 0
languageField = 0
orderBy = sorting
includeRecordsWithoutDefaultTranslation = 1
}
}
DOWNLOADS_EN = CONTENT
DOWNLOADS_EN {
table = tt_content
select {
pidInList = 31
where = sys_language_uid = 2
languageField = 0
orderBy = sorting
}
}
FAQDATA = CONTENT
FAQDATA {
table = tt_content
select {
pidInList = 34
orderBy = sorting
includeRecordsWithoutDefaultTranslation = 1
}
}
}
}
}
Keep in mind that TEMPLATE, MARKERS and SUBPARTS will be removed in TYPO3 11.
the 10.template = FILE was removed in TYPO3 10.
You will have to switch to FLUID.
Read more here: https://docs.typo3.org/m/typo3/reference-typoscript/master/en-us/ContentObjects/Template/Index.html
10 = FLUIDTEMPLATE
10 {
# also dynamic with .stdWrap
templateName = TemplateName
layoutRootPaths {
# if you set <f:layout name="Whatever" /> in your template, create Whatever.html there
10 = fileadmin/t3/Layouts/
}
partialRootPaths {
10 = fileadmin/t3/Partials/
}
templateRootPaths {
# make sure you have TemplateName.html inside (whatever templateName will be)
10 = fileadmin/t3/Templates/
}
variables {
# use as {copyright} in template
copyright = TEXT
copyright{
data = date : U
strftime = %Y
noTrimWrap = |© | TYPO3 All Rights Reserved.|
}
}
}
// untested, but should be right
Like the title says, I'd like to manage default meta tags with a specific typo3 page.
I figured out the text-fields like
og:description {
data = DB:pages:49:og_description
override {
required = 1
data = field:og_description
}
}
But it won't work with
og:image {
cObject = IMG_RESOURCE
cObject {
file {
import.data = DB:pages:49:og_image
treatIdAsReference = 1
import.listNum = 0
}
}
}
What am I missing?
Thanks
EDIT:
With a little more research and try and error (There is no fileId in page) i got his working
og:image {
attribute = property
stdWrap.cObject = IMG_RESOURCE
stdWrap.cObject {
file {
import.data = DB:pages:156:og_image
import.listNum = 0
}
begin = 0
maxItems = 1
renderObj = TEXT
renderObj {
stdWrap.typolink {
parameter.stdWrap {
cObject = IMG_RESOURCE
cObject {
file {
crop.data = file:current:crop
cropVariant = facebook_variant1
import.data = file:current:uid
}
}
}
returnLast = url
forceAbsoluteUrl = 1
}
required = 1
}
}
}
Its alle fine, BUT: This won't add the URL to the Image. (should be exact the Same)
twitter:image {
attribute = property
stdWrap.cObject = IMG_RESOURCE
stdWrap.cObject {
file {
import.data = DB:pages:156:twitter_image
import.listNum = 0
}
begin = 0
maxItems = 1
renderObj = TEXT
renderObj {
stdWrap.typolink {
parameter.stdWrap {
cObject = IMG_RESOURCE
cObject {
file {
crop.data = file:current:crop
cropVariant = facebook_variant1
import.data = file:current:uid
}
}
}
returnLast = url
forceAbsoluteUrl = 1
}
required = 1
}
}
}
I have the following menu-type, which works correctly for the main-part.
However, i want to add a fallback image, if no image is found.
tt_content.menu {
20 {
108 = HMENU
108 {
special = directory
special.value.field = pages
1 = TMENU
1.wrap = <div class="special_menu">|</div>
1.NO {
doNotLinkIt = 1
stdWrap.cObject = COA
stdWrap.cObject {
10 = FILES
10 {
references {
table = pages
fieldName = media
}
renderObj = IMAGE
renderObj {
file {
width = 263c
height = 155c
maxW = 263c
maxH = 155c
import.data = file:current:publicUrl
# if file:current:publicUrl is empty, use default image
if.isFalse = fileadmin/my/path/to/image.jpg
}
altText.field = title
imageLinkWrap = 1
imageLinkWrap {
enable = 1
typolink.parameter.field = uid
}
}
stdWrap.wrap = <div class="menu10_bild">|</div>
}
20 = TEXT
20.field = title
20.typolink.parameter.field = uid
20.wrap = <div class="menu10_text">|
30 = TEXT
30.field = abstract
30.wrap = <p>|</p></div><div class="w-clearfix"> </div>
}
}
}
}
}
for some reason, it just ignores the line. Can someone help me with that?
You should check the TypoScript Reference stdWrap.ifEmpty.
In your case the code should look like this
tt_content.menu {
20 {
108 {
1.NO {
stdWrap.cObject {
10 = FILES
10 {
# ....
stdWrap.ifEmpty.cObject = IMAGE
stdWrap.ifEmpty.cObject{
file = fileadmin/.../my_image.png
}
# ....
}
}
}
}
}
}
You can use every cObject you want.
Check out Content Objects (cObject)
Try this:
tt_content.menu {
20 {
108 = HMENU
108 {
special = directory
special.value.field = pages
1 = TMENU
1.wrap = <div class="special_menu">|</div>
1.NO {
doNotLinkIt = 1
stdWrap.cObject = COA
stdWrap.cObject {
# default image
value = fileadmin/my/path/to/image.jpg
10 = FILES
10 {
references {
table = pages
fieldName = media
}
renderObj = IMAGE
renderObj {
file {
width = 263c
height = 155c
maxW = 263c
maxH = 155c
import.data = file:current:publicUrl
}
altText.field = title
imageLinkWrap = 1
imageLinkWrap {
enable = 1
typolink.parameter.field = uid
}
}
stdWrap.wrap = <div class="menu10_bild">|</div>
}
20 = TEXT
20.field = title
20.typolink.parameter.field = uid
20.wrap = <div class="menu10_text">|
30 = TEXT
30.field = abstract
30.wrap = <p>|</p></div><div class="w-clearfix"> </div>
}
}
}
}
}
I use the following Typoscript to get a menu of pages with images from respective page resource.
How can i get the page-title (or page-description etc.) to the images alt and/or title-tags?
tt_content.menu.20.4 >
tt_content.menu.20.4 = COA
tt_content.menu.20.4 {
wrap = <div>|</div>
10 = HMENU
10 {
special = directory
special.value.field = pages
1 = TMENU
1 {
noBlur = 1
NO = 1
NO {
stdWrap >
stdWrap {
cObject = COA
cObject {
10 = FILES
10 {
references {
table = pages
uid.data = field = uid
fieldName = media
data = levelmedia:-1, slide
treatIdAsReference = 1
listNum = 0
}
renderObj = IMG_RESOURCE
renderObj {
file.import.data = file:current:publicUrl
file.maxW = 100
file.maxH = 60
required = 1
}
stdWrap.wrap = <img src="|" title="???pagetitle???" alt="???pagetitle???">
}
}
}
wrapItemAndSub = <div>|</div>
}
}
}
}
Have you tried it with dataWrap?
i think it could be something like this
stdWrap.dataWrap = <img src="|" title="{field:title}" alt="{field:title}">
or maybe...
stdWrap.dataWrap = <img src="|" title="{page:title}" alt="{page:title}">
this works for me now
cObject = COA
cObject {
10 = FILES
10 {
references {
table = pages
uid.data = field = uid
fieldName = media
data = levelmedia:-1, slide
treatIdAsReference = 1
listNum = 0
}
renderObj = COA
renderObj {
10 = IMG_RESOURCE
10.stdWrap.wrap = <img src="|
10.file.import.data = file:current:publicUrl
20 = TEXT
20.stdWrap.wrap = " title="|
20.data = file:current:title
30 = TEXT
30.stdWrap.wrap = " alt="|" />
30.data = file:current:title
}
stdWrap.wrap = |
stdWrap.required = 1
}
}
In a COA, I have this TypoScript to add an image linked to a larger copy of itself. But the Javascript plugin I'm using (Colorbox) isn't able to resize the image properly.
20 = CONTENT
20 {
wrap = <div class="lightbox clearfix">|</div>
required = 1
table = tt_content
select.languageField = sys_language_uid
select.where = colPos = 2
select.selectFields = bodytext,image,header
renderObj=COA
renderObj{
10 = FILES
10 {
required = 1
references {
table = tt_content
fieldName = image
}
renderObj = IMAGE
renderObj {
file.import.data = file:current:originalUid // file:current:uid
file.width=300c
file.height=300c
imageLinkWrap = 1
imageLinkWrap {
enable = 1
width = 1600m
height = 1600m
JSwindow = 0
linkParams.ATagParams {
// title.data =
dataWrap = class = "lightbox-group" title="{file:current:description}"
}
}
}
}
}
}
What's up?
Here's the correct TypoScript. I'm sharing it because it is a legacy weirdness others might stumble upon too.
You have to set imageLinkWrap.directImageLink = 1, else imageLinkWrap won't deliver the image itself, but a HTML page containing that image!
20 = CONTENT
20 {
wrap = <div class="lightbox clearfix">|</div>
required = 1
table = tt_content
select.languageField = sys_language_uid
select.where = colPos = 2
select.selectFields = bodytext,image,header
renderObj=COA
renderObj{
10 = FILES
10 {
required = 1
references {
table = tt_content
fieldName = image
}
renderObj = IMAGE
renderObj {
file.import.data = file:current:originalUid // file:current:uid
file.width=300c
file.height=300c
imageLinkWrap = 1
imageLinkWrap {
enable = 1
width = 1600m
height = 1600m
directImageLink = 1
JSwindow = 0
linkParams.ATagParams {
// title.data =
dataWrap = class = "lightbox-group" title="{file:current:description}"
}
}
}
}
}
}