Typo3 - Frontend Editing - Versionsgeschichte

91.47.56.45 am 10. Juni 2008 um 10:19 Uhr

2008-06-10T10:19:35Z

91.47.56.45 am 10. Juni 2008 um 10:07 Uhr

2008-06-10T10:07:14Z

91.47.56.45 am 10. Juni 2008 um 10:04 Uhr

2008-06-10T10:04:28Z

Neue Seite

Ein Artikel aus http://expertinnen-web.de/2006-160/typo3-seiten-mit-frontend-editing-pflegen/ Datum des Zugriffs 10.6.2008

TYPO3-Seiten mit Frontend-Editing pflegen
Tags: none

Frontend-Editing ist praktisch, vermittelt es doch dem nicht so webaffinen Redakteur das Gefühl, den Inhalt genau unter Kontrolle zu haben. Der Komfort läßt sich noch steigern, wenn er sich mit seinem FE-User-Passwort auch gleich zur Seitenpflege anmelden kann. Außerdem läßt sich das Aussehen des Edit-Panels, mit dem der Redakteur arbeitet, gefälliger und unaufdringlicher gestalten - auch ein Beitrag zur besseren Arbeitsumgebung.
Die User

Wir legen FE-User, BE-User und eine BE-Usergruppe datenpflege mit eingeschränkten Rechten, wie ein Redakteur sie braucht, an.
Frontend-Editing einschalten

* Die BE-Usergruppe datenpflege wird so konfiguriert, dass sie kein Admin-Panel sieht (zu unbequem), sondern für jeden Inhalt eine Editorleiste vorfindet. Der Eintrag in der Gruppen-User-TSconfig:
admPanel {
#Frontend-Editieren freigeben
enable.edit = 1
#Buttons einblenden
override.edit.displayIcons = 1
#Admin-Panel abschalten
hide = 1
}
* Im Template-Setup wird das Frontend-Editing grundsätzlich freigeschaltet:
page.config.admPanel = 1
* Damit der Redakteur vom Frontend auch auf die gesamte Seite, nicht nur auf die einzelnen Inhalte zugreifen kann, bauen wir eine Instanz des Edit-Panels für Seiten im Template ein:
page {
marks.INHALT.10 < styles.content.editPanelPage
marks.INHALT.20 < styles.content.get
}

Frontend-Editing konfigurieren

Die Buttonleisten des Edit-Panels sind keine ästhetische Freude und stören den Überblick über die Seite. Ist eine Content-Spalte zu schmal, kann ihr Label (enthält die Überschrift einer Seite oder eines Inhaltselements) auch schon einmal das ganze Layout sprengen. Hier ist also weniger mehr - wir schalten Überflüssiges ab.

