[Neos] imageClass not rendered in <img > element.

Nick Poaros nick at jamalade.com
Mon Dec 9 23:27:30 CET 2013


Hi

I was looking at the demo site (beta 2) and noticed that in Root.ts2 the Image template is overwritten in the Teaser section in order to add the class "img-responsive" from  bootstrap ie.

// Overwrite the image template in the teaser section to make them responsive
				prototype(TYPO3.Neos.NodeTypes:Image) {
					imageClassName = 'img-responsive'
				}

However if you just add an image to the teaser its doesn't behave responsively as expected. This because in TYPO3.Neos.Nodetypes the "imageClassName" is added to the <figure> element which wraps the the <img> . In the partial Image.html

<figure{f:if(condition: imageClassName, then: ' class="{imageClassName}"')}>
	<f:if condition="{image}">
		<f:then>
                    <f:if condition="{link}">
				<f:then>
					<a href="{link}"><media:image image="{image}" alt="{alternativeText}" title="{title}" maximumWidth="{maximumWidth}" maximumHeight="{maximumHeight}" /></a>
				</f:then>
				<f:else>
					<media:image image="{image}" alt="{alternativeText}" title="{title}" maximumWidth="{maximumWidth}" maximumHeight="{maximumHeight}" />
				</f:else>
			</f:if>

..

Not sure if this will work, that is I haven't tested for all cases, but adding class="{imageClassName}" to the media:image tag that isn't a link would give the responsive result for the example in demo.

Hope this helps in some small way :)

Nick				


 


More information about the Neos mailing list