Différences

Ci-dessous, les différences entre deux révisions de la page.

--- info:concrete5:docfred:image_page [2014/11/01 07:43] – créée radeff
+++ info:concrete5:docfred:image_page [2018/07/18 09:46] (Version actuelle) – ↷ Liens modifiés en raison d'un déplacement. radeff
@@ Ligne 1: / Ligne 1: @@
 ====== Concrete5: réaliser une liste de page avec vignettes (thumbnails) ======
-{{:info:concrete5:docfred:c5image_page064355.png?200|}}
+La doc initiale: [[info:concrete5:thumbnail_page_list|Concrete5: liste de page avec vignettes]]
+Et voici une version toute en images
+====== Première partie ======
+Création d'un modèle personnalisé pour afficher l'attribut (le plus compliqué)
+//Ne pas s'embêter à ré-écrire tout, il est possible de copier-coller depuis la doc initiale en version texte avec le code à copier-coller: [[info:concrete5:thumbnail_page_list|Concrete5: liste de page avec vignettes]]//
+===== Créer le fichier =====
+créer le modèle personnalisé en copiant le fichier /concrete/blocks/page_list/view.php sur /blocks/page_list/templates/thumbnail_images.php.
+{{info:concrete5:docfred:c5image_page070201.png|}}
+===== éditer le fichier =====
+Ici, édition à distance sur le serveur avec gigolo & geany
+{{info:concrete5:docfred:c5image_page070252.png|}}
+===== modif1 =====
+{{info:concrete5:docfred:c5image_page070324.png|}}
+===== modif2 =====
+{{info:concrete5:docfred:c5image_page070339.png|}}
+===== doc c5 =====
+Comme d'habitude, la doc est bien faite!
+{{info:concrete5:docfred:c5image_page070359.png|}}
+===== modification finale =====
+{{info:concrete5:docfred:c5image_page070416.png|}}
+====== 2e partie ======
+===== On créée un nouvel attribut =====
+Chercher "attr" dans le moteur de recherche
+{{info:concrete5:docfred:c5image_page064355.png|}}
+===== Ajout attribut =====
+{{info:concrete5:docfred:c5image_page064757.png|}}
+===== Choix attribut =====
+choisissez “Image file”, puis cliquez sur le bouton “Ajouter”.
+{{info:concrete5:docfred:c5image_page064817.png|}}
+===== Ajouter =====
+{{info:concrete5:docfred:c5image_page064853.png|}}
+===== Le nouvel attribut est disponible =====
+{{info:concrete5:docfred:c5image_page064910.png|}}
+===== Modifier le type de page =====
+Chercher "type" dans le moteur de recherche
+{{info:concrete5:docfred:c5image_page064936.png|}}
+===== Choisir le type de page =====
+{{info:concrete5:docfred:c5image_page065028.png|}}
+===== Ici Right Sidebar, puis "Properties" =====
+{{info:concrete5:docfred:c5image_page065114.png|}}
+===== Cliquer sur le nouvel attribut "Image page" =====
+{{info:concrete5:docfred:c5image_page065124.png|}}
+Et sauver
+===== Affecter l'attribut aux pages souhaitées =====
+On revient dans notre liste de page, toujours désespérément vide
+{{info:concrete5:docfred:c5image_page065159.png|}}
+===== éditer les propriétés de la page (edit properties) =====
+{{info:concrete5:docfred:c5image_page065217.png|}}
+===== custom attributes =====
+{{info:concrete5:docfred:c5image_page065233.png|}}
+===== Scroller et choisir "image page" =====
+{{info:concrete5:docfred:c5image_page065247.png|}}
+===== Scroller vers le haut =====
+Un des rares défaut d'ergonomie de c5... il faut remonter pour voir l'attribut
+{{info:concrete5:docfred:c5image_page065319.png|}}
+===== Cliquer sur "choose file" =====
+{{info:concrete5:docfred:c5image_page065330.png|}}
+===== cliquer sur la vignette =====
+{{info:concrete5:docfred:c5image_page065501.png|}}
+===== choose =====
+{{info:concrete5:docfred:c5image_page065514.png|}}
+===== save =====
+{{info:concrete5:docfred:c5image_page065525.png|}}
+====== 3e étape: changer la "page list" ======
+===== Revenir sur la page list =====
+Choisir "Custom template"
+{{info:concrete5:docfred:c5image_page070539.png|}}
+===== Choisir "Thumbnail images" =====
+{{info:concrete5:docfred:c5image_page070554.png|}}
+===== Résultat =====
+On procède pour toutes les pages... et voici le résultat!
+{{info:concrete5:docfred:c5image_page073105.png|}}
+La doc initiale en version texte avec le code à copier-coller: [[info:concrete5:thumbnail_page_list|Concrete5: liste de page avec vignettes]]