Académique Documents
Professionnel Documents
Culture Documents
Ec o n o m iq u e s e t S o c ia le s
- S o u is s i
SYSTEMES DE GESTION
DE CONTENU (CMS)
Lic e n c e P ARC.EXC.MADICE.S 5
HAMZA EL HAMDAOUI
Introduction aux CMS
Installation et Configuration
plan de cours
Création de Contenu
Personnalisation du Design
Sécurité et Optimisation
Définition 1
Un système de gestion de contenu, communément appelé CMS (Content
Management System), est une solution conçue pour la création dynamique et
la mise à jour régulière de sites web.
Définition 2
Les systèmes de gestion de contenu permettent aux administrateurs de sites
web de gérer le contenu de leurs sites sans nécessiter des compétences en
programmation HTML ou l'utilisation d'outils de développement.
Définition 3
Un système de gestion de contenu représente un outil qui simplifie la
publication d'informations sur Internet, sans nécessiter de compétences de
programmation. Il permet la création automatisée et la gestion de sites
d'actualité aussi bien que de boutiques en ligne, tout en offrant une facilité
d'utilisation pour les utilisateurs non techniques.
Il existe de nombreux types de systèmes de gestion de contenu (CMS) disponibles, chacun avec ses propres
caractéristiques :
Les CMS Open Source sont des systèmes de gestion de contenu pour la création
et la gestion de sites web. Ils sont distribués sous une licence open source, ce qui
les rend gratuits et accessibles à tous. Les utilisateurs peuvent personnaliser leur
site web en utilisant des thèmes et des plugins, et bénéficier du support d'une
communauté active de développeurs et d'utilisateurs.
EXEMPLES :
CMS E-commerce :
EXEMPLES :
CMS Basés sur le Cloud :
Les CMS basés sur le cloud, ou CMS en ligne, sont des plateformes de gestion de
contenu qui fonctionnent sur des serveurs distants et sont accessibles via
Internet. Ils sont fournis avec un service d'hébergement, offrent une facilité
d'utilisation universelle depuis n'importe quel navigateur web, et bénéficient de
mises à jour automatiques gérées par le fournisseur de services.
EXEMPLES :
les principaux composants d'un site web
Un site web est composé de plusieurs éléments essentiels qui travaillent ensemble pour fournir du contenu et une
expérience utilisateur cohérente.
Contenu HTML :
Le contenu de base de chaque page web est créé en utilisant le langage de balisage HTML (HyperText Markup Language).
Cela inclut le texte, les images, les liens et d'autres éléments visuels.
EXEMPLE :
<!DOCTYPE html>
<html>
<head>
<title>MADICE WEBSITE</title>
</head>
<body>
</body>
</html>
les principaux composants d'un site web
EXEMPLE :
<!DOCTYPE html>
<html>
<head>
<style>
body {background-color: powderblue;}
h1 {color: blue;}
p {color: red;}
</style>
</head>
<body>
</body>
</html>
les principaux composants d'un site web
JavaScript :
Le JavaScript est un langage de programmation utilisé pour ajouter des fonctionnalités interactives à un site web. Cela
inclut les effets de survol, les animations…
EXEMPLE :
function afficherAlerte() {
alert('Ceci est une alerte JavaScript !');}
les principaux composants d'un site web
Images et Médias : Les images, les vidéos, les fichiers audio et d'autres médias sont intégrés dans les pages web pour
enrichir le contenu et l'expérience de l'utilisateur.
EXEMPLE :
<!DOCTYPE html>
<html>
<body>
Navigation :
Les menus de navigation, les liens internes et externes permettent aux utilisateurs de se déplacer facilement entre les
pages et les sections du site.
EXEMPLE :
<nav>
<ul>
<li><a href="/">Accueil</a></li>
<li><a href="/produits">Produits</a></li>
<li><a href="/contact">Contact</a></li>
</ul>
</nav>
les principaux composants d'un site web
En-tête :
L'en-tête du site contient souvent le logo de l'entreprise, le nom du site, la navigation principale et d'autres informations
importantes.
EXEMPLE :
<header>
<h1>Mon Site Web</h1>
<img src="logo.png" alt="Logo du site">
</header>
les principaux composants d'un site web
Pied de page :
Le pied de page contient généralement des informations de contact, des liens vers les médias sociaux, des mentions
légales et d'autres éléments pertinents.
EXEMPLE :
<footer>
<p>Contactez-nous :
contact@monsite.com</p>
<a href="/mentions-
legales">Mentions Légales</a>
</footer>
les principaux composants d'un site web
Pages :
Un site web est généralement composé de plusieurs pages, chacune ayant son propre contenu et sa propre structure. Les
pages peuvent inclure la page d'accueil, les pages de produits ou de services, les pages de contact, les articles de blog, etc.
EXEMPLE :
les principaux composants d'un site web
Nom de Domaine :
Le nom de domaine est l'adresse web du site (par exemple, www.monsite.com). Il est associé à une adresse IP spécifique
du serveur web.
EXEMPLES :
les principaux composants d'un site web
Serveur Web :
Le site est hébergé sur un serveur web qui le rend accessible aux visiteurs via Internet. Des serveurs web populaires
incluent Apache, Nginx et Microsoft IIS.
Rôle :
Hébergement Web :
Le site est généralement hébergé sur un service d'hébergement web qui stocke les fichiers du site et les rend disponibles
en ligne.
Rôle :
L'hébergement web, également appelé hébergement de site web, est le service qui
permet à un site web d'être accessible en ligne. Il consiste à stocker les fichiers du site
web sur des serveurs web connectés à Internet de manière à ce que les utilisateurs
Base de Données :
Certains sites web, en particulier les sites dynamiques, utilisent une base de données pour stocker et récupérer des
informations, telles que les utilisateurs enregistrés, les commentaires, les produits, etc.
EXEMPLE :
les principaux composants d'un site web
Sécurité :
Des mesures de sécurité sont mises en place pour protéger le site contre les menaces en ligne, telles que les attaques de
piratage et les logiciels malveillants.
EXEMPLES :
les principaux composants d'un site web
Rôle :
Analytique Web :
Des outils d'analyse web sont utilisés pour suivre le trafic du site, les comportements des utilisateurs et d'autres
métriques.
EXEMPLES :
Je vous invite à télécharger
ces applications sur votre ordinateur
XAMPP :
XAMPP est un ensemble de logiciels open source largement utilisé pour faciliter le développement et la
gestion de sites web locaux. L'acronyme XAMPP représente les composants principaux du logiciel :
x A M P P
Système d'exploitation Apache MySQL PHP Perl
(OS) Un serveur web open Un système de gestion Un langage de script côté Un langage de
Il est compatible avec de base de données serveur utilisé pour programmation
source très populaire
plusieurs systèmes relationnelle (SGBDR) développer des interprété, bien que dans
d'exploitation,
qui gère les requêtes open source. Il est utilisé applications web la plupart des cas, le "P"
notamment Windows, HTTP et sert les pour stocker et gérer les dynamiques. PHP est soit plus couramment
Linux, macOS et d'autres. fichiers web. données de votre site souvent utilisé avec des associé à PHP.
web. bases de données MySQL
pour créer des sites web
interactifs.
Installation de XAMPP
L'installation de XAMPP est généralement assez simple. Voici les étapes de base pour installer XAMPP sur un système
Windows. Les étapes peuvent varier légèrement selon votre système d'exploitation, mais le processus global est similaire.
Ét a p e 1 : Té lé c h a r g e m e n t d e XAMP P Ét a p e 2 : Dé s a c t iv e r le s p r o g r a m m e s Ét a p e 3 : Dé s a c t iv e r Us e r Ac c o u n t
a n t iv ir u s Co n t r o l
Pour une installation en toute fluidité, Le contrôle du compte utilisateur (UAC, User Account
Téléchargez la version de XAMPP compatible désactivez temporairement votre antivirus Control) peut entraver l'installation de XAMPP en
avec votre système d'exploitation (Windows, jusqu'à la fin du processus. raison de restrictions d'écriture sur le lecteur C.
Linux, macOS, etc.). Assurez-vous de
télécharger la dernière version stable.
Installation de XAMPP
Après avoir désactivé les programmes de sécurité Lors de l'installation de XAMPP, personnalisez Vous pourrez sélectionner le répertoire
susceptibles de causer des problèmes lors de les composants selon vos besoins. Pour un d'installation de votre logiciel et de ses
l'installation de XAMPP, il est temps de passer à environnement de test, optez pour composants lors de la procédure. Par défaut, un
l'étape suivante. Cliquez sur 'Suivant' pour configurer l'installation complète en cliquant simplement dossier XAMPP sera créé à la racine de votre
les paramètres de votre installation. sur "Suivant". disque dur.
Installation de XAMPP
Ét a p e 7 : La d e r n iè r e é t a p e d ' in s t a lla t io n
Terminer
Fermer le Contrôleur de
gestion XAMPP
Ouvre le dossier XAMPP Affiche les services propose des liens d’aide
dans Windows fonctionnant en arrière-plan par le biais du forum
utilisateur
Configuration de XAMPP
Dès que le serveur est prêt, la prochaine étape consiste à procéder à l'installation de WordPress. Vous pouvez
télécharger la dernière version de WordPress, puis décompresser le fichier ZIP.
Accédez au dossier XAMPP sur votre lecteur C (C:\xampp) et repérez le dossier htdocs. Ensuite, transférez les fichiers
WordPress extraits dans ce répertoire. Il est conseillé de renommer ce nouveau dossier avec le nom de votre site Web
pour simplifier le développement Web sur le serveur XAMPP.
cliquer sur le
bouton Explorer
Cr é e r u n e Ba s e d e d o n n é e s
Pour créer une base de données, il faut lancer phpMyadmin en cliquant sur le bouton Admin.
Dans le menu horizontal , cliquez sur Bases de données
Cr é e r u n e Ba s e d e d o n n é e s
Choisissez le nom de votre base de données, puis sélectionner « utf8_bin » pour l’interclassement, puis cliquez sur Créer.
In s t a lla t io n d e W o r d P r e s s
e n lo c a l
http://localhost/nomdossier.
étape.
In s t a lla t io n d e W o r d P r e s s
e n lo c a l
In s t a lla t io n d e W o r d P r e s s
e n lo c a l
Pour construire le site en local, WordPress requiert un ensemble d'informations. Veuillez renseigner les données de la base
Une fois que vous avez terminé, appuyez sur "Soumettre" puis "Exécuter l'installation". Complétez les informations
supplémentaires requises, telles que le nom du site et les identifiants de connexion, puis cliquez sur le bouton "Installer
WordPress".
Co m m e n t Ac c é d e r
à Vo t r e S it e W e b
Pour vous connecter à votre site la prochaine fois, vous pouvez suivre ces
étapes :
La création de contenu fait référence au processus de production d'informations, d'éléments visuels, de vidéos, de
textes, d'audio et d'autres médias, dans le but de fournir des informations, de divertir, d'instruire, de communiquer ou
de susciter un intérêt auprès d'un public spécifique.
contenu est de répondre aux besoins, aux La création de contenu joue un rôle
individus ciblés.
Stratégie digitale
Il est important de commencer par analyser la situation en utilisant par exemple la matrice SWOT
Stratégie digitale Exemple:
Forces (S) :
Contenu de qualité: Si le site web propose un contenu informatif, utile et de grande qualité, cela peut attirer un public
fidèle.
Bonne expérience utilisateur: Une interface conviviale, une navigation intuitive et une conception réactive peuvent
améliorer l'expérience des utilisateurs.
Visibilité sur les moteurs de recherche: Si le site est bien optimisé pour les moteurs de recherche (SEO), il peut apparaître
dans les résultats de recherche, augmentant ainsi la visibilité.
Réseau de médias sociaux: Une forte présence sur les médias sociaux peut être un atout pour diriger le trafic vers le site
web.
Monétisation potentielle: La possibilité de générer des revenus grâce à la publicité, les ventes en ligne, ou d'autres
méthodes.
Stratégie digitale Exemple:
Fa ib le s s e s (W ) :
Manque de notoriété : Si le site est nouveau ou peu connu, il peut être difficile d'attirer du trafic au début.
Concurrence intense : Dans des niches populaires, la concurrence peut être féroce, ce qui rend difficile la distinction du
site.
Maintenance technique : Les mises à jour régulières, la gestion de la sécurité et d'autres aspects techniques peuvent être
une charge pour l'équipe du site.
Contenu obsolète : Le maintien de contenu actuel et pertinent peut être un défi, en particulier pour les sites web à fort
volume de contenu.
Problèmes de financement : Si le site dépend de la publicité ou de la génération de revenus, une baisse du trafic ou de la
demande publicitaire peut entraîner des difficultés financières.
Stratégie digitale Exemple:
Op p o r t u n it é s (O) :
Élargissement du public : En ciblant de nouveaux segments de marché ou en créant du contenu diversifié, le site peut
élargir son public.
Partenariats potentiels : Collaborer avec d'autres sites ou entreprises peut ouvrir de nouvelles opportunités de promotion
et de monétisation.
Tendances du marché : Identifier et capitaliser sur les tendances actuelles du marché peut permettre de rester pertinent
et attractif pour les utilisateurs.
Événements saisonniers : Profiter d'événements saisonniers ou d'occasions spéciales pour promouvoir le site.
Innovation technologique : L'adoption de nouvelles technologies, telles que l'intelligence artificielle ou la réalité virtuelle,
peut améliorer l'attrait du site.
Stratégie digitale Exemple:
Me n a c e s (T) :
Évolution des algorithmes de recherche : Les modifications dans les algorithmes de moteurs de recherche peuvent
affecter le classement du site et la visibilité.
Cyberattaques : Les menaces de sécurité en ligne, telles que les attaques par déni de service (DDoS), peuvent
compromettre la disponibilité du site.
Évolution de la législation : Les changements dans la réglementation en matière de confidentialité des données, de droits
d'auteur ou de commerce électronique peuvent avoir un impact sur le fonctionnement du site.
Instabilité économique : Les fluctuations économiques peuvent réduire la demande publicitaire ou les dépenses des
consommateurs, affectant ainsi les revenus du site.
Mauvaise réputation en ligne : Les commentaires négatifs, les critiques ou les controverses en ligne peuvent nuire à la
réputation du site.
Stratégie digitale