Typo3 - Frontend Editing

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.

tt_news Frontend Editing

und aus der Usergroup Ruhr: geht doch mit dem frontend editing der news...

Hier eine Lösung! 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
     }
  }