Zum Inhalt springen

css_styled_content und eigene classen vergeben. wie?

Erstellt am 26. Januar 2005 · 16 Antworten · letzte Antwort am 30. Januar 2005

Tags: Inhaltselemente, HTML & CSS, Frage

bonanza ·

hi. ich würde gerne alle classen die typo3 zu den tags dazuschreibt ausschalten die das content rendering bewirken und möchte die tags dann über ne golbale css definieren. wie und wo kann ich die "class" zusätze per typoscript entfernen oder gibt es eine andere alternative?

gruß und danke jan

bonanza ·

ich will das "clean" haben - vor allem die ganzen divs und die tables die um die "img"es liegen stören ==> Umsetzung Barrierefrei.
Will nciht so ein riesen aufgesetztes Stylesheet nutzen sondern meine eigenes und die paar tags die benötigt werden selbst vormatieren:
listenpunkte
p tags
h1-h6
img
das müssten ja die wichtigsten gewesen sein. desweiteren will ich die clear gifs entfernen. die sind auch unnötig in meinen augen .-)

nice ·

hallo,
schau dir mal die datein in /typo3/ext/css_styled_content/
an. sollte das meiste abdecken was du willst.
besonders interessant sind
/typo3/ext/css_styled_content/static/setup.txt
/typo3/ext/css_styled_content/static/constants.txt
/typo3/ext/css_styled_content/pi1/class.tx_cssstyledcontent_pi1.php
/typo3/ext/css_styled_content/pageTSconfig.txt
mfg
nice

bonanza ·

Also angeschaut hab ich mir die sachen - Ich kapier auch das mit den Beispiel css-Dateien, aber so ganz schlau aus dem Setup und den Constanten Dateien werd ich nicht.
Durchgetestet hab ich diese Möglichkeiten bin aber nicht dahinter gekommen wie ich cleane p,h1-h6 usw. tags bekomme. Bei Content(default) funktioniert das ja so:

# Formatierung des Standardtextes
content.wrap.bodytext = <p>|</p>

# Formatierung der Header über Stylesheet
content.wrap.header = |
content.wrap.header1 = <h1>|</h1>
content.wrap.header2 = <h2>|</h2>
content.wrap.header3 = <h3>|</h3>
content.wrap.header4 = <h4>|</h4>

Bei CSS_Stylesheet leider aber nicht. Weis noch jemand einen Tip?

nice ·

hallo,
in der datei /typo3/ext/css_styled_content/static/setup.txt
steht so ca. bei zeile 164

# This CASE cObject renders the header content:
# currentValue is set to the header data, possibly wrapped in link-tags.
10 = CASE
10.setCurrent {
field = header
htmlSpecialChars = 1
typolink.parameter.field = header_link
}
10.key.field = header_layout
10.key.ifEmpty = {$content.defaultHeaderType}
10.key.ifEmpty.override.data = register: defaultHeaderType

10.1 = TEXT
10.1.current = 1
10.1.insertData = 1
10.1.fontTag = <h1{register:headerStyle}{register:headerClass}>|</h1>

10.2 < .10.1
10.2.fontTag = <h2{register:headerStyle}{register:headerClass}>|</h2>

10.3 < .10.1
10.3.fontTag = <h3{register:headerStyle}{register:headerClass}>|</h3>

10.4 < .10.1
10.4.fontTag = <h4{register:headerStyle}{register:headerClass}>|</h4>

10.5 < .10.1
10.5.fontTag = <h5{register:headerStyle}{register:headerClass}>|</h5>

# Post-processing:
stdWrap.fieldRequired = header
stdWrap.if {
equals.field = header_layout
value = 100
negate = 1
}

stdWrap.editIcons = tt_content : header, [header_layout | header_position], [header_link|date]
stdWrap.editIcons.beforeLastTag = 1
stdWrap.editIcons.iconTitle.data = LLL:EXT:css_styled_content/pi1/locallang.php:eIcon.header

stdWrap.dataWrap = <div class="csc-header csc-header-n{cObj:parentRecordNumber}">|</div>
stdWrap.prefixComment = 2 | Header:
}

da kannst du die header einstellen wie du sie haben willst

z.b.
10.2.fontTag = <h2>|</h2>
(ohne {register:headerStyle}{register:headerClass})
dann macht es nur <h2></h2>

in der datei kannst du auch nach tags suchen
such mal nach <p und dann sieh dir den quelltext deiner html seite an.
wenn du nicht weiter kommst poste einfach nochmal, aber probiers mal herauszufinden - macht am meisten spass wenn man selber draufkommt.
mfg nice

nice ·

