Génération WYSIWYG de types de documents avec CPSTypeMaker [How-To]

CPSTypeMaker

Génération visuelle de types de documents dans Zope

Auteur : Tarek Ziadé <tz@nuxeo.com>

1. Introduction

L'un des aspects les plus important d'un gestionnaire de contenu web est la définition de ses types de documents. Le système de définition se doit d'être suffisament souple et générique pour permettre aux intégrateurs de modifier ou d'ajouter des types de documents en utilisant les « briques de base » du web que sont les widgets (zone de texte, libellé, image, etc.) sans avoir à coder quoi que ce soit. C'est l'objectif d'outil comme Archetypes ou CPSSchemas, qui fournissent un nouveau langage de définition de plus haut niveau que Python ou le TAL.

Pourtant, dans la course à l'ergonomie et à la simplification de l'usage des cms sous Zope, il faut encore maitriser ces langages de définition, et c'est une barrière de plus pour l'utilisateur.

La programmation visuelle répond à cette problèmatique en fournissant à l'utilisateur des outils WYSIWYG (What You See Is What You Get), en charge de générer les définitions.

A l'instar des éditeurs HTML WYSIWYG, CPSTypeMaker se charge de générer des définitions compatibles avec CPSSchemas par le biais d'un éditeur de types de documents « à la souris ».

Pour utiliser cet outil vous devez télécharger CPS 3.2.3 ici :

http://zope.org/Members/nuxeo/Products/CPS3/CPS-3.2.3/CPS-3.2.3.tar.gz

ou mettre à jour votre CPS existant.

Figure 1 : portail CPS

Une fois un site CPS créé dans votre instance de Zope, passez en zmi et ajoutez à la racine un objet de type External Method avec ces informations :

ID : type_maker_installer

Title : CPSTypeMaker

Module Name : CPSTypeMaker.install

Function Name : install

et exécutez là en vous rendant dans cet objet en en cliquant sur l'onglet "test".

CPS TypeMaker est à présent installé

3. Utilisation de l'outil

De retour sur votre site CPS, vous découvrirez dans les actions du portail, à gauche, une nouvelle action "Gérer les types de documents".

Figure 2: « Gérer les typesde documents » dans les actions du portail

Cliquez sur ce lien pour entrer dans l'éditeur de types.

Création du type

Ce premier écran, vide, regroupera l'ensemble des types de documents créés dans l'éditeur.

Les actions disponibles dans cet écran sont :

• Configuration générale de TypeMaker

• Ajouter un nouveau type

• Nom

• Prénom

• Téléphone

• Photo

• Email

• Url

• Société

• Notes

Cliquez sur "Ajouter nouveau type" et ajoutez un nouveau type de document avec ces valeurs :

• Titre : contact

• Description : fiche descriptive d'une personne

La création du document vous place dans l'éditeur de type.

Création des champs

Ajoutez tous les champs nécessaires dans le type de document en entrant ces valeurs :

Figure 3 : Edition des champs du type

Remarquez le drapeau rouge, il correspond à un champ qui nécessite une configuration plus poussée qu'un simple ajout.

Pour configurer ce champ, clickez sur la « clé de mécanicien » sur la ligne Responsable, à coté de la croix rouge. Descendez dans le formulaire du champ, pour aller saisir dans les champs « annuaire » et « vocabulaire » qui doit contenir "members".

Une fois ces manipulations effectuées, retournez à l'édition du type par le biais de l'action "Editer le type".

Les champs de votre type de document sont prêts, nous n'avons plus qu'à mettre en place la disposition.

Disposition

Allez dans "éditer la disposition", en vous assurant que le javascript est activé dans votre navigateur. Vous êtes dans l'éditeur de disposition, tous les champs sont disponibles à droite de l'écran. Ajoutez 8 lignes par le biais du bouton, pour créer 8 cellules vides.

Une fois ces cellules créés, glissez-déposez les champs de droite dans l'ordre que vous désirez, pour construire la disposition. Vous pouvez à tout moment inverser deux cellules, en glissant-déposant la première sur la deuxième.

Figure 4 : Editeur de disposition, sans champs disposés

Figure 5 : Editeur de disposition, document prêt

Retournez à présent dans la liste des types de documents, votre document est disponible maintenant sur le portail pour tous les utilisateurs (coche verte).

Liens pratiques :

• Zope.org : http://zope.org

• Guide utilisateur CPS3 : http://www.cps-project.org/Public/documentation/guide_utilisateur_st/

• Archetypes : http://plone.org/documentation/archetypes/

• Communauté CPS et Mailings lists CPS : http://cps-project.org