* tt_content.stdWrap.editPanel.label =
# Label entfernen
tt_content.stdWrap.editPanel.line = 0
# Linie unterhalb des Edit-Panels enfernen
styles.content.editPanelPage {
10 = EDITPANEL
10 {
label.data =
label.wrap =
}
}
# schaltet das Label für das seiten-Editpanel aus
* Die Tabelle, die das Edit-Panel enthält, ist hartcodiert. Am einfachsten formatiert man sie deshalb per CSS:
table.typo3-editPanel { border: none; background-color: #fff; width: auto;}
table.typo3-editPanel TD.typo3-editPanel-controls { border: 1px solid #ccc; background-color: #fff;}

Frontend-User einen Backend-User zuweisen

Damit sich jetzt Mitglieder einfach mit ihrem FE-Login anmelden und doch editieren können, setzt man die Extension simulatebe ein. Sie ermöglicht die Verbindung eines FE-Users mit einem BE-User, auf dessen Rechte und Gruppenrechte er dann zugreifen kann.

* simulatebe im Extension Manager importieren und installieren.
* Im Template einbinden:
page.headerData.40 < plugin.tx_simulatebe_pi1
* Unsere FE-User feuser1 mit beuser1, feuser2 mit beuser2 verbinden (über das Auswahlfeld related backend user)
* Fertig!

Vorsicht, dynamisch!

Neben harmlosem Content gibt es aber immer Seiten, die ein Plugin wie z.B. ein Wiki enthalten. Damit der forsche Redakteur nicht versehentlich solche Seiten löscht, sperren wir sie einfach, indem wir ihre Rechte auf admin setzen und die Gruppe entfernen.

← Nächstältere Version		Version vom 10. Juni 2008, 10:19 Uhr
Zeile 71:		Zeile 71:

	Neben harmlosem Content gibt es aber immer Seiten, die ein Plugin wie z.B. ein Wiki enthalten. Damit der forsche Redakteur nicht versehentlich solche Seiten löscht, sperren wir sie einfach, indem wir ihre Rechte auf admin setzen und die Gruppe entfernen.		Neben harmlosem Content gibt es aber immer Seiten, die ein Plugin wie z.B. ein Wiki enthalten. Damit der forsche Redakteur nicht versehentlich solche Seiten löscht, sperren wir sie einfach, indem wir ihre Rechte auf admin setzen und die Gruppe entfernen.
		+
		+	=== tt_news Frontend Editing ===
		+	und aus der Usergroup Ruhr:
		+	geht doch mit dem frontend editing der news...
		+
		+	Hier eine Lösung!
		+	<code>
		+	plugin.tt_news {
		+	general_stdWrap.editPanel = 1
		+	general_stdWrap.editPanel {
		+	allow = edit,new,move,toolbar,hide,delete
		+	line=5
		+	label = %s
		+	onlyCurrentPid = 0
		+	previewBorder=4
		+	edit.displayRecord = 1
		+	}
		+	}
		+	</code>

@@ Zeile 8: / Zeile 8: @@
 Wir legen FE-User, BE-User und eine BE-Usergruppe datenpflege mit eingeschränkten Rechten, wie ein Redakteur sie braucht, an.
-    * Die BE-Usergruppe datenpflege wird so konfiguriert, dass sie kein Admin-Panel sieht (zu unbequem), sondern für jeden Inhalt eine Editorleiste vorfindet. Der Eintrag in der Gruppen-User-TSconfig:
+== Frontend-Editing einschalten ==
        admPanel {
        #Frontend-Editieren freigeben
@@ Zeile 19: / Zeile 22: @@
        hide = 1
+       }
-    * Im Template-Setup wird das Frontend-Editing grundsätzlich freigeschaltet:
+</code>
-      page.config.admPanel = 1
+* Im Template-Setup wird das Frontend-Editing grundsätzlich freigeschaltet:
-    * Damit der Redakteur vom Frontend auch auf die gesamte Seite, nicht nur auf die einzelnen Inhalte zugreifen kann, bauen wir eine Instanz des Edit-Panels für Seiten im Template ein:
+ page.config.admPanel = 1
        page {
        marks.INHALT.10 < styles.content.editPanelPage
        marks.INHALT.20 < styles.content.get
+       }
 Die Buttonleisten des Edit-Panels sind keine ästhetische Freude und stören den Überblick über die Seite. Ist eine Content-Spalte zu schmal, kann ihr Label (enthält die Überschrift einer Seite oder eines Inhaltselements) auch schon einmal das ganze Layout sprengen. Hier ist also weniger mehr - wir schalten Überflüssiges ab.
+<code>
-    * tt_content.stdWrap.editPanel.label =
+      tt_content.stdWrap.editPanel.label =
        # Label entfernen
        tt_content.stdWrap.editPanel.line = 0
@@ Zeile 43: / Zeile 50: @@
+       }
        # schaltet das Label für das seiten-Editpanel aus
-    * Die Tabelle, die das Edit-Panel enthält, ist hartcodiert. Am einfachsten formatiert man sie deshalb per CSS:
+</code>
        table.typo3-editPanel { border: none; background-color: #fff; width: auto;}
        table.typo3-editPanel TD.typo3-editPanel-controls { border: 1px solid #ccc; background-color: #fff;}
 Damit sich jetzt Mitglieder einfach mit ihrem FE-Login anmelden und doch editieren können, setzt man die Extension simulatebe ein. Sie ermöglicht die Verbindung eines FE-Users mit einem BE-User, auf dessen Rechte und Gruppenrechte er dann zugreifen kann.
-    * simulatebe im Extension Manager importieren und installieren.
+* simulatebe im Extension Manager importieren und installieren.
-    * Im Template einbinden:
+* Im Template einbinden:
-      page.headerData.40 < plugin.tx_simulatebe_pi1
+ page.headerData.40 < plugin.tx_simulatebe_pi1
-    * Unsere FE-User feuser1 mit beuser1, feuser2 mit beuser2 verbinden (über das Auswahlfeld related backend user)
+* Unsere FE-User feuser1 mit beuser1, feuser2 mit beuser2 verbinden (über das Auswahlfeld related backend user)
-    * Fertig!
+* Fertig!
 Vorsicht, dynamisch!
 Neben harmlosem Content gibt es aber immer Seiten, die ein Plugin wie z.B. ein Wiki enthalten. Damit der forsche Redakteur nicht versehentlich solche Seiten löscht, sperren wir sie einfach, indem wir ihre Rechte auf admin setzen und die Gruppe entfernen.