VEYTON-Plugins mit eigenen Style-Dateien
In einem früheren Artikel habe ich bereits beschrieben, wie man VEYTON-Plugins mit eigenen Templates individuell anpassen kann. Heute soll es um ein paar Gedankenanstöße gehen, wie man das ebenfalls mit CSS-Dateien hinbekommen kann.
Leider ist das hier beschriebene Vorgehen nicht VEYTON-Standard für bereits existierende Plugins. Es geht vielmehr darum, wie man seine selbst entwickelten Plugins anpassbar machen kann. Um die im oben verlinkten Artikel beschriebene Funktionalität mit den individualisierbaren Template-Dateien zu erhalten, muss man nichts weiter tun, außer die Plugin-Templatedateien mit den VEYTON-Bordmitteln in das selbst entwickelte Plugin einzubinden …
Das Problem
… allerdings gehört meiner Meinung nach zu einem HTML-Template eben auch immer eine CSS-Datei. Wenn ich ein Plugin entwickle, habe ich zwei Anforderungen an das Layout:
- muss das Layout auch ohne größere Anpassungen funktionieren. Das Plugin muss sofort nach der Installation mit der integrierten Standard-Optik im Shop verwendbar sein.
- muss das Layout individuell an alle Anforderungen anpassbar sein. Wenn das Plugin in einem grafisch besonders anspruchsvollen Shop eingesetzt wird, muss es über HTML und CSS individuell anpassbar sein, ohne dabei seine Updatebarkeit zu verlieren.
Um dem ersten Punkt gerecht zu werden, ist es erforderliche, dass das Plugin von Haus aus ein HTML-Template und, bei Bedarf, ebenfalls eine CSS-Datei mit bringt. Doch was ist, wenn das HTML-Template individualisiert werden kann, die CSS-Datei aber nicht?
Das würde durchaus ein Problem darstellen. Stylesheet-Informationen, die keiner mehr braucht und niemand mehr zuordnen kann, zerstören evtl. unkontrolliert das Layout. Deshalb ist es wichtig, nicht nur die Standard-HTML-Datei, sondern ebenfalls die Standard-CSS-Datei des Plugins überschreiben zu können.
Die Lösung
Die von VEYTON standardmäßig integrierte Möglichkeit, VEYTON-Plugins mit eigenen Templates individuell anzupassen habe ich bereits mehrfach angesprochen. Und genau diese Variante wollen wir jetzt auch für die mitgelieferte CSS-Datei realisieren. Die Umsetzung ist ausgesprochen einfach und lässt sich mit nur einem einzigen Hook in der Installer-XML bewerkstelligen:
<?xml version="1.0" encoding="utf-8"?>
<xtcommerceplugin>
<plugin_code>
<code>
<hook>styles.php:bottom</hook>
<phpcode><![CDATA[
if(file_exists($_SERVER['DOCUMENT_ROOT']._SRV_WEB._SRV_WEB_TEMPLATES._STORE_TEMPLATE.'/plugins/my_plugin/my_plugin.css')) {
$cssfile = _SYSTEM_BASE_URL._SRV_WEB._SRV_WEB_TEMPLATES._STORE_TEMPLATE.'/plugins/my_plugin/my_plugin.css';
}
else {
$cssfile = _SYSTEM_BASE_URL._SRV_WEB.'plugins/my_plugin/templates/my_plugin.css';
}
echo '<link rel="stylesheet" type="text/css" href="'.$cssfile.'" />';
]]></phpcode>
<order>1</order>
<active>1</active>
</code>
</plugin_code>
</xtcommerceplugin>
Wichtig ist, dass der Hookpoint styles.php:bottom verwendet wird. Dadurch wird gewährleistet, dass der erzeugte Code an der korrekten Stelle ins HTML geschrieben wird.
Im Hook selbst wird geprüft ob die Datei individualisierte Datei templates/myTemplate/plugins/my_plugin/my_plugin.css existiert. Ist dies der Fall, wird der Pfad zu dieser Datei in der Variable $cssfile gespeichert. Existiert die Datei nicht, wird der Pfad plugins/my_plugin/templates/my_plugin.css in der Variable gespeichert. Diese Datei ist die Standard-CSS-Datei, die das mit dem Plugin ausgeliefert wird.
Anschließend wird der <link>-Tag zum einbetten der gefunden CSS-Datei generiert und ausgegeben.
