Guide d'utilisation de zEditor

Pour fonctionner, zEditor a besoin d'un moteur d'exécution. Ce moteur est XULRunner, développé par Mozilla et permettant d'exécuter du code XUL (zEditor étant écrit en XUL). Il se trouve que XULRunner est inclus dans Firefox 3. Cela veut donc dire que si vous possédez Firefox 3 vous n'avez pas besoin de télécharger XULRunner.

Si vous ne possédez pas Firefox 3, vous devez télécharger zEditor en version complète qui contient XULRunner.
Si Firefox 3 est présent sur votre ordinateur, téléchargez simplement zEditor pour Firefox 3. Des instructions pour l'exécution au moyen de Firefox sont données plus bas.

zEditor + XULRunner (si vous n'avez pas Firefox 3)

• Télécharger zEditor 0.5 pour Windows — dl.free.fr ;
• Télécharger zEditor 0.5 pour Linux — dl.free.fr.

zEditor seul (si vous avez Firefox 3)

• Télécharger zEditor 0.5 pour Windows — dl.free.fr ;
• Télécharger zEditor 0.5 pour Linux — dl.free.fr ;
• Télécharger zEditor 0.5 pour Mac OS — dl.free.fr.

Sous Windows

Un exécutable est présent et permet d'installer zEditor comme n'importe quel autre logiciel Windows. Une association de fichiers est créée automatiquement dans le cas de la version complète : les fichiers .tuto, .zc et .zcode sont automatiquement associés à zEditor ce qui permet de les ouvrir avec le logiciel en double-cliquant dessus.

Sous Linux

zEditor est contenu dans une archive .tar.gz. Il suffit de la décompresser et de lancer l'application zeditor pour démarrer zEditor.

Sous Mac OS

zEditor, pour des raisons techniques, n'est pas directement exécutable sous Mac. La seule façon de l'utiliser sous Mac est de le lancer via Firefox 3, comme expliqué ci-dessous.

Lancer zEditor avec Firefox 3

Sous Windows

Pour exécuter zEditor en utilisant Firefox 3 sous Windows, il suffit d'utiliser cette commande :

Code : Console

L'argument app contient le chemin vers le fichier application.ini à la racine de zEditor. Un fichier nommé zeditor.bat permet de lancer directement, pour peu que Firefox et zEditor soient installés dans leur répertoire par défaut. Pour modifier le fichier zeditor.bat, ouvrez-le avec un éditeur de texte (bloc-notes fait l'affaire).

Sous Linux

Sous Linux, il se peut qu'il ne soit pas possible d'utiliser la commande firefox (de la même manière qu'avec Windows). Si tel est le cas, il est possible d'utiliser la commande xulrunner, car sous Linux, XULRunner est installé indépendamment lors de l'installation de Firefox 3.

Code : Console

Sous Mac OS

Pour exécuter zEditor en utilisant Firefox 3 sous Mac OS, il suffit d'utiliser cette commande :
Code : Console

Si ce n'est déjà fait, ouvrez ou créez un nouveau tutoriel (Fichier > Nouveau > Mini-tuto, ou Ctrl + Shift + N). Voici ce que vous devriez avoir :



zEditor se compose de deux parties bien distinctes :

• L'architecture à gauche : l'architecture a pour fonction de représenter de façon logique la structure du tutoriel. Vous pouvez ainsi très facilement vous repérer dans les parties, chapitres, sous-parties, etc. Son utilisation sera détaillée tout de suite après.
• L'interface de rédaction à droite : l'interface de rédaction comprend tout ce qui est nécessaire à la rédaction : une ou plusieurs zones de texte, des systèmes de visualisation et la possibilité d'éditer les options de l'élément sélectionné dans l'arborescence comme son titre, sa licence, sa difficulté, ...

L'architecture

En fonction de l'élément sélectionné dans l'arborescence, plusieurs boutons vous permettant de réaliser certaines actions s'affichent :

• Ces boutons servent à faire déplacer verticalement les éléments ;
• Le Plus ouvre un menu qui permet, en fonction de l'élément sélectionné, d'ajouter des sous-éléments ;
• Pas de surprise, ce dernier bouton sert à supprimer l'élément sélectionné (et tout ce qu'il contient si ce dernier contient des sous-éléments).

