News-Addon mit Tinymce statt Textile

[Fanello]

Liebe Redaxo-Gemeinde

Ich verwende ein News-Addon, wobei das Eingabefeld für den News-Text (also den Artikel, nicht Teaser oder Titel) ein Textile-Feld ist. Die Ausgabe erfolgt folgendermassen:

Code: Alles auswählen

       
$text = htmlspecialchars_decode($row["article"]);
$text = str_replace("<br />","",$text);
$text = rex_a79_textile($text);
$text = str_replace("###","&#x20;",$text);
$text = strip_tags($text);
$item[$i]['text'] = $text;

Statt Textile hätte ich nun aber lieber den Tinymce-Editor. Geht das überhaupt? Kann man diesen Editor in einem anderen Addon einsetzen? Oder klappt es nur als Modul?

Danke für die Hilfe

[Cheffchen]

Hallo,

klar geht das.

-zuerst musst schauen wie Tinyfeld aussehen muss, steht intern bei tiny im Addon als beispielcode.
-dann must im news-addon die stelle vom Eingabefeld finden.
-passe das Eingabefeld an, meisten muss nur ein classe eingetragen werden (je nach Tiny/redaxo version)
-jetzt musst dein news-addon intern mal aufrufen und schauen was in der url bei page steht, merken.
-als letztes gehst wieder intern zu tiny zu einstellungen und da gibt es ein feld wo addon/seitennamen eintragen kannst wo tiny eingebunden wird, jetzt rate mal, genau das gemerkt page dort eintragen fertig.

Mach das am besten mit FF oder so da IE meistens am anfang problem mit cache hat, wenn es funktioniert funktioniert das dann auch beim IE aber zum testen halt ein richtigen browser nehmen.

hoffe war verständlich.

wenn die eingabe funktioniert musst dann natürlich die ausgabe auch noch anpassen, die stelle hast ja schon aber erst mal das eine.

Cheffchen

[Popkultur]

Hallo,

könnte noch kurz Hilfe brauchen, will den CKEditor einbauen.

"dann must im news-addon die stelle vom Eingabefeld finden."

Ist das die Stelle im Template?

Code: Alles auswählen

{if $list['text']}<div class="news_detail_article">{$list['text']}</div>{/if}

[RexDude]

Eingabefeld = <input> Feld???

[Popkultur]

Habe die Stelle gefunden:

Code: Alles auswählen

    $field = $form->addTextareaField('article', NULL, array('rows' => 16, 'style' => 'width:98%', 'class' => 'markitup-text tinyMCEEditor'));
    if (class_exists('a287_markitup'))
    a287_markitup::markitup('textarea.markitup-text', 'h1,h2,h3,h4,separator,bold,italic,separator,listbullet,listnumeric,separator,intlink,extlink,separator,mailtolink,separator,filelink', '540', '380');
    $field->setLabel('Artikel');

Wie muss ich das jetzt ändern, damits mit dem CKeditor geht? Hab versucht:

Code: Alles auswählen

$field = $form->addTextareaField('article', NULL, array('rows' => 16, 'style' => '', 'class' => 'ckeditor'));
	$field->setLabel('Artikel');

Aber da erscheint dann nichts.

Naja, mein Editor muss auch so eingebunden werden:

Code: Alles auswählen

<textarea id="ckeditor1" name="VALUE[2]" style="display: none;" class="editors">REX_VALUE[2]</textarea>
<script src="<?php echo $REX['HTDOCS_PATH']; ?>js/ckeditor.def.js" type="text/javascript"></script>

[RexDude]

Schau im Ausgabe Code was da steht. Normal brauchts minimum dass hier: <textarea class="ckeditor"></textarea>

[Popkultur]

Hab addRawField entdeckt. Will dummerweise immer noch nicht. Naja, mal weitersuchen.

[RexDude]

Probier sonst mal hartcodiert ne textarea mit ckeditor class reinzumachen. Nicht das es am CK liegt

[Popkultur]

Wenn ich manuell eine

Code: Alles auswählen

<textarea id="ckeditor1" name="X" style="display: none;" class="editors">X</textarea>

hinzufüge, gehts (besser). Obwohl der Editor total verschoben und versteckt angezeigt wird. Wenn ich dynamisch generiere siehts so aus:

Code: Alles auswählen

<textarea id="ckeditor1" rows="16" style="display: none" class="editors" cols="50" name="News_editieren[article]">Inhalt</textarea>

und geht nicht. Mahlzeit.

So sieht der JS Code aus:

Code: Alles auswählen

