Advitum.de auf Google+

Einstieg in Extbase – ein Typo3-Plugin ohne Models

Einstieg in Extbase – ein Typo3-Plugin ohne Models
VN:F [1.9.22_1171]
Bewertung: 3.9/5 (25 Stimmen abgegeben)
Von am
Kategorien: Content Management Systeme, PHP, Programmieren, Tutorials, Typo3

Ich habe mich lange Zeit um Extbase gedrückt—wie immer bei Typo3 findet man zu Extbase keine wirklich guten Tutorials und der Einstieg fällt leider ziemlich schwer. Wenn man dann doch ein Tutorial findet, sind viele Dinge im Tutorial schon wieder veraltet und funktionieren nicht wie erwartet. Das ist für einen Anfänger natürlich immer besonder schlecht.

Jetzt kam ich allerdings nicht mehr drum herum, den Einstieg zu wagen. Als ich eine Webseite mit Typo3 v6 aufsetzen wollte, stellte ich fest, dass viele meiner eigenen Extensions nicht mehr wie gewünscht funktionieren. Also werde ich diese jetzt nach und nach auf Extbase umstellen und dabei hoffentlich einiges lernen.

In diesem Artikel möchte ich versuchen, euch den Einstieg in Extbase so einfach wie möglich zu machen. Dies ist keineswegs ein allumfassendes Tutorial, denn ich bin selbst noch dabei, mich einzuarbeiten. Dieser Artikel ist quasi ein Wegweiser für alle, die wie ich vor der großen Herausforderung mit Namen Extbase stehen.

Einstieg in Extbase - ein Typo3-Plugin ohne Models, 3.9 out of 5 based on 25 ratings

Ein kleines Bisschen Theorie

Leider kommt man beim Einstieg in Extbase nicht um etwas Theorie herum. Deshalb muss ich hier in Kürze die Grundlagen von MVC erläutern.

MVC ist die Abkürzung für Model-View-Controller und ist eine Methode der Software-Architektur. Kernprinzip ist die Aufteilung der Software in Models, welche für die Verwaltung und Aufbereitung der Daten und für die Kommunikation mit der Datenbank zuständig sind, Views, welche als Templates für die Ausgabe (in unserem Fall den HTML-Content) dienen und Controller, welche den Ablauf der Software und die Kommunikation zwischen allen Komponenten steuern. Das ist eine wirklich sehr knappe Erklärung des Prinzips MVC. Allen Interessierten empfehle ich die Lektüre des Wikipedia-Artikels zum Thema und eine eingehende Web-Recherche. Für diesen Artikel soll das jedoch erst einmal reichen.

Wir können im folgenden die Sache erstmal etwas vereinfachen, indem wir die Models außen vor lassen. Wir werden ein Plugin entwickeln, dass jedoch keine komplizierten Daten verarbeiten muss, deshalb brauchen wir auch kein Model. Wir werden lediglich einen Controller und dazugehörige Views anlegen. Aber dazu später mehr. Zuerst schauen wir uns den Zweck des Plugins an.

Was soll das Plugin eigentlich können?

Schon in meinem Artikel über individuelle Layouts für Unterseiten in Typo3 habe ich einige Dinge gezeigt, die ich bei der Umsetzung der Webseite für Urologie-Curos getan habe, dies will ich auch hier wieder tun. Das Plugin, das wir in diesem Artikel erstellen, soll auf jeder Unterseite eine bestimmte Grafik im Kopf anzeigen, die wir in den Seiteneigenschaften festlegen können.

Das ist eigentlich schon alles, also fangen wir einfach an!

Schritt 1: Aufbau einer Typo3-Extension mit Extbase

Eine Typo3-Extension, die auf Extbase aufsetzt, muss einer genauen Struktur folgen. Das hat den Vorteil, dass wir nicht so schnell den Überblick verlieren, wenn wir komplizierte Erweiterungen entwickeln. Der Nachteil ist, dass wir jetzt erstmal diese Struktur anlegen müssen.