hallo,
ich noch mal. was ich vergessen habe zu sagen ist das es sehr wichtig ist in typo3 die caches zu leeren sonst greifen die änderungen in den datein nicht wenn die seite gecacht wird.
mfg
nice

bonanza ·

Super Danke. Das hab ich tatsächlich übersehen. Werds gleich antesten. Danke erstmal - wenns nicht klappt melde ich mich nochmals :-)

Eine Frage hätte ich doch noch: Muss ich alle Änderungen in mein Setupfeld schreiben oder nur die die ich abändern will?

Danke. Gruß Jan

bonanza ·

Ok die obige Frage konnte ich mir selbst beantworten. hab einfach das komplette Setup kopiert. Die Überschriften und die <p> tags hab ich jetzt schon mal clean. Aber wo kann ich diese Tags finden:
<ul class="csc-bulletlist csc-bulletlist-0">

sowie das alles um das Bild:

<div align="center">
<table width="440" border="0" cellspacing="0" cellpadding="0" class="imgtext-table">
<tr>
<td valign="top">
<img
src="uploads/pics/herzlich_willkommen_in_kobl.jpg"
width="440" height="100" border="0" align="top"
alt="" title="" /><br />
</td>
</tr>
</table>
</div>

nice ·

hallo,
nun ja, da du sowieso nie wieder diese tags so haben willst wie sie im original sind, währe es eine gute vorgehensweise erst eine sicherungskopie der dateien die du änderst zu machen z.b.
/typo3/ext/css_styled_content/static/setup.txt.original
und dann das was du ändern willst direkt in der datei ändern. danach die caches löschen.

aber nun zu deiner andern frage:
lass uns das mit den bullets als erstes machen
in der datei
/typo3/ext/css_styled_content/pi1/class.tx_cssstyledcontent_pi1.php
<ul class="csc-bulletlist csc-bulletlist-'.$type.'">'
durch <ul> ersetzen.
noch besser währe es das <ul> in eine zeile unter
<ul class="csc-bulletlist csc-bulletlist-'.$type.'">' zu setzen und dies dann auskommentiern
// Die untere Zeile mache ich weg weil ich class="csc-bulletlist csc-bulletlist-0" nicht mehr sehen mag
// <ul class="csc-bulletlist csc-bulletlist-'.$type.'">'
<ul>

wie soll den der tabellenquelltext mal aussehen?
dann kann ich dir da auch helfen
mfg
nice
ps:habe das mit den bullets nicht getestet, müsste aber ziemlich sicher funktionieren. wenns probleme giebt sag mir bitte bescheid.

bonanza ·

So, Danke das hat auch geklappt. Updatetechnisch wäre es wohl sinnvoller die original Klassen bezeichnungen Beizubehalten - denk ich :-)
Das letzte Problem ist denk ich das er mir Content Bilder mit einer Tabelle umgiebt für die gewählte Ausrichtung. Ich hab jetzt gesehen das es dafür die extension css_styled_imagetext gibt. Installiert und eingebunden hab ich Sie. Sie schreibt auch ein Stylesheet in den Head aber die Tabelle ist immer noch da? An was kann das liegen?

Danke vielmals. Gruß Jan

PS: Ich nutze übrigends vers. 3.7.0

nice ·

nun ja,
wenn du wirklich sicher bist, dass du die tabellen weghaben willst und weißt wie du die auch so richtig hinbekomst, kannst du für die normale imgtext renderung also die default renderung in der datei.
/tslib/class.tslib_content.php
ab zeile 1073 ( oder suche nach // Table-tag is inserted)
ändern

// Table-tag is inserted
$i=$contentPosition;
$table_align = (($i==16) ? 'align="'.$align.'"' : '');
$tablecode = '<table'.($tableWidth?' width="'.$tableWidth.'"':'').' border="0" cellspacing="0" cellpadding="0" '.$table_align.' class="imgtext-table">'.$tablecode;
if ($editIconsHTML) { // IF this value is not long since reset.
$tablecode.='<tr><td colspan="'.$colspan.'">'.$editIconsHTML.'</td></tr>';
$editIconsHTML='';
}
if ($cap) {
$tablecode.='<tr><td colspan="'.$colspan.'" align="'.$caption_align.'">'.$caption.'</td></tr>';
}
$tablecode.='</table>';
if ($conf['tableStdWrap.']) {$tablecode=$this->stdWrap($tablecode,$conf['tableStdWrap.']);}
}