L'affichage sous forme d'arborescence peut être un peu déroutant au début. Pour simplifier, lorsque vous survolez un élément, une infobulle vous informe du type d'élément dont il s'agit (chapitre, partie, sous-partie, ...).

S'il est possible de faire monter et descendre des sous-parties au moyen des boutons et , il n'est pas possible de le faire directement pour les chapitres et les parties. Pour ce faire, le bouton est présent et permet d'accéder à une liste raccourcie, plus facile à gérer :

L'interface de rédaction

L'interface de rédaction a pour but premier d'afficher le contenu de l'élément sélectionné dans la structure. Ce contenu peut être visualisé afin d'avoir une idée de comment il s'affichera sur le Site du Zéro.

L'interface de rédaction se compose de plusieurs éléments.

La barre d'onglets

zEditor offre la possibilité d'ouvrir plusieurs documents en même temps. Chaque document est représenté par un onglet, ce dernier prenant place dans la barre d'onglets dont le fonctionnement est exactement le même que celui de Firefox.

Rédaction, Fractionnée, Aperçu et Visualisation

Ces quatre boutons permettent de jouer sur l'affichage de l'interface de rédaction.

• Rédaction : c'est l'affichage de base, seules les zones de texte sont affichées ;
• Fractionnée : les zones de texte sont affichées mais possèdent en plus une prévisualisation au cours de la frappe ;
• Aperçu : les zones de texte font place à une visualisation. Cette visualisation ne s'occupe que d'afficher le contenu des zones de texte, un peu comme la visualisation au cours de la frappe ;
• Visualisation : le tutoriel est affiché complètement.

Options des tutoriels

Comme sur le Site du Zéro, il est possible pour les tutoriels, parties, chapitres, ... de définir l'avancement, la difficulté ou encore la licence. Quand ces options sont disponibles pour l'élément sélectionné dans l'architecture, un bouton intitulé Options supplémentaires s'affiche à droite de la barre de titre. Ce bouton permet d'afficher et de masquer les options avancées du tutoriel :

Enregistrer un tutoriel

Comme dans la plupart des logiciels, un Ctrl + S suffit pour enregistrer le tutoriel affiché.