In dem Ordner /typo3conf/ext legen wir einen Ordner, dessen Name den Erweiterungs-Schlüssel darstellt. In meinem Fall ist das »le_curos«.

Innerhalb des Erweiterungs-Ordners legen wir diese Ordner-Struktur an, wobei die Groß- und Kleinschreibung zu beachten ist.
Innerhalb des Erweiterungs-Ordners legen wir diese Ordner-Struktur an, wobei die Groß- und Kleinschreibung zu beachten ist.

Nun müssen wir noch drei Dateien anlegen, die jede Typo3-Extension aufweisen muss, nämlich ext_emconf.php, ext_localconf.php und ext_tables.php, welche wir alle drei direkt in den Ordner der Extension legen.

Die Datei ext_emconf.php ist dafür zuständig, dem Erweiterungsmanager alle wichtigen Informationen über die Erweiterung zur Verfügung zu stellen. So sieht meine Datei aus:

<?php
	
	$EM_CONF[$_EXTKEY] = array(
		'title' => 'Curos',
		'description' => 'Plugins für die Curos-Webseite.',
		'category' => 'plugin',
		'author' => 'Lars Ebert',
		'author_email' => 'info@advitum.de',
		'author_company' => 'Advitum.de',
		'shy' => 1,
		'priority' => '',
		'module' => '',
		'state' => 'alpha',
		'internal' => '',
		'uploadfolder' => '0',
		'createDirs' => '',
		'modify_tables' => '',
		'clearCacheOnLoad' => 0,
		'lockType' => '',
		'version' => '0.0.1',
		'constraints' => array(
			'depends' => array(
				'extbase' => '6.0',
				'fluid' => '6.0',
				'typo3' => '6.0',
			),
			'conflicts' => array(
			),
			'suggests' => array(
			),
		),
	);
	
?>

Eigentlich sind alle Schlüssel des Arrays selbsterklärend, aber am wichtigsten ist das Array unter constraints.depends, denn hier definieren wir, welche Komponenten die Erweiterung benötigt.

In der Datei ext_localconf.php können wir grundlegende Einstellungen für unsere Erweiterung festlegen, in der Datei ext_tables.php weiterführende, genauere Einstellungen. Fürs erste reicht es, wenn wir die beiden Dateien mit folgendem Inhalt füllen. Dieser sorgt dafür, dass die Dateien nicht manuell aufgerufen werden können.

<?php
	
	if(!defined('TYPO3_MODE')) die ('Access denied.');
	
?>

Wir haben jetzt unsere erste, eigene Typo3-Extension, die wir natürlich direkt über den Extension-Manager installieren!

Schritt 2: Ein Plugin definieren

Um ein Plugin zu definieren, müssen wir Typo3 eigentlich nur mitteilen, wo das Plugin liegt und was aufgerufen werden soll, um den Inhalt des Controllers auszugeben. Zuerst fügen wir in der Datei ext_tables.php folgende Zeile hinzu:

<?php
	
	if(!defined('TYPO3_MODE')) die ('Access denied.');
	
	Tx_Extbase_Utility_Extension::registerPlugin($_EXTKEY, 'headerimage', 'Titelbild');
	
?>

Damit teilen wir Typo3 mit, dass unsere Extension mit dem Schlüssel $_EXTKEY ein Plugin mit der ID »headerimage« und dem Namen »Titelbild« hat. Jetzt könnten wir das Plugin schon über das Backend in die Seite einfügen. Allerdings wüsste Typo3 dann noch nicht, was es zu tun hat, wenn das Plugin angezeigt wird. Dazu müssen wir noch einige Zeilen zur Datei ext_localconf.php hinzufügen.

<?php
	
	if(!defined('TYPO3_MODE')) die ('Access denied.');
	
	Tx_Extbase_Utility_Extension::configurePlugin(
		$_EXTKEY,
		'headerimage',
		array(
			'Static' => 'headerimage'
		),
		array()
	);
	
