CSS beim neusten HTMKLarea RTE

bjs1977 · #1 02.03.07, 09:53

Hallo zusammen.

Anscheinend bin ich ein wenig zu dumm. Wie kann ichmeine eigne CSS-Datei in dem Ecditor einfügen. Wenn ich bestimmmte CLASS im HTML-Code benutze, die auch in der Template-CSS der Seite zu finden sind, übernimmt er diese nicht, eher gesagt, Sie bleiben bestehen, werden aber im FE nicht als solche angezeigt.

Kann mir da jemand mal helfen, weil alles was hier so steht und in der beschreibung der Extension verstehe ich nicht wirklich...

Über eure Hilfe wäre ich sehr erfreut.

Danke
BJS

Tevsa · #2 03.03.07, 15:22

Dieser Post von Karin ist sehr gut:
typo-3.de - htmlarea / RTE (Konfiguration) - so gehts

Liebe Gruße
Tevsa

lemon · #3 16.03.07, 08:49

Hi!

Also ich hab mir das Tutorial mit seinen insgesamt 15 (puh!) Seiten durchgeschaut und durchprobiert, aber mein RTE (1.5.1 mit Typo3 4.1) ändert sich kein bisschen.

Hier mein TS-Config in der Root-Seite (1:1 von Karin übernommen:sad:

Typoscript-Code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
61:
62:
63:
64:
65:
66:
67:
68:
69:
70:
71:
72:
73:
74:
75:
76:
77:
78:
79:
80:
81:
82:
83:
84:
85:
86:
87:
88:
89:
90:
91:
92:
93:
94:
95:
96:
97:
98:
99:
100:
101:
102:
103:
104:
105:
106:
107:
108:
109:
110:
111:
112:
113:
114:
115:
116:
117:
118:
119:
120:
121:
122:
123:
124:
125:
126:
127:
128:
129:
130:
131:
132:
133:
134:
135:
136:
137:
138:
139:
140:
141:
142:
143:
144:
145:
146:
147:
148:
149:
150:
151:
152:
153:
154:
155:
156:
157:
158:
159:
160:
161:
162:
163:
164:
165:
166:
167:
168:
169:
170:
171:
172:
173:
174:
175:
176:
177:
178:
179:
180:
181:
182:
183:
184:
185:
186:
187:
188:
189:
190:
191:
192:
193:
194:
195:
196:
197:
198:
199:
200:
201:
202:
203:
204:
205:

#*** RTE Classe des Interface (Ausrichtung)
RTE.classes {
align-left {
name = LLL:EXT:rtehtmlarea/htmlarea/locallang_tooltips.xml:justifyleft
value = text-align: left;
}
align-center {
name = LLL:EXT:rtehtmlarea/htmlarea/locallang_tooltips.xml:justifycenter
value = text-align: center;
}
align-right {
name = LLL:EXT:rtehtmlarea/htmlarea/locallang_tooltips.xml:justifyright
value = text-align: right;
}
}

#
# *** Entfernt das Bild vor den Links
RTE.classesAnchor {
internalLink {
class = internal-link
type = page
image >
}
externalLink {
class = external-link
type = url
image >
}
externalLinkInNewWindow {
class = external-link-new-window
type = url
image >
}
internalLinkInNewWindow {
class = internal-link-new-window
type = page
image >
}
download {
class = download
type = file
image >
}
mail {
class = mail
type = mail
image >
}
}

## RTE Konfiguration
RTE.default {

        # Zuweisung der CSS-Datei
contentCSS = rte.css

        ## Markup options
enableWordClean = 1
removeTrailingBR = 1
removeComments = 1
removeTags = center, sdfield
removeTagsAndContents = style,script

        # Buttons die gezeigt/versteckt werden
showButtons = textstyle, textstylelabel, blockstyle, blockstylelabel, bold, italic, underline, left, center, right, orderedlist, unorderedlist, insertcharacter, line, link, image, removeformat, table, toggleborders, tableproperties, rowproperties, rowinsertabove, rowinsertunder, rowdelete, rowsplit, columninsertbefore, columninsertafter, columndelete, columnsplit, cellproperties, cellinsertbefore, cellinsertafter, celldelete, cellsplit, cellmerge, findreplace, insertcharacter, undo, redo, showhelp, about
hideButtons = fontstyle, formatblock, fontsize, strikethrough,lefttoright, righttoleft, textcolor, bgcolor, textindicator, emoticon, user, spellcheck, chMode, inserttag, outdent, indent, justifyfull, subscript, superscript, acronym, copy, cut, paste

        # Hält die RTE Icons gegroupt zusammen
keepButtonGroupTogether = 1

        # blendet Statusbar in htmlarea aus
showStatusBar =  0

        ## Add styles Left, center and right alignment of text in paragraphs and cells.
inlineStyle.text-alignment (
                p.align-left, h1.align-left, h2.align-left, h3.align-left, h4.align-left, h5.align-left, h6.align-left, td.align-left { text-align: left; }
                p.align-center, h1.align-center, h2.align-center, h3.align-center, h4.align-center, h5.align-center, h6.align-center, td.align-center { text-align: center; }
                p.align-right, h1.align-right, h2.align-right, h3.align-right, h4.align-right, h5.align-right, h6.align-right, td.align-right { text-align: right; }
)

        ## Use stylesheet file rather than the above mainStyleOverride and inlineStyle properties to style the contents (htmlArea RTE only)
ignoreMainStyleOverride = 1

proc {
                # tags die erlaubt / verboten sind
allowTags = table, tbody, tr, th, td, h1, h2, h3, h4, h5, h6, div, p, br, span, ul, ol, li, re, blockquote, strong, em, b, i, u, sub, sup, strike, a, img, nobr, hr, tt, q, cite, abbr, acronym, center
denyTags = font

                # br wird nicht zu p konvertiert
dontConvBRtoParagraph = 1

                # tags sind erlaubt außerhalt von p, div
allowTagsOutside = img,hr

                # erlaubte attribute in p, div tags
keepPDIVattribs = align,class,style,id

                # List all class selectors that are allowed on the way to the database
allowedClasses (
                        external-link, external-link-new-window, internal-link, internal-link-new-window, download, mail,
                        align-left, align-center, align-right, author
)

                # html parser einstellungen
HTMLparser_rte {

                        # tags die erlaubt/verboten sind
allowTags < RTE.default.proc.allowTags
denyTags < RTE.default.proc.denyTags

                        # tags die untersagt sind
removeTags = font

                        # entfernt html-kommentare
removeComments = 1

                        # tags die nicht übereinstimmen werden nicht entfernt (protect / 1 / 0)
keepNonMatchedTags = 0
}

                # Content to database
entry HTMLparser_db = 1
entry HTMLparser_db {

                        # tags die erlaubt/verboten sind
allowTags < RTE.default.proc.allowTags
denyTags < RTE.default.proc.denyTags

                        # CLEAN TAGS
noAttrib = b, i, u, strike, sub, sup, strong, em, quote, blockquote, cite, tt, br, center

rmTagIfNoAttrib = span,div,font

                        # htmlSpecialChars = 1

                        ## align attribute werden erlaubt
tags {
p.fixAttrib.align.unset >
p.allowedAttribs = class,style,align

div.fixAttrib.align.unset >

hr.allowedAttribs = class

                                # b und i tags werden ersetzt (em / strong)
b.remap = strong
i.remap = em

                                ## img tags werden erlaubt
img >
}
}

}

        # Classes: Ausrichtung
classesParagraph (
                align-left, align-center, align-right
)

        # Classes: Eigene Stile
classesCharacter = author
classesImage= rte_image

        # Classes für Links (These classes should also be in the list of allowedClasses)
classesAnchor = external-link, external-link-new-window, internal-link, internal-link-new-window, download, mail
classesAnchor.default {
page = internal-link
url = external-link-new-window
file = download
mail = mail
}

        # zeigt alle CSS-Klassen die in formate.css vorhanden sind
showTagFreeClasses = 1

        # Do not allow insertion of the following tags
hideTags = font

        # Tabellen Optionen in der RTE Toolbar
hideTableOperationsInToolbar = 0
keepToggleBordersInToolbar = 1

        # Tabellen Editierungs-Optionen (cellspacing/ cellpadding / border)
disableSpacingFieldsetInTableOperations = 1
disableAlignmentFieldsetInTableOperations=1
disableColorFieldsetInTableOperations=1
disableLayoutFieldsetInTableOperations=1
disableBordersFieldsetInTableOperations=0
}

# Use same processing as on entry to database to clean content pasted into the editor
RTE.default.enableWordClean.HTMLparser < RTE.default.proc.entry HTMLparser_db

# FE RTE configuration (htmlArea RTE only)
RTE.default.FE < RTE.default
RTE.default.FE.userElements >
RTE.default.FE.userLinks >

# Breite des RTE in Fullscreen-Ansicht
TCEFORM.tt_content.bodytext.RTEfullScreenWidth= 80%

Und hier die dazugehörige css-Datei (ebenfalls 1:1 übernommen:sad:

HTML-Code:

 .author {
    font-size:11px; 
    font-weight:bold;
    font-style:normal; 
     color:#961207;
}

span.author {
    font-size:11px; 
    font-weight:bold;
    font-style:normal; 
     color:#961207;
}

Auch die Einstellungen im Ext. Manager sind die selben:

Zitat:

Default configuration settings: Demo
Enable images in the RTE: haken gesetzt
Enable compressed scripts: haken nicht gesetzt

Aber, wie gesagt, es tut sich absolut nichts im RTE. :sad:

Viele Grüße

Lemon

franz ferdinand · #4 28.05.07, 15:44

wo ist denn dieser post von karin? der link funktioniert nicht mehr...

Themen-Optionen	Thema durchsuchen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen	Thema durchsuchen: Erweiterte Suche
Ansicht	Thema bewerten
Linear-Darstellung Zur Hybrid-Darstellung wechseln Zur Baum-Darstellung wechseln	Thema bewerten:

LinkBacks (?) LinkBack to this Thread: http://www.typo3forum.net/forum/typo3-4-x-rich-text-editor/19690-css-beim-neusten-htmklarea-rte.html
Erstellt von	For	Type	Datum
Nabble - in rtehtmlarea 1.5.1 meine CSS einbinden	This thread	Refback	08.03.08 17:33
Nabble - in rtehtmlarea 1.5.1 meine CSS einbinden	This thread	Refback	04.04.07 14:08
[TYPO3-german] in rtehtmlarea 1.5.1 meine CSS einbinden	This thread	Refback	28.03.07 20:20
Rich Text Editor: See what people are saying right now on Technorati	This thread	Refback	12.03.07 18:11

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
<o:p> beim RTE	teddy88	TYPO3 4.x Rich Text Editor	2	06.10.07 10:39
Probleme beim Veröffentlichen	stefan_1st	TYPO3 4.x Backend	0	21.06.07 23:09
optionsplit beim gmenu?	sissi	TYPO3 4.x Fragen und Probleme	3	08.06.06 10:48
Neusten Artikel auf startseite zeigen	execute	tt_products	2	13.04.06 10:59
Sublevels beim veröffentlichen	mseibel	Suchmaschinenfreundliche URLs (SEO)	0	03.04.06 10:55

Suche

Userpanel

CSS beim neusten HTMKLarea RTE