Configuration

Instructions valid only for version 3.0.x and later

Basic configuration

The basic configuration is done through the TYPO3 constants. If you want to change the default values ​​regarding the breakpoints, you must log in with the administrator code and open the "Template" menu and continue from the frame on the right choose "Constant Editor" and select the TEXTIMAGE_SIZE (11) category.

Here you can modify the default values for:

  • SCSS path
  • Variants for gutter
  • Variants for responsive view (breakpoints)

Advanced configuration

In some cases you may need to change the default  parameters regarding the image resizing.

These options are only available via TypoScript, so you can proceed to modify the values ​​you see below:

lib.contentElement.settings.responsiveimages.contentelements.8 < lib.contentElement.settings.responsiveimages.contentelements.textmedia.default
lib.contentElement.settings.responsiveimages.contentelements.8.multiplier {
  default = 0.08
  xlarge = 0.08
  large = 0.08
  medium = 0.08
}
lib.contentElement.settings.responsiveimages.contentelements.16 < lib.contentElement.settings.responsiveimages.contentelements.textmedia.default
lib.contentElement.settings.responsiveimages.contentelements.16.multiplier {
  default = 0.16
  xlarge = 0.16
  large = 0.16
  medium = 0.16
}
lib.contentElement.settings.responsiveimages.contentelements.25 < lib.contentElement.settings.responsiveimages.contentelements.textmedia.default
lib.contentElement.settings.responsiveimages.contentelements.25.multiplier {
  default = 0.25
  xlarge = 0.25
  large = 0.25
  medium = 0.25
}
lib.contentElement.settings.responsiveimages.contentelements.33 < lib.contentElement.settings.responsiveimages.contentelements.textmedia.default
lib.contentElement.settings.responsiveimages.contentelements.33.multiplier {
  default = 0.33
  xlarge = 0.33
  large = 0.33
  medium = 0.3333
}
lib.contentElement.settings.responsiveimages.contentelements.41 < lib.contentElement.settings.responsiveimages.contentelements.textmedia.default
lib.contentElement.settings.responsiveimages.contentelements.41.multiplier {
  default = 0.41
  xlarge = 0.41
  large = 0.41
  medium = 0.41
}
lib.contentElement.settings.responsiveimages.contentelements.50 < lib.contentElement.settings.responsiveimages.contentelements.textmedia.default
lib.contentElement.settings.responsiveimages.contentelements.50.multiplier {
  default = 0.5
  xlarge = 0.5
  large = 0.5
  medium = 0.5
}
lib.contentElement.settings.responsiveimages.contentelements.58 < lib.contentElement.settings.responsiveimages.contentelements.textmedia.default
lib.contentElement.settings.responsiveimages.contentelements.58.multiplier {
  default = 0.58
  xlarge = 0.58
  large = 0.58
  medium = 0.58
}
lib.contentElement.settings.responsiveimages.contentelements.66 < lib.contentElement.settings.responsiveimages.contentelements.textmedia.default
lib.contentElement.settings.responsiveimages.contentelements.66.multiplier {
  default = 0.66
  xlarge = 0.66
  large = 0.66
  medium = 0.66
}
lib.contentElement.settings.responsiveimages.contentelements.75 < lib.contentElement.settings.responsiveimages.contentelements.textmedia.default
lib.contentElement.settings.responsiveimages.contentelements.75.multiplier {
  default = 0.75
  xlarge = 0.75
  large = 0.75
  medium = 0.75
}
lib.contentElement.settings.responsiveimages.contentelements.83 < lib.contentElement.settings.responsiveimages.contentelements.textmedia.default
lib.contentElement.settings.responsiveimages.contentelements.83.multiplier {
  default = 0.83
  xlarge = 0.83
  large = 0.83
  medium = 0.83
}
lib.contentElement.settings.responsiveimages.contentelements.91 < lib.contentElement.settings.responsiveimages.contentelements.textmedia.default
lib.contentElement.settings.responsiveimages.contentelements.91.multiplier {
  default = 0.91
  xlarge = 0.91
  large = 0.91
  medium = 0.91
}

The TypoScript Libraries are copied from the defaut settings given by extension.

For example, the following library:

lib.contentElement.settings.responsiveimages.contentelements.83.multiplier {
  default = 0.83
  xlarge = 0.83
  large = 0.83
  medium = 0.83

}

refers to the 83% width of the image respect the text. You can modify the values associated to each breakpoint adjusting the values.

To do this please copy the  whole or partial code and insert it into your web setup (Template > Edit whole template > setup  input box).