CMS Made Simple Inline Editor Modul - touchInlineEdit

[Chris]

Hallo zusammen,

für den Relaunch einer etwas grösseren Webseite die auf CMSms basiert haben wir einen InlineEditor erstellt der es ermöglicht im Frontend die Contentseiten durch einen Doppelklick zu editieren und wieder abzuspeichern ohne dabei in das Backend zu wechseln.

Das Modul steht Open Source unter der GPL 2.0 Lizenz zum Download bereit. Die Projektseite auf CMSmadeSimple.org findet ihr unter: http://dev.cmsmadesimple.org/projects/touchinlineedit

Besondere Features

• Inhalte im Frontend bearbeiten
• Support Admin- und Frontend User
• Pluginsystem
• Opionaler Support für FrontendUsers und Gruppenberechtigung
• Versch. Editorplugins

Die Installation erfolgt in 3 Schritten

1) Download des Modules

Das Modul könnt ihr über den Modulmanager im CMSms Backend oder direkt von CMSmadeSimple.org http://dev.cmsmadesimple.org/project/files/882 herunterladen.

2) Installation über den Modulinstaller

Die Installation erolgt regulär über den Modulinstaller unter "Erweiterungen » Module".

3) Das Modul im Template laden:

Im Kopf (ganz oben) unseres Templates direkt nach dem Tag {process_pagedata} fügen wir folgenden SmartyTag ein um das Modul zu laden:

Code:

{cms_module module="touchInlineEdit"}

4) Contentblock "Edittable"

Hinweis: Der Flag iseditable wird ab Version 1.7.4 nicht mehr benötigt und kann (sollte) aus den Templates entfernt werden.

Zuletzt narkieren wir den {content} Tag (Maincontent) in unserem Template der im Frontend über InlineEdit "editable" sein soll:

Code:

{content iseditable='true'}

--

Das Modul wurde in den CMSms Releases 1.8.2 Toliara und 1.6.8 Pouebo und 1.9.2 Tevairoa getestet, die Abwärtskompatibilität kann in späteren Releaes jedoch entfernt werden, so das eine akuelle CMSms Installation erforderlich sein wird.

Geplante Funktionen

• Alle Contenblöcke editierbar machen ({content block='1234'})
• kompatibel zu MLE Fork - MLE bis auf weiters eingestellt
• Editierbare Werkzeugleiste - in Version 1.7 hinzugefügt
• Variabler Inline Editor - in Version 1.7 hinzugefügt
• Erweitertes Kontextmenü - ab Version 1.7 entfernt
• Content-Funktionen (Seiten aktivieren, deaktivieren...)
• Erweiterte Benutzerechte verwalten
• Kompatibilität zu FEU FrontendUsers - in Version 1.7.4 hinzugefügt
• Kompatibilität zu alternativen ContentBlöcken (z.B.: AdvancedContent) - in Version 1.7.4 hinzugefügt
• Exclude liste für Blocks
• Ein- / Ausschalten des Editor je Seite
• Berücksichtigen der Seitenspezifischen Berechtigungen (Eigentümer,Bearbeiter)
• Dateimanager für Bilduploads hinzufügen

Screencast

YouTube: http://www.youtube.com/watch?v=QVd_oFiT1Bw

Ressourcen

[1]: http://dev.cmsmadesimple.org/projects/touchinlineedit
[2]: https://github.com/touchdesign/cmsms-touchinlineedit
[3]: http://www.homepage-community.de/index.php?topic=1680.0
[4]: http://www.touchdesign.de/loesungen/cms-made-simple/module.htm

Screenshots

