Russian TYPO3 community

Russian TYPO3 community (http://forum.typo3.ru/index.php)
-   HTMLArea, RTE, tinymce_rte и другие визуальные редакторы (http://forum.typo3.ru/forumdisplay.php?f=24)
-   -   Редактор и стиль параграфа (http://forum.typo3.ru/showthread.php?t=2322)

dapissarenko 23.12.2006 21:49

Редактор и стиль параграфа
 
Здравствуйте!

Я хочу, чтобы некоторые параграфы были с синим фоном. Вот так:

Код:

<div id="blueBackground">
...
</div>

blueBackground записан в stylesheet:

Код:

#blueBackground
{
        background:#c6d2f5;
}

Как мне сделать так, чтобы в редакторе (rich text editor) в списке стилей параграфов появлялся blueBackground?

У меня TYPO3 Ver. 4.0.3.

Заранее благодарен

Дмитрий

filippoff 24.12.2006 16:27

RTE.default.useCSS = 1
RTE.default.contentCSS = fileadmin/templates/style.css
RTE.default.showTagFreeClasses = 1

dapissarenko 24.12.2006 19:19

Спасибо за ответ!

Цитата:

Сообщение от filippoff (Сообщение 8731)
RTE.default.useCSS = 1
RTE.default.contentCSS = fileadmin/templates/style.css
RTE.default.showTagFreeClasses = 1

Где это надо писать?

Я безуспешно пробовал написать это

а) в константах шаблона,
б) в сетапе шаблона,
в) в разделе Backend Editor Configuration шаблона.

С уважением

Дмитрий

dapissarenko 24.12.2006 19:28

Здравствуйте!

Может быть, проблема в том, что у меня не RTE, а другой редактор?

Вот как у меня выглядит редактор:

http://dapissarenko.com/resources/20...orm/editor.png

С уважением

Дмитрий

void 25.12.2006 00:27

У вас rtehtmlarea.

А приведённый выше код нужно писать в Page TS Config (находится в свойствах страницы).

dapissarenko 25.12.2006 02:08

Спасибо за ответ!

Цитата:

Сообщение от void (Сообщение 8752)
А приведённый выше код нужно писать в Page TS Config (находится в свойствах страницы).

Сделал.

Но теперь списки Параграф (стиль параграфа) и Текст вообще отключены (grayed). Раньше я там мог что-то выбирать, а после того, как вставил

Код:

RTE.default.useCSS = 1
RTE.default.contentCSS = fileadmin/style.css
RTE.default.showTagFreeClasses = 1

в TSconfig той страницы - они перестали работать.

Если этот код оттуда убрать - снова работают.

Что делать?

Заранее благодарен

Дмитрий

filippoff 25.12.2006 12:59

При необходимости записи TSconfig для редактора я делаю в свойствах корневой страницы сайта.

Пример настройки RTE:

-----------------------------
RTE >
RTE.default.enableWordClean = 1
RTE.default.disableEnterParagraphs = 1
RTE.config.tt_content.bodytext.showButtons = *
RTE.default.showButtons = *
RTE.default.useCSS = 1
RTE.default.showTagFreeClasses = 1
RTE.default.contentCSS = fileadmin/templates/style.css

RTE.default.proc {
allowTags = b,i,strong,em,table, tbody, tr, th, td, h1, h2, h3, h4, h5, h6, div, p, br, span, ul, ol, li, pre, blockquote, strong, em, a, img, hr, tt, q, cite, abbr, acronym, address, center, sub, sup
overruleMode = ts_css
dontConvBRtoParagraph = 1
internalizeFontTags = 1
allowTagsOutside = img,hr,address,sub,sup
denyTags = strike,font
entryHTMLparser_db = 1
entryHTMLparser_db {
allowTags < RTE.default.proc.allowTags
xhtml_cleaning = 1
htmlSpecialChars = 0
noAttrib = b, i, u, strike, sub, sup, strong, em, quote, blockquote, cite, tt, br, center
tags.hr.allowedAttribs = class
tags.span.allowedAttribs = class
tags.div.allowedAttribs = align
tags.b.remap = strong
tags.i.remap = em
removeTags = sdfield
keepNonMatchedTags = protect
}
}
----------------------------

dapissarenko 25.12.2006 16:36

Здравствуйте!

Спасибо за ответ!

Цитата:

Сообщение от filippoff (Сообщение 8766)
При необходимости записи TSconfig для редактора я делаю в свойствах корневой страницы сайта.

Я сделал это и вид редактора изменился. Теперь он выглядит так:

http://dapissarenko.com/resources/20...rm/editor2.png

Список со стилями параграфа отключён.

Вопросы:

1) TYPO3 сам узнает из стайлшита, какие стили надо показывать, или мне надо где-то прописать, какие именно стили мне нужны в редакторе?

Стиль прописан вот так:

Код:

#blueBackground
{
        background:#c6d2f5;
}

2) Как мне сделать так, чтобы я мог в редакторе писать текст как показано ниже (т. е. чтобы редактор делал div) ?

Код:

<div id="blueBackground">Текст</div>
Спасибо

Дмитрий

filippoff 26.12.2006 01:27

гм, ну да, редактор же сброшен :о) был неправ, вспылил. вернее, недописал.

вообще, за список стилей параграфа отвечает элемент classesParagraph. чтобы отобразить список ваших стилей пропишите

RTE.default.classesParagraph = style1, style2 - ваши стили.

Эти стили оборачивают текст в div, но не с идентификатором, а с классом.

cами стили определяются в RTE.classes:

RTE.classes {
style1 { - класс, который добавится к параграфу
name = Style 1 - имя, которое будет отображено в списке
value = font:bold; color:red; - собственно стиль
}
style2 {
name = Style 2
value = font:bold; color:black;
}
}

вроде так.

dapissarenko 27.12.2006 04:39

Здравствуйте!

Теперь мой стиль есть в списке и даже отображается правильно. Вот что я сделал:

TSConfig корневой страницы:

Код:

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;

        }
      sourceCode {

              name = Source code
              value = font-family: Courier;

      }

}

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.default {
        contentCSS = fileadmin/css/rte.css


        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, sourceCode
                       

                )     

 

#                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

                entryHTMLparser_db = 1

                entryHTMLparser_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, sourceCode

        )

 

#        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.entryHTMLparser_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%

rte.css (стайлшит для редактора):

Код:

.sourceCode { font-family: Courier; }

span.sourceCode { font-family: Courier; }

p.sourceCode { font-family: Courier; }

sourceCode { font-family: Courier; }

В стайлшите страницы стоит:

Код:

p.sourceCode { font-family: Courier; background-color: #b6ccf3; }
Продолжение следует...


Часовой пояс GMT +4, время: 20:41.

Работает на vBulletin® версия 3.8.1.
Copyright ©2000 - 2025, Jelsoft Enterprises Ltd.
Перевод: zCarot