Changing default image width of 600 px in TYPO3 Version 9

Typo3 by default limits image width to 600 px. You can easily change this setting using TypoScript. These TypoScript can be usually located on the root Template record. If not you can try using the object browser to find the exact location.

You can change TYPO3 default image size in setup and in constants of the the base template record. You need to login to the bckend in order to edit the TYPO3 backend template record.

The following TYPOSCRIPT is applicable to TYPO3 version 7 onwards including TYPO3 version 9

styles {
content {
textmedia {
# maximum width of generated images
maxW = 2400
# maximum width of generated images (beside text)
maxWInText = 2400
# column spacing in pixels for multiple image columns
columnSpacing = 10
# row spacing in pixels for multiple image rows
rowSpacing = 10
# spacing to the text
textMargin = 10
}
}
}

If you are looking forward to change the image size in TYPO3 version 6 or lower the code is bit different as follows:

In CONSANTS:
styles.content.imgtext.maxW = 700

In SETUP:
tt_content.image.20.maxW = 930

This article was first published on 3rd October 2009!

Typoscript to include IE specific css and js

Here is how we can include css and javascript that targets different Internet explorer versions using typoscript.

page {
includeJS {
iejs = fileadmin/templates/js/ie.js
iejs.allWrap = <!–[if lt IE 9]> | <![endif]–>
iejs.excludeFromConcatenation = 1
}

includeCSS {
iecss = fileadmin/templates/css/ie.css
iecss.allWrap = <!–[if lt IE 9]> | <![endif]–>
iecss.excludeFromConcatenation = 1
}
}

Here I am including css and js for ie version less than 9.

 

Adding the Icon for Menu from page media property

From typo3 6.2.x, please use the following codeĀ  to generate the icon for menus from its page’s media property.

lib.menu = HMENU
lib.menu {
entryLevel = 1
expAll = 1
1 = TMENU
1{
wrap = <ul class=”leftmenu”> | </ul>
expAll = 1
NO = 1
NO{
before.wrap = <li>|
stdWrap.cObject = COA
stdWrap.cObject {
10 = FILES
10 {
# Get the images related to the current page
references {
table = pages
fieldName = media
}
# Render each image and wrap it as appropriate
renderObj = TEXT
renderObj {
typolink {
parameter.data = file:current:publicUrl
forceAbsoluteUrl = 1
returnLast = url
}
wrap = |,
}
stdWrap {
# Take only the first image if several are defined
listNum = 0
# Use default image if none is available
ifEmpty.cObject = TEXT
ifEmpty.cObject.typolink {
parameter = path_to_images/logo.png
forceAbsoluteUrl = 1
returnLast = url
}
wrap = <img src=”|” title=”image” />
}
}

20 = TEXT
20.field = title
20.wrap = <span>|</span>
}
after.wrap = |</li>
}
ACT < .NO
ACT.before.wrap = <li class=”active”> |

CUR < .NO
CUR.before.wrap = <li class=”active”> |
}
}

Running a SQL Query using TypoScript

Well, after using this feature for quite long time, I though I should post this info:Consider the following Query:

SELECT DISTINCT FROM_UNIXTIME(`datetime`, ‘%Y’) AS `year` FROM tt_news where pid=113 order by datetime limit 1

My main goal was to get the latest year from the tt_news records, that is then going to be pushed to Tesseract filter.

Soln:

20 = CONTENT
20 {
table = tt_news
select {
selectFields = FROM_UNIXTIME(`datetime`, ‘%Y’) AS year
orderBy = datetime desc
pidInList = 113
max = 1
}
renderObj = TEXT
renderObj.field = year
}

Reference: http://typo3.org/documentation/document-library/core-documentation/doc_core_tsref/4.5.0/view/1/5/#id2621093

Conditional menu based on menu page-id

Following code gives a nice way to have a custom content element as sub-menu item for each main menu item

lib.customMenu = HMENU
lib.customMenu {
 1 = TMENU
 1  {
        wrap = |
        NO.allWrap = | 
        NO.stdWrap.htmlSpecialChars = 1
        NO.after.cObject = COA
        NO.after.cObject {           
            20 = CASE
            20 {
               key.field = uid
               default = RECORDS
               default.tables = tt_content
               default.conf.tt_content < tt_content
               default.conf.tt_content.stdWrap.innerWrap >               
               
               14 < .default               
               14.source = {$submenu_element_14}
               
               15 < .default               
               15.source = {$submenu_element_15}
               
               16 < .default               
               16.source = {$submenu_element_16}
               
               17 < .default               
               17.source = {$submenu_element_17}
               
            }            
            
        }
        ACT = 1
        ACT.after.cObject < .NO.after.cObject
        ACT.allWrap = |
        ACT.ATagParams = class="act"
        ACT.stdWrap.htmlSpecialChars = 1

        CUR < .ACT
        CUR.ATagParams = class="cur"
    }
}

This code cannot be used as it is, you will need to make sure the DHTML/JavaScript code for the sub menu items are configured accordingly.

Further References:

  1. [TYPO3-english] conditional menu based on menu page-id
    http://lists.typo3.org/pipermail/typo3-english/2009-November/065557.html
  2. [TYPO3-english] Custom class in tmenu according to uid page
    http://lists.typo3.org/pipermail/typo3-english/2010-February/067336.html