TinyMCE4SF v02.02.00, TinyMCE 2.1.0+ als wysiwyg für Sefrengo Einstellungen

[amk]

Name:
TinyMCE4SF 02.02.00

Status:
beta

Bechreibung:
Diese Erweiterung ersetzt den in Sefrengo verwendeten wysiwyg-Editor
"FCKeditor" vollständig durch den wysiwyg-Editor "TinyMCE" (Version 2.1.0+)

Features:
- Analog zum FCKeditor
- Extrem schnelles laden durch GZip-Kompression
- XHTML-valider Output möglich
- Advanced-TinyMCE-Plugins werden genutzt inkl. neuem CSS- & XHTMLXtra-Plugin
- Deutsche, englische und französische UI-Sprachunterstütztung
- Vollständige Sefrengo-ResourceBrowser-Unterstützung
- Umfangreiche optionale Konfigurationsmöglichkeiten

Autor:
Alexander M. Korn (amk)

Lizenz:
GPL

Benötigte Sefrengo Version:
>= 01.03.00 (Sefrengo 1.3)
(Sollte auch mit Sefrengo 1.2 funktionieren)


Installation:

1.
Eine Sicherheitskopie der Datei "backend/inc/fnc.type_forms.php"
Ihrer Sefrengo-Installation anlegen. (Diese Datei der Sefrengo-
Orginalinstallation wird überschrieben).
2.
Innerhalb des ZIP-Verzeichnisses "backend/" befinden sich 3 Ordner:
"inc/"
"inc_SF_v01_03_00/"
"inc_SF_v01_03_01/"
Je nach dem welche Sefrengo-Version Sie nutzen, kopieren Sie die in
"inc_SF_v01_03_00/" oder "inc_SF_v01_03_01/" enthaltene Datei
"fnc.type_forms.php" in das "backend/inc/"-Verzeichnis Ihrer
Sefrengo-Installation.
3.
Danach kopieren Sie aus dem ZIP-Verzeichnis "backend/inc/"
die Datei "fnc.type_forms.tinymce.php" wiederum in das
"backend/inc/"-Verzeichnis Ihrer Sefrengo-Installation.
4.
Kopieren Sie dann aus dem ZIP-Verzeichnis "projekt01/cms/"
das Verzeichnis "tinymce/" in das "cms/"-Verzeichnis Ihres
Sefrengo-Projektes.

TinyMCE als wysiwyg-Editor für Sefrengo kann nun verwendet werden.

Deaktivierung der Erweiterung:
Wenn Sie TinyMCE als wysiwyg-Editor für Sefrengo nicht mehr nutzen
wollen, entfernen Sie einfach die Datei "fnc.type_forms.tinymce.php"
aus dem "backend/inc/"-Verzeichnis Ihrer Sefrengo-Installation. Danach
sollkte der FCKeditor wieder aktiviert sein.

Hinweise:
Die neue Farbauswahl funktioniert leider auf dem Internet-Explorer nicht
in Verbindung mit dem InlinePopUp-Plugin.

Die französichen Sprachdateien des TinyMCE v2.1.0 sind leider nicht
vollständig. Deshalb können bei französicher UI auch englische Begriffe
auftauchen.

TinyMCE ist nicht 100% kompatibel mit den Browsern OPERA und SAFARI!

Hinweise für erfahrene Benutzer:
Um die Erweiterung individuellen Bedürfnissen anzupassen, befindet sich
"projekt01/cms/tinymce" die Datei "tinymce4sf_config.php". Innerhalb
dieser Datei lassen sich u.a. bestimmte Funktionen und Plugins des TinyMCE
aktivieren. Die einzelnen Optionen sind zur Erklärung entsprechend
kommentiert. Eine genauere Erklärung der Optionen ist ebenfalls im
Sefrengo-Wiki zu finden!

