Seiteninhalt mit Ajax laden

Bei dieser Seite hier https://brewsandgrooves.com werden die Seiteninhalte mit Ajax* geladen.
D.h. wenn man das Menü rechts oben benutzt, wird bei einem Seitenaufruf nur der Inhaltsbereich ersetzt/geladen.

Das sieht sehr elegant und smooooth aus :cool:

Wie würdet ihr sowas in Contao realisieren?

Danke für eure Tipps :D

* zumindest vermute ich das

Ich glaub ich versteh die Frage nicht ganz. Wie würde man es in Contao machen? Genauso?!
Response per AJAX holen, Content austauschen, URL per pushState anpassen :D

man kann das Ajax auch mit einem preloader "simulieren" - z. B. https://unique.contao-themes-shop.de/

Zitat:

---

Zitat von BennyBorn

Ich glaub ich versteh die Frage nicht ganz. Wie würde man es in Contao machen? Genauso?!
Response per AJAX holen, Content austauschen, URL per pushState anpassen :D

---

Ok, danke schon mal, d.h. so in der Art:

Code:

---

// bei einem Klick auf einen Menüeintrag folgendes ausführen:
$( "#content" ).load( "kontakt.html div#content" );

// und dann die URL anpassen (den ersten Parameter versteht ich nicht ganz):
window.history.pushState("object or string", "Kontakt", "/kontakt.html");

---

... ich hole mir den gesamten Inhalt der Seite und "filtere" dann den Content-Bereich mit JS heraus.
Gibts eine Möglichkeit dass ich gleich nur den Content per Ajax reinhole?

Möglicherweise https://packagist.org/packages/fritz...ao-ajax-layout in Verbindung mit https://packagist.org/packages/alnv/ajax-menu oder auch https://packagist.org/packages/posty...to-ajax-bundle ...?

Fake-Ajax habe ich mal via https://github.com/inspiredminds/contao-animsition gemacht, das schaut dann beispielsweise so aus: https://www.christine-schmid.net/

Zitat:

---

Zitat von thesweetg

Ok, danke schon mal, d.h. so in der Art:

Code:

---

// bei einem Klick auf einen Menüeintrag folgendes ausführen:
$( "#content" ).load( "kontakt.html div#content" );

// und dann die URL anpassen (den ersten Parameter versteht ich nicht ganz):
window.history.pushState("object or string", "Kontakt", "/kontakt.html");

---

... ich hole mir den gesamten Inhalt der Seite und "filtere" dann den Content-Bereich mit JS heraus.
Gibts eine Möglichkeit dass ich gleich nur den Content per Ajax reinhole?

---

Grob in Pseudcode gesagt JA. Es gibt aber keine Möglichkeit nur direkt einen Teil der Seite anzufragen. Du musst die ganze Seite holen und Dir dann den passenden Content rausholen. Neben pushState sollte man auch noch popState implementieren um sicherzustellen das die Navigation via die Vor- und Zurückbuttons im Browser funktionieren.

Zitat:

---

Zitat von lucina

Fake-Ajax habe ich mal via https://github.com/inspiredminds/contao-animsition gemacht, das schaut dann beispielsweise so aus: https://www.christine-schmid.net/

---

Das schaut zwar nett aus, aber generell würde ich davon abraten. Sinn und Zweck hinter solch einer Ajax-Implementierung ist ja eigentlich das der Seitenaufbau schneller wird. Durch solch einen Fake wirkt die Seite jedoch träger.

Zitat:

---

Zitat von BennyBorn

Sinn und Zweck hinter solch einer Ajax-Implementierung ist ja eigentlich das der Seitenaufbau schneller wird. Durch solch einen Fake wirkt die Seite jedoch träger.

---

ich wäre vorsichtig mit der Behauptung, dass mit Ajax der Seitenaufbau schneller wird... ggf. wenn man sowas wie Lazyload für Elemente usw. einbaut... der Performancevorteil gegenüber einenem Reload der ganzen Seite dürfte bei im Browser gecacheden (uff ... schreibt man das so?) Elementen gering sein.