Différences

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

--- wiki:application:moduledesigner_template [2018/04/13 18:19]
r.toma
+++ wiki:application:moduledesigner_template [2018/04/17 17:07] (Version actuelle)
ANALYS Informatique
@@ Ligne 28: / Ligne 28: @@
 <jumbotron>
-====== Rappels sur la Navigation ======
+===== Rappels sur la Navigation =====
 </jumbotron>
 {{page>wiki:application:moduledesigner_page_widget#rappels_sur_la_navigation&noheader&nofooter&nodate&nouser}}
 <jumbotron>
-====== Types de template ======
+===== Types de template =====
 </jumbotron>
 Il existe deux types de template différents : les templates de page et les templates de groupe.\\ \\
-Les **templates de groupes** sont uniquement composés de [[wiki:application:moduledesigner_page_widget#Eléments secondaires|groupes]]. Ces groupes peuvent être imbriqués les uns dans les autres et afficher différents éléments (titre, boutons...).
+Les **templates de groupes** sont uniquement composés de [[wiki:application:moduledesigner_page_widget#Eléments secondaires|groupes et d'éléments secondaires]] {{fa>external-link?14&color=#008cba|groupes}}. Ces groupes peuvent être imbriqués les uns dans les autres et afficher différents éléments (titre, boutons...).\\ \\
-Les **templates de pages** sont composés de [[wiki:application:moduledesigner_page_widget#Eléments secondaires|groupes]] {{fa>external-link?14&color=#008cba|groupes}} et de [[wiki:application:modulepage#zones_layoutcontrol|zones]]. Les zones permettent de définir des blocs indépendants dans les pages.
+Les **templates de pages** sont composés de [[wiki:application:moduledesigner_page_widget#Eléments secondaires|groupes]] {{fa>external-link?14&color=#008cba|groupes}} et de [[wiki:application:modulepage#zones_layoutcontrol|zones]] {{fa>external-link?14&color=#008cba|groupes}}. Les zones permettent de définir des blocs indépendants dans les pages.
 <jumbotron>
-====== Gestion des templates ======
+===== Gestion des templates =====
 </jumbotron>
+<jumbotron>
+==== Créer / Modifier un template ====
+</jumbotron>
+<WRAP group>
+<WRAP column third>
+<thumbnail>
+{{ :wiki:application:template_addedit.png?nolink }}
+<caption>
+<TEXT align="center">
+Créer / modifier un template
+</TEXT>
+</caption>
+</thumbnail>
+</WRAP>
+<WRAP>
+Pour **créer ou modifier un template**, dans la [[wiki:application:moduledesigner#fenetre_de_design|fenêtre de design]] {{fa>external-link?14&color=#008cba}}, cliquer sur le bouton **Menu des templates**. Dans le sous-menu, choisir l'action désirée.
+</WRAP>
+</WRAP>
+<jumbotron>
+==== Ajouter des contrôles ====
+</jumbotron>
+Il est possible d'**ajouter des contrôles** dans les templates :
+  * Pour les **templates de groupes**, des groupes et des éléments secondaires peuvent être ajoutés en utilisant les fonctionnalités de l'[[wiki:application:moduledesigner#arborescence|arborescence]] {{fa>external-link?14&color=#008cba|groupes}} de l'élément désigné.\\ \\
+  * Pour les **templates de page**, en plus des groupes et des éléments secondaires, des zones peuvent être ajoutées à l'aide de la liste des [[wiki:application:moduledesigner#controles_instantiables|contrôles instantiables]] {{fa>external-link?14&color=#008cba|groupes}} et des [[wiki:application:moduledesigner#controles_disponibles|contrôles disponibles]] {{fa>external-link?14&color=#008cba|groupes}} (voir [[wiki:application:moduledesigner_page_widget#ajouter_des_controles|ajouter des contrôles]] {{fa>external-link?14&color=#008cba|groupes}}).
+<jumbotron>
+==== Supprimer des contrôles ====
+</jumbotron>
+Il est possible de **supprimer les contrôles** présents dans les templates. La suppression des groupes est immédiate et définitive. Dans le cas des zones, la suppression se fait en deux temps :
+  * Pour retirer une zone du template, cliquer sur le bouton <tooltip html="true" title="{{:wiki:application:design_remove_control.png?nolink}}">**retirer un élément**</tooltip>. Le contrôle se retrouve alors dans la liste des [[wiki:application:moduledesigner#controles_disponibles|contrôles disponibles]] {{fa>external-link?14&color=#008cba}} et peut être replacé à tout moment dans le template.\\ \\
+  * Lorsque le contrôle se trouve dans la liste des [[wiki:application:moduledesigner#controles_disponibles|contrôles disponibles]] {{fa>external-link?14&color=#008cba}}, il est possible de le supprimer définitivement en cliquant sur le bouton <tooltip html="true" title="{{:wiki:application:design_delete_control.png?nolink}}">**supprimer le contrôle**</tooltip>. Une <tooltip html="true" title="{{:wiki:application:design_delete_confirmation.png?nolink}}">**fenêtre de confirmation**</tooltip> apparaît demandant la confirmation de la suppression.
+<callout type="warning" title="Suppression définitive" icon="true">
+Lorsque le contrôle est supprimé de la liste des contrôles disponibles, il est supprimé pour tous les **thèmes / langues** de l'élément designé et il ne peut plus être récupéré.
+</callout>
+<jumbotron>
+==== Modifier les propriétés ====
+</jumbotron>
+Les **propriétés** du contrôle sélectionné sont visibles dans la zone [[wiki:application:moduledesigner#proprietes|propriétés]] {{fa>external-link?14&color=#008cba}}, suivant l'élément sélectionné, les propriétés modifiables seront différentes.\\ \\
+La modification des propriétés d'un élément permet de changer le **comportement** et le **rendu** de l'élément dans le template. Pour les template, les propriétés sont enregistrées uniquement selon les paramètres de thème et de langue. Les paramètres de [[wiki:application:designparams#notion_de_groupe|groupe]] {{fa>external-link?14&color=#008cba}} et d'[[wiki:application:designparams#notion_d_utilisateur|utilisateur]] {{fa>external-link?14&color=#008cba}} ne sont pas pris en compte.
+<callout type="info" title="Reset" icon="true">
+Le bouton <tooltip html="true" title="{{:wiki:application:design_reset.png?nolink}}">**Reset**</tooltip> permet de remettre les propriétés par défaut à l'élément sélectionné.
+</callout>
+<jumbotron>
+==== Réorganiser les éléments ====
+</jumbotron>
+<WRAP group>
+<WRAP column third>
+<thumbnail>
+{{ :wiki:application:design_alignments.png?nolink }}
+<caption>
+<TEXT align="center">
+Modifier les alignements
+</TEXT>
+</caption>
+</thumbnail>
+</WRAP>
+<WRAP>
+Il est possible de modifier le **positionnement** des contrôles dans le template. Pour déplacer un contrôle, réaliser un **glisser-déposer** depuis l'[[wiki:application:moduledesigner#arborescence|arborescence]] {{fa>external-link?14&color=#008cba}} ou la zone de [[wiki:application:moduledesigner#visualisation_du_design|visualisation du design]] {{fa>external-link?14&color=#008cba}} jusqu'à l'endroit désiré.\\ \\
+Les contrôles peuvent également être **réalignés** à l'intérieur de l'élément designé. Pour réaliser cette action, faire un clic droit sur le contrôle dans l'[[wiki:application:moduledesigner#arborescence|arborescence]] {{fa>external-link?14&color=#008cba}} ou la zone de [[wiki:application:moduledesigner#visualisation_du_design|visualisation du design]] {{fa>external-link?14&color=#008cba}}. Dans le sous-menu, positionner la souris sur **Alignement Horizontal** ou **Alignement Vertical** puis choisir l'alignement désiré.
+</WRAP>
+</WRAP>
+<callout type="info" title="Menu élément" icon="true">
+Lors du clic droit sur un élément dans l'[[wiki:application:moduledesigner#arborescence|arborescence]] {{fa>external-link?14&color=#008cba}} ou la zone de [[wiki:application:moduledesigner#visualisation_du_design|visualisation du design]] {{fa>external-link?14&color=#008cba}}, les actions contenues dans le sous-menu dépendent du type de l'élément sélectionné.
+</callout>
+===== Références =====
+  * [[wiki:application:menus|Menus]]
+  * [[wiki:application:modulepage|Module Manager - Page Manager - Page]]
+  * [[wiki:application:moduledesigner|Mode Design]]
+  * [[wiki:application:designparams|Paramètres de personnalisation]]
+  * [[wiki:application:architecture|Architecture de l'application]]
+===== A voir =====
+  * [[wiki:application:menudesigner|Personnalisation des menus]]
+  * [[wiki:application:widgetsquickcustomize|Widgets - Quick Customize]]
+  * [[wiki:application:styleeditor|Editeur de styles]]