Unter "projekt01/cms/tinymce" befindet sich eine CSS-Datei namens
"tinymce4sf_content_overwrite.css". Diese CSS-Datei läd TinyMCE nachdem
er alle eventuell definierten Styles einer Sefrengo-Seite geladen hat.
Wie der Name der Datei schon sagt, kann man damit die Styles der Seite
innerhalb TinyMCE überschreiben.
Bsp.: Im CSS einer Website wurde als Body-Schriftfarbe ein Pastellton
gewählt und als Body-Hintergrund ein Muster definiert. Zu leichteren
Editierung der Textinhalte innerhalb des Editors notiert man dann
kontrastreichere Schriftfarben und einen Body ohne Hintergrundgrafik
{background-color:white;background-image:none;} in der
"tinymce4sf_content_overwrite.css".

CODE

Changelog legend:
# -> Bug Fix
+ -> Addition
^ -> Change
- -> Removed
! -> Note

02.02.00 - released 10.03.2007
-----------------------------------------------------------------------------
+ customization of the paste-buttons (in tinymce4sf_config.php)
+ TinyMCE-plugins:  -insertion (for activation edit the
tinymce4sf_config.php)
^ GZIP-compressor script update (v1.1) and init-methode
^ TinyMCE-plugins updated (TinyMCE-package v2.1.0)
^ TinyMCE-core updated to pre-version v2.1.1 (nightly build 09-03-2007)

02.01.00 - released 01.12.2006
-----------------------------------------------------------------------------
+ TinyMCE-plugin & config file option "InlinePopups" (default 'false' coz
it's experimental)
+ config file option "FormatSourceCode"
+ config file option "EntityMode"
# tried to fix a startup problem with the new TinyMCE-compressor and
some IE-versions
# replaced some TinyMCE-package files with the current CVS-versions (some
bug fixes)
# wrong js-variables names for for images and internal-sites list causes no
selectboxes within Tiny-popup's
# a startup problem in Sefrengo 01.03.00 coz of wrong charset of some
TinyMCE-language-files
# wrong german wording for the label "background image" within Tiny-popups
^ config file re-format and some additional comments

02.00.02 - released 16.11.2006
-----------------------------------------------------------------------------
+ config file option for Tiny's conversion of new lines to br's
+ config file option shows all buttons if "Alle Felder sichtbar"
within SF-modul configuration isn't selected.

02.00.01 - released 16.11.2006
-----------------------------------------------------------------------------
+ fnc.type_forms.php for Sefrengo v1.3.1

02.00.00 - released 15.11.2006
-----------------------------------------------------------------------------
+ all possible wysiwyg/wysiwyg2 features are now available (e.g. preview,
font, fontsize - identical to the FCKeditor implementation)
+ special config file for different functionalities / plugins / options of
TinyMCE (e.g. the XHTMLXtra-plug, doc-type, gzip-compression etc.)
see this file for more information - all options are commented.
+ XHTMLXtra-Plugin added
^ update to TinyMCE 2.0.8 and GZip Compressor 1.09 (1.08 via option still
usable)
^ wysiwyg/wysiwyg2 feature handling changed and improved
^ files renamed
^ TinyMCE-UI-CSS changes & fixes for a better visual
Sefrengo v1.3.1-UI-integration
! several rewrites, changes, improvements, fixes, feature additions

01.01.01 - released 17.07.2006
-----------------------------------------------------------------------------
+ tinyMCE insert link > js-popup-feature > Sefrengo-resourcebrowser added
- 2 unused plug dirs within the tinyMCE package

01.01.00 - released 12.07.2006
-----------------------------------------------------------------------------
^ optimisation for multiple wysiwyg's

01.00.00 Beta - 24.06.2006
-----------------------------------------------------------------------------
! first release

ich freue mich über unterstützung

ihr verbessert damit die chance einer weiterentwicklung der erweiterung durch mich

PAYPAL SPENDE - www.tiefexzeitlos.de (button nutzen)

MEIN AMAZON WUNSCHZETTEL

wer ggf. als sponsor in den modulinfos (readme/forum) genannt werden möchte kann mir das mitteilen!

p.s.: es ist mir möglich, bei einer unterstützung durch firmen etc., eine rechnung mit ausgewiesener mwst. anzufertigen.

Angehängte Datei(en)

 TinyMCE4SF_v02_02_00.zip ( 509.22KB ) Anzahl der Downloads: 51

 

[amk]

so - ich hoffe das release läuft vernünftig bei euch.

