SlideShare une entreprise Scribd logo
Rapport projet tuteuré :
Actualisation de site WEB :
Outils : JOOMLA!
IUT DE BLAGNAC | DEPARTEMENT RESEAUX ET TELECOMMUNICATIONS
Client : Pierre-Louis QUEMIN
Tuteur pédagogique : Gaël MANSALIER
Binôme: Arnold Stéllio BOUNGOUNGOU - Yann BELEMA 2010-2011
2
Rapport projet tuteuré :
Actualisation de site WEB à l'aide de JOOMLA! Site
www.toy4raid.com
Client : Pierre-Louis QUEMIN
Tuteur pédagogique : Gaël MANSALIER
Binôme: Arnold BOUNGOUNGOU - Yann BELEMA 2010-2011
3
4
Sommaire
Sommaire...............................................................................................................................................5
Introduction............................................................................................................................................5
1. Présentation du travail à effectuer et du CMS Joomla !.....................................................................7
1.1 Présentation et analyse du cahier des charges :...........................................................................7
2- Utilisation de Joomla!.......................................................................................................................13
2.1 Concepts fondamentaux :.........................................................................................................13
2.2 Installation :................................................................................................................................19
3. Présentations et utilisations de différentes extensions :..................................................................21
3.1 Le forum :...................................................................................................................................21
3.2 Virtuemart (boutique en ligne) :.................................................................................................24
3.3 GAvick photoslide GK3* .............................................................................................................26
3.4 AdsManager (Petites annonces) :...............................................................................................27
3.6 Présentation générale de K2 :.....................................................................................................28
4-Analyse du trafic sur le site et génération de fonds :........................................................................33
5-Retour d’expérience :........................................................................................................................35
Conclusion :..........................................................................................................................................36
Glossaire...............................................................................................................................................38
Bibliographie :.......................................................................................................................................40
Web graphie :.......................................................................................................................................40
Introduction
Etudiants en deuxième année de DUT en Réseaux et Télécommunications à l’IUT Blagnac, il
est important de réaliser un projet tuteuré. Ce projet nous permet non seulement
5
d’approfondir quelques notions abordées au cours de notre formation, mais aussi de nous
préparer à la soutenance orale et à la rédaction du projet.
www.toy4raid.com « version 1 » est née en 2007 sous la forme d'un blog dédié à la passion
du 4x4, des rallyes-raids, et des Toyota.
Le blog s'est ensuite rapidement enrichi de rubriques nécessitant une gestion plus régulière
de son contenu. Le site à aujourd'hui a atteint un premier niveau de maturité, il compte
environ
200 visites par mois (source Xiti). Actuellement, l'outil utilisé pour l'administration et la
publication du site est TOWEB. Cet outil offre l'avantage d'une très grande facilité
d'utilisation mais atteint ses limites en termes de gestion de contenus et surtout de mise en
œuvre de nouvelles fonctionnalités.
Le but de ce projet est de rendre le site plus dynamique et de générer plus de trafic. Pour
cela nous devons travailler sur l’interactivité du site avec les internautes afin de susciter plus
de visites et en faisant des liens vers d’autres sites (notion portail) partenaires. Ensuite, nous
devons enrichir le site en nouvelles fonctionnalités, ce qui nécessite d’apporter plus de
contenus et de proposer plus de multimédia au site. Enfin nous devons disposer d’un
système de gestion de contenu plus évolué, et le choix de JOOMLA ! répond aux attentes de
la réalisation su projet du fait de sa composition modulaire et son interface d’administration
conviviale et instinctive. L’un des principaux objectifs du projet est d’apporter des
fonctionnalités plus avancées comme une boutique en ligne, afin de générer des revenus et
de rendre le site plus complet.
Dans un premier temps, on va présenter JOOMLA ! et parler de son choix par rapport à
l’évolution du site existant et à l’analyse du cahier des charges, ensuite nous poursuivrons
sur l’utilisation de JOOMLA ! en commençant par son installation sur un serveur choisi en
ligne et nous présenterons ensuite ses différents composants, modules et plug-in
permettant la gestion du site et enfin le choix du Template adapté à JOOMLA ! Nous
présenterons aussi le site dans sa structure et l’organisation de son contenu avant de finir la
présentation et l’utilisation de différentes extensions compatibles avec JOOMLA ! qui
apportent de nouvelles fonctionnalités au site et qui permettent sa dynamicité.
6
1. Présentation du travail à effectuer et du CMS
Joomla !
1.1 PRÉSENTATION ET ANALYSE DU CAHIER DES CHARGES :
Sujet : Actualisation d'un site WEB à l'aide de JOOMLA! Site www.toy4raid.com.
Pour mener ce projet nous allons utiliser le Composant JOOMLA ainsi que des modules
complémentaires (tels que VIRTUEMART* pour le e-commerce et KUNENA* pour le forum).
Le site www.toy4raid.com est un site qui existe déjà ; donc notre but est de le rendre le plus
dynamique tout en apportant des nouvelles fonctionnalités et des nouveaux modules :
• Forum: mise en place d'un forum avec médiation par le webmaster ; nous avons décidé de le
réaliser avec KUNENA* car se composants 'intègre très bien dans JOOMLA.
• Petites annonces : Identification nécessaire (nom, prénom, email, pseudo, mot de passe).
Donner aux internautes la possibilité de saisir leur annonce avec chargement de photos.
L'annonce est publiée après validation par le webmaster.
• Album photos et gallérie vidéos : pour que les utilisateurs puissent ajouter des photos et
vidéos sur le site ; les composants choisis sont alors hwdPhotoShare* et hwdVideoShare*.
• Plate forme de publicité plus évoluée : ce programme propose un revenu publicitaire.
• Boutique en ligne et boutiques partenaires : elle sera dédiée à des articles signés
toy4raid.com. Si le paiement se fait en ligne, il faut créer un paiement sécurisé avec tiers de
confiance. Boutique partenaire : L'idée est de permettre aux internautes d'acheter des
équipements et accessoires dédiés aux 4x4 Toyota, mais également des équipements typés
raids (matériels de déplantage, vêtements, petit matériel de camping, etc.). Différentes
possibilités seront offertes aux partenaires :
- Niveau 1, accord simple avec un partenaire.
- Niveau 2, Lien sur un article de la boutique du partenaire. Possibilité tracer l'achat par un
cookie et donc rémunération possible de toy4raid.com
– Niveau 3. Achat sur le site toy4raid, d'un article partenaire. Niveau de service et logistique.
Composant choisi pour développer la boutique en ligne est VIRTUEMART*.
7
Rappelons que l’ensemble des composants cités ci-dessus fera l’objet d’une étude plus approfondie
dans la suite de notre rapport, nous verrons comment ils agissent sur le site et quel est leur utilité.
1.2 Présentation de l'existant :
www.toy4raid.com est un site qui existe déjà et est présent sur la toile. C’est un site de rallye qui
traite des émotions, de la passion que procure le raid. Une certaine activité existe, et à du contenu
comme tout site ordinaire. Et ce de cette base que nous allons nous appuyé pour reconstruire le
nouveau site. Par exemple, nous allons conserver le logo du site mais aussi l’architecture du
contenu. Il s’agit entre autre des Catégories, Rubriques et la gestion des articles. Tous les noms des
rubriques et catégories seront réutilisés, et si possible en ajouté d’autres.
Le tableau ci-dessous montre comment le contenu était géré avant que nous ne commencions les
travaux.
Ce site a du contenu statique et le but est de le faire évoluer, tout en respectant les valeurs actuelles
du site.
Rappelons juste que : pour faire évoluer ce site nous allons partir de ‘zéro’ c'est-à-dire nous allons
travailler sur une autre plate-forme (parfois en local ou sur un autre hébergeur différent de celui où
le site est installé).
8
Après avoir fait l’état des lieux, nous allons maintenant présenter le principal élément qui va nous
permettre de mettre sur pied le nouveau site.
1.3-Présentation de Joomla!
« Joomla ! » fait partir des CMS (Content Management System) les plus utilisés dans le
monde du WEB, il vient juste en 3e position (derrière DRUPAL et WORDPRESS) dans le
concours de 2009 du meilleur CMS Open source* organisé par la société britannique Packt.
Toute une communauté développe et travail autour de Joomla ! et se trouve dans touts les
horizons du monde ; Ces derniers mettent en ligne leurs travaux et le partage avec tout le
monde.
Un CMS permet de créer du contenu (forum, boutique en ligne, galerie photos…), de
l'organiser en plusieurs catégories et de développer des fonctionnalités spécifiques sans
faire appel à des fortes connaissances en programmation. C’est ainsi que Joomla! Signifie en
swahili ‘le tous, tous ensemble’.
Partie Administration : C’est dans cette partie que le gros du travail se déroule ; la capture
ci-dessous présente la partie caché, où seul l’administrateur et des personnes autorisées ont
accès. Pour fixer les choses, nous allons présenter les différents onglets de la figure ci-
dessous enfin de s’habituer aux termes qui seront le plus souvent cité dans notre rapport.
9
L’onglet ‘Site’ permet d’accéder à la configuration générale du site, par exemple si l’on
souhaite mettre le signe en hors ligne, de créer des utilisateurs, gestion des médias, si l’on
souhaite mettre des images en ligne…
L’onglet ‘Menu’ permet de gérer l’ensemble des menus qui s’afficheront sur le site ‘partie
public). La capture ci-dessous montre les différents menus présents sur notre site et leurs
sous-onglets.
Une fois crée dans la partie administration, les différents menus sont visibles sur la partie
public (voir capture ci-dessous).
10
L’onglet ‘contenu’ va nous permettre de créer tout le contenu du site il s’agit en majorité des articles.
Mais ces articles doivent être classés dans un certain ordre notamment par thème enfin de s’y
retrouver et de bien présenter ce contenu aux personnes qui vont se connecter sur le site.
…
… …
…
Cet onglet ‘contenu’ va aussi nous permettre de sélectionner tous l’élément que l’on décide
d’afficher en page d’accueil et de créer les différents articles.
Notons que pour des soucis de présentations et de plusieurs options, nous avons ajouté un module
complémentaire K2 que nous développerons plus tard.
11
Article 1 Article 2 Article 3
Catégorie 1.1 Catégorie 1.2
Section 1
Article 1 Article 2
Les Graphiques ci-contre présentent comment
le contenu est relié.
En partant du bas du graphique, nous pouvons
remarquer que chaque article est relié à une
catégorie ; les catégories sont reliées à une
section.
Nous pouvons associer les sections à des
thèmes et des catégories à des sous thèmes.
Section 2
Catégorie 2.1 Catégorie 2.2
Article 3Article 2Article 1
Article 1
L’onglet « Composants» permet d’accéder à l’ensemble des composants (ceux présents à
l’installation de Joomla ! et ceux ajoutés). Le but du composant est de créer une application au sein du
système. Il permet d’aller très vite dans la réalisation d’un site web. Et ajoute des fonctionnalités.
L’onglet « Extensions* » va nous permettre de gérer et d’installer les plugins*, de charger et de choisir le
Template* par défaut.
L’onglet « Outils » c’est comme une boite mail ; dans laquelle on va envoyer et recevoir le message ; de
nettoyer de le cache* et de purger les fichiers expirés du cache*.
L’onglet « help » c’est pour l’aide.
Nous avons fait le tour sur les objets que nous allons utiliser, et présenter en général joomla ! enfin de
faciliter la compréhension de la suite.
Après avoir fait le tour du travail à exécuter et présenter Joomlà ! de manière succincte, nous allons
maintenant voir comment il s’utilise.
12
2- Utilisation de Joomla!
2.1 Concepts fondamentaux :
On présente dans cette partie la structure fonctionnelle d’un Système de Gestion de
Contenu Web (CMS) en nous basant sur Joomla !
 Frontend (Frontal) et backend :
