tas2580

Style Änderungen in phpBB über eine eigene Extension

tas2580  

Immer wieder wollen Betreiber eines phpBB Forums kleinere Änderungen an ihrem Template machen um z.B. Buttons von sozialen Median oder ähnliches einzubinden. Dazu kann man natürlich einfach die Originalen Template Dateien anpassen, allerdings kann es dann bei zukünftigen Updates zu Problemen kommen wenn der Updater bestimmte Stellen nicht findet oder die Änderungen überschreibt. Als Alternative kann man ein eigenes Template erstellen und dank Vererbung dort nur die Dateien rein kopieren die man ändern möchte. Das hat allerdings den Nachteil das man bei einem Update die Codeänderungen durchgehen muss um seine geänderten Dateien anzupassen. Der sicherste Weg ist also Änderungen über eine Extension zu machen, so muss man das Original Template nicht ändern und muss sich bei einem Update um nichts weiter kümmern. Das erstellen einer solchen Extension ist recht einfach, man benötigt dazu keine PHP Kenntnisse, wenn man weiß wie man Ordner und Dateien anlegt und ein wenig HTML/CSS Kenntnisse hat reicht das vollkommen aus.


1. Ordner anlegen

Als erstes muss man für seine Extension einen Ordner innerhalb des Ordners ext anlegen. Die Extension selber liegt in einem Ordner der nach dem Autor benannt ist um mehrere Extensions mit dem gleichen Namen von verschiedenen Autoren zu ermöglichen. Man legt sich also den Ordner /ext/myname/myextension/ an.

2. Composer anlegen

Jetzt benötigt man noch eine Datei die phpBB Informationen zur Extension gibt. Die Datei muss direkt in den Hauptordner der Extension liegen und hat den Namen composer.json, der vollständige Pfad wäre also /ext/myname/myextension/composer.json. Die Datei muss mit folgendem Inhalt gefüllt werden:

{
	"name": "myname/myextension",
	"type": "phpbb-extension",
	"description": "Hier eine Beschreibung der Extension.",
	"homepage": "http://example.com",
	"version": "1.0.0",
	"license": "GPL-2.0",
	"authors": [
		{
			"name": "Dein Name",
			"email": "mail@example.com",
			"homepage": "http://example.com",
			"role": "Developer"
		}
	],
	"require": {
		"php": ">=5.3.3"
	},
	"require-dev": {
		"phpbb/epv": "dev-master"
	},
	"extra": {
		"display-name": "Hier der Angezeigte Name der Extension",
		"soft-require": {
			"phpbb/phpbb": ">=3.1.3,<3.2.*@dev"
		}
	}
}

Die Änderungen die man in der Datei machen muss sollten selbsterklärend sein, wichtig ist das unter name der Pfad zur Extension eingetragen wird.

Jetzt hat man schon eine lauffähige Extension die sich im Adminbereich aktivieren lässt. Allerdings macht die Extension noch nichts.

3. Template Dateien anlegen

Wenn man das Grundgerüst für seine Extension hat kann man die Änderungen am Template anlegen. Dazu verwendet man die Template Events in phpBB, eine Liste aller Events gibt es hier. Alternativ kann man auch in den Templatedateien nach Events suchen. Ein Event erkennt man an einem HTML Kommentar das nach dem Muster <!-- EVENT event_name --> aufgebaut ist. Wenn man ein passendes Event hat muss man innerhalb seiner Extension eine Datei dafür anlegen, die Datei muss unter /styles/prosilver/template/event/ liegen und den Namen des Events haben. Wenn man z.B. etwas im Footer des Forums einfügen will lautet der vollständige Name der Datei /ext/myname/myextension/styles/prosilver/template/event/overall_footer_after.html. Die Datei kann jetzt mit dem HTML Code den man einfügen möchte gefüllt werden.

Wenn man ein anders Template als Prosilver verwendet muss der Name des Ordners angepasst werden. Man kann auch all also Ordnername verwenden, dann werden die Änderungen in allen installierten Templates angezeigt.

4. CSS einbinden

Oft will man nicht nur neuen HTML Code einfügen sondern auch eigenes CSS verwenden. Auch das ist per Extension möglich. Dazu muss man zu erst eine neue CSS Datei einbinden. Das geschieht über das Template Event overall_header_head_append, man legt sich also die Datei /ext/myname/myextension/styles/prosilver/template/event/overall_header_head_append.html an und bindet dort seine CSS Datei folgendermaßen ein:

<!-- INCLUDECSS @myname_myextension/style.css -->

Hier muss man den Namen des Autors und der Extension anpassen.

Nun kann man eine CSS Datei mit dem im Template Event angegebenen Namen nach /styles/prosilver/theme/ legen. Die Datei wird jetzt global im ganzen Forum eingebunden. Da sie nach den original phpBB CSS Dateien eingebunden wird kann man darin auch Klassen aus dem original CSS überschreiben.

5. Extension installieren

Wenn man alle Dateien angelegt hat und sie mit seinem Code gefüllt hat kann man die Extension im Adminbereich unter Anpassen -> Erweiterungen verwalten installieren. Sollte man nach der Installation noch was ändern muss der Foren-Cache gelöscht werden. Ein neu installieren der Extension ist nicht nötig um Änderungen zu übernehmen. Nachdem man die Extension aktiviert hat sollten die eingefügten HTML-Codes an den jeweiligen stellen angezeigt werden.

Ich habe hier mal ein Paket als Vorlage zusammengestellt.


Ähnliche Beiträge


Kommentare

Hallo ;D
Wollte nur schreiben, das der Link zur der Vorlage Paket tot ist.

Oh, da hab ich wohl vergessen die Datei mit auf den neuen Server zu schieben.

Dann könnte man doch eigentlich auch so Sachen wie Bootstrap in eine Extension packen oder ?

Ja, könnte man. Allerdings müsste man dann ja auch die CSS Klassen im HTML Code auf Bootstrap ändern. Das würde ich dann doch eher über ein eigenes Template machen.
Eine Extension eignet sich eher wenn man das schon vorhandene HTML/CSS um eigenen Code erweitern will.


Kommentar schreiben

URLs werden automatisch umgewandelt.
[b]DEIN TEXT[/b] für Fett gedruckt
[quote]DEIN ZITAT[/quote] für Zitate
[code]DEIN CODE[/code] für Code
captcha