musste einiges an sprachdateien vervollständigen (da ich dem französischen nicht mächtig bin, habe ich das was fehlt mit englisch ausgefüllt) ... die DE/FR-language-file-macher sind leider nicht so schnell wie die core-entwickler.

ein aktuelles changelog bzgl. TinyMCE gibts hier:

http://tinymce.moxiecode.com/nightly/

[pillepalle]

so - ich hoffe das release läuft vernünftig bei euch.

musste einiges an sprachdateien vervollständigen (da ich dem französischen nicht mächtig bin, habe ich das was fehlt mit englisch ausgefüllt) ... die DE/FR-language-file-macher sind leider nicht so schnell wie die core-entwickler.

ein aktuelles changelog bzgl. TinyMCE gibts hier:

http://tinymce.moxiecode.com/nightly/

Läuft Klasse!

Vermisse aber die Möglichkeit, wie bei Wordpress, Layer einzufügen... wäre das eventuell auch noch machbar --> Plugin Layer und eventuell Emoticons

Gruß Peter

weiter so

[toddy]

HI,
ich nutze den "normalen" WYSIWYG2 1.2. Wenn ich hier den neuen installiere, erscheint dann ein neuer WYSIWYG Editor zur Auswahl unter Module, oder wird der alte komplett ersetzt?. Was ist dann mit dem bisherigen Inhalten, bleiben die bestehen?

[andi]

morgen toddy

der tinymce-hack «überschreibt» den bestehenden fckeditor von sefrengo.
inhalte aus wysiwyg und wysiwyg2 bleiben unberührt und lassen sich danach mittels tinymce editieren.


gruss andi

[amk]

Läuft Klasse!

Vermisse aber die Möglichkeit, wie bei Wordpress, Layer einzufügen... wäre das eventuell auch noch machbar --> Plugin Layer und eventuell Emoticons

Gruß Peter

weiter so

möglich ist alles - aber sinnvoll?

layer und emoticons werd ich gewiss nicht ins release mit aufnehmen da ich Tiny oder FCK innerhalb SF nicht als html-editor sondern primär als text-editor sehe mit dem komfortabel text eingegeben/formatiert werden soll.

sofern du ein bisschen von php/js verstehst kannst du dir die plugs und buttons selbst aktivieren - ist nicht weiter schwer - ansonsten hilft dir eventuell jemand aus'm forum hier oder du hast ein paar euro übrig und ich baus dir auf die schnelle ein ...

[tigi]

Hallo und Dank an AMK für den Editor, hab das mal installiert und es funktioniert ohne Probleme.
Werde nun mal nach und nach alle Möglichkeiten testen.
mal sehen
Frohe Osterfeiertage

Der Beitrag wurde von tigi bearbeitet: Thu. 5. April 2007, 19:11

[andi]

arbeitet eigentlich jemand erfolgreich mit divs innerhalb des wysiwyg-editors? habe das spasshalber getestet und so wirklich sinnvolles markup kam da nicht raus.

[andi]

hallo zusammen

auf der tiny-website habe ich im editor eine selectbox für css-styles gesehen. obwohl ich im plugin «alle felder sichtbar» aktiviert habe bekomme ich diese selectbox nicht. wurde diese deaktiviert oder muss ich erst an einem bestimmten ort die styles auswählen, damit die selectbox erscheint?

update:
ich gebe zu, ich habe von php fast keine ahnung, aber ich komme der sache näher :-)

tinymce kennt im gegensatz zum fckeditor 4 verschiedene selectboxen:

- css-stile
- format
- schriftgrösse
- schriftart

innerhalb von sefrengo kann jedoch in der modulkonfiguration nur:
- Fonts (tiny-pendant: schriftart)
- Fontgrösse (tiny-pendant: schriftgrösse)
- Stylesheets (tiny-pendant: format)

ausgewählt werden. wohl auch der grund, warum die selectbox «css-stile» im tiny nicht angezeigt wird?

nach einer weiteren suche in der datei fnc.type_forms.tinymce.php fand ich die zeilen 481 und 482:

QUELLTEXT

if (in_array('styles', $features) && !empty($type_config['selectablestyles']))
$components2[] = 'styleselect';

diesen teil «&& !empty($type_config['selectablestyles'])» kam mir spanisch vor, also habe ich ihn probehalber gelöscht.
siehe da, die selectbox «css-stile» taucht im tinymce plötzlich auf.