jQuery(document).ready(function($) {
   
   $('.editors').each(function() {
        var id = $(this).attr('id');

    CKEDITOR.replace(id, {
        height: 500,
        fillEmptyBlocks: false,
        forcePasteAsPlainText: false,
        entities: false,
        linkShowTargetTab: true,
        format_tags: 'p;h1;h2;h3;h4;h5;pre',
        removePlugins: '',
        extraPlugins: 'rex_help',
        allowedContent: true,
        removeDialogTabs: '',
        toolbar: [
            ['Cut', 'Copy', 'Paste', 'PasteText', 'PasteFromWord', '-', 'Undo', 'Redo'],
            ['Link', 'Unlink', 'Anchor'],
            ['Image', 'Table', 'Seperator', 'HorizontalRule', 'SpecialChar'],
            ['TextColor', 'BGColor'],
            ['CreateDiv'],
            ['Maximize'],
            ['Source'],
            ['rex_help'],
            '/',
            ['Format', 'Styles'],
            ['Bold', 'Italic', 'Underline', 'Strike', 'Subscript', 'Superscript', '-', 'RemoveFormat'],
            ['JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock'],
            ['NumberedList', 'BulletedList', '-', 'Outdent', 'Indent', '-', 'Blockquote']
            // no comma after last entry!!!
        ],
        contentsCss: [CKEDITOR.basePath + 'contents.css',
		    'h1 { font-size:48px; text-transform: uppercase; }' +
		    'h2 { font-size:36px; text-transform: uppercase; }' +
		    'h3 { font-size:28px; text-transform: uppercase; }' +
		    'h4 { font-size:22px; text-transform: uppercase; }' +
		    'h5 { font-size:18px; text-transform: uppercase; }' +
	        '.pdflink { background: url(/img/pdf_icon.png)no-repeat; padding-left: 20px; }' +
    	    '.grey { color:#AAACAF; }' +
     		'.red { color: #cd0032; }' +
       		'.blue { color:#46A0DC; }' +
        	'.orange { color:#EBAA46; }' +
        	'.purple { color:#B90087; }' +
        	'.green { color: #9BC33C; }' +
        	'.picleft { float: left; clear: left; margin: 0 10px 5px 0; }' +
        	'.picright { float: right; clear: right; margin: 0 0 5px 10px; }'
		            // no plus after last entry!!!
        ]
        // no comma after last entry!!!
    });
	  

   });
   
      CKEDITOR.stylesSet.add('default', [
        { name: 'pdflink', element: 'span', attributes: { 'class': 'pdflink' } },
        { name: 'grau', element: 'span', attributes: { 'class': 'grey' } },
        { name: 'eyevisrot', element: 'span', attributes: { 'class': 'red' } },
        { name: 'blau', element: 'span', attributes: { 'class': 'blue' } },
        { name: 'orange', element: 'span', attributes: { 'class': 'orange' } },
        { name: 'magenta', element: 'span', attributes: { 'class': 'purple' } },
        { name: 'grün', element: 'span', attributes: { 'class': 'green' } },
        { name: 'Bild linkbündig', element: 'div', attributes: { 'class': 'picleft' } },
        { name: 'Bild rechtsbündig', element: 'div', attributes: { 'class': 'picright' } }
        // no comma after last entry!!!
    ]);
	
});

Er meldet: TypeError: a is undefined

[RexDude]

https://github.com/RexDude/ckeditor/blo ... -einsetzen

[RexDude]

Ah ok, brauchst ne spezial Konfig. Readme nochmal studieren schadet aber bestimmt nicht

Er meldet: TypeError: a is undefined

Ich würd mal alles unnötige raus und nach und nach wieder rein. Hast vermutlich irgendwo einen Syntax fehler.

[Popkultur]

Der gleiche JS-Code funktioniert ja in anderen Modulen, er wird da genauso extern eingebunden. Es liegt auch nicht am Code, denn wenn ich ihn komplett auskommentiere, meldet er immer noch den Type A Fehler, auch wenn ich die auskommentierte JS Datei einbinde. Erst wenn ich die Datei nicht mehr einbinde, kommt kein Fehler mehr.

[RexDude]

Dann grab weiter. Um welche Datei gehst? Welche Codezeile? Was steht da? etc.

[runstop64]

Er meldet: TypeError: a is undefined

Solche Fehler werden auch von jQuery geworfen. Sind die Objekte korrekt gesetzt? Gib sie mal in der Konsole aus.

[Popkultur]

Okay, der Fehler hat sich selbst gelöst. Vielleicht hätte ich mal den Cache leeren sollen. Jetzt gehts so wie oben beschrieben. Danke für die Hilfe!