?>

Hier definieren wir, dass zur Anzeige des Plugins »headerimage« die Action »headerimage« im Controller »Static« aufgerufen werden soll. Hier kommen wir jetzt endlich mit MVC in Berührung. Deshalb schiebe ich hier jetzt schnell ein paar Grundlagen über Controller ein.

Schritt 3: Einen Controller anlegen

Controller stellen in MVC die Kontroll-Einheiten dar. Sie kontrollieren den Programmfluss, welche Modelle benötigt werden und welcher View aufgerufen werden soll. Ein Controller ist in Extbase einfach eine Klasse, in der sich beliebig viele Aktionen befinden können. Im Normalfall, also wenn wir irgendwelche komplexen Anwendungen entwickeln, gehört zu jedem Controller auch ein Modell.

So könnte es in einer Blogging-Extension zum Beispiel einen Articles-Controller geben, der die Artikel verwaltet. In diesem Article-Controller würde es verschiedene Methoden geben, die als Actions bezeichnet werden. Denkbar wäre hier zum Beispiel eine addAction zum Hinzufügen von Artikeln, eine editAction zum Bearbeiten und eine showAction zum Anzeigen eines einzelnen Artikels. Wird im Frontend dann zum Beispiel der Artikel XYZ aufgerufen, wird intern die Methode showAction im ArticlesController aufgerufen, die dafür sorgt, dass der Artikel XYZ angezeigt wird.

Analog gibt es in unserer Extension einen StaticController. Ich habe diesen Controller »Static« genannt, weil hier eben keine wirkliche Interaktion mit der Datenbank geschieht, der Contoller sorgt wirklich nur für die Darstellung von simplem, statischem Inhalt. Bei der Anzeige unseres oben definierten Plugins wird, so wie wir es angegeben haben, in diesem StaticController die Methode headerimageAction aufgerufen. Was müssen wir also tun? Wir müssen diesen Controller und diese Methode anlegen. Dazu erstellen wir eine neue Datei im Controller-Ordner unserer Extension.

<?php
	
	class Tx_LeCuros_Controller_StaticController extends Tx_Extbase_MVC_Controller_ActionController
	{
		public function headerimageAction() {
			
		}
	}
	
?>

In dieser Datei legen wir eine neue Klasse mit Namen Tx_LeCuros_Controller_StaticController an. Tx ist der allgemeine Prefix für alle Typo3-Extensions, LeCuros ist der Name unserer Extension (aus le_curos wird LeCuros), Controller besagt, dass es sich um einen Controller handelt und am Ende steht der eigentliche Name unseres Controllers.

Die Klasse erstellen wir auf Basis der Klasse Tx_Extbase_MVC_Controller_ActionController was zur Folge hat, dass wir grundlegende Controller-Methoden zur Verfügung gestellt bekommen.

In der Methode headerimageAction können wir uns nun nach belieben austoben. Hier findet die Logik unseres Plugins Platz. Ich habe hier dafür gesorgt, dass das mit der aktuellen Seite verknüpfte Bild an den View übergeben wird.

<?php
	
	class Tx_LeCuros_Controller_StaticController extends Tx_Extbase_MVC_Controller_ActionController
	{
		public function headerimageAction() {
			$image = $GLOBALS["TYPO3_DB"]->exec_SELECTgetSingleRow(
				'sys_file.identifier',
				'sys_file, sys_file_reference',
				"sys_file_reference.tablenames = 'pages' AND sys_file_reference.table_local = 'sys_file' AND sys_file_reference.fieldname = 'media' AND sys_file.uid = sys_file_reference.uid_local AND sys_file_reference.uid_foreign = " . $GLOBALS['TSFE']->id,
				'',
				'sorting_foreign'
			);
			
			if(isset($image) && isset($image['identifier'])) {
				$this->view->assign('image', htmlspecialchars($image['identifier']));
			} else {
				$this->view->assign('image', '/templates/curos/img/home.jpg');
			}
		}
	}
	
