[TYPO3-UG Dutch] Grafische headings

[Rik Willems]

Frustraties op de vrijdag morgen...?!

Zo'n soort puzzle heb ik eens gehad toe ik afbeeldingen automatisch 
wilde afsnijden naar vierkant, om er vervolgens een circel omheen te 
plaatsen met buitenkant transparant. Was ook een leuke opgave...

Fijn weekend!

Jigal van Hemert schreef:
> Ik laat even de discussie links liggen of technieken als sifr beter zijn,
> maar stel dat je in plaats van <h2> een grafische heading wilt hebben...
> 
> In de eerste plaats zullen we de header velden bij content elementen
> aanpakken. Deze worden gedefinieerd in de bekende lib.stdheader.
> lib.stdheader.10 bevat de header definities en elk genummerd subelement
> het bijbehorende heading nummer; dus lib.stdheader.10.2 definieert "Layout
> 2" (h2 normaliter).
> 
> lib.stdheader.10.2 >
> lib.stdheader.10.2 = COA
> lib.stdheader.10.2 {
>   2 = IMAGE
>   2 {
>     altText.stdWrap.field = header
>     stdWrap.typolink.parameter.field = header_link
>     file = GIFBUILDER
>     file {
>       XY = [10.w]+10,28
>       transparentBackground = 1
>       10 = TEXT
>       10 {
>         text.field = header
>         offset = 5,20
>         fontFile = fileadmin/myspecialfont.ttf
>         fontSize = 24
>         fontColor = #ff00ff
>         niceText = 0
>       }
>     }
>   }
> }
> 
> Met de altText kunnen we de tekst nog als alt-attribute inzetten en ook de
> header link wordt hierboven bewaard. De opbouw van de gifbuilder
> instellingen is een voorbeeld en moet aan het gewenste design aangepast
> worden.
> 
> Blijft nog over dat de <h2>'tjes in de content zelf niet zijn aangepast.
> Bijvoorbeeld tekstelementen die via de RTE gevuld worden bevatten nog <h2>
> tags. tt_content is verantwoordelijk voor de rendering hiervan.
> lib.parseFunc_RTE bevat de configuratie en dat is meteen een leuke puzzel:
> 
> lib.parseFunc_RTE.nonTypoTagStdWrap.encapsLines.encapsLinesStdWrap.H2 {
>   setContentToCurrent = 1
>   cObject = IMAGE
>   cObject {
>     altText.stdWrap.current = 1
>     file = GIFBUILDER
>     file {
>       XY = [10.w]+10,28
>       transparentBackground = 1
>       10 = TEXT
>       10 {
>         text.current = 1
>         offset = 5,20
>         fontFile = fileadmin/myspecialfont.ttf
>         fontSize = 24
>         fontColor = #ff00ff
>         niceText = 0
>       }
>     }
>   }
> }
> 
> Let op dat de H2 in hoofdletters moet staan (zo is nu eenmaal de definitie
> daar)
> Aangezien we de content willen vervangen helpt setCurrentToContent = 1 om
> hiermee de 'current' waarde te vullen, zodat later current=1 ingezet kan
> worden.
> De inhoud vervangen we door een cObject te definiëren. De alt-tekst wordt
> weer netjes ingevuld met de tekst van de heading en we maken een leuk
> plaatje met de tekst.
> 
> Let op: lange heading teksten worden nu niet over meerdere regels
> verdeeld. Dat is bij mijn weten niet automagisch te doen. Je zou wel de
> lengte van de tekst kunnen beperken, maar dat is een andere oefening :-)
> 
> Leuk spul, he, TypoScript...