| Les deux révisions précédentes Révision précédente Prochaine révision | Révision précédente |
| info:concrete5:thumbnail_page_list [2014/07/10 08:27] – radeff | info:concrete5:thumbnail_page_list [2018/07/18 09:46] (Version actuelle) – ↷ Liens modifiés en raison d'un déplacement. radeff |
|---|
| ====== Concrete5: liste de page avec vignettes ====== | ====== Concrete5: liste de page avec vignettes ====== |
| //kw: c5 page_list thumbnail// | {{tag>c5}} |
| | //kw: page_list thumbnail// |
| |
| | Source: http://concrete5tricks.com/blog/page-attributes-thumbnail-images/ //Traduction Fred Radeff// |
| ===== Attributs de page: images miniatures ===== | ===== Attributs de page: images miniatures ===== |
| <note> | <note> |
| Au bas de cette page, cliquez sur la liste déroulante "Ajouter un attribut" et choisissez "Image file", puis cliquez sur le bouton "Ajouter". | Au bas de cette page, cliquez sur la liste déroulante "Ajouter un attribut" et choisissez "Image file", puis cliquez sur le bouton "Ajouter". |
| |
| {{:info:concrete5:thumbnail_page_list:create_image_attribute.png|}} | {{info:concrete5:thumbnail_page_list:create_image_attribute.png|}} |
| |
| "Identifiant unique" (Handle) est un code pour lequel vous devez respecter une certaine syntaxe: minuscules (a-z, sans caractères accentués) et _ (underscore) | "Identifiant unique" (Handle) est un code pour lequel vous devez respecter une certaine syntaxe: minuscules (a-z, sans caractères accentués) et _ (underscore) |
| Par exemple, sur un blog, nous avons le "Blog" type de page, et nous voulons qu'on nous propose toujours d'ajouter un attribut "Blog post image" lors de l'ajout de nouvelles pages | Par exemple, sur un blog, nous avons le "Blog" type de page, et nous voulons qu'on nous propose toujours d'ajouter un attribut "Blog post image" lors de l'ajout de nouvelles pages |
| |
| {{:info:concrete5:thumbnail_page_list:image_attribute_on_add_new_page.png|}} | {{info:concrete5:thumbnail_page_list:image_attribute_on_add_new_page.png|}} |
| |
| Pour le mettre en place, accédez au Tableau de bord> Pages & Thèmes> Types de page, cliquez sur le bouton "Paramètres" à côté du type de page que vous souhaitez, cochez la case à côté de l'attribut, et cliquez sur "Enregistrer". | Pour le mettre en place, accédez au Tableau de bord> Pages & Thèmes> Types de page, cliquez sur le bouton "Paramètres" à côté du type de page que vous souhaitez, cochez la case à côté de l'attribut, et cliquez sur "Enregistrer". |
| |
| {{:info:concrete5:thumbnail_page_list:image_attribute_on_page_type_settings.png|}} | {{info:concrete5:thumbnail_page_list:image_attribute_on_page_type_settings.png|}} |
| |
| |
| Ouvrez le nouveau fichier /blocks/page_list/templates/thumbnail_images.php dans votre éditeur de texte favori. Il ya des commentaires dans le code qui expliquent comment utiliser les attributs, et autour de la ligne n° 30, il ya une section spécifique sur les attributs de l'image. | Ouvrez le nouveau fichier /blocks/page_list/templates/thumbnail_images.php dans votre éditeur de texte favori. Il ya des commentaires dans le code qui expliquent comment utiliser les attributs, et autour de la ligne n° 30, il ya une section spécifique sur les attributs de l'image. |
| |
| 1) Activer l'image aide en décommentant (enlever les deux barres principales "//" ) les lignes suivantes: | 1) Activer l'image aide en décommentant (enlever les deux slash ) les lignes suivantes: |
| | |
| <code> | <code> |
| 2) Extraire l'attribut d'image et créer une miniature de limage en ajoutant le code suivant (le placer sous le existant (ligne ≃ 20): | 2) Extraire l'attribut d'image et créer une miniature de limage en ajoutant le code suivant (le placer sous le existant (ligne ≃ 20): |
| |
| <code> | |
| $description = $th->entities($description) | $description = $th->entities($description) |
| </code> | |
| |
| |
| |
| <code> | <code> |
| </code> | </code> |
| |
| Vous voulez probablement ajouter ce code immédiatement avant ou après l'élément <div class="ccm-page-list-description"> (autour de la ligne n ° 54), mais l'emplacement exact dépendra de la conception et de la CSS de votre thème. Notez que ce code diffèrera également de l'exemple. | Vous voulez probablement ajouter ce code immédiatement avant ou après l'élément <div class="ccm-page-list-description"> (autour de la ligne n ° 54), mais l'emplacement exact dépendra de la conception et de la CSS de votre thème. Notez que ce code différera également de l'exemple. |
| |
| Lorsque vous avez terminé ces trois étapes, vous devriez vous retrouver avec ce type de code (extrait): | Lorsque vous avez terminé ces trois étapes, vous devriez vous retrouver avec ce type de code (extrait): |
| Ensuite, pendant que vous êtes encore en mode d'édition, cliquez sur le bloc de la liste de pageS et choisissez "modèle personnalisé" dans le menu contextuel: | Ensuite, pendant que vous êtes encore en mode d'édition, cliquez sur le bloc de la liste de pageS et choisissez "modèle personnalisé" dans le menu contextuel: |
| |
| {{:info:concrete5:thumbnail_page_list:image_attribute_choose_custom_template.png|}} | {{info:concrete5:thumbnail_page_list:image_attribute_choose_custom_template.png|}} |
| |
| Ensuite, choisissez votre modèle personnalisé ("Vignette Images» dans notre exemple) et cliquez sur le bouton "Enregistrer". | Ensuite, choisissez votre modèle personnalisé ("Vignette Images» dans notre exemple) et cliquez sur le bouton "Enregistrer". |
| |
| Source: http://concrete5tricks.com/blog/page-attributes-thumbnail-images/ //Traduction Fred Radeff// | Here it is! |
| |
| | Source: http://concrete5tricks.com/blog/page-attributes-thumbnail-images/ //Traduction Fred Radeff// |
| |
| | En images: [[info:concrete5:docfred:image_page|Concrete5: réaliser une liste de page avec vignettes (thumbnails)]] |