Ibexa 4

CMS : Gestion de contenu. Il s’agit d’un logiciel en ligne grâce auquel il est possible de créer, de gérer et de modifier facilement un site web, sans avoir besoin de connaissances techniques en langage informatique.

​

Open source : son code est accessible à tous, donc plus flexible, on peut le moder, y brancher d’autres outils et sa longévité supérieure car il est amélioré en permanence par la communauté.

​

Langage de développement moderne : développé sur le Framework Symfony, la bibliothèque de développement la plus utilisée et reconnu aujourd’hui.

​

Ses cousins :

Sommaire

1. Prérequis
2. Présentation du back office
3. Administration de contenu
4. Wysiwyg
5. Pages et structure
6. Blocs et éléments
7. Rôles & droits

.01

Prérequis

Définitions

principes & règles

Connexion �

Back office (BO) : Le terme désigne l’interface permettant de gérer les contenus d’un site, soit la « zone administrateur ».

​

Back : l’expression fait référence au back office, la « zone administrateur » (interne).

​

Front : l’expression est l’opposée de « back », elle désigne le site web public en lui-même, la partie visible par l’utilisateur (externe).

​

Serveur de recette : serveur permettant de tester l’affichage des contenus, il est indépendant du serveur de production et les utilisateurs finaux ne voient pas ce qui est affiché dessus. �

Serveur de production : serveur sur lequel sera déployé le site internet une fois terminé. Les utilisateurs finaux voient ce qui est affiché dessus.

​

WYSIWYG : tiré de l’anglais “what you see is what you get” est une interface visuelle où l’on peut directement créer et mettre en forme un contenu sans avoir à coder

​

Bloc : morceaux de site avec des fonctionnalités et un design prédéfinis et réutilisables utilisés pour former des pages de contenus

01. Définitions

Arborescence : ce BO fonctionne sous forme d’arborescence, les url des pages correspondent au niveau de la page dans l’arborescence et son titre est repris dans url. On parle de page “à la racine”, ce qui correspond au premier niveau de l’arborescence (ex : Lamy-immobilier/acheter)

​

Testez sur le serveur de recette : plutôt que de risquer que l’affichage ne soit pas adapté ou casse la page actuelle lors de la création ou la modification d’un contenu, testez-le d’abord sur le serveur de test.

​

Brouillons : lorsque vous éditez ou créez un contenu dans le BO, un brouillon est automatiquement créé et empêche les autres utilisateurs d’accéder à cette partie du BO pour éviter les conflits de modifications. Toujours publier ou supprimer vos brouillons quand vous avez terminez au risque de bloquer les autres utilisateurs !

​

Optimisation des médias : le BO optimise automatiquement les médias pour les adapter au contenu proposé (poids et taille)

​

Liens externes : les liens externes doivent toujours commencer par https://www. sinon les liens seront KO

01. Principes & règles

• 2 environnements existent : un serveur de recette et serveur de production
• Un back office et un front office existent sur ces 2 environnements
• Le contenu du serveur de recette n’est pas publié automatiquement sur le serveur de production et inversement

​

​

Serveur de recette :

​

• BO : https://lamy.infostrates.com/is_admin/login
• Front : https://lamy.infostrates.com/

​

Serveur de production :

​

• BO : https://www.lamy-immobilier.fr/is_admin/login
• Front : https://www.lamy-immobilier.fr/

​

​

01. Connexion

.02

Présentation du back office

�Navigation

Arborescence

Tri des sous-éléments

Priorités

Construction d’une page

02. Navigation

​

La navigation du BO est composée de 4 niveaux

N2

N3

N1

N4

02. Niveau 1 et 2 de navigation

​

​

​

​

Le premier niveau de navigation est composé de :

​

• Content : accès à l’arborescence du site et ses contenus
• Bookmarks : accès aux contenus mis en favoris
• Trash : accès aux éléments supprimés

​

​

​

​

Le second niveau de navigation est composé de :

​

• Dashboard : vue des actions et contenus récents
• Content structure : répertoire des contenus du site
• Media : bibliothèque média (image, pdf)
• Draft : accès aux brouillons de pages et contenus
• Paramètre : modification des paramètres (région, labels, etc.)

02. Niveau 3 de navigation

​

​

​

Le troisième niveau de navigation est identique pour toutes les catégories du deuxième niveau de navigation et est composé de :

​

• Fields : vue des informations relatives à la page
• Sub-items : accès aux sous éléments de la page
• Translations : accès aux traductions de la page
• URL : accès à l’URL de la page
• Relations : vue des relations entre la page et les autres
• Authors : vue des auteurs et dates des dernières modifications de la page