Il faut bien garder en tête que le Site du Zéro est avant tout un site web et donc que zEditor ne vient communiquer avec lui qu'avec les mêmes moyens que vous pouvez utiliser manuellement : l'exportation/importation XML. Les fichiers permettant l'échange sont des fichiers XML portant l'extension .tuto (sous Windows, le setup vous permet d'associer les .tuto à zEditor).

Exportation

Si vous avez déjà un tutoriel en ligne et que vous souhaitez continuer sa rédaction offline ou tout simplement en faire une sauvegarde par sécurité, vous pouvez exporter un tutoriel lors de :

• l'édition d'un big-tuto :
• l'édition d'un mini-tuto/chapitre :

Importation

De la même manière, les .tuto modifiés ou créés avec zEditor peuvent être utilisés pour importer votre tutoriel sur le site :

• à la racine de la section "Mes Tutoriels" :
• lors de l'édition d'une partie :

Quel que soit l'endroit où vous décidez d'importer le tutoriel, vous devez ensuite sélectionner (avec le bouton Parcourir) le .tuto que vous souhaitez envoyer. Pas besoin de copier-coller le texte XML dans le champ précédent, l'utilisation directe du fichier est bien plus pratique :



Si vous exportez un .tuto depuis le site et que vous le modifiez dans zEditor, importer la nouvelle version du .tuto viendra modifier la version sur le site. Cependant, si le fichier a été créé à partir de zéro sur zEditor, cela viendra rajouter un tutoriel et en aucun cas modifier un de vos tutoriels existants.



Non. Le fichier .tuto ne contient que la version texte de votre tutoriel.
Les images sont donc à envoyer manuellement après l'importation du tutoriel. Dans la section juste en dessous, vous trouverez la présentation d'un outil de zEditor qui facilite cette étape. De même quand vous exportez un tutoriel, vous ne récupérez que la version texte.

Comme cela a été dit, les images sont indépendantes du tutoriel et il faut donc les uploader à part sur le Site du Zéro.

Insertion d'images

Quand vous insérez une image avec la boîte de dialogue prévue à cet effet, zEditor analyse le dossier dans lequel est enregistré le fichier de tutoriel sur lequel vous travaillez ce qui lui permet de dresser une liste des images disponibles. C'est donc pour cette raison qu'il peut être utile de réserver un seul dossier pour l'ensemble du tutoriel.

Visualisation des images

Par défaut, lors de la visualisation d'un tutoriel, zEditor recherche les images dans le dossier du tutoriel. Vous pouvez modifier ce comportement en indiquant une URL personnalisée (comme par exemple http://www.siteduzero.com/) si les images sont déjà uploadées sur le site.

Pour ce faire, allez dans Outils > Préférences > Visualisation, et sélectionnez Chemin pour la préférence Chemin relatif pour les images. Ce chemin personnalisé peut être spécifié dans le champ de texte qui suit, à savoir Chemin / URL à utiliser.

Liste des images

Le panneau Actifs, Fenêtres > Actifs, permet de lister toutes les images insérées dans le tutoriel. Il vous suffit de double-cliquer sur une image pour l'insérer à l'emplacement du curseur.



Le petit bouton représentant un fichier permet d'afficher la liste sous forme de texte, pouvant ainsi être copiée-collée.

zEditor étant un vrai éditeur, il dispose bien évidemment de fonctions et d'outils plus poussés que la simple zForm du Site du Zéro.
Je vais vous présenter ici un petit aperçu de ce que zEditor propose comme fonctionnalités.

Fonctions liées à la rédaction

La Toolbar

zEditor propose une barre d'outils (la Toolbar) qui permet, comme dans le cas de la zForm, d'insérer des balises zCode. Mais au contraire de la zForm, il y a beaucoup plus d'options pour insérer les balises comme par exemple la possibilité d'insérer une image centrée avec un lien dessus en quelques clics, via des boîtes de dialogue, comme le montre l'exemple ci-dessous :



Certains boutons font office de listes déroulantes pour un accès rapide.

Le menu Insertion

Le menu insertion est semblable à la Toolbar : son rôle est d'insérer des balises. Mais il ne permet généralement que d'insérer les balises de façon brute, sans pouvoir définir leurs attributs comme c'est le cas avec les boîtes de dialogue de la Toolbar. Ce menu affiche aussi les raccourcis claviers attribués aux différentes balises, par exemple Ctrl + Alt + L pour insérer un lien.
Pratique pour gagner du temps.

Auto-complete

zEditor dispose d'une petite fonctionnalité d'auto-complete.
Lorsque l'utilisateur entre une balise, une suggestion est proposée dans la barre d'état de l'éditeur, sous cette forme : . Si la suggestion convient, il suffit d'appuyer sur la touche Tab pour insérer la balise.

Via les options (Outils > Préférences > Rédaction), il est possible d'activer ou de désactiver la fonction, et il est aussi possible de spécifier une autre touche pour valider la balise. Il y a le choix entre Enter, Tab et Space (barre d'espace).

Auto-close

Outre l'auto-complétion, zEditor dispose d'une fermeture semi-automatique des balises. En tapant </, l'éditeur ferme automatiquement la dernière balise non fermée.

Par exemple, si ceci est présent :
Code : Zcode
et que l'utilisateur rentre à la suite, l'éditeur fermera aussitôt la balise LIEN :
Code : Zcode

Cette fonctionnalité est bien évidemment désactivable (Outils > Préférences > Rédaction).

Tabulation

Par défaut, la touche Tab (tabulation) sert de touche d'indentation.
Il y a moyen de ne pas l'utiliser à cet effet, et donc de l'utiliser pour naviguer entre les zones de texte. L'option pour désactiver ce comportement est disponible dans Outils > Préférences > Rédaction.

Correction orthographique