?>

Die Variable $GLOBALS['TSFE']->id beinhaltet die UID der Typo3-Seite, auf welcher das Plugin gerade eingebettet wird. Mit der Methode $this->view->assign() können wir Variablen an unseren View übergeben. In diesem Fall speichere ich in einer Variable mit Namen »image« den Pfad des anzuzeigenden Bildes.

Der Controller ruft am Ende der Action automatisch den zugehörigen View auf. Jede Action in jedem Controller hat standardmäßig einen eigenen View, diesen müssen wir allerdings noch schnell anlegen.

<img src="/fileadmin{image}" alt="" /><

Der Inhalt meines Views bleibt relativ leer, da ich wirklich nur ein einziges Bild einfügen will.

Die Views einer Extbase-Extension werden mit Fluid realisiert. Für uns heißt das an dieser Stelle lediglich, dass wir auf die eben definierte Variable über {image} zugreifen können. Mit Fluid könnte man hier noch weitere Dinge anstellen, wie zum Beispiel For-Schleifen, Fallunterscheidungen und vieles mehr. Aber auch hier muss ich mich selbst erst einmal genauer mit befassen. Fürs erste soll diese eine Zeile Code jedoch reichen.

Nun müssen wir das Plugin lediglich noch per TypoScript in unsere Seite einbinden.

Schritt 4: Ein Plugin per TypoScript einbinden

Um ein Plugin per Typoscript einzubinden, reicht seit Extbase leider nicht mehr nur noch eine Zeile. Aber wenn man erst einmal weiß, wie es geht, ist es eigentlich auch wieder ganz einfach.

plugin {
  tx_le_curos {
    view {
      templateRootPath = {$plugin.tx_le_headerimage.view.templateRootPath}
      partialRootPath = {$plugin.tx.le_headerimage.view.partialRootPath}
      layoutRootPath = {$plugin.tx_le_headerimage.view.layoutRootPath}
    }
  }
}

Als erstes müssen wir die gesamte Extension initialisieren. Das müssen wir zum Glück nur einmal pro Extension machen, wenn wir also noch ein zweites Plugin aus der Extension einbinden würden, müssten diese Zeilen nur ein mal im Code stehen.

Nun erstellen wir eine Instanz unseres Plugins innerhalb unserer temp-Variable.

temp {
  headerImage = USER
  headerImage {
    userFunc = tx_extbase_core_bootstrap->run
    extensionName = LeCuros
    pluginName = headerimage
  }
}

Mit userFunc = tx_extbase_core_bootstrap->run rufen wir den Bootstrapper von Extbase manuell auf und übergeben ihm als Parameter die Namen unserer Extension und unseres Plugins.

Nun müssen wir als letztes noch das Plugin an der gewünschten Stelle einbinden. Das geschieht bei mir mit folgender Zeile.

page.10.marks.HEADER_IMAGE < temp.headerImage

Abhängig vom Aufbau eures bisherigen TypoScripts kann es sein, dass ihr das Plugin an einer anderen Stelle einbinden müsst, aber die Grundlagen sollten hier klar sein.

Fazit: Wenn man weiß, wie es geht, ist es einfach

Wir haben soeben unser erstes eigenes Plugin mit Extbase realisiert! Und das tolle ist, dass wir nun endlich einen relativ einfachen Einstieg in die Entwicklung mit Extbase haben. Ich empfehle hier nun dringend weiteren Lesestoff, um das Gelernte weiter zu vertiefen. Dazu gebe ich in den Links zum Thema ein paar Linktipps!

Ich hoffe euch hat mein kleines Mini-Tutorial gefallen. Ich würde mich über ein Feedback in den Kommentaren freuen!

Einstieg in Extbase - ein Typo3-Plugin ohne Models, 3.9 out of 5 based on 25 ratings

