wiki:application:moduledesigner_template

Différences

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

Lien vers cette vue comparative

Les deux révisions précédentes Révision précédente
Prochaine révision
Révision précédente
wiki:application:moduledesigner_template [2018/04/13 15:58] r.tomawiki:application:moduledesigner_template [2018/04/17 15:07] (Version actuelle) ANALYS Informatique
Ligne 28: Ligne 28:
  
 <jumbotron> <jumbotron>
-====== Rappels sur la Navigation ======+===== Rappels sur la Navigation =====
 </jumbotron> </jumbotron>
 {{page>wiki:application:moduledesigner_page_widget#rappels_sur_la_navigation&noheader&nofooter&nodate&nouser}} {{page>wiki:application:moduledesigner_page_widget#rappels_sur_la_navigation&noheader&nofooter&nodate&nouser}}
  
 <jumbotron> <jumbotron>
-====== Types de template ======+===== Types de template =====
 </jumbotron> </jumbotron>
 Il existe deux types de template différents : les templates de page et les templates de groupe.\\ \\ 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|{{glyphicon>link?12|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> <jumbotron>
-====== Gestion des templates ======+===== Gestion des templates =====
 </jumbotron> </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]]