La correction orthographique est la même que celle de Firefox. Les versions de zEditor qui utilisent Firefox 3 partagent le même dictionnaire.
Les versions utilisant XULRunner ont de base un dictionnaire.

Si vous utilisez une version de zEditor pour Linux lancée via la commande xulrunner, le dictionnaire est en anglais car le dictionnaire français n'existe pas. Vous pouvez faire une copie du dictionnaire de Firefox vers XULRunner, au moyen de cette commande :
Code : Console

Documentation

Si vous allez dans Fenêtres > Documentation, un panneau s'ouvre dans le bas de la fenêtre. Ce panneau vous donne accès à deux choses : la référence du zCode et un accès vers des tutoriels relatifs à la rédaction de contenu sur le Site du Zéro.

La référence zCode

La référence zCode, disponible localement (sans connexion internet), permet d'avoir un support sur la façon d'écrire les balises zCode.
C'est pratique si vous ne vous souvenez plus à quoi sert tel ou tel attribut ou comment l'utiliser.

Accès aux tutoriels

La liste déroulante vous permet, outre l'accès à la référence zCode, d'accéder à divers tutoriels du Site du Zéro ayant un rapport direct avec la rédaction de contenu (tutoriels, news...).

Le bloc-notes

Le bloc-notes, comme son nom l'indique permet de prendre des notes, et ce, directement dans zEditor sans devoir passer par le bloc-notes du système d'exploitation. Ça peut être pratique pour travailler avec des données en regard.

Le bloc-notes se trouve dans le panneau horizontal situé dans le bas de la fenêtre. Il peut s'ouvrir via le menu Fenêtres > Bloc-notes.



Le bloc-notes supporte l'ouverture et l'écriture de documents textuels. Il est à noter que pour enregistrer il faut cliquer sur le bouton Enregistrer et non utiliser la combinaison de touches Ctrl + S qui ne fonctionne que pour le tutoriel.

Les fragments de code

Les fragments de code (appelés en anglais code snippets) sont un moyen pour stocker des portions de code de manière à les insérer facilement. Il s'agit généralement de codes qui reviennent fréquemment.

La liste des fragments est disponible dans le panneau latéral (Fenêtres > Fragments de code).



Pour créer un fragment, il suffit d'aller dans Outils > Créer un fragment de code. Une autre méthode consiste à sélectionner du texte dans une des zones de texte et d'aller dans Sélection > Créer un fragment de code. Le code sélectionné sera mis dans le fragment.



Pour insérer un fragment à partir de la liste, il suffit de double-cliquer sur le nom d'un fragment. Il est aussi possible d'insérer le fragment sélectionné en faisant Enter ou en cliquant sur le bouton Insérer. Pour éditer un fragment, sélectionnez-le et cliquez sur le petit crayon dans le bas de la fenêtre.

Rechercher et remplacer

Le système de recherche de zEditor n'est pas encore abouti. Une seule option de recherche est disponible : rechercher et remplacer. La recherche est disponible dans le panneau latéral droit, ou directement via Fenêtres > Recherche.

En l'état, il n'est possible que de rechercher dans les zones de texte affichées.
Un rechercher/remplacer simple peut être utilisé, mais il est possible de le rendre plus performant en utilisant des expressions régulières, en cochant la case adéquate.

Expressions régulières

Les expressions régulières sont à entrer au format ECMAScript, comme il faut le faire avec l'objet RegExp de Javascript. La syntaxe ressemble fortement à celle des expressions régulières utilisées en PHP. Voici quelques règles de formation. Voici un petit exemple simple de rechercher/remplacer :

A rechercher :

Code : Autre

A remplacer :

Code : Autre

Ce qui remplacera toutes les balises GRAS par des ITALIQUE.

Convertisseur de code

zEditor inclut un outil pour convertir un code en un autre.
Pour l'ouvrir, allez dans Outils > Convertisseur de code.



Actuellement, l'outil gère ces conversions :

• HTML > zCode ;
• BBCode > zCode ;
• mdown > zCode (des erreurs d'interlignage peuvent subsister) ;
• zCode > Latex ;
• zCode > HTML.