Web : Créer la navigation et les pages
Download as PDFAperçu
le CMS de Backstage vous permet de configurer et d'organiser facilement votre site web. Dans le module Web, vous commencez par créer la structure de votre site à l'aide de modèles de page et des menus de navigation. Chaque élément de menu, comme une page d'inscription ou une offre de médias, contribue à définir la manière dont les visiteurs naviguent sur votre site.
Le CMS est fourni avec des menus prédéfinis que vous pouvez développer ou personnaliser en fonction de vos besoins. Vous pouvez également ajouter des liens rapides de connexion, ou vers votre webshop, ainsi que des liens externes vers des partenaires.
Conseil
Pour découvrir des exemples de modèles de pages Web, rendez-vous sur notre site d'aide : howto.picturemaxx.com
Remarque
Une fois votre structure définie, vous pouvez créer le contenu de votre page. Pour en savoir plus, consultez la FAQ Web : Ajouter du contenu.
Créer la navigation et les pages
Backstage regroupe les éléments de page dans une hiérarchie de navigation afin d'en faciliter la gestion. Par défaut, il existe trois structures de navigation :
- Tree 1 : Menu de navigation principal
- Tree 2 : Menu du pied de page
- Tree 3 : Menu d’en-tête de droite

Navigation dans Backstage : éléments du menu du Tree 1 sur la page d'accueil