Un Système CMS se base sur le couple Frontend et Backend. Le Frontend (partie vitrine)
consiste en la page d’accueil et toutes les autres pages du site telles que les voient les
visiteurs et les utilisateurs identifiés.
Exemple : Page d’accueil du site
Le Backend (partie arrière-boutique) contient l’interface de gestion des pages par
l’administrateur. Les activités de Backend comprennent la configuration, la maintenance, la
création des statistiques et des nouveaux contenus. Le Backend est située à une adresse
13
http://projet 4toy.harmonieslash.com
Web différente de la page d’accueil du site (donc du Frontend), dans notre cas :
http://projet4toy.harmonieslash.com/administrator illustrée par la figure suivante.
 Droits d’accès
Dès que l’on parle d’administration, il faut introduire des règles pour garantir l’utilisation
organisée des ressources disponibles : ce sont les droits d’accès. Dans un CMS*, toutes les
personnes concernées se voient attribuer un identifiant (nom d’utilisateur) et un profil
d’accès y est associé. Cohabitent ainsi des utilisateurs simplement reconnus, des créateurs et
correcteurs de contenus qui ont plus de droits et un ou plusieurs administrateurs, qui ont
accès à tout. Selon le profil de droits d’accès, la page d’accueil du site se présente
différemment ou bien l’utilisateur bénéficie d’une interface d’administration distincte de la
page d’accueil.
14
http://projet4toy.harmonieslash.com/administrator
Interface de connexion à l’administration Joomla !
Interface administration présentant la gestion des différents types d’utilisateurs
15
 Contenus :
Les contenus peuvent prendre des formes très diverses : fichiers textes, liens, images,
fichiers audio, données extraites d’une application comme Google Maps ou une
combinaison de ces éléments. Pour que la gestion de tous ces contenus soit simplifiée, ils
sont systématiquement intégrés à des structures d’accueil. Les textes sont ainsi répartis dans
les catégories. Ces catégories consistent elles aussi à des contenus qui doivent être
administrables. On peut s’abonner à ces différents types de contenu.
 Extentions
Les composants, modules, Template et plugins sont réunis sous le terme collectif
« extensions ». Ils apportent les enrichissements fonctionnels par rapport à ce que propose
le noyau de Joomla !
 Template
Sorte de modèle visuel prêt à recevoir des contenus. Il détermine les couleurs, les polices, les
tailles de caractères, l’image d’arrière-plan, les espacements et la distribution des sous-
éléments d’une page. Un Template réunit au moins un fichier HTML décrivant la structure
de la page et un fichier CSS décrivant les styles d’affichage. Un Template peut être beaucoup
plus complexe et rendre c'est-à-dire afficher des données de Joomla ! accessibles de
multiples manières.
 Plugins :
Un plugin est un bloc de code qui vient se brancher en un point de l’infrastructure de
Joomla ! pour en modifier le fonctionnement. Vous pouvez par exemple utiliser un plugin
dans un contenu pour charger le contenu d’un module dans un texte. Pour pouvoir étendre
16
la fonction de recherche d’un site Web à un composant supplémentaire, il faut lui associer
un plugin.
En exemple un moteur de recherche qui va directement indexer le contenu des articles (côté
administration):
 Modules
Ce sont des outils qui définissent l’affichage et le positionnement des contenus gérés par les
composants et les plugins. Si on installe un composant qui gère la boutique en ligne du site Web, on
peut utiliser et positionner un module qui fera appel aux données gérées par ce composant et
définira son affichage et son positionnement sur le site.
17
Permet la recherche
dans tous les articles
 Composants :
Ce sont des extensions qui permettent de construire de A à Z des fonctionnalités métiers
comme un gestionnaire de formation, un gestionnaire candidature web ou encore une
newsletter.
18
Affichage du contenu de
virtuemart dans un module
2.2 Installation :
L’installation de Joomla ! ne prend qu’une dizaine de minutes la première fois. Pour cette
installation, il faut d’abord mettre en place localement une sorte d’internet privé réunissant un
serveur Web, avec support du langage PHP, et un système de gestion de bases de données (SGBD)
exploitable per Joomla !.
Les dossiers de Joomla ! seront ensuite installés dans cette structure de données puis configurés via
un installateur à interface Web. Il s’agit d’un exemple typique d’environnement client-serveur.
Interface web d’installation de Joomla ! sur le serveur
Pour mettre en ligne le site il faut acheter un nom de domaine permettant d’identifier le site sur
internet. Pour avoir un nom de domaine il faut se connecter sur un hébergeur connecté 24/24 à
internet, c’est sur cet hébergeur qu’on va ensuite installer Joomla !.
Dans notre projet on dispose de tous ces services sur notre hébergeur en ligne qui est 1&1.
19
Site 1&1.
 Déroulement d’un accès à un site Web Joomla !