02. Niveau 4 de navigation

​

​

​

Le quatrième niveau de navigation est identique pour tous les niveaux de navigations et est composé de :

​

• + Create content : créer un nouveau contenu
• Preview : visualiser le contenu en front
• Edit : modifier la page
• Move : déplacer la page
• Copy : copier la page
• … : autres options

02. Arborescence

​

L’arborescence du site et de ses contenus s’affiche dans les entrées “content structure” et “Média” de la navigation 2, elle permet de : �

• Avoir un vue de l’arborescence du site
• Naviguer parmi les pages du site web depuis l’arborescence
• Créer de nouvelles pages
• Editer les pages actuelles

Sous éléments

02. Tri des sous-éléments

​

• Il est possible de modifier l’ordre de tri des sous-éléments, par défaut : “date de publication” en “ordre décroissant”
• Pour modifier l’ordre de tri des sous-éléments, cliquez sur sur la donnée par laquelle vous souhaitez trier
• Dans l’exemple ci-dessous, pour classer les sous éléments par priorités, je clique sur “priority”

​

02. Priorités

​

• Les priorités servent à ordonner l’affichage des contenus dans une page en front
• Modifiez la priorité en utilisant les flèches (haut/bas) ou en tapant directement le chiffre souhaité

​

02. Construction d’une page

​

​

Une page est composée comme une arborescence en plusieurs couches, appelées ici “sous-éléments” ou “Parent” et “Enfant”.

​

Par exemple, la page “Nos marques” :

​

• Composée d’un sous élément “Lamys
• Composé lui même d’un sous élément “Nos services”
• Composé lui même d’un sous élément “Syndic”

​

Pour modifier une information dans le bloc Syndic, il faudra donc refaire ce chemin dans l’arborescence.

.03

Administration du contenu

�Créer du contenu

Cacher

Traductions

Emplacements multiples

Médias

03. Créer

​

• Depuis un contenu où la création est possible, je peux cliquer sur “Créer” depuis la barre de navigation de droite
• Le type de contenu que l’on peut créer dépend de l’élément sélectionné

​

03. Créer

​

• Après avoir cliqué sur “créer”, un bandeau latéral apparaît pour vous permettre de sélectionner le type de contenus / blocs que vous souhaitez créer

​

03. Créer

​

• Après avoir sélectionné le bloc souhaité, vous entrez dans la page de création, où vous retrouvez tous les champs relatifs au contenu du bloc.

​

03. Créé

​

• Le champ “Titre” s’affiche par défaut en front. Si vous ne souhaitez pas afficher le titre du contenu, cochez “Ne pas afficher le titre du bloc” (image ci-dessous) lorsque cela est possible.

​

​

​

​

​

​

​

​

​

​

03. Cacher

​

Pour ne pas avoir à supprimer un contenu que vous ne voulez plus afficher momentanément, vous pouvez le cacher en front :

​

• Sélectionner un contenu avec la case à cocher devant un contenu
• Cliquez sur l'icône “hide” pour la cacher
• Cliquez sur l'icône “reveal” pour le réafficher

03. Traductions��Lors de la création d’un contenu, le langage par défaut (“Main language”) est le Français

Pour voir si un contenu existe dans une autre langue, cliquez sur l’onglet “Translations”

​

Étapes pour traduire un contenu :

​

• Depuis l’onglet “Translations” d’un contenu, cliquez sur l’icône “+”
• Choisissez la langue dans laquelle le contenu doit être traduit (English).�Pour gagner du temps, le contenu peut être traduit en partant du contenu existant (Français).
• Cliquez sur “Create”

03. Emplacements multiples

​

Il est possible d’utiliser un même contenu pour différents emplacements du site. Cela permet d’éditer une seule fois le contenu et que la modification s’applique à ces différents emplacements. Pour cela :

​

• Sélectionner un contenu avec la case à cocher
• Cliquez sur l’onglet “Add Locations”
• Depuis cet onglet vous pouvez ajouter un emplacement et consulter les emplacements existants
• Depuis l’onglet “Locations” d’un contenu, cliquez sur l’icône “+”
• Depuis l’arborescence, choisissez où le contenu doit être utilisé puis validez

03. Médias

​

• La section “Média” permet d’ajouter différents types de contenus dont des images et des documents.
• Le dossier Folder est utilisé pour les documents
• Le dossier Images pour les images / photos
• Le dossier multimédia pour les vidéos (non prévues sur notre site)

03. Médias

