Enable setting image width (and height) in textmedia

[createdwithlove]

In addition to all the great functions, I (or better an editor) miss the ability to adjust the size of images and I don't mean the calculation of the right image dimensions! I mean how it's displayed in the frontend from an optical view. After all, I don't always want a (single) image to span the entire width when it is placed above the text or halfway when it is next to the text.

I understand the reason for deactivating this function, it quickly becomes complicated with the calculation of the responsive images. However, I think that's a very important function. I've also found an older issue #332 where this function was tagged with wontfix.

Here are just two quick examples of why I think this should be fixed anyway:

• The image above the text should be 367px wide (it's just a smal illustration)
• The image to the right of the text should be 8 columns wide, the text only 4 cols (I only have little text)

To illustrate it, I also made wireframes: https://xd.adobe.com/view/2fd844e1-41e6-4d77-becb-983bbfdf59fc-7a8b/

There are, of course, tons of ways to do that. For example using an input field or dropdown, depending on how much freedom you want to give there. However, I would like to avoid flexform and think that it works without it or even with core functions and the fields that are already there.

Before I start looking for possible solutions, I wanted to ask if anyone has dealt with it before. The question actually goes in the direction of @benjaminkott and the other contributers, what they think of it and whether there already someone has worked on it.

[gilbertsoft]

Well the comment by Benjamin back then is still valid today, it's normally not up to the editor to make this decision, this is the designers job to define all possibilities which makes sense and are supported by the design.

Imho it's better you use e.g. backend layouts which the editor can select then and where the image sizes are bound to. This will ensure the layout doesn't break if the editor makes a mistake.

If this is not what you want you can change it with your sitepackage. If not we have a real issue here which must be addressed then....

[createdwithlove]

Ok, let's explain it different:

Please have a look at the texticon element. There are really many options how the icon can be displayed:icon_position: [left, right, top], icon_type: [default, square, circle] and icon_size: [default, medium, large, awesome].

Now look at the textmedia element. You only can choose from `imageorient: [top, bottom, left, left centered, right, right centered] – thats it, there are no options how you further can influence how the content is displayed.

In my eyes the textmedia element is one of the most important contentelements for creating visually beautiful sites. I totally agree in the point, that no editor using this element should be responsible to decide how many pixels images must have to fit in a layout or work in the sourcecode. But: in fact even if client, designer and integrator decide, that an image – wether it's combined with text (textimage) or not (image) – should not stretch above the maximum available space, there is no way to do this out of the box with bootstrap_package.

And bootstrap_package is not only any sitepackage, it's the sitepackage people new to TYPO3 get in contact first. It's filled up with best practices how to make templates for websites with TYPO3 and nearly leaves nothing to be desired. But in this single point it's behind what people expect – just my opinion. Also I myself was surprised that something fundamental like this is not possible. You can't imagine the face of my boss when I showed him an intermediate status of the project, he first pointed to the huge pictures, asked me if that should be the case and I said "I first have to add a function to scale them down".

Now, how could it be solved? Please have a look at https://www.t3sbootstrap.de/demo/textmedia – i think there it's done nearly right (from editors view – technically it's done with a huge monster of flexform and viewhelper combo). There you have no input field for image width in pixels, but you can choose the text/image column ratio (25%, 50%, 75%). If you take it more abstractly and instead name the possible options default,medium, large andawesome, then you are almost there where the texticon element is now. And if you do it that way, the options are so limited that it makes sense for the editor.

With the texticon the only reason it's already implemented, because with the SVGs it doesn't matter how many pixels the graphic should have and you can easily style it with a single value in the sourceode and some lines of CSS. This is much more complicated with a pixel image and then there are all the responsive breakpoints where other sizes are needed. And if we're honest, that's exactly why no one has thought about the solution.

If there is positive feedback to implement such functionality, I will try to solve this problem and contribute the solution. If the wontfix is written in stone, I will solve it quick and dirty in my sitepackage and be happy with it.

[rumpfwerk]

Hey @createdwithlove. Thank you for your input. My option about extending the BTP ist, that it should have

• a minimum of breaking changes

I am more an integrator than an programmer and I experiend the need of more options in the given content-elements, too. For me, an implementation of an relative text/image-ratio, left/right-spacing would be welcome. (Old-Fashioned) Text around images, too.

I often use the BTP to build pages without Design-Overhead with the BTP an some customers asked about the "to big pictures" and have problems to understand the responsive approach. So "text/image-ratio" would help in this case. "Text-around images" in desktop-views is also welcome, because a lot of editors, coming from old systems und "no-responsive" minded are having a need for an "easy" solution. In my opinion, the "spacing"-thing is a thing more for "implementing" (e.g. different page-layouts) and not as interesting für Users as the other two points. It seem to have the most work for a clean implementation (image-sizing in dependency to text/image-ratio)

IMHO extensions can realized with a constant-switch e.g. named "advanced options" - switch, so they can be both: no-breaking and evolving.

[createdwithlove]

First I want to add some options to tt_content.imageorient named something like textcolumn_[tiny, small, default, large, extralarge ] which will fit to ratios 3/9, 4/8, 6/6, 8/4, 9/3. Because this doesn't introduce any new fields and just builds upon already existing layouts, I think this should be no problem.

For the sizing of images above/below the text, this would be possible, too. Of course this would than add many options to the drowpdown and I'm not sure if that is really helpful for an editor. Maybe it would be better to add a new select field than (e.g. imagewidthratio) which is used only for that purpose – but that's something @benjaminkott first should approve.