Page d’accueil : Eléments de navigation du Tree 1-3
Pour ajouter de nouveaux éléments à votre site web, procédez comme suit :
- Allez dans Web > Eléments de page > Navigation.
- (Facultatif pour plusieurs sites Web) Dans le menu déroulant « Site Web », sélectionnez le site Web.
- Dans Menu de navigation, sélectionnez la hiérarchie de navigation souhaitée dans le menu déroulant Tree.
- Pour ajouter des éléments, cliquez avec le bouton droit de la souris sur un élément du menu de navigation afin d'ouvrir le menu contextuel, puis sélectionnez l'une des options suivantes :
- Ajouter élément (niveau actuel)
- Ajouter élément (niveau inférieur)
- Pour modifier l'ordre des éléments dans le menu de navigation, cliquez avec le bouton droit de la souris sur un élément de la hiérarchie pour ouvrir le menu contextuel, puis sélectionnez l'une des options suivantes :
- Déplacer en première position
- Déplacer vers le haut
- Déplacer vers le bas
- Déplacer en dernière position
- Déplacer vers un autre niveau
Ou
- Sélectionnez l'une des options suivantes dans le menu Éditer :
- Ajouter élément (niveau actuel)
- Ajouter élément (niveau inférieur)
Remarque
Utilisez le menu Vues > Ouvrir les éléments inférieurs pour afficher les éléments de navigation masqués. Pour revenir à l'affichage précédent, sélectionnez Fermer les éléments inférieurs.
Conseil
Choisissez votre affichage
Après avoir sélectionné une hiérarchie de navigation, vous pouvez afficher la structure de navigation de votre site web de deux manières :
- Nom de la navigation : sélectionnez cette option pour afficher les noms internes de la structure de navigation.
- Langue : sélectionnez une langue pour afficher la structure de navigation dans les langues disponibles sur le site web.
Important : ces affichages n'ont aucune incidence sur votre site web ; ils servent uniquement à faciliter la modification.
_
Affichage de la Navigation : Sélectionnez Nom ou Langue_
Configurer un élément de navigation
Définissez les propriétés de l’élément dans la partie de droite Editer l’élément :
Nom
Saisissez un nom pour l’élément (utilisation en interne uniquement)
Titre
Indiquez le titre de l'élément. Ce titre apparaît dans la vue de navigation spécifique à la langue et sur votre site web. Si votre site est multilingue, indiquez un titre pour chaque langue.
Modèle
Sélectionnez le modèle de page dans le menu déroulant. Ce modèle définit la structure interne des liens de votre site web. Pour plus d'informations, consultez la section Modèles de page disponibles ci-dessous.
Activer Modèles d’article
Activer l'option permettant d'utiliser les différents modèles pour les articles disponibles dans Web > Contenu > Articles.
Modèle d’article
Sélectionnez un modèle par défaut pour les nouveaux articles dans le menu déroulant. Vous pourrez l'adapter ultérieurement pour chaque article.
Utiliser Cache
Nous vous recommandons d'activer cette option afin d'accélérer le chargement des pages et de réduire la charge sur le serveur. Le cache stocke des copies des éléments contenus dans la page que l'utilisateur est en train de consulter. Lorsque cette page est consultée à nouveau, ces éléments sont récupérés directement depuis le cache, ce qui rend votre site plus rapide.
Vous pouvez également définir la durée de validité du contenu mis en cache. Sélectionnez l'option Statique pour une validité illimitée. Quelle que soit la durée de validité choisie, le cache est réinitialisé dès que la page ou ses éléments sont mis à jour.
L’Elément est la page d’accueil
Activez l'option permettant de définir cette page comme page d'accueil de votre site web. Ce sera la première page que les utilisateurs verront lorsqu'ils visiteront votre site.
Important
Si vous ne définissez pas de page d'accueil, les utilisateurs verront s'afficher un message d'erreur lorsqu'ils se rendront sur votre site.
Ajouter les articles nouvellement créés
- Ajouter en première position – Les nouveaux articles apparaissent en premier.
- Ajouter en dernière position – Les nouveaux articles apparaissent en dernier.
Vue et ordre sur le site web
- Par ordre croissant – L’article avec le numéro le plus bas apparait en premier.
- Par ordre décroissant – L’article avec le numéro le plus haut apparait en premier..
Alignement du menu déroulant
- Vertical – Les éléments du sous-menu s'affichent en colonne.
- Horizontal – Les éléments du sous-menu s’affichent côte à côte.
Type de menu déroulant
- Simple – Les sous-menus contiennent uniquement du texte.
- Amélioré (avec images) – Les sous-menu contiennent de l’image et du texte.
Remarque
Pour plus d'informations sur le type de menu déroulant Amélioré, consultez la section Configurer les sous-menus ci-dessous.
L’élément est publié
Cochez cette option lorsque l'élément est prêt et que vous souhaitez qu'il apparaisse sur votre site web.
L’élément est caché
Cochez cette option pour que l'élément reste publié tout en le masquant dans la navigation du site web. Il peut toujours être utilisé pour les liens internes.
L’élément est publié mais nécessite une connexion
Cet élément apparaît dans la barre de navigation. Lorsque les utilisateurs cliquent dessus, ils sont redirigés vers la page de connexion.
L’élément n’est visible qu’après être connecté
Cet élément n'apparaît dans la barre de navigation que pour les utilisateurs connectés.
L’élément est visible que pour certain accès
Permet de rendre l'élément visible uniquement pour certains utilisateurs ou groupes d'utilisateurs. Sélectionnez les ensuite dans la liste.
Définir une heure de début
Cochez cette option pour programmer la publication de l'élément. Indiquez la date et l'heure.
Définir une heure de fin
Cochez cette option pour désactiver la publication de l'élément. Indiquez la date et l'heure.
Description
Utilisez ce champ pour ajouter des notes internes ou des informations supplémentaires concernant l'élément. Ces informations ne s'affichent pas sur votre site web et sont destinées uniquement à un usage interne.
Modifier ou supprimer des éléments de la page dans la navigation
Les éléments de la page peuvent être modifiés à tout moment dans Backstage. La procédure à suivre est similaire à celle utilisée pour créer de nouveaux éléments.
- Allez dans Web > Eléments de page > Navigation.
- Facultatif pour plusieurs sites web : sélectionnez le site web souhaité dans le menu déroulant..
- Sélectionnez le Tree dans lequel se trouve l'élément à modifier ou à supprimer.
- Sélectionnez ensuite l'élément souhaité dans la hiérarchie de navigation.
- Effectuez les modifications nécessaires dans la partie droite.
- Confirmez avec Enregistrer.
- Pour supprimer un élément, allez dans Editer > Supprimer l’élément.
Ou
- Ouvrez le menu contextuel comme indiqué plus haut, puis cliquez sur Supprimer l'élément.
Configurer les sous-menus
Commencez par choisir les images qui doivent apparaître dans la barre de navigation, puis téléchargez-les dans Web > Modèles > Pièces à joindre.
Toutes les images doivent avoir la même taille ; la largeur recommandée est de 300 pixels.
Remarque
Découvrez comment importer des documents dans la FAQ sur les pièces à joindre.
Définissez les paramètres de l'élément de menu pour intégrer les images :
- Allez dans Web > Eléments de page > Navigation.
- Dans le menu Navigation, sélectionnez Tree 1.
- Cliquez avec le bouton droit sur l'élément de menu et sélectionnez Ajouter un élément (niveau inférieur) dans le menu contextuel pour ajouter un sous-menu.
- Dans Editer l’élément :
- Saisissez un nom (interne uniquement).
- Dans le menu déroulant Modèle, sélectionnez le type de page (Nouvelle page est sélectionnée par défaut).
- À côté du champ Sélectionner une image, cliquez sur le bouton pour ouvrir les pièces jointes et sélectionner une image déjà téléchargée.
- (Facultatif) Ajouter une description pour chaque langue.
- Dans Publication, assurez-vous que la case L’élément est caché ne soit pas cochée.
- Cliquez sur Enregistrer.
- Répétez ces étapes pour les autres éléments du menu.
Remarque
- La taille réelle des images affichées dans la navigation dépend du nombre et de la taille des images et s'ajuste automatiquement.
- Les menus horizontaux s'étendent sur toute la largeur de la zone de navigation.
- Cette option de navigation n'est disponible que pour le Tree 1 (menu principal), et non pour les Tree 2 ou 3.

