Schon mal was von eZ JSCore gehört? Dabei handelt es sich um den kleinen JavaScript Helfer von eZ Publish!

JavaScript ist in der heutigen Online-Welt unausweichlich: Slideshows, Effekte, Ajax-Events und vieles mehr wird nur noch darüber abgebildet. Flash hat ausgedient – endlich.

eZ Publish bietet als Unterstützung für die Arbeiten mit JavaScript die kleine aber feine Erweiterung namens  eZ JScore. Diese Erweiterung  bietet drei ganz besondere Funktionen: JavaScript einbinden, Ajax-Event und JS/CSS Packer. Diese möchte ich dir heute näher bringen.

 

JavaScript einbinden

Wie jeder eZ Entwickler weiß, werden JavaScripts und CSS-Dateien über die design.ini definiert.

[StylesheetSettings]
CSSFileList[]=base.css
CSSFileList[]=customize.css

[JavaScriptSettings]
FrontendJavaScriptList[]=main.js
BackendJavaScriptList[]=main_admin.js

Diese Dateien werden im pagelayout.tpl direkt eingebunden und stehen auf jeder Seite zur Verfügung. Wunderbar! Oder doch nicht? Nicht überall benötigt man jede CSS- oder JS-Datei. In diesem Fall würde man nun wahrscheinlich im jeweiligen Template ein händisches Include machen. Aber Stop! Es geht auch anders!

 {ezscript( array('jquery-ui.min.js')}
 {ezcss( array('blue.css' )}

Somit nutzt man die Struktur von eZ Publish und die jeweilige Dateien werden nur eingebunden, wenn das Template aufgerufen wird. Wichtig ist das im Header

 ezcss_load() und ezscript_load()

eingebunden wird. (Im Standard brauchst dir um den letzten Befehl keine Sorgen machen)

Ajax-Event

Wenn ich mal kurz in die Vergangenheit gehen dürfte, so in etwa 10 Jahre, wie lange habe ich da gebraucht, um ein stinknormales Ajax-Event abzusetzen? Mindestens einen Tag, wenn nicht auch mal länger. Dann kam jQuery und Prototype – 5 Minuten?! Mit eZJSCore braucht man gerade mal noch 3 Minuten.

In Summe musst du genau zwei Schritte erledigen.

1. Ajax-Landigpage Template anlegen

unter design/../ezjsctemplate/meinbeispiel.tpl

2. JavaScript Befehl einbinden

Mit folgenden Befehl werden die Funktionen für den Ajax-Befehl von eZ Publish erstellt

 {ezscript_load(array( 'ezjsc::jqueryio') )}

und der JavaScript Befehl (Info: das was nach ezsctemplate:: steht wäre der Name Deines Templates name ohne die Endung .tpl)

jQuery.ez( 'ezjsctemplate::meinbeispiel', {postData: 'node_id=12'}, function(data){ alert('success');  })

erledigt den Rest. Das war auch schon alles, was man tun muss. 🙂

JS/CSS Packer

Bevor man eine Seite online stellt, sollte man eine INI Einstellung tätigen und zwar

[eZJSCore]
Packer=enabled

damit packt eZ Publish alle JavaScript/CSS Dateien in eine Datei und komprimiert den Code. Sollte eigentlich ein Pflichtakt auf jeder eZ Publish Seite sein.

Zusätzliche Funktionen

Es gibt noch einige weitere Funktionen in dieser Erweiterung auf welche ich leider aus Zeitgründen an dieser Stelle nicht näher eingehen kann, aber vielleicht das nächste Mal.

  • Lade Dateien von CDN
  • binde jQuery / UI oder YUI 2/3 ein
  • div. Hilfs Operatoren

Weitere Links:

 

https://blog.silversolutions.de/wp-content/uploads/2018/12/ez_dummy.pnghttps://blog.silversolutions.de/wp-content/uploads/2018/12/ez_dummy-150x150.pngDavid HohlB2B.technologieCMS,Entwicklung,Javascript,ToolsSchon mal was von eZ JSCore gehört? Dabei handelt es sich um den kleinen JavaScript Helfer von eZ Publish! JavaScript ist in der heutigen Online-Welt unausweichlich: Slideshows, Effekte, Ajax-Events und vieles mehr wird nur noch darüber abgebildet. Flash hat ausgedient – endlich. eZ Publish bietet als Unterstützung für die Arbeiten mit...Die e-Commerce B2B Experten bloggen über Händler-Shops, ERP, PIM und das integrierte CMS eZ Publish