Links zum Thema

Jetzt seid ihr dran!

Teilt eure Meinung mit uns in den Kommentaren, gebt eine Bewertung für diesen Artikel ab und teilt ihn in Social Networks!

Über

Ich bin ein junger Webdesigner und Programmierer aus Siegen und blogge auf Advitum.de über meine Erfahrungen im Web. Meine Themenschwerpunkte liegen im Bereich der Web-Entwicklung mit PHP, JavaScript, HTML und anderen Script-, Programmier- und Markup-Sprachen, der Nutzung von Content Management System wie Typo3, Wordpress etc. und der Effekt-Hascherei mit Photoshop. Seit 2008 blogge ich auf Advitum.de – mal mehr, mal weniger regelmäßig – über alles, was mich so interessiert. Wenn dir mein Blog gefällt, freue ich mich immer sehr über Feedback in Form von Kommentaren und E-Mails.

Kommentare zu diese Artikel

Schreibe jetzt einen Kommentar!

Chris schrieb am Antworten

Vielen Dank für diesen super Text. Es ist wirklich nicht einfach, irgendwo gute Erklärungen dafür zu finden.
Eine ganz blöde Frage: Wenn ich eine einfach Extension für jemand anderes erstellen will, mache ich das genauso wie von dir beschrieben und er kopiert sich dann die Dateien einfach in sein ext-Verzeichnis? Muss in seinem Typo3 dann auch Extbase installiert sein?
Oder gibt es dafür einen besseren Weg?
Ich will eigentlich nur eine fertige PHP-Seite in eine Extension umbauen und die Extension dabei so simpel halten wie irgendwie möglich.

    Lars Ebert schrieb am Antworten

    Hallo Chris! Danke für dein Lob, es freut mich sehr, dass dir mein Artikel gefällt.

    Du kannst ohne weiteres den gesamten Extension-Ordner zu einer anderen Typo3-Installation kopieren. Extbase muss dann dort aber vorhanden sein. In den neuesten Typo3-Versionen (ich glaube ab v6) ist Extbase aber schon fest integriert!

    Viel Erfolg!

Patricia schrieb am Antworten

Hi Lars,
vielen Dank für das tolle Tutorial! Wirklich gut erklärt.
Es wäre allerdings ganz hilfreich, wenn Du die Daten noch zur Verfügung stellst (zumindest die sql-Datei) damit das Beispiel besser nachzuvollziehen wäre.

Weiter so 🙂

Patricia schrieb am Antworten

Ja, habs grad gerafft .. braucht ja keine SQL, da ja das Bild aus den Seiteneigenschaften geholt wird 🙂

    Lars Ebert schrieb am Antworten

    Richtig! Es freut mich, dass mein Tutorial dir gefällt. Viel Erfolg noch!

Markus schrieb am Antworten