• Pour ajouter un élément (ex : une image), cliquez sur le dossier souhaité dans l'arborescence puis sur “create content”
• Pour modifier une image, descendez jusqu’au sous élément de la rubrique puis cliquez sur le crayon pour l’éditer

.04

WYSIWYG

�Fonctionnalités

Insérer un CTA

Note de bas de page

04. Fonctionnalités

​

Au clic sur le champs champ « contenu », un éditeur de Rich Text s’affiche :

​

• Permet de déplacer un contenu du bas vers le haut�
• Permet d’éditer les styles de texte (titres, cta)�
• Permet l’alignement du texte (gauche, centré, droite)�
• Permet d’ajouter des boulettes points ou numéros�
• Permet de créer un tableau (non prévu aujourd’hui)�
• Mise en gras, italique, souligné du texte

​

• Exposant du texte (le texte en sous-exposant aura un style gris clair pour permettre de traiter les notes de bas de page).

​

04. Fonctionnalités

​

• Barrer un texte�
• Mettre des guillemets�
• Insérer un lien�
• Permet l’ajout d’une ancre dans le texte�
• Insérer du code�
• Embed

​

• Ajouter une image

​

• Embed dans du contenu

​

• Ajouter des RS

04. CTA

​

Pour ajouter un CTA dans un bloc wysiwyg :

​

• Cliquez sur “paragraph” du menu wysiwyg
• Sélectionnez le “Bouton”

04. CTA

​

​

• Un encadré apparaît
• Écrivez le texte à intégrer dans le CTA
• Sélectionnez le texte et cliquez sur l'icône “lien” du menu wysiwyg
• Un second menu apparaît et vous permet d’ajouter un lien interne (en naviguant dans l’arborescence et en sélectionnant la page) ou un lien externe
• Cliquez sur “save”
• Votre CTA est fonctionnel

04. Note de bas de page

​

Pour créer une note de bas de page :

​

• Utilisez un bloc Wysiwyg
• Placez le en bas de votre page builder
• Ajoutez votre texte et sélectionnez le
• Utilisez le bouton exposant du menu wysiwyg pour modifier le texte
• Votre texte apparaîtra en mise en forme de note de bas de page

.05

Pages et structure

�Créer une page builder

Créer une Landing Page

Ajouter une page au menu

FAQ : thématiques - sous thématique - réponse

Agences, villes, départements

Paramètres (footer & catégories d’actualités)

Module SEO

05. Créer une page builder

​

Pour créer une nouvelle page :

​

• Placez vous à la racine du site (ici : accueil)
• Cliquez sur “create content”

​

​

​

​

​

​

​

​

05. Créer une page builder

​

Une page souvre :

​

• Sélectionner “page builder”
• Cliquez sur Create
• Rentrez les informations relatives à la page (titre, hero banner)
• La page est créée et utilisable mais n'apparaît pas dans le menu du site

​

​

​

​

​

​

​

​

05. Créer une Landing Page

​

Pour créer une nouvelle page :

​

• Placez vous à la racine du site (ici : accueil)
• Cliquez sur “create content”

​

​

​

​

​

​

​

​

05. Créer une Landing Page

​

Une page souvre :

​

• Sélectionner “Landing Page”
• Cliquez sur Create
• Rentrez les informations relatives à la page (titre, hero banner, cta)
• La page est créée et utilisable mais n'apparaît pas dans le menu du site

​

​

​

​

​

​

​

​

05. Menu

​

Le menu est composé de deux éléments, les “parties de site” et “lien”

​

• Les liens renvoient directement l’utilisateur au clic sur la page en question
• La partie du site créée un menu déroulant

​

​

​

​

​

05. Menu

​

Pour créer un nouveau “lien” ou “partie de site” dans le menu :

​

• Placez vous à la racine du site (ici : accueil)
• Cliquez sur “create content”
• sélectionnez un lien ou une partie de site

​

​

​

​

​

05. Menu - lien

​

• Ajoutez un titre à votre lien
• Liez la page souhaitée à votre lien à partir du sélecteur

​

​

​

​

​

05. Menu - partie de site

​

• Créer la partie de site
• Placez vous dans la partie de site créée dans l’arborescence du site
• Ajouter vos pages à votre partie de site

​

​

​

​

​

05. Menu - partie de site

​

Pour administrer l’espace de mise en avant des megas menu :

• sélectionnez votre partie de site
• cliquez sur modifier

​

​

​

​

​

05. Menu - partie de site

​

Pour administrer l’espace de mise en avant des megas menu :

• Administrez le titre, l’image et le lien interne ou externe

​

​

​

​

​

05. FAQ

​

La FAQ est décomposée dans le dossier FAQ par thématique, sous thématique et réponse.� �

​

​

​

​

​

05. FAQ - Thématique

​

Pour créer une thématique :

• Placez vous dans la catégorie thématique
• Cliquer sur “créer”
• Ajouter une thématique� �

​

​

​

​

​

05. FAQ - Sous thématique

​

Pour créer une sous thématique :

• Placez vous dans une thématique
• Cliquer sur “créer”
• Ajouter une sous thématique� �

​

​

​

​

​

05. FAQ - Réponse

​

Pour créer une réponse :

• Placez vous dans une sous thématique
• Cliquer sur “créer”
• Ajouter une réponse� �

​

​

​

​

​

05. Agences, villes, départements

​

Les agences, villes et départements sont créées automatique via le flux de données Nexity, ce que ça implique :

• Si une agence est manquante ou en trop, c’est au niveau du flux qu’il faut apporter une modification
• Même chose pour les informations automatisées de la page

​

Dans le BO, les agences sont classées dans le dossier “nos agences” par département, ville, agence

�

​

​

​

​

​

05. Agences - modifications

​

Pour ajouter des blocs sur une page agence, ville ou département :

• Placez vous dans une agence, ville ou département
• Cliquez sur “créer”
• Ajouter le bloc souhaité et administrez le

�

​

​

​

​

​

05. Paramètre

​

• Les paramètres sont accessibles depuis l’onglet “Parameters”
• Les paramètres permettent d’administrer le footer du site
• Même principe de création et édition que le reste du BO

​

​

​

​

​

​

​

​

​

05. Module SEO

​

• Allez dans une page parent de l’arborescence
• Cliquez sur l’onglet “SEO”
• Suivez les étapes d’édition

​

​

​

​

​

​

​

​

05. Module SEO

​

Tous les champs du mobule SEO sont remplis par défaut, mais vous pouvez les administrer au besoin :

• balise titre
• balise meta
• robot : NOINDEX, NOFOLLOW

​

​

​

​

​

​

​

​

.06

Blocs et items

�

05. Cartes

​

​

​

​

​

​

​

​

​

​

BACK

FRONT

05. Cartes

​

​

​

​

​

​

​

​

​

​

BACK

FRONT

05. Bloc contenu

​

​

​

​

​

​

​

​

​

​

BACK

FRONT

05. Bloc contenu

​

​

​

​

​

​

​

​

​

​

BACK

FRONT

05. Bloc contenu

​

​

​

​

​

​

​

​

​

​

BACK

FRONT

05. Bloc bandeau complexe

​

​

​

​

​

​

​

​

​

​

BACK

FRONT

05. Bloc bandeau simple

​

​

​

​

​

​

​

​

​

​

BACK

FRONT

05. Bloc chiffres clés

​

​

​

​

​

​

​

​

​

​

BACK

FRONT

05. Bloc chiffres clés

​

​

​

​

​

​

​

​

​

​

BACK

FRONT

05. Bloc portraits

​

​

​

​

​

​

​

​

​

​

BACK

FRONT

05. Bloc portraits

​

​

​

​

​

​

​

​

​

​

BACK

FRONT

05. Bloc bandeau + image

​

​

​

​

​

​

​

​

​

​

BACK

FRONT

05. Bloc vidéo

​

​

​

​

​

​

​

​

​

​

BACK

FRONT

05. Bloc ascenseur

​

​

​

​

​

​

​

​

​

​

BACK

FRONT

05. Bloc ascenseur

​

​

​

​

​

​

​

​

​

​

BACK

FRONT

05. Bloc cards + image

​

​

​

​

​

​

​

​

​

​

BACK

FRONT

05. Bloc cards + image

​

​

​

​

​

​

​

​

​

​

BACK

FRONT

05. Bloc À savoir

​

​

​

​

​

​

​

​

​

​

BACK

FRONT

05. Bloc Recherche d’agence

​

​

​

​

​

​

​

​

​

​

BACK

FRONT

05. Bloc mini cards

​

​

​

​

​

​

​

​

​

​

BACK

FRONT

05. Bloc mini cards

​

​

​

​

​

​

​

​

​

​

BACK

FRONT

.07

Rôle et droits

�Ajouter des User

05. Rôles & droits

​

Il y a deux types d’utilisateurs avec différents droits :

• Users : droit de consultation
• Editor : droit d’éditions, suppression, déplacement…

​

​

​

​

​

​

​

​

05. Ajouter un utilisateur

​

• Allez dans “utilisateurs” puis dans “éditors”
• Cliquez sur “create user”
• Suivez les étapes de création d’un user

​

​

​

​

​

​

​

​

Let’s go !