Catalog Templates anpassen: Unterschied zwischen den Versionen

Aus Contao Community Documentation

(Die Seite wurde neu angelegt: „{{stub}} {{AppliesTo|TLVersion=ab 2.8|Extensions=TYPOlight Core, Catalog Version 2}} Category:Admin Module Category: Extensions =Te…“)
 
Zeile 12: Zeile 12:
 
Zunächst geht es hier ganz allgemein um das Vorgehen bei der Template Anpassung. Wie man an bestimmte Werte kommt und so an die Ausgaben die man möchte.
 
Zunächst geht es hier ganz allgemein um das Vorgehen bei der Template Anpassung. Wie man an bestimmte Werte kommt und so an die Ausgaben die man möchte.
 
Zusätzlich werden hier noch ein paar Fallbeispiele vorgestellt, welche zum Teil aus den Wünschen im Forum entnommen sind.
 
Zusätzlich werden hier noch ein paar Fallbeispiele vorgestellt, welche zum Teil aus den Wünschen im Forum entnommen sind.
 +
 +
=Voraussetzungen für das Tutorial=
 +
* wie ein Katalog erstellt wird sollte von anderen Tutorials klar sein. Es sollte also ein Katalog vorhanden sein mit Inhalten.
 +
* der Umgang mit TYPOlight sollte bekannt sein
 +