Hi Lars, tolles Tutorial!
Hast Du auch Erfahrung mit der Integration von Datatabels (Server-side Processing / http://www.datatables.net/development/server-side/php_mysql) in Typo3?
Wie könnte man das realisieren?
Schöne Grüße, Markus

    Lars Ebert schrieb am Antworten

    Hallo Markus, damit habe ich bisher noch keine Erfahrungen gemacht, aber ich werde mich damit mal beschäftigen. Vielleicht gibt es dann ja bald auch ein Tutorial dazu.

Markus schrieb am Antworten

Juhee! Wahrscheinlich das erste auf Anhieb verständliche Tutorial zu einem Typo3 Thema das ich in den letzten 5 Jahren gefunden habe! Tausen Dank dafür!

    Lars Ebert schrieb am Antworten

    Es freut mich, dass dir das Tutorial weiter geholfen hat.

Panade schrieb am Antworten

Guter Artikel, kenn das zwar schon, aber ist mal ein interessanter Ansatz der mehr Motivation schafft als diese ewigen „von Grund auf, alles“ Tutorials. Oft will jemand ja nur erstmal ein schnelles Plugin bauen und dann darauf aufbauen.
MVC kann man danach auch noch machen. 🙂 Ich werds weiterempfehlen.

    Lars Ebert schrieb am Antworten

    Eigentlich wollte ich schon längst einen Folge-Artikel geschrieben haben, der sich dann intensiver mit MVC innerhalb von Extbase beschäftigt. Eigentlich 😉

Peter schrieb am Antworten

Ein wirklich sehr guter Artikel. Danke dafür. Aber ich werde so lange wie irgend möglich nach dem alten Prinzip vorgehen. Damit ist man einfach wesentlich schneller, und bekommt auch sehr saubere Extensions hin.

Silvan schrieb am Antworten

Hallo Ebert,

Ich konnte die MVC und Extbase Teile deines Tutorials gut nachvollziehen. Danke soweit!
Doch was ich nicht ganz verstehe, ist der zumeist nicht kommentierte Teil:

$image = $GLOBALS[„TYPO3_DB“]->exec_SELECTgetSingleRow(
’sys_file.identifier‘,
’sys_file, sys_file_reference‘,
„sys_file_reference.tablenames = ‚pages‘ AND sys_file_reference.table_local = ’sys_file‘ AND sys_file_reference.fieldname = ‚media‘ AND sys_file.uid = sys_file_reference.uid_local AND sys_file_reference.uid_foreign = “ . $GLOBALS[‚TSFE‘]->id,
“,
’sorting_foreign‘
);

wo holst du das Bild? Bei mir wird dementsprechend nur das „else“ ($this->view->assign(‚image‘, ‚/templates/curos/img/home.jpg‘);) bild geladen. Koenntest du hier diesen Schritt noch etwas praezisieren?

Zudem, ist dieser Teil auch schwer verstaendlich:

plugin {
tx_le_curos {
view {
templateRootPath = {$plugin.tx_le_headerimage.view.templateRootPath}
partialRootPath = {$plugin.tx.le_headerimage.view.partialRootPath}
layoutRootPath = {$plugin.tx_le_headerimage.view.layoutRootPath}
}
}
}

sorry, habe Erfahrung mit TypoScript, doch ansonsten halt ein Anfaenger mit Typo3.

Vielen Dank fuer deine Antwort.
Silvan

ariane schrieb am Antworten

Hallo

ich habe die versucht die erweietrung genau so zu programmieren, leider bekomme ich die fehlermeldung: Could not analyse class:Tx_LeCuros_Controller_StaticController maybe not loaded or no autoloader?
kann man die fertige erweiterung downloaden?

    Benito schrieb am Antworten

    Hallo,
    ich erhalte auch den Fehler. Kann es sein, dass die Controller mittlerweile nur noch mit einem DomainModel geladen werden.
    Wie kann ich hier einen autoload implementieren ?

    Danke schon mal !

Asvet schrieb am Antworten

Sehr guter Einstieg,

Sehr gut gemacht Lars Ebert. Danke dafür – und mehr davon dem Zeuch’s

Gruß
Asvet

Marcus schrieb am Antworten

Moin Moin,
ich finde dein Tutorial sehr gut, bis auf eine kleinigkeit:

Bei Schritt 4 bin ich mir absolut nicht sicher in welche Datei der jeweilige TypoScript Schnipsel kommt. Wäre es möglich das noch mit anzugeben?

Jonas schrieb am Antworten

Hallo,
sehr schöne Tutorial! Wäre schön, wenn du auch mal ein dynamisches machen könntest. (Verbindung zur Datenbank).

Freundliche Grüße
Jonas

Typo3 Horst schrieb am Antworten

Funktioniert leider nicht

Bodo schrieb am Antworten

Danke, der Beitrag ist knackig und verständlich. So kommt man wenigstens in die Struktur. Ist schon was anderes als die alte Forme der Entwicklung von extensions

Diese Artikel könnten dir auch gefallen