Pour vous faire une idée générale de ce qui se passe en coulisses, voici les étapes successives
de l’accès d’un ordinateur client à un site Web propulsé par Joomla !:
1. Etablissement d’une connexion Internet via un fournisseur d’accès.
2. On saisie l’adresse Web (URL) on entre en contact avec le serveur Web
3. Le serveur Web retransmet une requête à son interpréteur PHP qui, après avoir
exécuté les commandes appropriées à Joomla !, envoie les données d’entrée à la
base de s données et génère un code d’habillage HTML, qui sera envoyé par le
serveur Web au navigateur du client.
4. Le navigateur interprète les balises de style HTML et CSS et intègre les données
externe en allant les chercher un à un auprès du serveur Web.
Plusieurs d’entre ces étapes ne concernent pas Joomla ! lui-même.
Maintenant nous savons comment Joomla ! fonctionne, un problème se pose car il est très
limité il faudrait dans ce cas ajouter des extensions pour avoir des fonctionnalités très
intéressantes.
20
3. Présentations et utilisations de différentes
extensions :
Pour satisfaire les besoins spécifiés dans le cahier des charges, on est amené à utiliser un
certains nombre d’extensions Jommla ! afin d’apporter de nouvelles fonctionnalités au futur
site Web.
3.1 Le forum :
KUNENA est un composant de forum pour Joomla!. Intégrer un forum dans Joomla ! a
toujours été possible mais n’a jamais été très facile, souvent nécessitant l’utilisation de
bridges pour connecter Joomla ! aux forums biens établis. Le nom Kunena est un mot venant
du Swahili qui signifie, "parler". Il est dérivé de l'ancien forum Fireboard avec de nouveaux et
précédents développeurs ce qui inclut quelques développeurs du core de Joomla!. Les
développeurs ont un but à long terme qui est de concevoir Kunena depuis zéro pour tirer
pleinement parti de ce que Joomla ! a à offrir.
Panneau de contrôle du forum KUNENA
KUNENA constitue donc un excellent forum de discussion disposant de nombreuses
possibilités :
21
- création de catégories et de sous-catégories :
KUNENA dispose d’une gestion intégrée de contenus dont l’affichage est pris en charge
principalement par les modules du Template ; en effet KUNENA est un composant qui
dispose de toutes les fonctionnalités possibles pour gérer non seulement le contenu mais
aussi l’affichage du contenu et cela en utilisant le corps du Template de base :
En rouge : l’interface d’accueil du forum KUNENA
- gestion de forums multiples avec droit d’accès :
L’une des fonctionnalités majeures de ce projet est d’intégrer le système des droits
d’accès non seulement sur le forum mais aussi sur le site lui-même pour gérer l’accès de
différents utilisateurs.
22
En rouge : la zone d’identification des utilisateurs du forum
- profils des utilisateurs et avatars :
Les profils des utilisateurs et avatars permettent une interactivité avec le déroulement du
site et aussi entre les utilisateurs :
En rouge : zone indiquant le profil du visiteur
- téléchargements des fichiers et d’images avec les messages.
L’interactivité entre les visiteurs se voit aussi à travers le fait qu’ils peuvent commenter des
sujets postés par les autres et télécharger quelques fichiers comme des images :
23
Figure illustrant la création d’un nouveau sujet dans le forum
Après l’installation du forum, qui est très simple, les fichiers du composant ont été distribués
dans les sous-dossiers appropriés. Et donc une fois le composant mis en place et quelques
opérations de configuration minimale, il ne reste plus qu’à mettre en page le forum de
discussion.
Notons que KUNENA possède une telle richesse de paramétrage que nous pourrions y
consacrer plusieurs chapitres.
3.2 Virtuemart (boutique en ligne) :
Choix des outils :
La boutique en ligne est l’une des évolutions majeure du site car cette boutique va permettre dans
un futur proche ou lointain, et selon les besoins de notre client d’avoir un espace où les internautes
pourront passer directement les commandes via paypal ou un autre moyen de payement en ligne.
Après étude faite et en accord avec notre client, nous avons décidé d’utiliser Paypal.
Pour ce faire, il a fallut installer une extension permettant de gérer cette boutique : VIRTUEMART*.
En annexe, nous verrons comment installer Virtuemart.
Virtuemart* est constitué de composant et plugins qu’il faut activer enfin de profiter de toutes ses
fonctionnalités. Il s’agit entre autre de :
• Vi rtueMart Module : ce module permet de faire de la recherche des produits tout
en affinant son choix (par taille, couleur, prix croissant, décroissant).
24
• VirtueMart Shopping Cart : ce module permet de voir l'état du panier.
• VirtueMart Product Categories : module permettant de classer les articles vendues
par catégorie.
• virtueMart login : pour la connexion sur la boutique.
En plus de ces modules il est nécessaire d’ajouter des plugins orienté recherche ; il s’agit
de :
• VirtueMart Product Snapshot.
• Virtuemart Extended Search Plugin.
Après avoir choisi les outils qui devront nous permettre de réaliser la boutique, il faut
maintenant passer à la configuration de cette dernière.
Pour cela il nous faut le nom de la boutique (boutique toy4raid) ; son adresse ; le numéro de
téléphone et l’email ; la catégorie d’articles vendu sur le site, dans notre cas nous avons
juste une catégorie (Chemise) et un seul type de produit (Chemise).
Une fois toutes les configurations faites, il faut maintenant créer l’article présentant le
produit vendu et ainsi l’utilisateur pour faire son achat et avoir une solution Paypal pour le
règlement.
Pour l’instant nous n’allons pas utiliser cette solution car l’utilisateur sera directement
redirigé vers un site partenaire.
Une fois ce travail fait nous pouvons admirer le rendu sur le site, l’utilisateur peu ainsi voir l’offre qui
lui est proposée ainsi que les critères de la chemise. Et un lien de redirection vers le site partenaire
(http://www.koulala-vetements.com/acheter-vetements-koulala-chemise-toy4raid-
2,1,7,1,0,65.htm).
25
3.3 GAvick photoslide GK3*
Est le module qui permet d’afficher le diaporama des photos dans la partie header ; Enfin de le faire
fonctionner il faut au préalable créer un ‘GROUP’ puis des ‘Slides’ ; Dans notre cas le groupe c’est
‘Header_diapo’ qui affiche les images contenues dans les slide 1,2,3.
26
3.4 AdsManager (Petites annonces) :
Cette extension va permettre à un utilisateur de pouvoir passer son annonce en ligne directement,
entrer le texte et les photos adéquates.
C’est l’une évolution que nous avons apportée, car sur l’ancienne version du site, l’utilisateur
envoyait son annonce à l’administrateur par mail. L’avantage ici est que tout le monde gagne en
temps car aussitôt l’annonce postée, elle apparait en ligne et l’administrateur joue juste le rôle de
modérateur.
Les petites annonces sont aussi classées par catégorie principe très cher à joomla ! Cela va
permettre De faire des recherches par catégorie et de bien classer les annonces ; cette technique est
très avantageuse, car nous pourrions avoir plusieurs annonces tout en se retrouvant facilement.
L’utilisateur peut voir toutes ses annonces et le modifier à chaque fois.
3.5 hwdPhotoShare Photos :
hwdPhotoShare est une galerie de photos Joomla ! qui permet d'afficher des images organisées qui
peuvent être partagées entre les utilisateurs sur Internet. hwdPhotoShare peut manipuler l'image en
la redimensionnant. Les images peuvent être transférées par l’utilisateur lui même.
Des commentaires peuvent être mis sur les photos.
Création des catégories afin de regrouper les photos mis sur le site par les utilisateurs.
27
Catégories crées :
• Paysage
• Faune et Flore
• Aventure
• Abstract
• Architecture
• Voitures
• Sport & Loisirs
• Autres
3.6 Présentation générale de K2 :
De toutes les extensions utilisées, K2 est le plus important car, il va nous permettre de gérer tout le
contenu du site. Rappelons que le contenu peut être géré directement avec Joomla ! mais nous
serons limités dans la présentation du contenu.
K2 est une extension pour Joomla! 1.5 composant de gestion de contenu conçu pour Joomla! et
développer par JoomlaWorks* (créateurs d'extension Joomla! depuis 2006). K2 évolue très souvent.
Il fournit une solution intégrée avec des formulaires élaborés contenu pour les articles (Exemples
article Joomla! avec champs supplémentaires pour les images, vidéos, galeries d'images et des pièces
jointes), Imbrication de catégories, étiquettes, commentaires, un puissant plugin API pour étendre le
contenu, catégorie et les formulaires utilisateurs.
Force de K2 :
Utilisé K2, permet de transformer son site Joomla! en site d'actualités, magazine avec des blogs par
auteur, catalogues de produits, portfolio*, base de connaissances, téléchargement/gestionnaire de
documents, annuaire, liste d'événements et plus encore, et tout ça, regroupées sous un seul paquet!
Étant donné que K2 est extensible avec des champs supplémentaires, K2 permet aussi de créer des
catégories spécifiques aux types de contenu, par exemple article, blog, page produit, liste d'annuaire.
De plus les paramètres de chaque catégorie peuvent être hérités d'une autre catégorie, ce qui
permet de conserver facilement une cohérence de votre affichage.
K2 possède également un système de tags simple d'utilisation vous permettant d'afficher vos articles
par tags. Vous pouvez créer vos propres groupes, auquel vous assigné des droits et les informations
des utilisateurs sont plus complètes vous permettant par exemple de créer des fiches auteurs.
Enfin, le composant K2 intègre également un système de commentaire avec captcha et validation
manuelle.
Comment avons nous utilisé K2 pour la mise en place du site ?
28
Après avoir créé les catégories et section sur joomla ! il faut les exporter vers K2 (voir en annexe).
L’affichage des blocs en page d’accueil :
Tableau à collé toute la page
29
(**) Nom du module dans la partie administration de Joomla !
Le schéma ci-dessus nous montre que K2 est très présent sur le site et contribue énormément à
l’esthétique et la présentation du contenu, à travers la gestion du contenu par K2, l’utilisateur
navigue aisement. Exemple de capture du site :
30
Gestion d’articles avec K2 :
L’une des forces de K2 se trouve dans la manière dont il permet de créer les articles. Possibilité
d’intégrer une vidéo directement dans l’article, d’insert des fichiers à télécharger, d’intégrer des
musiques en différent format. Il propose aussi à l’utilisateur de pouvoir télécharger la page en
format PDF ou de l’imprimer. L’article peut aussi être publié sur les différents réseaux sociaux tels
que Facebook. K2 permet aussi de gérer les commentaires concernant l’article.
31
Après cette partie, le site est en fait près et a tous les modules et composants
nécessaires, il va maintenant falloir faire l’audit du trafic et trouver des solutions
pour que le site nous génère des fonds. C’est toute l’utilité de la partie suivante.
32
4-Analyse du trafic sur le site et génération de
fonds :
Une fois le site mis en ligne ; il est très important de savoir le trafic enfin de mieux ciblé son contenu
et innové en matière des services proposés sur le site. Car c’est cela qui permettra au site de vivre.
C’est dans cette optique que le client a choisit de suivre l’évolution de sont trafic avec XITI. C’est
l’une des moyens le plus utilisé dans le monde du web pour faire de l’audience.
Parmi les fonctionnalités de XITI on retrouve :
Tableau de bord synthétique qui permet d’indiquer la santé du site.
Comportement des visiteurs (principaux critères d'intérêt, acquisition et fidélisation des visiteurs,
heures de connexion).
Géo localisation exacte : continents, pays, régions (service fourni exclusivement par XITI).
Sources (naturelles et marketings : accès directs, emails, sites affluents, bannières).
Référencement (moteurs de recherche, mots clés, liens sponsorisés).
Technique (compatibilité du site avec l’équipement des visiteurs : navigateurs, os, écrans, vitesse de
connexion etc.)
Arborescence (classification automatique des pages en chapitre, marquage simple et rapide)
Diffusion des rapports en format PDF, exports Excel, CSV et XML.
Administration gestion des droits utilisateurs, surveillance ou exclusion de visiteurs par adresse IP
ou par cookie.
Support client FAQ, aides en ligne, support technique par email et téléphone.
Le client souhaite aussi que le site lui généré des fonds, dans ce cadre il s’est abonné au programme
Google Adsens ; c’est un programme pour de la publicité qui est mis automatiquement en ligne par
Google Adsens. Pour que les bannières de publicités s’affichent sur le site, il faut au préalables
installer une extension ‘google adsens pour joomla !’ et indiquer l’endroit où les modules
s’afficheront. Dans notre cas nous avons choisi d’afficher les bannières aux endroits suivants :
‘top’ et ‘left’ comme nous pouvons le voir dans la capture ci-dessous.
33
34
5-Retour d’expérience :
Ce projet a été bénéfique pour nous et nous a permis de prolonger les connaissances
acquises en cours notamment sur les notions de Php, Mysql, CSS et bien d’autres encore.
Nous avons utilisé la totalité des notions abordées, même si souvent on ne se rendait pas
parfois compte que là on utilisait une notion bien précise, par exemple dans l’administration
Joomla !.
Le challenge était grand pour nous, car il ne s’agissait plus de faire un compte rendu de TP
personnel mais plutôt de mener un projet pour un client qui avait défini un cahier de charge
qu’il fallait respecter. Nous avons donc été méthodiques tout au long du projet et avons pu
acquérir des compétences dans la mise en place d’un projet.
Malgré des difficultés rencontrées lors de l’immigration du site ou lors de l’hébergement sur
www.freehostingcloud.com (le site a été supprimé) et bien d’autres encore, le travail
attendu par le client a été respecté, toutes les fonctionnalités désirées ont été ajoutées, on a
pu finir le projet dans les temps et le travail réalisé correspond aux attentes du client, M
Pierre Louis Quemin.
Enfin nous remercions M. Gaël MANSALIER, notre tuteur de projet tuteuré et enseignant
dans les modules d’informatique et réseaux, qui nous a beaucoup guidé en nous aidant à
bien répartir notre temps de travail et de bien organiser notre plan de travail, ainsi que
quelques informations techniques et des livres nous permettant de mener à bien le projet.
Ensuite nous remercions le client, M Pierre Louis Quemin qui a bien spécifié son besoin
permettant d’avancer vite dans la réalisation du projet. Enfin nous remercions Mme Danielle
CABALLERO qui nous a permis de rédiger le support écrit de notre projet.
35
Conclusion :
JOOMLA ! est la solution adaptée à notre projet car il offre toutes les fonctionnalités dont on a eu
besoin pour réaliser notre site. En effet la composition modulaire de JOOMLA ! permet une mise en
œuvre facile et intuitive d’un site Web dans sa configuration. De plus on peut importer, au besoin,
des extensions au noyau de JOOMLA ! afin de rendre plus dynamique le site et de lui apporter plus
de fonctionnalités ; même si on est parfois amené à retoucher de façon importante les composants
pour pouvoir les adapter aux besoins. La réalisation de ce site a été un succès de l’utilisation de
JOOMLA ! comme CMS.
36
37
Glossaire
CMS : Content Management System (en français Content Management System ou CMS) est une
famille de logiciels destinés à la conception et à la mise à jour dynamique de site Web ou
d'application multimédia.
Open Source : Logiciel dont le code source peut être modifier et redistribuer librement.
Section : Regroupe l’ensemble des catégories et les classes par thèmes.
Catégorie : Regroupe l’ensemble des articles à appartenant à un même thème.
Extensions : Les composants, modules, Templates et plugins sont réunis sous le terme
collectif « extensions ». Ils apportent des enrichissements fonctionnels par rapport à ce que
propose le noyau de Joomla !
KUNENA : Un composant de forum natif pour Joomla! 1.5.x ce qui vous autorise à déployer
rapidement un forum communautaire sur votre site web basé sur Joomla!.
VIRTUEMART : Extension permettant de monter une boutique en ligne, avec moyens de
payement via paypal.
Template : Sorte de gabarit visuel prêt à recevoir des contenus. Il détermine les couleurs, les
polices, les tailles de caractère, l’image d’arrière plan, les espacements et les distributions
des éléments d’une page : il constitue donc une mise en page. Un Template contient au
moins un fichier HTML décrivant la structure de la page, et un fichier CSS décrivant les styles
d’affichage.
Plugin : c’est un bloc de code qui vient se brancher en un point précis de l’infrastructure de
Joomla! Pour en modifier le fonctionnement.
hwdPhotoShare : est un composant autorisant la publication et le partage des photos sur les sites
communautaires Joomla !. Ce composant, d'une extrême puissance.
hwdVideoShare : est un composant autorisant la publication et le partage de vidéos sur les sites
communautaires Joomla !. Ce composant, d'une extrême puissance, n'est pas particulièrement
simple à prendre en main et se configurer correctement.
K2 :
JoomlaWorks : groupe des créateurs d'extension Joomla !
Portfolio : le portfolio regroupe les travaux, les recherches, synthèses d’une personne. C’est
un objet précieux et valorisant qui peut être représenté sous forme de site web.
38
Captcha : Un captcha est une forme de test de Turing permettant de différencier de manière
automatisée un utilisateur humain d'un ordinateur.
39
Bibliographie :
• JOOMLA ! 1.5 3e
édition Hagen Graf, élu meilleur CMS Open Source PHP 2007, et troisième.
en 2009
• Joomla 1.5 et VirtueMart 1.1 Réussir sa boutique en ligne: 2ème
édition.
Web graphie :
• www.joomla!.fr
• www.joomlabc.com
• www.virtuemart.fr
• www.kunena.org
• www.getk2.org
40

Contenu connexe

Tendances

Cahier des charges web
Cahier des charges webCahier des charges web
Cahier des charges web
Fred Brouard
 
Modèle cahier des charges site web
Modèle cahier des charges site webModèle cahier des charges site web
Modèle cahier des charges site web
JEAN-GUILLAUME DUJARDIN
 
Modèle de cahier des charges web
Modèle de cahier des charges webModèle de cahier des charges web
Modèle de cahier des charges web
Forestier Mégane
 
Comment bien rédiger le cahier des charges pour construire votre site interne...
Comment bien rédiger le cahier des chargespour construire votre site interne...Comment bien rédiger le cahier des chargespour construire votre site interne...
Comment bien rédiger le cahier des charges pour construire votre site interne...
echangeurba
 
La gestion de projet web en 15 étapes
La gestion de projet web en 15 étapesLa gestion de projet web en 15 étapes
La gestion de projet web en 15 étapes
Rodolphe Finamore
 
Cahier des charges modèle gratuit - préparez votre projet web facilement !
Cahier des charges modèle gratuit - préparez votre projet web facilement !Cahier des charges modèle gratuit - préparez votre projet web facilement !
Cahier des charges modèle gratuit - préparez votre projet web facilement !
Valls y Machinant David - Auteur sur : Carrefourdesreussites.com
 
Competitic : Cahier des charges site web
Competitic : Cahier  des charges site web Competitic : Cahier  des charges site web
Competitic : Cahier des charges site web
COMPETITIC
 
Rédaction d'un cahier des charges web
Rédaction d'un cahier des charges webRédaction d'un cahier des charges web
Rédaction d'un cahier des charges web
Forestier Mégane
 
Site internet nantes - ACIH
Site internet nantes - ACIHSite internet nantes - ACIH
Site internet nantes - ACIH
Agence_ACIH
 
Rédiger un bon cahier des charge pour développer son site Web, conférence Avi...
Rédiger un bon cahier des charge pour développer son site Web, conférence Avi...Rédiger un bon cahier des charge pour développer son site Web, conférence Avi...
Rédiger un bon cahier des charge pour développer son site Web, conférence Avi...
Semaweb
 
Site internet cahier des charges
Site internet cahier des chargesSite internet cahier des charges
Site internet cahier des charges
Jennifer Pône
 
Entrez dans l'E-Tourisme 2012
Entrez dans l'E-Tourisme 2012Entrez dans l'E-Tourisme 2012
Entrez dans l'E-Tourisme 2012
Jacqueline Quardon
 
Création de site web : comment bien gérer son projet
Création de site web : comment bien gérer son projetCréation de site web : comment bien gérer son projet
Création de site web : comment bien gérer son projet
Lilian FOURCADIER
 
Prédiagnostic site Internet
Prédiagnostic site InternetPrédiagnostic site Internet
Prédiagnostic site Internet
CCI 21
 
Determiner son besoin et definir ses objectifs pour son projet de site web
Determiner son besoin et definir ses objectifs pour son projet de site webDeterminer son besoin et definir ses objectifs pour son projet de site web
Determiner son besoin et definir ses objectifs pour son projet de site web
Matthieu Tran-Van
 
Synodiance > Formation SEO avec les experts du digital - 07/09/2013
Synodiance > Formation SEO avec les experts du digital - 07/09/2013 Synodiance > Formation SEO avec les experts du digital - 07/09/2013
Synodiance > Formation SEO avec les experts du digital - 07/09/2013
Search Foresight
 
Outil d'aide à la rédaction d'un cahier des charges (2006)
Outil d'aide à la rédaction d'un cahier des charges (2006)Outil d'aide à la rédaction d'un cahier des charges (2006)
Outil d'aide à la rédaction d'un cahier des charges (2006)
Ardesi Midi-Pyrénées
 
Comment bien rédiger le Cahier des charges de votre site web
Comment bien rédiger le Cahier des charges de votre site webComment bien rédiger le Cahier des charges de votre site web
Comment bien rédiger le Cahier des charges de votre site web
polenumerique33
 
Comment rédiger un cahier des charges de site web
Comment rédiger un cahier des charges de site webComment rédiger un cahier des charges de site web
Comment rédiger un cahier des charges de site web
Semaweb
 
Comment optimiser la Création ou la refonte de son site internet ?
Comment optimiser la Création ou la refonte de son site internet ?Comment optimiser la Création ou la refonte de son site internet ?
Comment optimiser la Création ou la refonte de son site internet ?
Office de Tourisme Val de Cher Controis
 

Tendances (20)

Cahier des charges web
Cahier des charges webCahier des charges web
Cahier des charges web
 
Modèle cahier des charges site web
Modèle cahier des charges site webModèle cahier des charges site web
Modèle cahier des charges site web
 
Modèle de cahier des charges web
Modèle de cahier des charges webModèle de cahier des charges web
Modèle de cahier des charges web
 
Comment bien rédiger le cahier des charges pour construire votre site interne...
Comment bien rédiger le cahier des chargespour construire votre site interne...Comment bien rédiger le cahier des chargespour construire votre site interne...
Comment bien rédiger le cahier des charges pour construire votre site interne...
 
La gestion de projet web en 15 étapes
La gestion de projet web en 15 étapesLa gestion de projet web en 15 étapes
La gestion de projet web en 15 étapes
 
Cahier des charges modèle gratuit - préparez votre projet web facilement !
Cahier des charges modèle gratuit - préparez votre projet web facilement !Cahier des charges modèle gratuit - préparez votre projet web facilement !
Cahier des charges modèle gratuit - préparez votre projet web facilement !
 
Competitic : Cahier des charges site web
Competitic : Cahier  des charges site web Competitic : Cahier  des charges site web
Competitic : Cahier des charges site web
 
Rédaction d'un cahier des charges web
Rédaction d'un cahier des charges webRédaction d'un cahier des charges web
Rédaction d'un cahier des charges web
 
Site internet nantes - ACIH
Site internet nantes - ACIHSite internet nantes - ACIH
Site internet nantes - ACIH
 
Rédiger un bon cahier des charge pour développer son site Web, conférence Avi...
Rédiger un bon cahier des charge pour développer son site Web, conférence Avi...Rédiger un bon cahier des charge pour développer son site Web, conférence Avi...
Rédiger un bon cahier des charge pour développer son site Web, conférence Avi...
 
Site internet cahier des charges
Site internet cahier des chargesSite internet cahier des charges
Site internet cahier des charges
 
Entrez dans l'E-Tourisme 2012
Entrez dans l'E-Tourisme 2012Entrez dans l'E-Tourisme 2012
Entrez dans l'E-Tourisme 2012
 
Création de site web : comment bien gérer son projet
Création de site web : comment bien gérer son projetCréation de site web : comment bien gérer son projet
Création de site web : comment bien gérer son projet
 
Prédiagnostic site Internet
Prédiagnostic site InternetPrédiagnostic site Internet
Prédiagnostic site Internet
 
Determiner son besoin et definir ses objectifs pour son projet de site web
Determiner son besoin et definir ses objectifs pour son projet de site webDeterminer son besoin et definir ses objectifs pour son projet de site web
Determiner son besoin et definir ses objectifs pour son projet de site web
 
Synodiance > Formation SEO avec les experts du digital - 07/09/2013
Synodiance > Formation SEO avec les experts du digital - 07/09/2013 Synodiance > Formation SEO avec les experts du digital - 07/09/2013
Synodiance > Formation SEO avec les experts du digital - 07/09/2013
 
Outil d'aide à la rédaction d'un cahier des charges (2006)
Outil d'aide à la rédaction d'un cahier des charges (2006)Outil d'aide à la rédaction d'un cahier des charges (2006)
Outil d'aide à la rédaction d'un cahier des charges (2006)
 
Comment bien rédiger le Cahier des charges de votre site web
Comment bien rédiger le Cahier des charges de votre site webComment bien rédiger le Cahier des charges de votre site web
Comment bien rédiger le Cahier des charges de votre site web
 
Comment rédiger un cahier des charges de site web
Comment rédiger un cahier des charges de site webComment rédiger un cahier des charges de site web
Comment rédiger un cahier des charges de site web
 
Comment optimiser la Création ou la refonte de son site internet ?
Comment optimiser la Création ou la refonte de son site internet ?Comment optimiser la Création ou la refonte de son site internet ?
Comment optimiser la Création ou la refonte de son site internet ?
 

En vedette

PROJET JAVA BD MySQL
PROJET JAVA BD MySQLPROJET JAVA BD MySQL
PROJET JAVA BD MySQL
Wilfried Tiani
 
Le guide d'administration d'un site sous joomla3
Le guide d'administration d'un site sous joomla3Le guide d'administration d'un site sous joomla3
Le guide d'administration d'un site sous joomla3
Com'3elles - www.com3elles.com
 
Worshop création d'un site web pour une exposition virtuelle
Worshop création d'un site web pour une exposition virtuelleWorshop création d'un site web pour une exposition virtuelle
Worshop création d'un site web pour une exposition virtuelle
Johanna Daniel
 
Workshop création de sites web avec Wordpress (master CIMER, Paris IV Sorbonne)
Workshop création de sites web avec Wordpress (master CIMER, Paris IV Sorbonne)Workshop création de sites web avec Wordpress (master CIMER, Paris IV Sorbonne)
Workshop création de sites web avec Wordpress (master CIMER, Paris IV Sorbonne)
Johanna Daniel
 
L'Union Personnelle et un Plan d'Aide pour la Wallonie (Schéma)
L'Union Personnelle et un Plan d'Aide pour la Wallonie (Schéma)L'Union Personnelle et un Plan d'Aide pour la Wallonie (Schéma)
L'Union Personnelle et un Plan d'Aide pour la Wallonie (Schéma)
Hendrik Bogaert
 
software libre
software libresoftware libre
software libre
guest793e1c
 
Module introduction innovation session1
Module introduction innovation session1Module introduction innovation session1
Module introduction innovation session1
Sabri MOURAD
 
Aceros (tp edi)
Aceros (tp edi)Aceros (tp edi)
Aceros (tp edi)
I.S.F.T N°118
 
Ava
AvaAva
Nuevas alternativas de prevención de VIH/SIDA: Antiretrovirales y Prevención
Nuevas alternativas de prevención de VIH/SIDA: Antiretrovirales y PrevenciónNuevas alternativas de prevención de VIH/SIDA: Antiretrovirales y Prevención
Nuevas alternativas de prevención de VIH/SIDA: Antiretrovirales y Prevención
Embajada de EE.UU. en el Perú
 
Relaciones de poder que sufren las mujeres
Relaciones de poder que sufren las mujeresRelaciones de poder que sufren las mujeres
Relaciones de poder que sufren las mujeres
Gobernabilidad
 
Tp arquitectura del barroco
Tp arquitectura del barrocoTp arquitectura del barroco
Tp arquitectura del barroco
Segundo
 
Diaporama Peuplade
Diaporama PeupladeDiaporama Peuplade
Diaporama Peuplade
julie
 
Le Jeu du 21e Siecle
Le Jeu du 21e SiecleLe Jeu du 21e Siecle
Le Jeu du 21e Siecle
Phil Steinberg
 
Seguridad en la Cadena de Suministros.pptx
Seguridad en la Cadena de Suministros.pptxSeguridad en la Cadena de Suministros.pptx
Seguridad en la Cadena de Suministros.pptx
Embajada de EE.UU. en el Perú
 
Unidad 1
Unidad 1Unidad 1
Unidad 1
Milenys Jimenez
 
Introduction Twitter (in french)
Introduction Twitter (in french)Introduction Twitter (in french)
Introduction Twitter (in french)
Jean-Francois Catz
 
Journee etude montpellier_bl
Journee etude montpellier_blJournee etude montpellier_bl
Journee etude montpellier_bl
Agrodoc Ouest
 
Les effets de la loi hamon
Les effets de la loi hamonLes effets de la loi hamon
Les effets de la loi hamon
Christophe Villeneuve
 
Fotos De Ginkgo
Fotos De GinkgoFotos De Ginkgo
Fotos De Ginkgo
guest5606dd
 

En vedette (20)

PROJET JAVA BD MySQL
PROJET JAVA BD MySQLPROJET JAVA BD MySQL
PROJET JAVA BD MySQL
 
Le guide d'administration d'un site sous joomla3
Le guide d'administration d'un site sous joomla3Le guide d'administration d'un site sous joomla3
Le guide d'administration d'un site sous joomla3
 
Worshop création d'un site web pour une exposition virtuelle
Worshop création d'un site web pour une exposition virtuelleWorshop création d'un site web pour une exposition virtuelle
Worshop création d'un site web pour une exposition virtuelle
 
Workshop création de sites web avec Wordpress (master CIMER, Paris IV Sorbonne)
Workshop création de sites web avec Wordpress (master CIMER, Paris IV Sorbonne)Workshop création de sites web avec Wordpress (master CIMER, Paris IV Sorbonne)
Workshop création de sites web avec Wordpress (master CIMER, Paris IV Sorbonne)
 
L'Union Personnelle et un Plan d'Aide pour la Wallonie (Schéma)
L'Union Personnelle et un Plan d'Aide pour la Wallonie (Schéma)L'Union Personnelle et un Plan d'Aide pour la Wallonie (Schéma)
L'Union Personnelle et un Plan d'Aide pour la Wallonie (Schéma)
 
software libre
software libresoftware libre
software libre
 
Module introduction innovation session1
Module introduction innovation session1Module introduction innovation session1
Module introduction innovation session1
 
Aceros (tp edi)
Aceros (tp edi)Aceros (tp edi)
Aceros (tp edi)
 
Ava
AvaAva
Ava
 
Nuevas alternativas de prevención de VIH/SIDA: Antiretrovirales y Prevención
Nuevas alternativas de prevención de VIH/SIDA: Antiretrovirales y PrevenciónNuevas alternativas de prevención de VIH/SIDA: Antiretrovirales y Prevención
Nuevas alternativas de prevención de VIH/SIDA: Antiretrovirales y Prevención
 
Relaciones de poder que sufren las mujeres
Relaciones de poder que sufren las mujeresRelaciones de poder que sufren las mujeres
Relaciones de poder que sufren las mujeres
 
Tp arquitectura del barroco
Tp arquitectura del barrocoTp arquitectura del barroco
Tp arquitectura del barroco
 
Diaporama Peuplade
Diaporama PeupladeDiaporama Peuplade
Diaporama Peuplade
 
Le Jeu du 21e Siecle
Le Jeu du 21e SiecleLe Jeu du 21e Siecle
Le Jeu du 21e Siecle
 
Seguridad en la Cadena de Suministros.pptx
Seguridad en la Cadena de Suministros.pptxSeguridad en la Cadena de Suministros.pptx
Seguridad en la Cadena de Suministros.pptx
 
Unidad 1
Unidad 1Unidad 1
Unidad 1
 
Introduction Twitter (in french)
Introduction Twitter (in french)Introduction Twitter (in french)
Introduction Twitter (in french)
 
Journee etude montpellier_bl
Journee etude montpellier_blJournee etude montpellier_bl
Journee etude montpellier_bl
 
Les effets de la loi hamon
Les effets de la loi hamonLes effets de la loi hamon
Les effets de la loi hamon
 
Fotos De Ginkgo
Fotos De GinkgoFotos De Ginkgo
Fotos De Ginkgo
 

Similaire à Actualisation de site WEB : Outils : JOOMLA!

Création de blog et sites internet
Création de blog et sites internetCréation de blog et sites internet
Création de blog et sites internet
piera5
 
E commerce - Panorama de l'offre open source
E commerce - Panorama de l'offre open sourceE commerce - Panorama de l'offre open source
E commerce - Panorama de l'offre open source
Maxime Fauquemberg
 
Koongo - Le produit universel de lexport
Koongo - Le produit universel de lexportKoongo - Le produit universel de lexport
Koongo - Le produit universel de lexport
NoStress Commerce s.r.o.
 
Newsletter Soho Solo N°27 Décembre 09
Newsletter Soho Solo N°27 Décembre 09Newsletter Soho Solo N°27 Décembre 09
Newsletter Soho Solo N°27 Décembre 09
Soho Solo Gers
 
Visitez les sites déjà conçu par Virtual Consult Africa
Visitez les sites déjà conçu par Virtual Consult AfricaVisitez les sites déjà conçu par Virtual Consult Africa
Visitez les sites déjà conçu par Virtual Consult Africa
chrislukoki
 
Presentation joomla
Presentation joomlaPresentation joomla
Presentation joomla
Cynapsys It Hotspot
 
Développer son site de e-commerce - Etude de cas - Partie 2
Développer son site de e-commerce - Etude de cas - Partie 2Développer son site de e-commerce - Etude de cas - Partie 2
Développer son site de e-commerce - Etude de cas - Partie 2
Jérémie Let
 
Réalisation d’une plateforme e-commerce de vente de prestations HTML dotée d...
Réalisation d’une plateforme e-commerce de vente de  prestations HTML dotée d...Réalisation d’une plateforme e-commerce de vente de  prestations HTML dotée d...
Réalisation d’une plateforme e-commerce de vente de prestations HTML dotée d...
kadzaki
 
Conférence au salon E-marketing | En 2016, Google et le référencement sont ...
Conférence au salon E-marketing  |  En 2016, Google et le référencement sont ...Conférence au salon E-marketing  |  En 2016, Google et le référencement sont ...
Conférence au salon E-marketing | En 2016, Google et le référencement sont ...
Peak Ace
 
Les Sites Mobiles
Les Sites MobilesLes Sites Mobiles
Les Sites Mobiles
mmti2008
 
Les Sites Mobiles
Les Sites MobilesLes Sites Mobiles
Les Sites Mobiles
m.dubucq
 
Les bases de Joomla 1.5
Les bases de Joomla 1.5Les bases de Joomla 1.5
Les bases de Joomla 1.5
laurentber
 
Les bases de JOOMLA
Les bases de JOOMLALes bases de JOOMLA
Les bases de JOOMLA
laurentber
 
Veille cb, sd, bl, jm, av
Veille cb, sd, bl, jm, avVeille cb, sd, bl, jm, av
Veille cb, sd, bl, jm, av
charismatic5
 
Tutoriel google sites
Tutoriel google sitesTutoriel google sites
Tutoriel google sites
Bruno PICHON
 
Drupal presentation
Drupal presentationDrupal presentation
Drupal presentation
Hery Zo Rakotondramanana
 
Rapport de mon First Projet Web à l'Ecole Supérieure de Technologie de SAFI -...
Rapport de mon First Projet Web à l'Ecole Supérieure de Technologie de SAFI -...Rapport de mon First Projet Web à l'Ecole Supérieure de Technologie de SAFI -...
Rapport de mon First Projet Web à l'Ecole Supérieure de Technologie de SAFI -...
Mohammed JAITI
 
ATELIER ANT N°1 - BLOG OU SITE INTERNET ?
ATELIER ANT N°1 - BLOG OU SITE INTERNET ?ATELIER ANT N°1 - BLOG OU SITE INTERNET ?
ATELIER ANT N°1 - BLOG OU SITE INTERNET ?
Laurent P. PRO
 
Créer son site internet en 3 étapes
Créer son site internet en 3 étapesCréer son site internet en 3 étapes
Créer son site internet en 3 étapes
Sylvie Corlay
 
Web Mobile : quelles opportunités face aux apps ?
Web Mobile : quelles opportunités face aux apps ?Web Mobile : quelles opportunités face aux apps ?
Web Mobile : quelles opportunités face aux apps ?
NiceToMeetYou
 

Similaire à Actualisation de site WEB : Outils : JOOMLA! (20)

Création de blog et sites internet
Création de blog et sites internetCréation de blog et sites internet
Création de blog et sites internet
 
E commerce - Panorama de l'offre open source
E commerce - Panorama de l'offre open sourceE commerce - Panorama de l'offre open source
E commerce - Panorama de l'offre open source
 
Koongo - Le produit universel de lexport
Koongo - Le produit universel de lexportKoongo - Le produit universel de lexport
Koongo - Le produit universel de lexport
 
Newsletter Soho Solo N°27 Décembre 09
Newsletter Soho Solo N°27 Décembre 09Newsletter Soho Solo N°27 Décembre 09
Newsletter Soho Solo N°27 Décembre 09
 
Visitez les sites déjà conçu par Virtual Consult Africa
Visitez les sites déjà conçu par Virtual Consult AfricaVisitez les sites déjà conçu par Virtual Consult Africa
Visitez les sites déjà conçu par Virtual Consult Africa
 
Presentation joomla
Presentation joomlaPresentation joomla
Presentation joomla
 
Développer son site de e-commerce - Etude de cas - Partie 2
Développer son site de e-commerce - Etude de cas - Partie 2Développer son site de e-commerce - Etude de cas - Partie 2
Développer son site de e-commerce - Etude de cas - Partie 2
 
Réalisation d’une plateforme e-commerce de vente de prestations HTML dotée d...
Réalisation d’une plateforme e-commerce de vente de  prestations HTML dotée d...Réalisation d’une plateforme e-commerce de vente de  prestations HTML dotée d...
Réalisation d’une plateforme e-commerce de vente de prestations HTML dotée d...
 
Conférence au salon E-marketing | En 2016, Google et le référencement sont ...
Conférence au salon E-marketing  |  En 2016, Google et le référencement sont ...Conférence au salon E-marketing  |  En 2016, Google et le référencement sont ...
Conférence au salon E-marketing | En 2016, Google et le référencement sont ...
 
Les Sites Mobiles
Les Sites MobilesLes Sites Mobiles
Les Sites Mobiles
 
Les Sites Mobiles
Les Sites MobilesLes Sites Mobiles
Les Sites Mobiles
 
Les bases de Joomla 1.5
Les bases de Joomla 1.5Les bases de Joomla 1.5
Les bases de Joomla 1.5
 
Les bases de JOOMLA
Les bases de JOOMLALes bases de JOOMLA
Les bases de JOOMLA
 
Veille cb, sd, bl, jm, av
Veille cb, sd, bl, jm, avVeille cb, sd, bl, jm, av
Veille cb, sd, bl, jm, av
 
Tutoriel google sites
Tutoriel google sitesTutoriel google sites
Tutoriel google sites
 
Drupal presentation
Drupal presentationDrupal presentation
Drupal presentation
 
Rapport de mon First Projet Web à l'Ecole Supérieure de Technologie de SAFI -...
Rapport de mon First Projet Web à l'Ecole Supérieure de Technologie de SAFI -...Rapport de mon First Projet Web à l'Ecole Supérieure de Technologie de SAFI -...
Rapport de mon First Projet Web à l'Ecole Supérieure de Technologie de SAFI -...
 
ATELIER ANT N°1 - BLOG OU SITE INTERNET ?
ATELIER ANT N°1 - BLOG OU SITE INTERNET ?ATELIER ANT N°1 - BLOG OU SITE INTERNET ?
ATELIER ANT N°1 - BLOG OU SITE INTERNET ?
 
Créer son site internet en 3 étapes
Créer son site internet en 3 étapesCréer son site internet en 3 étapes
Créer son site internet en 3 étapes
 
Web Mobile : quelles opportunités face aux apps ?
Web Mobile : quelles opportunités face aux apps ?Web Mobile : quelles opportunités face aux apps ?
Web Mobile : quelles opportunités face aux apps ?
 

Plus de Arnold Stellio

Memoire de fin d'études pour le diplome de Chef de Projet Informatique et Rés...
Memoire de fin d'études pour le diplome de Chef de Projet Informatique et Rés...Memoire de fin d'études pour le diplome de Chef de Projet Informatique et Rés...
Memoire de fin d'études pour le diplome de Chef de Projet Informatique et Rés...
Arnold Stellio
 
PAQL
PAQL PAQL
Planning2
Planning2Planning2
Planning2
Arnold Stellio
 
Manuel utilisateur v0.4
Manuel utilisateur v0.4Manuel utilisateur v0.4
Manuel utilisateur v0.4
Arnold Stellio
 
Dossier spécifications intégration_v1.00
Dossier spécifications intégration_v1.00Dossier spécifications intégration_v1.00
Dossier spécifications intégration_v1.00
Arnold Stellio
 
Dossier de rapport_de_tests_v1.00
Dossier de rapport_de_tests_v1.00Dossier de rapport_de_tests_v1.00
Dossier de rapport_de_tests_v1.00
Arnold Stellio
 
Dossier de plan_de_tests_v1.00
Dossier de plan_de_tests_v1.00Dossier de plan_de_tests_v1.00
Dossier de plan_de_tests_v1.00
Arnold Stellio
 
Dossier de creation_entreprise_v0.90
Dossier de creation_entreprise_v0.90Dossier de creation_entreprise_v0.90
Dossier de creation_entreprise_v0.90
Arnold Stellio
 
Dossier de conception_v1.00
Dossier de conception_v1.00Dossier de conception_v1.00
Dossier de conception_v1.00
Arnold Stellio
 
Compte rendu-reunion
Compte rendu-reunionCompte rendu-reunion
Compte rendu-reunion
Arnold Stellio
 
Cahier des charges
Cahier des chargesCahier des charges
Cahier des charges
Arnold Stellio
 
Paql intégration v1.00
Paql intégration v1.00Paql intégration v1.00
Paql intégration v1.00
Arnold Stellio
 
Hungary, soon 10 years in the European Union!
Hungary, soon 10 years in the European Union!Hungary, soon 10 years in the European Union!
Hungary, soon 10 years in the European Union!
Arnold Stellio
 
UI testing frameworks and the Coded UI testing paradigm
UI testing frameworks and the Coded UI testing paradigm UI testing frameworks and the Coded UI testing paradigm
UI testing frameworks and the Coded UI testing paradigm
Arnold Stellio
 
Presentation
PresentationPresentation
Presentation
Arnold Stellio
 

Plus de Arnold Stellio (15)

Memoire de fin d'études pour le diplome de Chef de Projet Informatique et Rés...
Memoire de fin d'études pour le diplome de Chef de Projet Informatique et Rés...Memoire de fin d'études pour le diplome de Chef de Projet Informatique et Rés...
Memoire de fin d'études pour le diplome de Chef de Projet Informatique et Rés...
 
PAQL
PAQL PAQL
PAQL
 
Planning2
Planning2Planning2
Planning2
 
Manuel utilisateur v0.4
Manuel utilisateur v0.4Manuel utilisateur v0.4
Manuel utilisateur v0.4
 
Dossier spécifications intégration_v1.00
Dossier spécifications intégration_v1.00Dossier spécifications intégration_v1.00
Dossier spécifications intégration_v1.00
 
Dossier de rapport_de_tests_v1.00
Dossier de rapport_de_tests_v1.00Dossier de rapport_de_tests_v1.00
Dossier de rapport_de_tests_v1.00
 
Dossier de plan_de_tests_v1.00
Dossier de plan_de_tests_v1.00Dossier de plan_de_tests_v1.00
Dossier de plan_de_tests_v1.00
 
Dossier de creation_entreprise_v0.90
Dossier de creation_entreprise_v0.90Dossier de creation_entreprise_v0.90
Dossier de creation_entreprise_v0.90
 
Dossier de conception_v1.00
Dossier de conception_v1.00Dossier de conception_v1.00
Dossier de conception_v1.00
 
Compte rendu-reunion
Compte rendu-reunionCompte rendu-reunion
Compte rendu-reunion
 
Cahier des charges
Cahier des chargesCahier des charges
Cahier des charges
 
Paql intégration v1.00
Paql intégration v1.00Paql intégration v1.00
Paql intégration v1.00
 
Hungary, soon 10 years in the European Union!
Hungary, soon 10 years in the European Union!Hungary, soon 10 years in the European Union!
Hungary, soon 10 years in the European Union!
 
UI testing frameworks and the Coded UI testing paradigm
UI testing frameworks and the Coded UI testing paradigm UI testing frameworks and the Coded UI testing paradigm
UI testing frameworks and the Coded UI testing paradigm
 
Presentation
PresentationPresentation
Presentation
 

Actualisation de site WEB : Outils : JOOMLA!

  • 1. Rapport projet tuteuré : Actualisation de site WEB : Outils : JOOMLA! IUT DE BLAGNAC | DEPARTEMENT RESEAUX ET TELECOMMUNICATIONS Client : Pierre-Louis QUEMIN Tuteur pédagogique : Gaël MANSALIER Binôme: Arnold Stéllio BOUNGOUNGOU - Yann BELEMA 2010-2011
  • 2. 2
  • 3. Rapport projet tuteuré : Actualisation de site WEB à l'aide de JOOMLA! Site www.toy4raid.com Client : Pierre-Louis QUEMIN Tuteur pédagogique : Gaël MANSALIER Binôme: Arnold BOUNGOUNGOU - Yann BELEMA 2010-2011 3
  • 4. 4
  • 5. Sommaire Sommaire...............................................................................................................................................5 Introduction............................................................................................................................................5 1. Présentation du travail à effectuer et du CMS Joomla !.....................................................................7 1.1 Présentation et analyse du cahier des charges :...........................................................................7 2- Utilisation de Joomla!.......................................................................................................................13 2.1 Concepts fondamentaux :.........................................................................................................13 2.2 Installation :................................................................................................................................19 3. Présentations et utilisations de différentes extensions :..................................................................21 3.1 Le forum :...................................................................................................................................21 3.2 Virtuemart (boutique en ligne) :.................................................................................................24 3.3 GAvick photoslide GK3* .............................................................................................................26 3.4 AdsManager (Petites annonces) :...............................................................................................27 3.6 Présentation générale de K2 :.....................................................................................................28 4-Analyse du trafic sur le site et génération de fonds :........................................................................33 5-Retour d’expérience :........................................................................................................................35 Conclusion :..........................................................................................................................................36 Glossaire...............................................................................................................................................38 Bibliographie :.......................................................................................................................................40 Web graphie :.......................................................................................................................................40 Introduction Etudiants en deuxième année de DUT en Réseaux et Télécommunications à l’IUT Blagnac, il est important de réaliser un projet tuteuré. Ce projet nous permet non seulement 5
  • 6. d’approfondir quelques notions abordées au cours de notre formation, mais aussi de nous préparer à la soutenance orale et à la rédaction du projet. www.toy4raid.com « version 1 » est née en 2007 sous la forme d'un blog dédié à la passion du 4x4, des rallyes-raids, et des Toyota. Le blog s'est ensuite rapidement enrichi de rubriques nécessitant une gestion plus régulière de son contenu. Le site à aujourd'hui a atteint un premier niveau de maturité, il compte environ 200 visites par mois (source Xiti). Actuellement, l'outil utilisé pour l'administration et la publication du site est TOWEB. Cet outil offre l'avantage d'une très grande facilité d'utilisation mais atteint ses limites en termes de gestion de contenus et surtout de mise en œuvre de nouvelles fonctionnalités. Le but de ce projet est de rendre le site plus dynamique et de générer plus de trafic. Pour cela nous devons travailler sur l’interactivité du site avec les internautes afin de susciter plus de visites et en faisant des liens vers d’autres sites (notion portail) partenaires. Ensuite, nous devons enrichir le site en nouvelles fonctionnalités, ce qui nécessite d’apporter plus de contenus et de proposer plus de multimédia au site. Enfin nous devons disposer d’un système de gestion de contenu plus évolué, et le choix de JOOMLA ! répond aux attentes de la réalisation su projet du fait de sa composition modulaire et son interface d’administration conviviale et instinctive. L’un des principaux objectifs du projet est d’apporter des fonctionnalités plus avancées comme une boutique en ligne, afin de générer des revenus et de rendre le site plus complet. Dans un premier temps, on va présenter JOOMLA ! et parler de son choix par rapport à l’évolution du site existant et à l’analyse du cahier des charges, ensuite nous poursuivrons sur l’utilisation de JOOMLA ! en commençant par son installation sur un serveur choisi en ligne et nous présenterons ensuite ses différents composants, modules et plug-in permettant la gestion du site et enfin le choix du Template adapté à JOOMLA ! Nous présenterons aussi le site dans sa structure et l’organisation de son contenu avant de finir la présentation et l’utilisation de différentes extensions compatibles avec JOOMLA ! qui apportent de nouvelles fonctionnalités au site et qui permettent sa dynamicité. 6
  • 7. 1. Présentation du travail à effectuer et du CMS Joomla ! 1.1 PRÉSENTATION ET ANALYSE DU CAHIER DES CHARGES : Sujet : Actualisation d'un site WEB à l'aide de JOOMLA! Site www.toy4raid.com. Pour mener ce projet nous allons utiliser le Composant JOOMLA ainsi que des modules complémentaires (tels que VIRTUEMART* pour le e-commerce et KUNENA* pour le forum). Le site www.toy4raid.com est un site qui existe déjà ; donc notre but est de le rendre le plus dynamique tout en apportant des nouvelles fonctionnalités et des nouveaux modules : • Forum: mise en place d'un forum avec médiation par le webmaster ; nous avons décidé de le réaliser avec KUNENA* car se composants 'intègre très bien dans JOOMLA. • Petites annonces : Identification nécessaire (nom, prénom, email, pseudo, mot de passe). Donner aux internautes la possibilité de saisir leur annonce avec chargement de photos. L'annonce est publiée après validation par le webmaster. • Album photos et gallérie vidéos : pour que les utilisateurs puissent ajouter des photos et vidéos sur le site ; les composants choisis sont alors hwdPhotoShare* et hwdVideoShare*. • Plate forme de publicité plus évoluée : ce programme propose un revenu publicitaire. • Boutique en ligne et boutiques partenaires : elle sera dédiée à des articles signés toy4raid.com. Si le paiement se fait en ligne, il faut créer un paiement sécurisé avec tiers de confiance. Boutique partenaire : L'idée est de permettre aux internautes d'acheter des équipements et accessoires dédiés aux 4x4 Toyota, mais également des équipements typés raids (matériels de déplantage, vêtements, petit matériel de camping, etc.). Différentes possibilités seront offertes aux partenaires : - Niveau 1, accord simple avec un partenaire. - Niveau 2, Lien sur un article de la boutique du partenaire. Possibilité tracer l'achat par un cookie et donc rémunération possible de toy4raid.com – Niveau 3. Achat sur le site toy4raid, d'un article partenaire. Niveau de service et logistique. Composant choisi pour développer la boutique en ligne est VIRTUEMART*. 7
  • 8. Rappelons que l’ensemble des composants cités ci-dessus fera l’objet d’une étude plus approfondie dans la suite de notre rapport, nous verrons comment ils agissent sur le site et quel est leur utilité. 1.2 Présentation de l'existant : www.toy4raid.com est un site qui existe déjà et est présent sur la toile. C’est un site de rallye qui traite des émotions, de la passion que procure le raid. Une certaine activité existe, et à du contenu comme tout site ordinaire. Et ce de cette base que nous allons nous appuyé pour reconstruire le nouveau site. Par exemple, nous allons conserver le logo du site mais aussi l’architecture du contenu. Il s’agit entre autre des Catégories, Rubriques et la gestion des articles. Tous les noms des rubriques et catégories seront réutilisés, et si possible en ajouté d’autres. Le tableau ci-dessous montre comment le contenu était géré avant que nous ne commencions les travaux. Ce site a du contenu statique et le but est de le faire évoluer, tout en respectant les valeurs actuelles du site. Rappelons juste que : pour faire évoluer ce site nous allons partir de ‘zéro’ c'est-à-dire nous allons travailler sur une autre plate-forme (parfois en local ou sur un autre hébergeur différent de celui où le site est installé). 8
  • 9. Après avoir fait l’état des lieux, nous allons maintenant présenter le principal élément qui va nous permettre de mettre sur pied le nouveau site. 1.3-Présentation de Joomla! « Joomla ! » fait partir des CMS (Content Management System) les plus utilisés dans le monde du WEB, il vient juste en 3e position (derrière DRUPAL et WORDPRESS) dans le concours de 2009 du meilleur CMS Open source* organisé par la société britannique Packt. Toute une communauté développe et travail autour de Joomla ! et se trouve dans touts les horizons du monde ; Ces derniers mettent en ligne leurs travaux et le partage avec tout le monde. Un CMS permet de créer du contenu (forum, boutique en ligne, galerie photos…), de l'organiser en plusieurs catégories et de développer des fonctionnalités spécifiques sans faire appel à des fortes connaissances en programmation. C’est ainsi que Joomla! Signifie en swahili ‘le tous, tous ensemble’. Partie Administration : C’est dans cette partie que le gros du travail se déroule ; la capture ci-dessous présente la partie caché, où seul l’administrateur et des personnes autorisées ont accès. Pour fixer les choses, nous allons présenter les différents onglets de la figure ci- dessous enfin de s’habituer aux termes qui seront le plus souvent cité dans notre rapport. 9
  • 10. L’onglet ‘Site’ permet d’accéder à la configuration générale du site, par exemple si l’on souhaite mettre le signe en hors ligne, de créer des utilisateurs, gestion des médias, si l’on souhaite mettre des images en ligne… L’onglet ‘Menu’ permet de gérer l’ensemble des menus qui s’afficheront sur le site ‘partie public). La capture ci-dessous montre les différents menus présents sur notre site et leurs sous-onglets. Une fois crée dans la partie administration, les différents menus sont visibles sur la partie public (voir capture ci-dessous). 10
  • 11. L’onglet ‘contenu’ va nous permettre de créer tout le contenu du site il s’agit en majorité des articles. Mais ces articles doivent être classés dans un certain ordre notamment par thème enfin de s’y retrouver et de bien présenter ce contenu aux personnes qui vont se connecter sur le site. … … … … Cet onglet ‘contenu’ va aussi nous permettre de sélectionner tous l’élément que l’on décide d’afficher en page d’accueil et de créer les différents articles. Notons que pour des soucis de présentations et de plusieurs options, nous avons ajouté un module complémentaire K2 que nous développerons plus tard. 11 Article 1 Article 2 Article 3 Catégorie 1.1 Catégorie 1.2 Section 1 Article 1 Article 2 Les Graphiques ci-contre présentent comment le contenu est relié. En partant du bas du graphique, nous pouvons remarquer que chaque article est relié à une catégorie ; les catégories sont reliées à une section. Nous pouvons associer les sections à des thèmes et des catégories à des sous thèmes. Section 2 Catégorie 2.1 Catégorie 2.2 Article 3Article 2Article 1 Article 1
  • 12. L’onglet « Composants» permet d’accéder à l’ensemble des composants (ceux présents à l’installation de Joomla ! et ceux ajoutés). Le but du composant est de créer une application au sein du système. Il permet d’aller très vite dans la réalisation d’un site web. Et ajoute des fonctionnalités. L’onglet « Extensions* » va nous permettre de gérer et d’installer les plugins*, de charger et de choisir le Template* par défaut. L’onglet « Outils » c’est comme une boite mail ; dans laquelle on va envoyer et recevoir le message ; de nettoyer de le cache* et de purger les fichiers expirés du cache*. L’onglet « help » c’est pour l’aide. Nous avons fait le tour sur les objets que nous allons utiliser, et présenter en général joomla ! enfin de faciliter la compréhension de la suite. Après avoir fait le tour du travail à exécuter et présenter Joomlà ! de manière succincte, nous allons maintenant voir comment il s’utilise. 12
  • 13. 2- Utilisation de Joomla! 2.1 Concepts fondamentaux : On présente dans cette partie la structure fonctionnelle d’un Système de Gestion de Contenu Web (CMS) en nous basant sur Joomla !  Frontend (Frontal) et backend : Un Système CMS se base sur le couple Frontend et Backend. Le Frontend (partie vitrine) consiste en la page d’accueil et toutes les autres pages du site telles que les voient les visiteurs et les utilisateurs identifiés. Exemple : Page d’accueil du site Le Backend (partie arrière-boutique) contient l’interface de gestion des pages par l’administrateur. Les activités de Backend comprennent la configuration, la maintenance, la création des statistiques et des nouveaux contenus. Le Backend est située à une adresse 13 http://projet 4toy.harmonieslash.com
  • 14. Web différente de la page d’accueil du site (donc du Frontend), dans notre cas : http://projet4toy.harmonieslash.com/administrator illustrée par la figure suivante.  Droits d’accès Dès que l’on parle d’administration, il faut introduire des règles pour garantir l’utilisation organisée des ressources disponibles : ce sont les droits d’accès. Dans un CMS*, toutes les personnes concernées se voient attribuer un identifiant (nom d’utilisateur) et un profil d’accès y est associé. Cohabitent ainsi des utilisateurs simplement reconnus, des créateurs et correcteurs de contenus qui ont plus de droits et un ou plusieurs administrateurs, qui ont accès à tout. Selon le profil de droits d’accès, la page d’accueil du site se présente différemment ou bien l’utilisateur bénéficie d’une interface d’administration distincte de la page d’accueil. 14 http://projet4toy.harmonieslash.com/administrator
  • 15. Interface de connexion à l’administration Joomla ! Interface administration présentant la gestion des différents types d’utilisateurs 15
  • 16.  Contenus : Les contenus peuvent prendre des formes très diverses : fichiers textes, liens, images, fichiers audio, données extraites d’une application comme Google Maps ou une combinaison de ces éléments. Pour que la gestion de tous ces contenus soit simplifiée, ils sont systématiquement intégrés à des structures d’accueil. Les textes sont ainsi répartis dans les catégories. Ces catégories consistent elles aussi à des contenus qui doivent être administrables. On peut s’abonner à ces différents types de contenu.  Extentions Les composants, modules, Template et plugins sont réunis sous le terme collectif « extensions ». Ils apportent les enrichissements fonctionnels par rapport à ce que propose le noyau de Joomla !  Template Sorte de modèle visuel prêt à recevoir des contenus. Il détermine les couleurs, les polices, les tailles de caractères, l’image d’arrière-plan, les espacements et la distribution des sous- éléments d’une page. Un Template réunit au moins un fichier HTML décrivant la structure de la page et un fichier CSS décrivant les styles d’affichage. Un Template peut être beaucoup plus complexe et rendre c'est-à-dire afficher des données de Joomla ! accessibles de multiples manières.  Plugins : Un plugin est un bloc de code qui vient se brancher en un point de l’infrastructure de Joomla ! pour en modifier le fonctionnement. Vous pouvez par exemple utiliser un plugin dans un contenu pour charger le contenu d’un module dans un texte. Pour pouvoir étendre 16
  • 17. la fonction de recherche d’un site Web à un composant supplémentaire, il faut lui associer un plugin. En exemple un moteur de recherche qui va directement indexer le contenu des articles (côté administration):  Modules Ce sont des outils qui définissent l’affichage et le positionnement des contenus gérés par les composants et les plugins. Si on installe un composant qui gère la boutique en ligne du site Web, on peut utiliser et positionner un module qui fera appel aux données gérées par ce composant et définira son affichage et son positionnement sur le site. 17 Permet la recherche dans tous les articles
  • 18.  Composants : Ce sont des extensions qui permettent de construire de A à Z des fonctionnalités métiers comme un gestionnaire de formation, un gestionnaire candidature web ou encore une newsletter. 18 Affichage du contenu de virtuemart dans un module
  • 19. 2.2 Installation : L’installation de Joomla ! ne prend qu’une dizaine de minutes la première fois. Pour cette installation, il faut d’abord mettre en place localement une sorte d’internet privé réunissant un serveur Web, avec support du langage PHP, et un système de gestion de bases de données (SGBD) exploitable per Joomla !. Les dossiers de Joomla ! seront ensuite installés dans cette structure de données puis configurés via un installateur à interface Web. Il s’agit d’un exemple typique d’environnement client-serveur. Interface web d’installation de Joomla ! sur le serveur Pour mettre en ligne le site il faut acheter un nom de domaine permettant d’identifier le site sur internet. Pour avoir un nom de domaine il faut se connecter sur un hébergeur connecté 24/24 à internet, c’est sur cet hébergeur qu’on va ensuite installer Joomla !. Dans notre projet on dispose de tous ces services sur notre hébergeur en ligne qui est 1&1. 19
  • 20. Site 1&1.  Déroulement d’un accès à un site Web Joomla ! Pour vous faire une idée générale de ce qui se passe en coulisses, voici les étapes successives de l’accès d’un ordinateur client à un site Web propulsé par Joomla !: 1. Etablissement d’une connexion Internet via un fournisseur d’accès. 2. On saisie l’adresse Web (URL) on entre en contact avec le serveur Web 3. Le serveur Web retransmet une requête à son interpréteur PHP qui, après avoir exécuté les commandes appropriées à Joomla !, envoie les données d’entrée à la base de s données et génère un code d’habillage HTML, qui sera envoyé par le serveur Web au navigateur du client. 4. Le navigateur interprète les balises de style HTML et CSS et intègre les données externe en allant les chercher un à un auprès du serveur Web. Plusieurs d’entre ces étapes ne concernent pas Joomla ! lui-même. Maintenant nous savons comment Joomla ! fonctionne, un problème se pose car il est très limité il faudrait dans ce cas ajouter des extensions pour avoir des fonctionnalités très intéressantes. 20
  • 21. 3. Présentations et utilisations de différentes extensions : Pour satisfaire les besoins spécifiés dans le cahier des charges, on est amené à utiliser un certains nombre d’extensions Jommla ! afin d’apporter de nouvelles fonctionnalités au futur site Web. 3.1 Le forum : KUNENA est un composant de forum pour Joomla!. Intégrer un forum dans Joomla ! a toujours été possible mais n’a jamais été très facile, souvent nécessitant l’utilisation de bridges pour connecter Joomla ! aux forums biens établis. Le nom Kunena est un mot venant du Swahili qui signifie, "parler". Il est dérivé de l'ancien forum Fireboard avec de nouveaux et précédents développeurs ce qui inclut quelques développeurs du core de Joomla!. Les développeurs ont un but à long terme qui est de concevoir Kunena depuis zéro pour tirer pleinement parti de ce que Joomla ! a à offrir. Panneau de contrôle du forum KUNENA KUNENA constitue donc un excellent forum de discussion disposant de nombreuses possibilités : 21
  • 22. - création de catégories et de sous-catégories : KUNENA dispose d’une gestion intégrée de contenus dont l’affichage est pris en charge principalement par les modules du Template ; en effet KUNENA est un composant qui dispose de toutes les fonctionnalités possibles pour gérer non seulement le contenu mais aussi l’affichage du contenu et cela en utilisant le corps du Template de base : En rouge : l’interface d’accueil du forum KUNENA - gestion de forums multiples avec droit d’accès : L’une des fonctionnalités majeures de ce projet est d’intégrer le système des droits d’accès non seulement sur le forum mais aussi sur le site lui-même pour gérer l’accès de différents utilisateurs. 22
  • 23. En rouge : la zone d’identification des utilisateurs du forum - profils des utilisateurs et avatars : Les profils des utilisateurs et avatars permettent une interactivité avec le déroulement du site et aussi entre les utilisateurs : En rouge : zone indiquant le profil du visiteur - téléchargements des fichiers et d’images avec les messages. L’interactivité entre les visiteurs se voit aussi à travers le fait qu’ils peuvent commenter des sujets postés par les autres et télécharger quelques fichiers comme des images : 23
  • 24. Figure illustrant la création d’un nouveau sujet dans le forum Après l’installation du forum, qui est très simple, les fichiers du composant ont été distribués dans les sous-dossiers appropriés. Et donc une fois le composant mis en place et quelques opérations de configuration minimale, il ne reste plus qu’à mettre en page le forum de discussion. Notons que KUNENA possède une telle richesse de paramétrage que nous pourrions y consacrer plusieurs chapitres. 3.2 Virtuemart (boutique en ligne) : Choix des outils : La boutique en ligne est l’une des évolutions majeure du site car cette boutique va permettre dans un futur proche ou lointain, et selon les besoins de notre client d’avoir un espace où les internautes pourront passer directement les commandes via paypal ou un autre moyen de payement en ligne. Après étude faite et en accord avec notre client, nous avons décidé d’utiliser Paypal. Pour ce faire, il a fallut installer une extension permettant de gérer cette boutique : VIRTUEMART*. En annexe, nous verrons comment installer Virtuemart. Virtuemart* est constitué de composant et plugins qu’il faut activer enfin de profiter de toutes ses fonctionnalités. Il s’agit entre autre de : • Vi rtueMart Module : ce module permet de faire de la recherche des produits tout en affinant son choix (par taille, couleur, prix croissant, décroissant). 24
  • 25. • VirtueMart Shopping Cart : ce module permet de voir l'état du panier. • VirtueMart Product Categories : module permettant de classer les articles vendues par catégorie. • virtueMart login : pour la connexion sur la boutique. En plus de ces modules il est nécessaire d’ajouter des plugins orienté recherche ; il s’agit de : • VirtueMart Product Snapshot. • Virtuemart Extended Search Plugin. Après avoir choisi les outils qui devront nous permettre de réaliser la boutique, il faut maintenant passer à la configuration de cette dernière. Pour cela il nous faut le nom de la boutique (boutique toy4raid) ; son adresse ; le numéro de téléphone et l’email ; la catégorie d’articles vendu sur le site, dans notre cas nous avons juste une catégorie (Chemise) et un seul type de produit (Chemise). Une fois toutes les configurations faites, il faut maintenant créer l’article présentant le produit vendu et ainsi l’utilisateur pour faire son achat et avoir une solution Paypal pour le règlement. Pour l’instant nous n’allons pas utiliser cette solution car l’utilisateur sera directement redirigé vers un site partenaire. Une fois ce travail fait nous pouvons admirer le rendu sur le site, l’utilisateur peu ainsi voir l’offre qui lui est proposée ainsi que les critères de la chemise. Et un lien de redirection vers le site partenaire (http://www.koulala-vetements.com/acheter-vetements-koulala-chemise-toy4raid- 2,1,7,1,0,65.htm). 25
  • 26. 3.3 GAvick photoslide GK3* Est le module qui permet d’afficher le diaporama des photos dans la partie header ; Enfin de le faire fonctionner il faut au préalable créer un ‘GROUP’ puis des ‘Slides’ ; Dans notre cas le groupe c’est ‘Header_diapo’ qui affiche les images contenues dans les slide 1,2,3. 26
  • 27. 3.4 AdsManager (Petites annonces) : Cette extension va permettre à un utilisateur de pouvoir passer son annonce en ligne directement, entrer le texte et les photos adéquates. C’est l’une évolution que nous avons apportée, car sur l’ancienne version du site, l’utilisateur envoyait son annonce à l’administrateur par mail. L’avantage ici est que tout le monde gagne en temps car aussitôt l’annonce postée, elle apparait en ligne et l’administrateur joue juste le rôle de modérateur. Les petites annonces sont aussi classées par catégorie principe très cher à joomla ! Cela va permettre De faire des recherches par catégorie et de bien classer les annonces ; cette technique est très avantageuse, car nous pourrions avoir plusieurs annonces tout en se retrouvant facilement. L’utilisateur peut voir toutes ses annonces et le modifier à chaque fois. 3.5 hwdPhotoShare Photos : hwdPhotoShare est une galerie de photos Joomla ! qui permet d'afficher des images organisées qui peuvent être partagées entre les utilisateurs sur Internet. hwdPhotoShare peut manipuler l'image en la redimensionnant. Les images peuvent être transférées par l’utilisateur lui même. Des commentaires peuvent être mis sur les photos. Création des catégories afin de regrouper les photos mis sur le site par les utilisateurs. 27
  • 28. Catégories crées : • Paysage • Faune et Flore • Aventure • Abstract • Architecture • Voitures • Sport & Loisirs • Autres 3.6 Présentation générale de K2 : De toutes les extensions utilisées, K2 est le plus important car, il va nous permettre de gérer tout le contenu du site. Rappelons que le contenu peut être géré directement avec Joomla ! mais nous serons limités dans la présentation du contenu. K2 est une extension pour Joomla! 1.5 composant de gestion de contenu conçu pour Joomla! et développer par JoomlaWorks* (créateurs d'extension Joomla! depuis 2006). K2 évolue très souvent. Il fournit une solution intégrée avec des formulaires élaborés contenu pour les articles (Exemples article Joomla! avec champs supplémentaires pour les images, vidéos, galeries d'images et des pièces jointes), Imbrication de catégories, étiquettes, commentaires, un puissant plugin API pour étendre le contenu, catégorie et les formulaires utilisateurs. Force de K2 : Utilisé K2, permet de transformer son site Joomla! en site d'actualités, magazine avec des blogs par auteur, catalogues de produits, portfolio*, base de connaissances, téléchargement/gestionnaire de documents, annuaire, liste d'événements et plus encore, et tout ça, regroupées sous un seul paquet! Étant donné que K2 est extensible avec des champs supplémentaires, K2 permet aussi de créer des catégories spécifiques aux types de contenu, par exemple article, blog, page produit, liste d'annuaire. De plus les paramètres de chaque catégorie peuvent être hérités d'une autre catégorie, ce qui permet de conserver facilement une cohérence de votre affichage. K2 possède également un système de tags simple d'utilisation vous permettant d'afficher vos articles par tags. Vous pouvez créer vos propres groupes, auquel vous assigné des droits et les informations des utilisateurs sont plus complètes vous permettant par exemple de créer des fiches auteurs. Enfin, le composant K2 intègre également un système de commentaire avec captcha et validation manuelle. Comment avons nous utilisé K2 pour la mise en place du site ? 28
  • 29. Après avoir créé les catégories et section sur joomla ! il faut les exporter vers K2 (voir en annexe). L’affichage des blocs en page d’accueil : Tableau à collé toute la page 29
  • 30. (**) Nom du module dans la partie administration de Joomla ! Le schéma ci-dessus nous montre que K2 est très présent sur le site et contribue énormément à l’esthétique et la présentation du contenu, à travers la gestion du contenu par K2, l’utilisateur navigue aisement. Exemple de capture du site : 30
  • 31. Gestion d’articles avec K2 : L’une des forces de K2 se trouve dans la manière dont il permet de créer les articles. Possibilité d’intégrer une vidéo directement dans l’article, d’insert des fichiers à télécharger, d’intégrer des musiques en différent format. Il propose aussi à l’utilisateur de pouvoir télécharger la page en format PDF ou de l’imprimer. L’article peut aussi être publié sur les différents réseaux sociaux tels que Facebook. K2 permet aussi de gérer les commentaires concernant l’article. 31
  • 32. Après cette partie, le site est en fait près et a tous les modules et composants nécessaires, il va maintenant falloir faire l’audit du trafic et trouver des solutions pour que le site nous génère des fonds. C’est toute l’utilité de la partie suivante. 32
  • 33. 4-Analyse du trafic sur le site et génération de fonds : Une fois le site mis en ligne ; il est très important de savoir le trafic enfin de mieux ciblé son contenu et innové en matière des services proposés sur le site. Car c’est cela qui permettra au site de vivre. C’est dans cette optique que le client a choisit de suivre l’évolution de sont trafic avec XITI. C’est l’une des moyens le plus utilisé dans le monde du web pour faire de l’audience. Parmi les fonctionnalités de XITI on retrouve : Tableau de bord synthétique qui permet d’indiquer la santé du site. Comportement des visiteurs (principaux critères d'intérêt, acquisition et fidélisation des visiteurs, heures de connexion). Géo localisation exacte : continents, pays, régions (service fourni exclusivement par XITI). Sources (naturelles et marketings : accès directs, emails, sites affluents, bannières). Référencement (moteurs de recherche, mots clés, liens sponsorisés). Technique (compatibilité du site avec l’équipement des visiteurs : navigateurs, os, écrans, vitesse de connexion etc.) Arborescence (classification automatique des pages en chapitre, marquage simple et rapide) Diffusion des rapports en format PDF, exports Excel, CSV et XML. Administration gestion des droits utilisateurs, surveillance ou exclusion de visiteurs par adresse IP ou par cookie. Support client FAQ, aides en ligne, support technique par email et téléphone. Le client souhaite aussi que le site lui généré des fonds, dans ce cadre il s’est abonné au programme Google Adsens ; c’est un programme pour de la publicité qui est mis automatiquement en ligne par Google Adsens. Pour que les bannières de publicités s’affichent sur le site, il faut au préalables installer une extension ‘google adsens pour joomla !’ et indiquer l’endroit où les modules s’afficheront. Dans notre cas nous avons choisi d’afficher les bannières aux endroits suivants : ‘top’ et ‘left’ comme nous pouvons le voir dans la capture ci-dessous. 33
  • 34. 34
  • 35. 5-Retour d’expérience : Ce projet a été bénéfique pour nous et nous a permis de prolonger les connaissances acquises en cours notamment sur les notions de Php, Mysql, CSS et bien d’autres encore. Nous avons utilisé la totalité des notions abordées, même si souvent on ne se rendait pas parfois compte que là on utilisait une notion bien précise, par exemple dans l’administration Joomla !. Le challenge était grand pour nous, car il ne s’agissait plus de faire un compte rendu de TP personnel mais plutôt de mener un projet pour un client qui avait défini un cahier de charge qu’il fallait respecter. Nous avons donc été méthodiques tout au long du projet et avons pu acquérir des compétences dans la mise en place d’un projet. Malgré des difficultés rencontrées lors de l’immigration du site ou lors de l’hébergement sur www.freehostingcloud.com (le site a été supprimé) et bien d’autres encore, le travail attendu par le client a été respecté, toutes les fonctionnalités désirées ont été ajoutées, on a pu finir le projet dans les temps et le travail réalisé correspond aux attentes du client, M Pierre Louis Quemin. Enfin nous remercions M. Gaël MANSALIER, notre tuteur de projet tuteuré et enseignant dans les modules d’informatique et réseaux, qui nous a beaucoup guidé en nous aidant à bien répartir notre temps de travail et de bien organiser notre plan de travail, ainsi que quelques informations techniques et des livres nous permettant de mener à bien le projet. Ensuite nous remercions le client, M Pierre Louis Quemin qui a bien spécifié son besoin permettant d’avancer vite dans la réalisation du projet. Enfin nous remercions Mme Danielle CABALLERO qui nous a permis de rédiger le support écrit de notre projet. 35
  • 36. Conclusion : JOOMLA ! est la solution adaptée à notre projet car il offre toutes les fonctionnalités dont on a eu besoin pour réaliser notre site. En effet la composition modulaire de JOOMLA ! permet une mise en œuvre facile et intuitive d’un site Web dans sa configuration. De plus on peut importer, au besoin, des extensions au noyau de JOOMLA ! afin de rendre plus dynamique le site et de lui apporter plus de fonctionnalités ; même si on est parfois amené à retoucher de façon importante les composants pour pouvoir les adapter aux besoins. La réalisation de ce site a été un succès de l’utilisation de JOOMLA ! comme CMS. 36
  • 37. 37
  • 38. Glossaire CMS : Content Management System (en français Content Management System ou CMS) est une famille de logiciels destinés à la conception et à la mise à jour dynamique de site Web ou d'application multimédia. Open Source : Logiciel dont le code source peut être modifier et redistribuer librement. Section : Regroupe l’ensemble des catégories et les classes par thèmes. Catégorie : Regroupe l’ensemble des articles à appartenant à un même thème. Extensions : Les composants, modules, Templates et plugins sont réunis sous le terme collectif « extensions ». Ils apportent des enrichissements fonctionnels par rapport à ce que propose le noyau de Joomla ! KUNENA : Un composant de forum natif pour Joomla! 1.5.x ce qui vous autorise à déployer rapidement un forum communautaire sur votre site web basé sur Joomla!. VIRTUEMART : Extension permettant de monter une boutique en ligne, avec moyens de payement via paypal. Template : Sorte de gabarit visuel prêt à recevoir des contenus. Il détermine les couleurs, les polices, les tailles de caractère, l’image d’arrière plan, les espacements et les distributions des éléments d’une page : il constitue donc une mise en page. Un Template contient au moins un fichier HTML décrivant la structure de la page, et un fichier CSS décrivant les styles d’affichage. Plugin : c’est un bloc de code qui vient se brancher en un point précis de l’infrastructure de Joomla! Pour en modifier le fonctionnement. hwdPhotoShare : est un composant autorisant la publication et le partage des photos sur les sites communautaires Joomla !. Ce composant, d'une extrême puissance. hwdVideoShare : est un composant autorisant la publication et le partage de vidéos sur les sites communautaires Joomla !. Ce composant, d'une extrême puissance, n'est pas particulièrement simple à prendre en main et se configurer correctement. K2 : JoomlaWorks : groupe des créateurs d'extension Joomla ! Portfolio : le portfolio regroupe les travaux, les recherches, synthèses d’une personne. C’est un objet précieux et valorisant qui peut être représenté sous forme de site web. 38
  • 39. Captcha : Un captcha est une forme de test de Turing permettant de différencier de manière automatisée un utilisateur humain d'un ordinateur. 39
  • 40. Bibliographie : • JOOMLA ! 1.5 3e édition Hagen Graf, élu meilleur CMS Open Source PHP 2007, et troisième. en 2009 • Joomla 1.5 et VirtueMart 1.1 Réussir sa boutique en ligne: 2ème édition. Web graphie : • www.joomla!.fr • www.joomlabc.com • www.virtuemart.fr • www.kunena.org • www.getk2.org 40