Les pages du site

Création d’une page

Pour créer une page enfant à une page de premier niveau, cliquez sur le bouton créer de la page parent. Une fenêtre s’ouvre alors.

Définissez d’abord la position de la nouvelle page. Dans l’exemple ci-dessus, nous souhaitons créer une page enfant de “Services”. Il faut donc cocher la case “Au-dessous de”. La case “Après” permet de créer une page de même niveau.
La prochaine étape consiste à remplir le champ ”Nom”. Cette chaîne de caractères sera utilisée par l’application pour générer l’adresse URL de la page.
Pour cette raison, il ne faut pas utiliser d’espace, de guillemets et autres accents.
ex :
Services
Les_Services
Appel_a_temoignage
Nous_contacter

Sélectionnez le template (modèle de page) à utiliser (par défaut Page).
Cliquez ensuite sur le bouton .

Remplir une page

Pour éditer une page, cliquer sur le bouton modifier ou sur la langue correspondante. La page à éditer apparaît alors.

Interface générale

Outils d’édition : Il s’agit d’une fenêtre déplaçable qui récapitule les informations de la page à éditer. Il suffit de cliquer sur les différents titres de partie pour réduire ou agrandir la zone sélectionnée.

Mode : Par défaut, le mode édition () est sélectionné. Vous pouvez prévisualiser la page en cliquant sur . Pour revenir à la liste des pages, cliquez simplement sur .

Statut : Vous pouvez publier ou dépublier une page en cliquant sur le statut choisi. Une page dépubliée n’est pas supprimée. Elle n’apparaîtra pas dans le site Web mais vous pourrez la re-publier ultérieurement.

Traductions(s) : Pour les site multilingues, permet d’éditer une page dans une autre langue, ou de supprimer une traduction. Pour de plus amples informations concernant les sites multilingues, se reporter à la section “site multilingue”.

Propriété de la page :
Titre : il s’agit du titre de la page.
Chemin : il s’agit de la chaîne de caractères qui sera utilisée pour générer l’adresse URL de la page.
Template (modèle de page) : le type de page référencé ici. Deux template sont disponibles : ”page“ pour les pages du site et “news” pour les page news.
Position : permet de déplacer une page dans l’arborescence du site Web. Pour cela, définissez sa position et cliquez sur enregistrer.

Édition du contenu

Pour éditer le contenu d’une page, double-cliquez dans la zone que vous souhaitez éditer.

Chaque page est divisée en trois parties : la partie haute (appelé également têtière) permet d’afficher une image de grand format. La partie centrale correspond au corps de la page, tandis que la partie de droite permet de mettre en exergue certains points, de faire des liens croisés, de proposer des téléchargements ou autre. Pour plus d’information sur les différents niveaux de lecture, rendez vous dans la partie Principes éditoriaux.

Les zones haute et droite, si elles ne sont pas complétées, prendront automatiquement les attributs de la page parent. Ainsi, il n’est pas nécessaire de remplir toutes les zones de toutes les pages du site.

La partie centrale, zone principale de la page, se décompose en trois champs : le titre, le “chapeau” (ou résumé) et le corps du texte.

Le champ “titre” est une zone de texte simple. La taille de la police et sa couleur sont celles définies par la maquette du site. Cette règle permet de conserver une uniformité graphique dans tout le site.

Les deux champs suivants proposent un éditeur HTML “Wysiwyg” (vous voyez ce que vous faites). Cet éditeur standard, permet de mettre en page très simplement votre contenu. Survolez les différentes icônes pour plus d’informations.

Pour un plus grand confort d’utilisation, vous pouvez redimentionner la fenêtre de l’éditeur verticalement grâce à l’onglet se situant en bas à droite de l’éditeur.
Tapez vos textes dans l’éditeur ou copier-coller des textes existants via la fonction “coller en tant que texte brut”. Vous pourrez ensuite appliquer des styles (tailles de polices, boutons, etc.), modifier les couleurs, utiliser le gras, l’italique, etc. Une fois votre texte mis en page, cliquez simplement sur .

Durant cette étape, veillez à respecter au maximum les principes de votre maquette (couleur, taille de police...).

S’il s’agit d’une nouvelle page, n’oubliez pas de la publier grâce aux outils d’édition décrits plus haut.

Votre page est maintenant en ligne sur votre site Web.

Insertion d’images et de médias

Pour agrémenter les pages d’images et autres animations flash, cliquez dans l’éditeur HTML, cliquez sur  si vous souhaitez ajouter une image ou sur  si vous souhaitez ajouter un fichier multimédia (flash, vidéo, etc.).

Pour supprimer une images ou un média, sélectionnez-le dans l’éditeur HTML et supprimez-le.

Pour insérer une vidéo sur une page de votre site, celle-ci doit avoir été “postée” au préalable sur un site de diffusion de vidéo en “streaming”, les plus connus étant YouTube et Dailymotion. Gratuites, ces plates-forment proposent un “lecteur exportable” qui permet de publier sur tout site tiers une vidéo alors qu’en réalité, celle-ci se trouve stockée physiquement sur leurs serveurs. Insérer une vidéo à une de vos pages Web revient alors à copier/coller le code HTML de ce lecteur exportable.

Depuis le site de diffusion vidéo (YouTube, Dailymotion...), copiez le code HTML associé à la vidéo :
• pour YouTube :


• pour Dailymotion :


Depuis votre interface d’administration Jumbe, éditez la page sur laquelle vous souhaitez publiez la vidéo, puis, dans le menu du corps de la page, cliquez sur  pour éditer le code HTML correspondant. Une fenêtre s’ouvre. Collez alors le code HTML du lecteur exportable à l’endroit désiré (facilement repérable) en cliquez enfin sur .
Enregistrez vos modifications.

Votre vidéo est en ligne !

Les liens hypertextes

Les liens hypertextes, ou encore HTML, permettent très facilement de se rendre sur une autre page de votre site, sur un site extérieur ou même de proposer au téléchargement un fichier (pdf, document Word, fichier Excel, etc.)

Pour ajouter un lien hypertexte, sélectionnez l’image ou le texte associé et cliquez sur  . 
Une fenêtre s’ouvre alors vous invitant à remplir différents champs afin d’indiquer l’adresse (ou URL) vers laquelle le lien devra renvoyer. Remplissez le champ “URL du lien” par l’adresse (ex : http://www.google.fr). Vous pouvez également choisir si le lien s’ouvrira dans la même fenêtre (conseillé si vous renvoyez vers une autre page de votre site) ou dans une nouvelle fenêtre (conseillé si vous renvoyez vers un autre site Web).

Pour supprimer un lien, sélectionnez le lien à supprimer et cliquez sur

Pour proposer au téléchargement un fichier, sélectionnez l’image ou le texte associé et cliquez sur . 
Dans la fenêtre qui s’ouvre, cliquez sur afin d’ouvrir le gestionnaire de fichiers. Sélectionnez le fichier souhaité et suivez la même procédure que lors de l’insertion d’une image.

Création d’un tableau

Les tableaux ont une double utilité. Il permettent bien entendu d’agencer du contenu de type tableau, comme dans n’importe quel logiciel de traitement de texte. Vous pourrez ainsi mettre en avant un comparatif, ou une liste de données. Mais les tableaux sur le Web permettent également de réaliser des mises en pages complexes sur plusieurs colonnes. En effet, un tableau au contour transparent permettra de présenter des images, textes, liens, fichiers multimédia...

Pour créer un tableau, cliquez sur

Exemple d’un tableau de données :


Exemple d’un tableau de mise en page :