Paramètres du menu de navigation et des sous‑menus appliqués sur la partie frontend
Modèles de page disponibles
Les modèles de page suivants sont disponibles dans Backstage. Chaque modèle comprend les paramètres par défaut décrits dans la section précédente. Certains modèles peuvent également proposer des options de configuration supplémentaires.
Remarque
Tous les modèles de page ne sont pas disponibles pour toutes les mises en page de site web.
- Offers Preview List : Affiche vos dernières offres sur le site web. L'affichage peut être filtré. Les offres sont gérées dans Gestion des médias > Collections > Offres.
- Download-Overview – by individual media file : Permet à vos utilisateurs de consulter un historique de leurs téléchargements, en fonction des médias qu'ils ont téléchargés.
- Download-Overview – by Order (ZIP files) : Permet à vos utilisateurs de consulter un historique de leurs téléchargements ZIP, en fonction des visionneuses et des paniers téléchargés.
- External Link : Liens vers un site web ou une ressource externe.
- Lightbox : Liens vers la visionneuse de l'utilisateur dans le webshop.
- Login – Popup : Ouvre la fenêtre de connexion.
- Login – Website : Ouvre la page de connexion.
- Logout : Déconnecte l'utilisateur de votre site web.
- My Account – Website : Liens vers la page Mon compte, qui permet de consulter les informations de l'utilisateur et de télécharger une photo. Les utilisateurs peuvent mettre à jour leurs données personnelles.
- My Account – Webshop : Liens vers la page Mon compte du webshop. Les utilisateurs peuvent mettre à jour leurs données personnelles.
- Registration – Popup : Ouvre la fenêtre d’inscription.
- Registration – Page : Ouvre la page d’inscription.
- Sitemap : Affiche un plan du site comprenant toutes les hiérarchie de navigation et tous les éléments de page.
- Search – Basic : Ouvre la page de recherche du webshop et peut afficher le dernier résultat de recherche.
- Search – Advanced : Ouvre la page de Recherche avancée et peut afficher le dernier résultat de recherche.
- Search – Predefined Keywords : Lance une recherche sur des mots-clés prédéfinis.
- Basket : Ouvre le panier de l'utilisateur connecté.
- Redirect to Element : Ouvre le premier sous-élément de l'élément actuel. S'il n'y en a pas, un message d'erreur s'affiche.