(http://www.homepage-community.de/UPLOADS/img/CMSMSinlineEdit.png)   (http://www.homepage-community.de/UPLOADS/img/CMSMSinlineEdit2.png)


CHANGELOG

Code:

//// Version 1.8.0

Fix plugin elRTE xhtml link element close tag /> #5918
Fix/Update de_DE translation
Add tinyMCE plugin (preview)
Add trigger_error in getPluginInstance
Add/Rewrite touchInlineEditPlugin base class
Improve plugins to store more infos about plugins: name,description,author...
Add touchModule base class
Rewrite/Update plugins tinyMCE, nicEdit, elRTE
Update/Rewrite touchinlineedit.js as clean javascript class
Add admin description for module manager
Add description for module
Rename method hasInlineEditRights -> isEnabled
Import plugin templates to DB (editable)
Add plugin uninstall method (remove unused templates, vars...)
Detach events from module class and call from parent DoEvent
Cleanup code and comments
Use cmsms autoloader for internal touch classes
Add maxheight and buttonlist parameter in nicEdit plugin
Add some options for tinyMCE plugin (tiny plugin support,width,height,editable button list,themes,skins and much more...)
Fix lost editor settings on save settings if is current editor bug #5922
Add confirm message on change settings
Add multiple block support
Fix maxHeight IE bug nicEdit
Add new flag supportsMultiple
Disable multiple support for elRTE
Add feedback box
Remove unused template admineditor.tpl
Register event contentPostRender

/// Version 1.7.4

Add optional support for FrontendUsers (FEU) module with group restrictions
Add new tab permissions
Add Grant/Revoke admin inline edit permissions
Replace radio buttons with dropdowns
Update true false (0,1) values
Remove event methods
Transplant touchinlineedit injector for more flexibility and better performance
Support for alternative ContentTypes (such as AdvancedContent)
Content assigns now allowed, for example {content assign="my_content"}
Goodbye iseditable='true' flag
Fix call install method on change editor plugin

/// Version 1.7.3

Set max cmsms version 1.9.2
Fix alias renaming #5805

/// Version 1.7.2

Fix notice attempt to load admin realm...
Fix aliasAutoRename

/// Version 1.7.1

Update for cmsms 1.9.x compatibility
Set new min/max cmsms versions: 1.6.4-1.9.1
Update translation
Call parent constructor in plugin instance
Update plugins, use parent methods, remove $gCms
Fix logger invalid $contentId
Plugins: Fix Attempt to load admin realm
Add force_compile for debugging

/// Version 1.7

Add template list in BA
Add plugin system
Add new tab editor in BA
Update translations
Add plugin nicedit
Add plugin elrte
Remove jQuery contextmenu
Update Installer
Update icons path for nicedit
Add CMSms max version

/// Version 1.6

Add option to enable/disable inlineEdit on dblclick
Add optional context menu (testing)
Enable logging in installer and upgrade methods
Enable logging on content actions
Move some stuff into event manager
Clean code

/// Version 1.5

Add html source code editor
Add xhtml support (experimental)
Fix ajax request encoding
Bugfix

/// Version 1.4

Move javascripts external
Update fetch tpl contents (plugins,tags,modules) on content update
Some bugfixes

/// Version 1.3

Add button template
Add option to load jquery
Update language
Update content update
Clean code

/// Version 1.2

Add upgrade method
Add CMS minimum version
Add css class .touchInlineEditButton {}
Fix compiled content_id

/// Version 1.1

Add some settings in admin panel
Update translation
Add german translation
Add postinstall message
Add postuninstall message

/// Version 1.0

Initial release

[nicmare]

Hallo!

1. Das ist genau das was ich noch bei CMSms vermisst habe!

2. Wieso postest du das nicht im offiziellen CMSms Forum?
Ich habe mich jetzt hier extra angemeldet um zu meinem eigentlichen Anliegen zu kommen:

Ich habe alles wie in der Anleitung unter 1.7.1 Escada eingerichtet und das Javascript wird auch geladen.
Da das CMS in einem Unterverzeichnis liegt, wurde das im JS auch entsprechend berücksichtigt:

Code:

url: '/cmsms/',

Es gibt keine Javascriptfehler aber trotzdem funktioniert nichts. Ich habe dem regulären Contenttag

Code:

iseditable="true"

gegeben. "Nichts" bedeutet, dass der alles ganz normal arbeitet aber ich nichts auf der Page bearbeiten kann.
Habe ich noch was vergessen?

viele grüße

[nicmare]

noch etwas was mir aufgefallen ist. im JS teil ist eine Funktion leer:

Code:

bkLib.onDomLoaded(
function() {
//...
}
);

Ich vermute mal dass das momentan normal ist?!

[Chris]

Hallo,

noch etwas was mir aufgefallen ist. im JS teil ist eine Funktion leer:

Die Codezeilen kannst du ignorieren, dass ist korrekt so.

1.7.1 Escada eingerichtet

Diese Version habe ich nicht getestet, glaube aber nicht das dein Problem hiermit etwas zutun hat.
Wir haben das Modul in den beiden Stable Releases 1.8.2 Toliara und 1.6.8 Pouebo getestet.

Der "iseditable" Paramater muss für den Maincontent-Block gesetzt werden. Wenn du vorne in den Quelltext deiner Webseite schaust sollte
ein DIV Element und ein Button zum ein/ausschalten (Ein Doppeklick in den Contentbereich geht auch) des Editors zu finden sein die mit den folgenden Klassen und Javascript Funktionen
versehen wurden:

Code:

<button onclick="toggleInlineEdit();">...

und der Content Block:

Code:

<div ondblclick="toggleInlineEdit();" id="touchInlineEditIdX" class="touchInlineEdit">

Falls dem nicht so ist schau nocheinmal in dein Template, evtl. hast du den Paramater falsch gesetzt.
Wenn das nicht hilft poste bitte mal deinen {content} Tag mit allen Parametern Tag so wie du ihn im Template eingebaut hast.

Viele Grüße
Chris

[nicmare]

Das ist eine ganz simple CMSms Basisinstallation:
http://tvim.de/cmsms/index.php?page=about
Habe da keine Experimente am laufen. Habe dem Content tag ganz normal das attribut verpasst. Aber da ist nirgends ein Button. Ich benutze Firefox, falls das hilft.

[Madlen]

Hallo nicmare,

bist du auch im Adminbereich bzw. als Admin eingeloggt? Vielleicht liegt da der Hund begraben.

LG Madlen

[nicmare]

natürlich

[Chris]

natürlich

Hat der Benutzer mit dem du im Frontend bist auch die "Use touchInlineEdit" Rechte? (Benutzerverwaltung > Gruppenberechtigungen)

Viele Grüße
Chris

[nicmare]

es gibt nur einen. den admin!
aber ich werde das modul dann bei gelegenheit noch bei ner anderen installation testen!

[Chris]

es gibt nur einen. den admin!

Der Editior wird in deinem FE nicht geladen, es gibt 2 Möglichkeiten die als Ursache in Frage kommen:

• du bist nicht eingeloggt
• dir fehlen die Rechte: Use touchInlineEdit

Viele Grüße
Chris

[Chris]

Hallo zusammen,

anbei die Update Info für Version 1.1 das aktualisierte Modul ist im Eingangsthread oder auf CMSmadesimple zu finden.

• Das Modul lässt sich jetzt über den Adminbereich konfigurieren
• Die Sprache de_DE wurde hinzugefügt
• Code cleanup

Viele Grüße
Chris

[nicmare]

so, habe nun 1.1 auf nem CMSms 1.6.8 "Pouebo" installiert und es funktioniert auch. Bravo!
Meine Wünsche/Verbesserungsvorschläge:
1. Werkzeugleiste gestalten. Also welche Formatierungen man vornehmen darf
2. Template für den Editbutton

Code:

<button onclick="toggleInlineEdit();">inlineEdit</button> <div ondblclick="toggleInlineEdit();" id="touchInlineEditId15" class="touchInlineEdit">

Finde so einen <button> nicht so hübsch. Wäre cool wenn man hier sein eigenes Template laden kann. So ists es eigentlich üblich bei den meisten Modulen.
3. irgendwie gibts kein Redo und Undo Button?

Ansonsten ein ganz ganz großer Benefit für CMSms! Vielen Dank dafür!

[nicmare]

warum gibs hier eigentlich keine edit funktion?
was ich noch ergänzen möchte:
es wäre auch gut wenn man den header code im template bearbeiten könnte (so wie beim gallery plugin). ich benutze sehr oft jquery und wenn man zweimal jquery einbindet, ist das erstens blöd und zweitens kann es passieren dass manche scripte nicht laufen.

[Chris]

Meine Wünsche/Verbesserungsvorschläge.

Danke für dein Feedback, die Vorschläge stehen auf der Todolist.

Bis es einzelne Templates gibt kannst du den Button ab der 1.2 Version über die Css Klasse "touchInlineEditButton" anpassen.

Viele Grüße
Chris

[Chris]

Hallo zusammen,

Update Info für Version 1.2 das aktualisierte Modul ist im Eingangsthread oder auf CMSmadesimple zu finden.

• CMS minimum version 1.6.8
• Add css class .touchInlineEditButton {}
• Fix compiled content_id

Hinweis: Ein Upgrade von der Vorgängerversion wird dringend empfohlen.

Viele Grüße
Chris