TYPO3 Quellcode sauber machen.

TYPO3 Quellcode sauber machen.

• WAM
• TYPO3 Codeschnipsel
• Mittwoch - 8 . Februar . 2012

Vor einiger Zeit haben wir Berichte geschrieben wie man im CMS TYPO3 den Quellcode bereinigen und TYPO3 den Spaghetti Code etwas abgewöhnen kann. Wenn man aber nochmal in den Quellcode reinschaut fallen dort immer wieder neue Störenfriede auf. Da haben wir zum Beispiel das ding mit den Bildern “csc-textpic csc-textpic-intext-left” folgend vom ”csc-textpic-imagewrap csc-textpic-single-image” und dann erst das Bild. TYPO möchte gerne jedes Bild in einem eigenen “Div-Container” packen, warum wissen nur die Entwickler.

Wenn man überlegt das der Quellcode davon nur aufgeblasen wird, sollte man darauf doch verzichten. Viel schöner wäre es doch wenn hier nur z.b. img-left dann das Bild ohne eigenem DIV Tag kommen würde.

TYPO3 Quellcode sauber machen

Nun werden die Entwickler nicht unbedingt diesen Bericht lesen und schon gar nicht die bewährte Struktur ändern. Also könnt ihr es selbst machen.

Eigentlich müsst Ihr dafür nur ein wenig die schon bekannte …..typo3 / sysext / css_styled_content / static / setup.txt umschreiben. Hier haben wir zum Beispiel die Angaben von “csc-textpic-intext-right / left” umgeschrieben in “img-left”.

Sollte so aussehen :

17 = TEXT
17.value = <div class=“csc-textpic csc-textpic-intext-right###CLASSES###“>###IMAGES######TEXT###</div>
17.override = <div class=“img-right###CLASSES###“>###IMAGES######TEXT###</div><div class=“csc-textpic-clear“><!– –></div>
17.override.if.isTrue = {$styles.content.imgtext.addIntextClearer}
# intext-left
18 = TEXT
18.value = <div class=“csc-textpic csc-textpic-intext-left###CLASSES###“>###IMAGES######TEXT###</div>
18.override = <div class=“img-left###CLASSES###“>###IMAGES######TEXT###</div><div class=“csc-textpic-clear“><!– –></div>
18.override.if.isTrue = {$styles.content.imgtext.addIntextClearer}

Woran Ihr aber denken müsst, ist die neu angelegte “Class” auch in die CSS zuschreiben sonst wird das ganze nichts.

Was Ihr aber ohne bedenken entfernen könnt sind solche Sachen wie <p class=”Bodytext”> Hier reicht es wenn nur ein <p> angegeben ist.

Hierfür einfach das “bodytext” unter nonTypoTagStdWrap.encapsLines entfernen.

nonTypoTagStdWrap.encapsLines {
encapsTagList = p,pre,h1,h2,h3,h4,h5,h6,hr
remapTag.DIV = P
nonWrappedTag = P
innerStdWrap_all.ifBlank = &nbsp;
addAttributes.P.class = bodytext
addAttributes.P.class.setOnly=blank
}

Die Angabe “csc-textpic-text” die im Normalfall noch unterhalb eines Bildelements im Quelltext auftaucht, ist eigentlich auch völlig überflüssig und kann entfernt werden.

Dafür nach “csc-textpic-text” suchen und das komplette “<div class=“csc-textpic-text“> | </div>” durch eine Headpipe ersetzten “|”

# *****************
# CType: textpic
# *****************
tt_content.textpic = COA
tt_content.textpic {
10 = COA
10.if.value = 25
10.if.isLessThan.field = imageorient
10.10 = < lib.stdheader

20  = < tt_content.image.20
20 {
text.10 = COA
text.10 {
if.value = 24
if.isGreaterThan.field = imageorient
10 = < lib.stdheader
10.stdWrap.dataWrap = <div class=“csc-textpicHeader csc-textpicHeader-{field:imageorient}“>|</div>
}
text.20 = < tt_content.text.20
text.wrap = <div class=“csc-textpic-text“> | </div>
}
}

Hier gibt es noch so einiges was Ihr ändern und anpassen könnt. Einfach mal den Quellcode genau ansehen.

Problem ist wenn Ihr auf eine Neue Version Updatet, müsst ihr den ganzen Kram von neuem anlegen und ändern.