* wie man [http://de.contaowiki.org/Templates_bearbeiten Templates bearbeitet] sollte in Grundzügen bekannt sein.
  
 
=Grundlagen=
 
=Grundlagen=
Zeile 20: Zeile 25:
  
 
<pre><?php print_r($this->entries); ?></pre>
 
<pre><?php print_r($this->entries); ?></pre>
 +
 +
Wenn man sich das Ergebniss nun auf er neu geladenen Seite anschaut ist das nicht gerade schön anzusehen. Alles steht hintereinander und ergibt einen Code Brei. Deswegen sollte man sich das am besten immer direkt in der Quellcode ansicht anschauen. Da bekommt man alles schön eingerückt und verschachtelt zu sehen! Oder man setzt die Ausgabe in dein <nowiki><pre></nowiki>-Tag.
 +
 +
Auszug aus von einem Immoblilien Katalog:
 +
 +
<pre>
 +
Array
 +
(
 +
    [0] => Array
 +
        (
 +
            [id] => 33
 +
            [catalog_name] => Immobilien
 +
            [parentJumpTo] => 27
 +
            [tablename] => immo_immobilien_alle
 +
            [showLink] => 1
 +
            [class] =>  first last even
 +
            [data] => Array
 +
                (
 +
                    [immo_titel] => Array
 +
                        (
 +
                            [label] => Titel
 +
                            [type] => text
 +
                            [raw] => villa in tunesien
 +
                            [value] => villa in tunesien
 +
                        )
 +
 +
                    [immo_gebiet] => Array
 +
                        (
 +
                            [label] => Gebiet
 +
                            [type] => select
 +
                            [raw] => 141
 +
                            [value] => Beja
 +
                            [ref] => Array
 +
                                (
 +
                                    [0] => Array
 +
                                        (
 +
                                            [id] => 141
 +
                                            [pid] => 130
 +
                                            [tstamp] => 1273353133
 +
                                            [sorting] => 112
 +
                                            [type] =>
 +
                                            [alias] => beja
 +
                                            [name] => Beja
 +
                                        )
 +
 +
                                )
 +
 +
                        )
 +
 +
...
 +
                          [immo_bild] => Array
 +
                                (
 +
                                    [label] => Bild - nur für das erste Bild &#40;Ein Bild für die Vorschau / maximale Dateigröße: 2MB / maximale Maße in px: 800x600&#41;
 +
                                    [type] => file
 +
                                    [raw] => tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/bild_01.jpg
 +
                                    [value] => <a href="immobilien-leser/items/miethaus-1.html" title="Die Details des Eintrags ansehen"><span class="image first even"><a rel="lightbox[lbimmo_immobilien_allecatalogrelated0]" href="tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/bild_01.jpg" title="Bild 01"><img src="system/html/bild_01-0ec9b6d1.jpg" alt="Bild 01" width="200" height="100" /></a></span></a>
 +
                                    [files] => Array
 +
                                        (
 +
                                            [0] => tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/bild_01.jpg
 +
                                        )
 +
 +
                                    [meta] => Array
 +
                                        (
 +
                                            [0] => Array
 +
                                                (
 +
                                                    [src] => system/html/bild_01-0ec9b6d1.jpg
 +
                                                    [alt] => Bild 01
 +
                                                    [lb] => lbcatalogrelated0
 +
                                                    [w] => 200
 +
                                                    [h] => 100
 +
                                                    [wh] => width="200" height="100"
 +
                                                    [caption] =>
 +
                                                    [metafile] =>
 +
                                                )
 +
 +
                                        )
 +
 +
                                )
 +
 +
                    [immo_bildergalerie] => Array
 +
                        (
 +
                            [label] => Bildergalerie - alle anderen Bilder &#40;für die Detail Ansicht / maximale Dateigröße: 2MB / maximale Maße in px: 800x600&#41;
 +
                            [type] => file
 +
                            [raw] => a:4:{i:0;s:103:"tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/how 2 rubbeldiekatz.jpg";i:1;s:89:"tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/image.png";i:2;s:99:"tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/institut-aussen.jpg";i:3;s:96:"tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/james-wilson.jpg";}
 +
                            [value] => <span class="image first even"><a rel="lightbox[lbimmo_immobilien_allecatalogreader0]" href="tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/how 2 rubbeldiekatz.jpg" title="How 2 rubbeldiekatz"><img src="system/html/how 2 rubbeldiekatz-0d26e104.jpg" alt="How 2 rubbeldiekatz" width="50" height="50" /></a></span><span class="image odd"><a rel="lightbox[lbimmo_immobilien_allecatalogreader0]" href="tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/image.png" title="Image"><img src="system/html/image-6a4159ed.png" alt="Image" width="50" height="50" /></a></span><span class="image even"><a rel="lightbox[lbimmo_immobilien_allecatalogreader0]" href="tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/institut-aussen.jpg" title="Institut-aussen"><img src="system/html/institut-aussen-538b1b35.jpg" alt="Institut-aussen" width="50" height="50" /></a></span><span class="image odd"><a rel="lightbox[lbimmo_immobilien_allecatalogreader0]" href="tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/james-wilson.jpg" title="James-wilson"><img src="system/html/james-wilson-379f0b97.jpg" alt="James-wilson" width="50" height="50" /></a></span>
 +
                            [files] => Array
 +
                                (
 +
                                    [0] => tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/how 2 rubbeldiekatz.jpg
 +
                                    [1] => tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/image.png
 +
                                    [2] => tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/institut-aussen.jpg
 +
                                    [3] => tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/james-wilson.jpg
 +
                                )
 +
 +
                            [meta] => Array
 +
                                (
 +
                                    [0] => Array
 +
                                        (
 +
                                            [src] => system/html/how 2 rubbeldiekatz-0d26e104.jpg
 +
                                            [alt] => How 2 rubbeldiekatz
 +
                                            [lb] => lbcatalogreader0
 +
                                            [w] => 50
 +
                                            [h] => 50
 +
                                            [wh] => width="50" height="50"
 +
                                            [caption] =>
 +
                                            [metafile] =>
 +
                                        )
 +
 +
                                    [1] => Array
 +
                                        (
 +
                                            [src] => system/html/image-6a4159ed.png
 +
                                            [alt] => Image
 +
                                            [lb] => lbcatalogreader0
 +
                                            [w] => 50
 +
                                            [h] => 50
 +
                                            [wh] => width="50" height="50"
 +
                                            [caption] =>
 +
                                            [metafile] =>
 +
                                        )
 +
 +
                                    [2] => Array
 +
                                        (
 +
                                            [src] => system/html/institut-aussen-538b1b35.jpg
 +
                                            [alt] => Institut-aussen
 +
                                            [lb] => lbcatalogreader0
 +
                                            [w] => 50
 +
                                            [h] => 50
 +
                                            [wh] => width="50" height="50"
 +
                                            [caption] =>
 +
                                            [metafile] =>
 +
                                        )
 +
 +
                                    [3] => Array
 +
                                        (
 +
                                            [src] => system/html/james-wilson-379f0b97.jpg
 +
                                            [alt] => James-wilson
 +
                                            [lb] => lbcatalogreader0
 +
                                            [w] => 50
 +
                                            [h] => 50
 +
                                            [wh] => width="50" height="50"
 +
                                            [caption] =>
 +
                                            [metafile] =>
 +
                                        )
 +
 +
                                )
 +
 +
                        )
 +
 +
...
 +
                    [immo_sterne] => Array
 +
                        (
 +
                            [label] => Sterne &#40;Wie viele Sterne hat das Hotel&#41;
 +
                            [type] => number
 +
                            [raw] =>
 +
                            [value] =>
 +
                        )
 +
...
 +
 +
</pre>
 +
 +
Das ist nur ein kleiner Auszug aus der Ausgabe.
 +
In dieser Ausgabe stehten verschiedene Dinge.
 +
 +
Am Anfang stehen immer die Grundinformationen (id, catalog_name, parentJumpTo, tablename,showLink, class).
 +
Die werden in der Regel nicht gebraucht. Sind aber gut zu wissen, damit man mal kurz schauen kann ob man überhaupt richtig ist ;)
 +
 +
Alle Variablen die man bekommt stehen immer in dem Array '''data'''
 +
Um an die einzelnen Werte zu kommen, braucht man nur die Arrays von dem Wert durchzugehen bis nach oben.
 +
 +
Beispiel:
 +
Den Titel der Immobilie als Überschrift ausgeben:
 +
 +
<pre> <h3><?php echo $entry['data']['immo_titel']['value']; ?></h3> </pre>
 +
 +
Das value 'villa in tunesien' soll ausgegeben werden, welches sich in dem Array 'immo_titel' befindet und das ist in dem Array 'data'.
 +
So einfach bekommt man einzelne Werte ausgegeben.
 +
 +
 +
 +
----
 +
 +
--[[Benutzer:MacKP|MacKP]] 21:44, 21. Mai 2010 (UTC)

Version vom 22. Mai 2010, 00:44 Uhr

MsgError.png Unvollständiger Artikel: dieser Artikel ist noch nicht sauber bearbeitet.

Bitte erweitere ihn und entferne erst anschliessend diesen Hinweis.


betrifft
TYPOlight Version ab 2.8
Extensions TYPOlight Core,

Catalog Version 2

Templates für den Catalog bearbeiten und verändern

Der Catalog bringt eine Menge Templates mit. Für fast jedes Modul gibt es einen eigenen Satz Templates. Zusätzlich werden Standard Templates herangezogen um zum Beispiel die Galerie oder die Filter zu generieren.

Da der Catalog aber nur ein Grundgerüst darstellt wird man nicht umhin kommen sich die Templates nach eigenen Wünschen und Vorstellungen anzupassen. Zunächst geht es hier ganz allgemein um das Vorgehen bei der Template Anpassung. Wie man an bestimmte Werte kommt und so an die Ausgaben die man möchte. Zusätzlich werden hier noch ein paar Fallbeispiele vorgestellt, welche zum Teil aus den Wünschen im Forum entnommen sind.

Voraussetzungen für das Tutorial

  • wie ein Katalog erstellt wird sollte von anderen Tutorials klar sein. Es sollte also ein Katalog vorhanden sein mit Inhalten.
  • der Umgang mit TYPOlight sollte bekannt sein
  • wie man Templates bearbeitet sollte in Grundzügen bekannt sein.

Grundlagen

Alles ein Array das entries Array

Um sich die Ausgabe von dem Array anzuschauen braucht man nur diese Zeile in das Template bringen:

<?php print_r($this->entries); ?>

Wenn man sich das Ergebniss nun auf er neu geladenen Seite anschaut ist das nicht gerade schön anzusehen. Alles steht hintereinander und ergibt einen Code Brei. Deswegen sollte man sich das am besten immer direkt in der Quellcode ansicht anschauen. Da bekommt man alles schön eingerückt und verschachtelt zu sehen! Oder man setzt die Ausgabe in dein <pre>-Tag.

Auszug aus von einem Immoblilien Katalog:

Array
(
    [0] => Array
        (
            [id] => 33
            [catalog_name] => Immobilien
            [parentJumpTo] => 27
            [tablename] => immo_immobilien_alle
            [showLink] => 1
            [class] =>  first last even
            [data] => Array
                (
                    [immo_titel] => Array
                        (
                            [label] => Titel
                            [type] => text
                            [raw] => villa in tunesien
                            [value] => villa in tunesien
                        )

                    [immo_gebiet] => Array
                        (
                            [label] => Gebiet
                            [type] => select
                            [raw] => 141
                            [value] => Beja
                            [ref] => Array
                                (
                                    [0] => Array
                                        (
                                            [id] => 141
                                            [pid] => 130
                                            [tstamp] => 1273353133
                                            [sorting] => 112
                                            [type] => 
                                            [alias] => beja
                                            [name] => Beja
                                        )

                                )

                        )

...
                           [immo_bild] => Array
                                (
                                    [label] => Bild - nur für das erste Bild (Ein Bild für die Vorschau / maximale Dateigröße: 2MB / maximale Maße in px: 800x600)
                                    [type] => file
                                    [raw] => tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/bild_01.jpg
                                    [value] => <a href="immobilien-leser/items/miethaus-1.html" title="Die Details des Eintrags ansehen"><span class="image first even"><a rel="lightbox[lbimmo_immobilien_allecatalogrelated0]" href="tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/bild_01.jpg" title="Bild 01"><img src="system/html/bild_01-0ec9b6d1.jpg" alt="Bild 01" width="200" height="100" /></a></span></a>
                                    [files] => Array
                                        (
                                            [0] => tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/bild_01.jpg
                                        )

                                    [meta] => Array
                                        (
                                            [0] => Array
                                                (
                                                    [src] => system/html/bild_01-0ec9b6d1.jpg
                                                    [alt] => Bild 01
                                                    [lb] => lbcatalogrelated0
                                                    [w] => 200
                                                    [h] => 100
                                                    [wh] => width="200" height="100"
                                                    [caption] => 
                                                    [metafile] => 
                                                )

                                        )

                                )

                    [immo_bildergalerie] => Array
                        (
                            [label] => Bildergalerie - alle anderen Bilder (für die Detail Ansicht / maximale Dateigröße: 2MB / maximale Maße in px: 800x600)
                            [type] => file
                            [raw] => a:4:{i:0;s:103:"tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/how 2 rubbeldiekatz.jpg";i:1;s:89:"tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/image.png";i:2;s:99:"tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/institut-aussen.jpg";i:3;s:96:"tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/james-wilson.jpg";}
                            [value] => <span class="image first even"><a rel="lightbox[lbimmo_immobilien_allecatalogreader0]" href="tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/how 2 rubbeldiekatz.jpg" title="How 2 rubbeldiekatz"><img src="system/html/how 2 rubbeldiekatz-0d26e104.jpg" alt="How 2 rubbeldiekatz" width="50" height="50" /></a></span><span class="image odd"><a rel="lightbox[lbimmo_immobilien_allecatalogreader0]" href="tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/image.png" title="Image"><img src="system/html/image-6a4159ed.png" alt="Image" width="50" height="50" /></a></span><span class="image even"><a rel="lightbox[lbimmo_immobilien_allecatalogreader0]" href="tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/institut-aussen.jpg" title="Institut-aussen"><img src="system/html/institut-aussen-538b1b35.jpg" alt="Institut-aussen" width="50" height="50" /></a></span><span class="image odd"><a rel="lightbox[lbimmo_immobilien_allecatalogreader0]" href="tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/james-wilson.jpg" title="James-wilson"><img src="system/html/james-wilson-379f0b97.jpg" alt="James-wilson" width="50" height="50" /></a></span>
                            [files] => Array
                                (
                                    [0] => tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/how 2 rubbeldiekatz.jpg
                                    [1] => tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/image.png
                                    [2] => tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/institut-aussen.jpg
                                    [3] => tl_files/usertreffen2010/immo/tunesien-immobilie_cat_items/immo_immobilien_alle/james-wilson.jpg
                                )

                            [meta] => Array
                                (
                                    [0] => Array
                                        (
                                            [src] => system/html/how 2 rubbeldiekatz-0d26e104.jpg
                                            [alt] => How 2 rubbeldiekatz
                                            [lb] => lbcatalogreader0
                                            [w] => 50
                                            [h] => 50
                                            [wh] => width="50" height="50"
                                            [caption] => 
                                            [metafile] => 
                                        )

                                    [1] => Array
                                        (
                                            [src] => system/html/image-6a4159ed.png
                                            [alt] => Image
                                            [lb] => lbcatalogreader0
                                            [w] => 50
                                            [h] => 50
                                            [wh] => width="50" height="50"
                                            [caption] => 
                                            [metafile] => 
                                        )

                                    [2] => Array
                                        (
                                            [src] => system/html/institut-aussen-538b1b35.jpg
                                            [alt] => Institut-aussen
                                            [lb] => lbcatalogreader0
                                            [w] => 50
                                            [h] => 50
                                            [wh] => width="50" height="50"
                                            [caption] => 
                                            [metafile] => 
                                        )

                                    [3] => Array
                                        (
                                            [src] => system/html/james-wilson-379f0b97.jpg
                                            [alt] => James-wilson
                                            [lb] => lbcatalogreader0
                                            [w] => 50
                                            [h] => 50
                                            [wh] => width="50" height="50"
                                            [caption] => 
                                            [metafile] => 
                                        )

                                )

                        )

...
                    [immo_sterne] => Array
                        (
                            [label] => Sterne (Wie viele Sterne hat das Hotel)
                            [type] => number
                            [raw] => 
                            [value] => 
                        )
...

Das ist nur ein kleiner Auszug aus der Ausgabe. In dieser Ausgabe stehten verschiedene Dinge.

Am Anfang stehen immer die Grundinformationen (id, catalog_name, parentJumpTo, tablename,showLink, class). Die werden in der Regel nicht gebraucht. Sind aber gut zu wissen, damit man mal kurz schauen kann ob man überhaupt richtig ist ;)

Alle Variablen die man bekommt stehen immer in dem Array data Um an die einzelnen Werte zu kommen, braucht man nur die Arrays von dem Wert durchzugehen bis nach oben.

Beispiel: Den Titel der Immobilie als Überschrift ausgeben:

 <h3><?php echo $entry['data']['immo_titel']['value']; ?></h3> 

Das value 'villa in tunesien' soll ausgegeben werden, welches sich in dem Array 'immo_titel' befindet und das ist in dem Array 'data'. So einfach bekommt man einzelne Werte ausgegeben.



--MacKP 21:44, 21. Mai 2010 (UTC)

Ansichten
Meine Werkzeuge

Contao Community Documentation

God: "what is your job?"
me: "i am a software developer ... i develop websites with Contao 3"
God: "sounds cool, what are you working on today? Web sockets? Ajax? HTML5 video streaming?"
me: "no, i am trying to send an email ...."

Leo Unglaub
Navigation
Verstehen
Verwenden
Entwickeln
Verschiedenes
Werkzeuge