ich habe das gefühl, es gibt ungereimtheiten mit den beiden selectboxen «css-stil» und «format». in der datei «tinymce4sf_config.php» kann die selectbox «format» aktiviert oder deaktiviert werden. diese selectbox kann aber bereits über die modulkonfiguration aktiviert werden. müsste also in dieser datei nicht die selectbox «css-stil» aktivierbar sein?

da ich mich aber wie gesagt in php nicht auskenne warte ich auf eine reaktion von amk als entwickler des hacks


gruss andi

[smail]

ich habe das gefühl, es gibt ungereimtheiten mit den beiden selectboxen «css-stil» und «format».

Vielleicht mal eine ganz dumme Frage: Warum brauchst Du die styles überhaupt? Ich finde mit den Formatvorgaben (also h1, h2...usw, Absatz) kommt man eigentlich auch ganz gut hin. Und das ganze ist semantisch sinnvoll ausgezeichnet - ohne zusätzliche divs.

Bilder lassen sich im übrigen damit trotzdem sehr schön floaten - ohne zusätzliches Markup. Ich denke mal, darum geht es Dir, oder?

Dazu einfach bei dem betreffenden Bild die Eigenschaften öffnen -> Erscheinungsbild. Dort kannst Du dann eine css-Klasse auswählen. Damit sie im Auswahlfeld erscheint (und im Editor korrekt angezeigt wird) die Klasse zusätzlich zu deinen normalen css-Definitionen in die Datei editor_content.css unter cms/tinymce/themes/advanced/css einfügen.

That's it


Gruß
Jan

[andi]

Vielleicht mal eine ganz dumme Frage: Warum brauchst Du die styles überhaupt? Ich finde mit den Formatvorgaben (also h1, h2...usw, Absatz) kommt man eigentlich auch ganz gut hin. Und das ganze ist semantisch sinnvoll ausgezeichnet - ohne zusätzliche divs.

weil es manchmal sinnvoll ist, einem element eine klasse zuzuweisen. dabei entsteht kein zusätzliches markup, die klasse wird dem element übergeben. vor allem, wenn man sefrengo dafür benötigt, um eigene seiten zu verwalten (kann also kaum was schief laufen) gehts einfach schneller. zusätzliches markup hast du mit der selectbox auch nicht.

Bilder lassen sich im übrigen damit trotzdem sehr schön floaten - ohne zusätzliches Markup. Ich denke mal, darum geht es Dir, oder?
Dazu einfach bei dem betreffenden Bild die Eigenschaften öffnen -> Erscheinungsbild. Dort kannst Du dann eine css-Klasse auswählen. Damit sie im Auswahlfeld erscheint (und im Editor korrekt angezeigt wird) die Klasse zusätzlich zu deinen normalen css-Definitionen in die Datei editor_content.css unter cms/tinymce/themes/advanced/css einfügen.

mache ich bis anhin so. mit der selectbox wirds aber noch einfacher: bild anklicken, aus der selectbox den css-stil wählen, fertig. ohne zusätzliches markup versteht sich.

gruss andi

[amk]

andi ... würdest du bitte nur irgendwelche php-files des package posten wenn du genau weisst was du tust!
... bitte nimm die files oben wieder raus. das ist schon alles so ok ...

du bekommst die style-auswahlbox sofern du in der modulkonfiguration, neben dem wysiwyg2-feature "stylesheets" auch die in SF importierten klassen auswählst ... was soll auch die selectbox erscheinen, wenn keine klassen ausgewählt sind. (siehe screenshot)

der switch bzgl. format-select ist im config-file da man dieses feature eben nicht nicht über die modulkonfiguration aktivieren/deaktivieren kann!

ferner werde ich in einer nächsten version die content_overwrite.css analysieren, so dass dort angegebene style-definitionen (klassen) ebenfalls in der tiny-style-selectbox ausgewählt werden können ... damit man auf den Sefrengo-stylesheet-editor/import ganz verzichten kann.


P.S.:

- css-stile
- format
- schriftgrösse
- schriftart

ist alles identisch bzgl. tiny<>fck.

