Unser LiteSpeed Cache Plugin erlaubt es rasend schnelle Ladezeiten für Ihren JTL-Shop zu erreichen.
Das Plugin senkt hierbei die Last des Servers und erlaubt zeitgleich schnellere Aufrufe Ihres Shops.
Hinweis: Inhalte welche dynamisch über PHP in Abhängigkeit von individuellen Ereignissen verändert werden, sind mit dem Plugin nicht kompatibel.
Beispiele hierfür: Brutto/Netto Rechner, Zuletzt angesehene Artikel, Preisänderungen nach Kundenherkunft, etc. Davon unberührt bleibt natürlich die Kompatibilität zu responsive Templates über CSS.
Installation des Plugins
Um unser LiteSpeed Cache Plugin zu installieren, müssen Sie sich in Ihrem Shop-Backend anmelden.
Es gibt zwei Möglichkeiten unser LiteSpeed Cache Plugin zu installieren.
Variante 1: Sie downloaden unser Plugin über den JTL-Extension Store und installieren das Plugin per Knopfdruck:
Variante 2: Navigieren Sie zu Plugin Verwaltung (Plugin-Manager) – Upload – Auswählen.
Nun öffnet sich ein Auswahlfenster Ihres Systems, in welchem Sie das heruntergeladene Plugin auswählen.
Anschließend klicken Sie auf “Hochladen”.
Zuletzt müssen Sie in der Plugin Verwaltung unter “Verfügbar” das Plugin auswählen und installieren.
Aktivieren des Plugins
Jetzt haben Sie unter “Aktiviert” das ecomDATA LiteSpeed Cache Plugin ersichtlich. Nun müssen Sie das Plugin aktivieren.
Wenn Sie nun auf Dashboard navigieren, wird Ihnen in der Mitte vorgeschlagen, die notwendigen .htaccess Anpassungen zu machen. Dies machen Sie mit einem Klick auf .htaccess anpassen. Nun sollte das Dashboard so aussehen:
Ganz unten sehen Sie nun das GuestMode Caching aktiviert ist.
Falls Sie unser LiteSpeed Cache Plugin in der Free Version nutzen, ist die Installation nun abgeschlossen.
LiteSpeed Cache PRO
Hier finden Sie die Vorteile von LiteSpeed Cache PRO
Private Cache
Enorme Ladezeitenverbesserung auch für eingeloggte Kunden mit Sonderpreisen.
Kunden mit Warenkörben
Ladezeitenverbesserung auch für Kunden mit Warenkörben.
Erweiterte Einstellungen
Eigener Cache pro User-Agent oder ausgeschlossene Get-Parameter.
Cache Blacklist
Schließen Sie bestimmte Seiten aus dem Cache aus, sodass diese nicht gecached werden.
Crawler
Wärmt den Cache vor, sodass auch jeder Erstaufruf einer Seite aus dem Cache ausgeliefert wird.
Credit Link
Der Credit Link zu ecomDATA im Footer wird entfernt.
Sie aktivieren die Pro Version des Plugins, in dem Sie auf Lizensierung bzw. LS Cache Pro klicken. Anschließend kopieren Sie lediglich den Lizenzschlüssel in das Feld und speichern.
Erweiterte Konfiguration (nur bei LiteSpeed Cache PRO möglich)
Nun können Sie mit der Konfiguration des Template-Mappings beginnen.
Konfiguration: Template Mapping
Hierfür wechseln Sie in den Reiter “Template Mapping”.
Im Template Mapping geben Sie an, welche Elemente der Seite den Private Cache (ESI) nutzen sollen. Damit sind Elemente gemeint, welche pro Besucher unterschiedlich sind wie z.B. Warenkorbanzeige, Account/Login mit Willkommens Anzeige, Wunschzettel sowie Vergelichsliste (bei Nutzung dieser), etc.
Je nach verwendeten Template, müssen hier unterschiedliche Elemente definiert werden werden.
Für diverse Templates gibt es bereits Vorlagen, diese können sofort aktiviert, müssen jedoch getestet werden.
Falls Sie eine solche Vorlage wählen, können Sie in der Anleitung zum Prüfungsteil springen.
Um ein Element zum Private Cache hinzuzufügen, müssen Sie herausfiltern, wie der Bereich aufgebaut ist.
Dafür navigieren Sie auf die Startseite des Shops und öffnen die im Browser integrierten Entwickleroptionen (zumeist Hotkey F12). Hier benötigen Sie die Ansicht “Elemente”. Das Ganze sollte dann so aussehen:
Danach müssen Sie auf Ihrer Tastatur “Strg+Umschalt(Shift)+C” drücken. Nun sehen Sie den Code hinter den einzelnen Elementen. Wenn Sie nun mit der Maus über z.B. den Kundenbereich in der Navigationsleiste fahren und Linke Maustaste drücken, springen Sie unter “Elemente” zum gewünschten Bereich.
Nun sehen Sie die für den Bereich hinterlegten Elemente. Sie sehen unser Element hat eine feste ID: shop-nav
Nun prüfen Sie, ob diese ID nur ein einziges Mal vorkommt, in dem Sie Strg+F klicken und in die Suche #shop-nav schreiben. Wenn nur ein einziges Suchergebnis gefunden wird, können Sie das Element auswählen, allenfalls müssen Sie die einzelnen Bereiche genauer spezifizieren.
Im Fall unseres Beispiels konnten wir jedoch nur einmal #shop-nav finden, was bedeutet unsere ID ist eindeutig.
Sie wechseln also wieder in das Admin-Backend unter “Template Mapping”. Hier geben Sie nun beim CSS-Selektor #shop-nav ein.
Die zweite Auswahl nennt sich “Templatebereich Inhalt”. Da in unserem Beispielfall in der Shop-Navigation der Warenkorb, der Login und die Vergleichsliste enthalten ist, können wir alle diese Bereich auswählen. Am Ende schaut es so aus:
Wenn Sie ein Template verwenden, wo diese Bereiche getrennt voneinander sind, müssen die einzelnen Bereiche einzeln angegeben werden. Dies schaut dann z.B. so aus:
Konfiguration: User-Agents
Falls Ihr Shop Template für verschiedene User-Agents verschiedene Shop-Designs auf PHP Ebene ausgibt, können Sie diese in den Erweiterten Einstellungen festlegen. User-Agents wären zum Beispiel unterschiedliche Crawler oder Mobile Geräte. Dies ist nur dann notwendig, wenn nicht rein per CSS die Veränderungen durchgeführt werden, sondern auch auf PHP Ebene um z.B. bestimmte Bereiche des Shops, bei bestimmten User-Agents, nicht zu laden.
Beispiele für User-Agents:
android|avantgo|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)/|plucker|pocket|psp|symbian|treo|up.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino|1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw-(n|u)|c55/|capi|ccwa|cdm-|cell|chtm|cldc|cmd-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc-s|devi|dica|dmob|do(c|p)o|ds(12|-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(-|_)|g1 u|g560|gene|gf-5|g-mo|go(.w|od)|gr(ad|un)|haie|hcit|hd-(m|p|t)|hei-|hi(pt|ta)|hp( i|ip)|hs-c|ht(c(-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i-(20|go|ma)|i230|iac( |-|/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |/)|klon|kpt |kwc-|kyo(c|k)|le(no|xi)|lg( g|/(k|l|u)|50|54|e-|e/|-[a-w])|libw|lynx|m1-w|m3ga|m50/|ma(te|ui|xo)|mc(01|21|ca)|m-cr|me(di|rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|-([1-8]|c))|phil|pire|pl(ay|uc)|pn-2|po(ck|rt|se)|prox|psio|pt-g|qa-a|qc(07|12|21|32|60|-[2-7]|i-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55/|sa(ge|ma|mm|ms|ny|va)|sc(01|h-|oo|p-)|sdk/|se(c(-|0|1)|47|mc|nd|ri)|sgh-|shar|sie(-|m)|sk-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h-|v-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl-|tdg-|tel(i|m)|tim-|t-mo|to(pl|sh)|ts(70|m-|m3|m5)|tx-9|up(.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|xda(-|2|g)|yas-|your|zeto|zte-
Konfiguration: Crawler
Nun kann der Crawler aktiviert werden, welcher dafür sorgt, dass Seiten immer auch beim ersten Aufruf, aus dem Cache ausgeliefert werden. Dafür navigieren Sie in den Plugineinstellungen unter “Crawler”. Hier können Sie den Crawler aktivieren und dann die zusätzlichen Einstellungen treffen.
- Crawler Einstellungen bieten folgende Optionen:
- Crawler Status – hiermit aktiviert man den Crawler
- Max. Laufzeit – damit kann man eine Ausführzeit festlegen, falls man den Crawler z.B. nur 5 Minuten laufen lassen möchte
- Max. CPU Auslastung (%) – diese Einstellung ermöglicht es, den Crawler abhängig von der Last des Servers zu steuern. Gibt man hier z.B. 40 an, läuft der Crawler nur, wenn die Auslastung unter 40% ist
- Max. gleichzeitige Threads – damit kann man festlegen, wie viele Threads verwendet werden dürfen
Grundsätzlich wäre die Konfiguration jetzt fertiggestellt.
Prüfen ob LiteSpeed Cache funktioniert
Testen Sie nun, ob Ihre Seite gecached ist. Hierfür öffnen Sie erneut auf der Startseite die Entwickleroptionen (F12) und wählen den Reiter “Netzwerk”. Nun müssen Sie in der Liste auf den Namen Ihre “Domain” klicken und anschließend auf “Headers”. Hier sollte nun bei x-litespeed-cache “HIT” stehen.
Der Cache ist aktiv – auch erkennbar an stark verbesserten Ladezeiten.
Nun müssen Sie prüfen, ob Ihre Einstellungen korrekt sind.
Hierfür öffnen Sie Ihren Shop fügen diverse Artikel dem Warenkorb hinzu und prüfen ob die Anzahl sowie der Betrag bestehen bleibt, wenn Sie zwischen verschiedenen Kategorien/Artikeln/Startseite hin und her wechseln. Dazu müssen Sie einfach Produkte in den Warenkorb legen und prüfen ob die Anzeige der “Artikel im Warenkorb” auf anderen schon gecachten Seiten, wie z.B. der Startseite, korrekt angezeigt werden.
Anschließend müssen Sie einen Account im Shop anlegen und prüfen, ob z.B. die Willkommensinfo (Hallo, Kundenname) korrekt angezeigt wird – oder weiterhin die Anmeldemaske angezeigt wird.
Falls Fehler aufgetreten sind, müssen Sie nun erneut mit F12 prüfen, ob der Bereich, wo der Fehler auftritt, einzigartig ist, oder ob genauer spezifiziert werden muss, welcher Bereich ausgenommen werden soll.