Bei einer stark besuchten Seite sollte eine Cache-Lösung wie Varnish eingesetzt werden. Der Nachteil einer gecachten Seite ist, dass ein Update eines Inhaltsblocks (z.B. einer Ankündigung oder einer Werbaktion), der auf allen Unterseiten angezeigt werden soll, durch den Cache nicht sofort möglich wäre.
Ohne der Erneuerung der gecachten Seiten kann der Inhalt des Blocks über jQuery geladen und in die gecachte Seite eingefügt werden. So entfällt das Cache-Warming, und der neue Inhalt ist sofort auf allen Seiten zu sehen.
Auch der dynamische Inhalt kann über eine CMS-Seite in Magento verwaltet werden. Um ihn über jQuery in die vorhandene Seitenstruktur sauber und effizient einfügen zu können, sollten die Inhalte der CMS-Seite in Roh-Form ausgegeben werden.
Roh-Ausgabe von CMS-Inhalten
Mit dem Layout „Empty“ und durch Entfernen des head-Blocks mit dem folgenden XML-Layout-Update können CMS-Inhalte unformatiert ausgegeben werden:
<remove name="head" />
Wenn wir die Quellecode-Ausgabe dieser CMS-Seite im Frontend ansehen, stellen wir fest, dass der Inhalt in ein nicht ganz leeres Layout eingebettet wird:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> </head> <body class="page-empty cms-page-view cms-hello"> <div> <div class="std"><p>Hallo Welt</p></div></div> </body> </html>
Dies hängt damit zusammen, dass für diese Ausgabe die Vorlage unter app/design/frontend/base/default/template/page/empty.phtml verwendet wird, die in der Tat nicht leer ist:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->getLang() ?>" lang="<?php echo $this->getLang() ?>">
<head>
<?php echo $this->getChildHtml('head') ?>
</head>
<body>
<div>
<?php echo $this->getChildHtml('after_body_start') ?>
<?php echo $this->getChildHtml('global_messages') ?>
<?php echo $this->getChildHtml('content') ?>
<?php echo $this->getChildHtml('before_body_end') ?>
<?php echo $this->getAbsoluteFooter() ?>
</div>
</body>
</html>
Für die dynamische Einbindung der CMS-Inhalte per jQuery in eine gecachte Seite, sollten die CMS-Inhalte in ihrem Ursprungszustand ausgegeben werden, d. h. ohne html- und body-Tag. Dies ist mit dem eigenem wirklich leeren Template möglich:
In unserem Template-Verzeichnis (z. B. app/design/frontend/default/default/template/page) legen wir die Datei really-empty.phtml mit folgendem Inhalt an:
<?php echo $this->getChildHtml('content') ?>
In das Feld XML für Layoutänderungen tragen wir folgenden XML-Code ein:
<remove name="head" /> <reference name="root"> <action method="setTemplate"> <template>page/really-empty.phtml</template> </action> </reference>
CMS-Inhalte mit jQuery einfügen
Nun bekommen wir tatsächlich nur <p>Hallo Welt</p> ausgegeben und könnten diese Inhalte dynamisch in eine statische Seite einfügen:
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$.noConflict();
jQuery(document).ready(function() {
jQuery('#dynamic-content').load('/magento1702sd/hello');
});
</script>
</head>
<body>
<div id="dynamic-content"></div>
</body>
</html>
Weiterlesen: