Wrapping image based on width… pure TypoScript

following issue: images should be wrapped with various class parameter (or div, or whatever) based on its width. And it should be solved only per TypoScript…

hmmm… quite a difficult one, don’t you think? well, you know what… I solved it… 😀

let’s get the code.. the following code will put a class (content_main_img_small, content_main_img_medium, content_main_img_big) in the img tag of image or text w/ image content element.

feel free to modify this.

tt_content.image.20.1 {
  params.cObject = COA
  params.cObject {
    ##
    # get the width of the image from the imagewidth field or from the original image
    5 = LOAD_REGISTER
    5 {
      myImgWidth.cObject = TEXT
      myImgWidth.cObject {
        data = field:imagewidth
        override {
          data = TSFE:lastImageInfo|0
          debugFunc = 2
          if {
            isFalse.data = field:imagewidth
          }
        }
      }
    }
 
    # if it's smaller than 125
    10 = TEXT
    10 {
      value =
      override = content_main_img_small
      override {
        if {
          value.data = register:myImgWidth
          value.debugFunc = 2
          isGreaterThan = 125
        }
      }
    }
 
    # between 125 and 250
    20 < .10
    20 {
      override = content_main_img_middle
      override.if.isGreaterThan = 250
      override.if.isLessThan = 125
    }
 
    # greater than 250
    30 < .10
    30 {
       override = content_main_img_big
       override.if.isGreaterThan >
       override.if.isLessThan = 250
    }
    wrap = class="|"
  }
}

Leave a Reply

Your email address will not be published. Required fields are marked *