$spaceBelowAbove = intval($this->stdWrap($conf['spaceBelowAbove'],$conf['spaceBelowAbove.']));
switch ($contentPosition) {
case '0': // above
$output= '<div align="'.$align.'">'.$tablecode.'</div>'.$this->wrapSpace($content, $spaceBelowAbove.'|0');
break;
case '8': // below
$output= $this->wrapSpace($content, '0|'.$spaceBelowAbove).'<div align="'.$align.'">'.$tablecode.'</div>';
break;
case '16': // in text
$output= $tablecode.$content;
break;
case '24': // in text, no wrap
$theResult = '';
$theResult.= '<table border="0" cellspacing="0" cellpadding="0" class="imgtext-nowrap"><tr>';
if ($align=='right') {
$theResult.= '<td valign="top">'.$content.'</td><td valign="top">'.$tablecode.'</td>';
} else {
$theResult.= '<td valign="top">'.$tablecode.'</td><td valign="top">'.$content.'</td>';
}
$theResult.= '</tr></table>';
$output= $theResult;
break;
}

am einfachsten dürfte es wohl sein
$output= $theResult; auszukommentieren und
$output= $content;
darunterzuschreiben am besten wie das letzte mal auch mit einem kommentar warum du das gemacht hast.
du kannst natürlich auch die wraps - kann man das so sagen? - ändern
z.b. die variable $tablecode

aber bitte mach vorher ein backup der datei! ich habe das nicht getestet sollte aber klappen.
die extention ss_styled_imagetext habe ich nicht installiert. aber wenn dir die lieber ist schaue ich mal ob ich sie nicht irgendwo testhalber mal installieren kann.

mfg
nice
(der noch immer nicht so ganz versteht für was dieser aufwand gut sein soll)

ps: was meinst du eigentlich mit
>Updatetechnisch wäre es wohl sinnvoller die original
Klassen bezeichnungen Beizubehalten - denk ich

pps: wie macht man das, dass die quelltexte im board so schön mit weiß unterlegt und so?

bonanza ·

Hi nochmals, könntest du das mal testen bitte mit der
extention css_styled_images.

habe eigentlich nur css_styled_content am laufen und die oben genannte. Einbinden tut er mir die css_styled_images ext anscheinend auch (er schreibt die stylsheets in dieser ext in den head) nur leider ist die tabelle immer noch um das bild. ich hab jetzt alle beiträge der mailing list und hier im forum durch, genauso wie diverse tutorials von google. die tabelle geht nicht weg.

ist es möglich die oben beschriebenen code änderungen über einen eintrag im ts setup field zu ändern?

gruß und danke für die mühe.
jan

bonanza ·

Juhu ich hab den Fehler. Aber ich weis nicht warum?!
Wenn ich den Quelltext aus der static/setup kopiere und in das Feld im Backend unter Setup einfüge dann gehts. Warum greift der Code über das Setup feld aber nicht über den Static Ordner aufm FTP ?!?!?
An was kann das liegen?

Gruß und Danke nochmals für die viele Hilfe!

nice ·

hallo,
ist jetzt alles so wie du es haben wolltest? ich werde aus deinen letzten postings nicht so ganz schlau.
wenn es mit den default imgtext sachen so funktioniert wie du es haben willst, welchen vorteil versprichst du dir dann von css-styled-imgtext ?
wie man die sachen die du im php ändern solltest per typoscript ändern kann weiß ich leider nicht.
ich bin beim extentionschreiben auch noch nicht so gut dass ich etwas ergänzen könnte um dann die möglichkeit zu haben das ganze per typoscript zu ändern.
ich bin mir auch nicht sicher ob es für so etwas überhaupt bedarf giebt.
wenn ich zeit finde werde ich mir mal die css-styled-imagetext installieren und nachsehen ob dort vorgesehen ist dies so zu ändern. versprechen kann ich es dir aber nicht das ich sie mir ansehe. vieleicht hat sie ja jemand installiert der da mal nachsehen kann.
mfg
nice

bonanza ·

Der Unterscheid zwischen css_styled_imgtext und imgtext(default) ist das die default tabllen nimmt um die bilder zu platzieren(die tabellen die ich weghaben wollte) und die andere css nimmt um die bilder zu platzieren. leider klappte die css_syled_imgtext extension nicht richtig aber dank den 2 Tutorials aus meiner vorhergehenden antwort hab ich sie zum laufen gebracht.
Die alt Tags zeigt sie mir zwar noch nicht an(wie im beispiel) aber das bekomme ich dnek ich auch noch hin.

Gruß und Danke nochmals.
Jan

PS: Ein Nachteil der css_styled_imagetext asu dem reposetory bei typo3 ist das sie nur mit dem content elemtent bild/mit Texte funktioniert bei nur bild aber nicht. Dieses Problem wird durch o.g. Tutorials behoben!