Architecture du Site Web Odoo
Avant de plonger dans la création, il est crucial de comprendre l'architecture sous-jacente de l'application Site Web d'Odoo.
Le thème comme esthétique
Le thème définit l'apparence visuelle globale du site. Odoo propose une variété de thèmes prédéfinis, chacun offrant un style unique. Les utilisateurs peuvent personnaliser ces thèmes pour refléter l'identité de leur entreprise.
Les pages comme structure
L'unité de base dans Odoo Site Web est la page. Chaque page représente une entité distincte sur le site, qu'il s'agisse de la page d'accueil, d'une page de produit, ou encore d'une page contact. Les pages sont modulables et peuvent être adaptées en fonction des besoins spécifiques.
Les blocs comme contenu
Les blocs sont les éléments de construction qui composent une page. Ils peuvent contenir du texte, des images, des vidéos, ou d'autres éléments interactifs. Chaque bloc peut être personnalisé individuellement pour garantir une présentation harmonieuse du contenu.
Les liens comme navigateur
Une navigation fluide et efficace sur le site est cruciale pour l'expérience utilisateur. Odoo facilite la création de menus et de liens pour guider les visiteurs à travers le site de manière intuitive.
Le SEO comme référencement
Le bon référencement d'un site est primordial et Odoo permet de le gérer facilement via son éditeur SEO.
Exemple
Sur le site ci-dessous, nous retrouvons un site avec un thème bien précis, un menu avec 5 rubriques, un bloc introductif sur la page d'accueil ainsi qu'un bouton/lien amenant à une action.
![](/web/image/168311-195f1b6d/Capture%20d%27%C3%A9cran%202023-11-28%20152128.png)
Thème général
La partie thème permet de gérer l'esthétique du site web : les couleurs, les polices et les tailles ou encore le design des boutons.
Exemple
![](/web/image/168347-b3707f6f/Capture%20d%27%C3%A9cran%202023-11-28%20153019.png)
Menu principal et rubriques
Le menu du site web comprend des rubriques principales, elles-mêmes associées à des pages web. La structure du menu est modifiable dans l'onglet Site > Éditeur de menu.
Exemple
Sur le site ci-dessous, nous retrouvons un menu avec 5 rubriques : "Accueil", "A propos" , "Modules", "Tarifs" et "Contact", chacune amenant à des pages diverses.
Ces rubriques sont modifiables en accédant à l'éditeur de menu.
![](/web/image/168348-174eeb85/Capture%20d%27%C3%A9cran%202023-11-28%20153653.png)
Chaque rubrique peut être modifiée au niveau du "nom" et de la page associée (/...). L'éditeur permet également d'ajouter/supprimer une rubrique ou un méga menu (menu déroulant en dessous de la rubrique) au menu principal.
![](/web/image/168394-e7c2f2ed/Capture%20d%27%C3%A9cran%202023-11-28%20154530.png)
Pages Web
Liste des pages web
Toutes les pages web présentes sur le site se retrouvent dans l'onglet Site > Pages. Toutes les données concernant chaque page sont affichées ici.
Création d'une page web
Une nouvelle page web (/...) se créée notamment via l'onglet Nouveau > Page ou via la liste des pages web du site (Site > Pages).
Exemple
![](/web/image/168398-26b16e00/Capture%20d%27%C3%A9cran%202023-11-28%20160049.png)
![](/web/image/168395-28b0c8d1/Capture%20d%27%C3%A9cran%202023-11-28%20160013.png)
Configuration d'une page
Une page peut être structurée en plusieurs blocs : images, vidéos, textes, boutons, animations,... La partie édition "Blocs" permet d'ajouter/supprimer/modifier un bloc.
Blocs
Lors de la modification d'une page, un menu d'édition est présent à droite de la page. Celui-ci comprend différents blocs à glisser sur la page concernée. Chaque bloc peut être personnalisé via le menu "Personnaliser" (Police, couleurs,...).
Exemple
![](/web/image/168438-b76f0e26/Capture%20d%27%C3%A9cran%202023-11-28%20162753.png)
Blocs personnalisés
Des blocs types peuvent être sauvegardés afin d'être réutilisés sur le site web.
Exemple
En sélectionnant le bloc à sauvegarder, possibilité d'enregistrer le bloc via le l'icône "sauvegarde" à droite. Chaque bloc sauvegardé se retrouve dans la partie "bloc".
![](/web/image/168461-45060700/Capture%20d%27%C3%A9cran%202023-11-28%20171025.png)
Liens
Bouton
Le bouton permet de faire des liens et des redirections sur le site web, permettant au lecteur de naviguer facilement sur le site.
Exemple
Ci-dessous, un bouton "démonstration" amène directement le lecteur à la page "contact". Ce bouton peut être modifié au niveau du design (police, couleur, grandeur,...) et doit absolument être configuré vers le bon lien (/...).
![](/web/image/168437-e2a2a313/Capture%20d%27%C3%A9cran%202023-11-28%20163741.png)
Référencement du site
Le Search Engine Optimization (SEO) est un ensemble de méthodes destinées à optimiser le site web afin d’obtenir un meilleur référencement dans des moteurs de recherche tels que Google.
Gestion du SEO
Le SEO du site peut être géré via l'onglet Site > Optimiser le référencement.
Exemple
![](/web/image/168441-481a71a0/Capture%20d%27%C3%A9cran%202023-11-28%20165408.png)
Les parties importantes du référencement sont : le titre de la page, sa description, les mots-clés qui résument au mieux la page et l'image associée à la page. Chacune de ces parties est rapidement gérée sur l'éditeur SEO ci-dessous.
![](/web/image/168447-80e60e81/Capture%20d%27%C3%A9cran%202023-11-28%20165545.png)