um beim fck die format-selectbox zu deaktivieren muss man in die datei "projekt01/cms/fckeditor/editor/fckconfig.php" schauen.

Angehängte Datei(en)

 875v971.png ( 15.98KB ) Anzahl der Downloads: 29

 

[andi]

andi ... würdest du bitte nur irgendwelche php-files posten wenn du weisst was du tust! ... bitte nimm die files oben wieder raus. das ist schon alles so ok ...

sorry amk. war ja auch nicht als bugfix oder ähnliches gedacht sondern lediglich um zu zeigen, was ich damit meine.

du bekommst die style-auswahlbox sofern du in der modulkonfiguration, neben dem wysiwyg2-feature "stylesheets" auch die in SF importierten klassen auswählst ... was soll auch das feature, wenn keine klassen ausgewählt sind. (siehe screenshot)

da gibst du dir die antwort doch gleich selber :-) :

ferner werde ich in einer nächsten version die content_overwrite.css analysieren, so dass dort angegebene style-definitionen (klassen) ebenfalls in der tiny-style-selectbox ausgewählt werden können ... damit man auf den Sefrengo-stylesheet-editor/import ganz verzichten kann.

der switch bzgl. format-select ist im config-file da man dieses feature eben nicht nicht über die modulkonfiguration aktivieren/deaktivieren kann!

asche über mein haupt. ich steck mein kopf in den sand. war wohl ein schuss in den ofen :-) sorry, wollte keinen unfug treiben.
(kann nach wunsch logischerweise alles zugunsten der übersichtlichkeit gelöscht werden.)


gruss andi

[amk]

ist ja kein problem andi ... um zu zeigen was du meinst gibt's screenshots und die möglichkeit entsprechenden code zu posten. manch ein unkundiger läd sich dass dann runter und wundert sich warum dieses oder jenes nicht mehr funktioniert.

[smail]

mit der selectbox wirds aber noch einfacher: bild anklicken, aus der selectbox den css-stil wählen, fertig. ohne zusätzliches markup versteht sich.

Oh, das wusste ich nicht, dann gebe ich Dir natürlich Recht
Werden da die CSSKlassen auch aus der editor_content.css gelesen?


Dabei nochmal eine Frage: in der Formatbox stehen ja ne ganze Menge Überschriften drin, wie kann ich Auswahl da beschränken, z.B. nur h1 & h2 ?

[amk]

Oh, das wusste ich nicht, dann gebe ich Dir natürlich Recht
Werden da die CSSKlassen auch aus der editor_content.css gelesen?

leider (noch) nicht.

Dabei nochmal eine Frage: in der Formatbox stehen ja ne ganze Menge Überschriften drin, wie kann ich Auswahl da beschränken, z.B. nur h1 & h2 ?

suche dir unter backend/inc/ die datei fnc.type_forms.tinymce.php

füge darin (bspw.) zwischen zeile 649 und 650 eine neue zeile ein:

QUELLTEXT

theme_advanced_blockformats : "h1,h2",

müsste funktionieren - habs nicht getestet.

siehe auch http://wiki.moxiecode.com/index.php/TinyMC...ed_blockformats

[smail]

QUELLTEXT

theme_advanced_blockformats : "h1,h2",

müsste funktionieren - habs nicht getestet.

getestet und für gut befunden

[tobaco]

DANKE für die neue version und eure arbeit!

wie sieht das denn bei einem update mit dem tinyMCE aus. läuft der dann noch?
hat sich in der "fnc.type_forms.php" was geändert oder kann ich die vom tiny einfach wieder drüberspielen?

[alexander]

@tobaco:


1. falscher Thread - stell die Frage lieber beim TinyMCE Hack Thread

2. Mach doch einfach ein Diff der beiden Versionen

3. Keiner der Hacks wird von uns mit einem neuen Release getestet. Es kann also durchaus sein, dass ganz wo anders Fehler auftreten.

Bearbeitungsgrund: Beiträge verschoben

[amk]

hat sich in der "fnc.type_forms.php" was geändert oder kann ich die vom tiny einfach wieder drüberspielen?

an dieser datei hat sich nichts geändert - die datei für SF v1.3.1 aus dem tinymce4sf-package kann bedenkenlos auch für SF 1.4 verwendet werden.