Projet Elmarnaoui

Licence EEA / Projet Cration dun site Internet
Etudiants : EL MARNAOUI Azdine session : 2005

1/25
LICENCE ELECTROTECHNIQUE ELECTRONIQUE AUTOMATISME

RAPPORT DE PROJET

CREATION DU SITE INTERNET POUR LA
FORMATION EEA DE MULHOUSE

Champs technologiques : Informatique + Communication

Professeur responsable : J.P URBAN

Etudiant : EL MARNAOUI Azdine

2/25
SOMMAIRE

PRESENTATION DU PROJET

I) Prsentation..3
II) Prsentation en Anglais.....................................................................................4
CREATION DU SITE INTERNET
I) Comprhension de SPIP5

a) Pour chaque de document un couple de fichier
b) Le principe de fonctionnement du cache
c) Le fichier .PHP3
d) Le fichier .HTML
e) Une interface diffrente dans le mme site

II) Les lments grs par SPIP...10

a) La hirarchie des rubriques
b) Les articles

MODE DEMPLOI

I) Rcuprer SPIP...12
II) Installer les fichiers....12
III) Procdure de configuration..13
IV) Lespace priv.14

a) La partie EDITION
b) La partie AUTEURS
c) La partie CONFIGURATON

CONCLUSION

I) Conclusion...20

ANNEXE

I) Les raccourcis typographiques22
II) Utilisez SPIP avec EasyPHP...23

3/25
PRESENTATION DU PROJET

I) Prsentation :

Le but de mon projet tait de construire le site Internet de la formation EEA de la FST de
Mulhouse. Le besoin principal tait premirement de prsenter la formation EEA par le biais
de lInternet dsormais incontournable pour la recherche dinformation et deuximement
davoir un site facile mettre jour sans avoir de grandes connaissances en programmation
Web.
Pour ce faire mon tuteur Mr URBAN ma conseill dutiliser SPIP.

SPIP est un Systme de Publication pour lInternet. Il sagit dun ensemble de fichiers,
installs sur votre compte Web, qui vous permettent de bnficier dun certain nombre
dautomatismes : grer un site plusieurs, mettre en page vos articles sans avoir taper du
HTML, modifier trs facilement la structure de votre site... Avec le mme logiciel qui sert
visiter un site (Mozilla, Netscape, Microsoft Explorer, Opera...), SPIP permet de fabriquer et
de tenir un site jour, grce une interface trs simple dutilisation.

SPIP appartient la famille des nombreux sites pages dynamiques que lon dsigne souvent
par CMS (Content Management System).
la diffrence dun site statique o vous crez (laborieusement) chaque page, un site
dynamique spare, pour votre plus grand confort et une meilleure efficacit, la forme (la
charte graphique) du fond (le contenu, le plus souvent du texte). Ce contenu est stock dans
une base de donnes (le plus souvent mySQL) qui est appele par le serveur (le plus souvent
Apache) grce un langage de programmation (le plus souvent PHP).
Pour diter des pages, il suffit alors dditer du texte dans des cases via des formulaires dans
votre navigateur. Et cest pour cela quil y a une partie publique (le site vu par les visiteurs) et
une partie prive (ladministration de votre CMS).

Un site gr sous SPIP comporte deux zones :

Zone Publique :
Cest dans cette partie que se trouve lensemble des informations publies, par les rdacteurs
du site. Comme tout site, cette zone comporte, des menus, des rubriques, des pages, ... La
manire dont vont safficher les contenus du site est entirement personnalisable par le
webmaster (administrateur du site).
Zone de Publication :
Plus couramment appele ladministration du site, cest linterface qui permet de grer le site.
Elle nest accessible quaux rdacteurs du site. Ils peuvent, en fonction des permissions qui
leur sont accordes, grer larborescence du site, crer des articles, y insrer des images ou
autres documents, mettre en place des forums ou des ptitions. Bref les possibilits sont divers
et varies. De plus aucun logiciel nest ncessaire puisque tout cela se fait au travers dun
navigateur Web (Mozilla, Netscape, Internet Explorer, ...).
4/25

II) Prsentation en anglais:

The goal of my project was to create an Internet site for the EEA students. The difficulty
which arose was that Mr. URBAN my tutor wanted a dynamic site. He thus suggested to me
to use SPIP.

SPIP is a System of Publication for the Internet. It is about a series of files, installed on your
Web account, which enables you to benefit from a certain number of automatisms: to manage
a site with several people to put your articles on page without having to type HTML, to very
easily modify the structure of your site... With the same software which is used to visit a site
(Mozilla, Netscape, Microsoft Explorer, Opera...), SPIP makes it possible to manufacture and
hold an up to date site, thanks to a very simple interface.

SPIP makes it possible indeed to manage data bases rather simply. For page-setting of the
contents one does not have to expect miracles of SPIP. It presents the contents in a rather
simplistic way. Thus to build a relatively beautiful site it is necessary to remake the skeletons
of presentation and thus to know the HTML language.

The first problem that I met was to know how SPIP ran. After having understood the
operation of SPIP, I started to build the skeletons which are used for page-setting of the site. I
chose a style, close to the UHA site to remain in accordance to the graphic charter. Moreover
not having a host I worked locally in my PC.

The second problem was what structure I was going to use. In other words the plan of the site.
I started to visit several sites of various schools to study their ideas. For that I used 5 parts:
Reception, Admissions, Studies, Access plan and Presentation. Its for me the most useful
parts to have information on a school curriculum.

The third and last problem dealt with the contents of the site, which is for the moment
provisional, information lacking at the moment. I have also in project to add a part on the
student life.
Finally, I managed SPIP code and thus succeeded in building all the skeletons well after
having tested several styles of page-setting. And indeed the site is dynamic and easy to
update, as desired. To be seen if the visitor like that.
http://www.trop.uha.fr/master

5/25
CREATION DU SITE INTERNET

I) Comprhension de SPIP:

Tout le contenu dun site gr sous SPIP est install dans une base de donnes mySQL. Pour
prsenter ces informations aux visiteurs du site, il faut donc raliser lopration qui consiste
lire les informations, les organiser et les mettre en page, afin dafficher une page HTML
dans le navigateur Web.
Cette opration est traditionnellement assez pnible :
il faut connatre la programmation PHP et MySQL, et crire des routines relativement
complexes ;
lintgration de telles routines dans une mise en page HTML labore est assez pnible ;
il faut prendre en compte des problmes de performances : le recours systmatique du
code mySQL et PHP est gourmand en ressources, ralentit la visite et, dans des cas extrmes,
provoque des plantages du serveur Web.
SPIP propose une solution complte pour contourner ces difficults :
la mise en page du site est effectue au moyen de pages HTML nommes squelettes,
contenant des instructions simplifies permettant dindiquer o et comment se placent les
informations tires de la base de donnes dans la page ;
un systme de cache permet de stocker chaque page et ainsi dviter de provoquer des
appels la base de donnes chaque visite. Non seulement la charge sur le serveur est
rduite, la vitesse trs largement acclre, de plus un site sous SPIP reste consultable mme
lorsque la base mySQL est plante.

a) Pour chaque type de document, un couple de fichiers:

Lintrt (et la limite) dun systme de publication automatis, cest que lon ne va pas
redfinir une interface diffrente en HTML pour chaque page isole. Par exemple, tous les
articles bnficieront de la mme interface, simplement le systme placera des informations
diffrentes dans ce graphisme.
Lavantage de cette manire de procder est vident : on dfinit un format-type (squelette)
pour, par exemple, tous les articles, et le systme fabriquera chaque page individuelle en
plaant automatiquement le titre, le texte, les liens de navigation... de chaque article.
Pour chaque type de document, SPIP vous demande deux fichiers : un fichier .php3 et un
fichier .html. Lors de linstallation de SPIP, vous trouverez ainsi les couples : article.php3 /
article.html , rubrique.php3 / rubrique.html , etc.

6/25
b) Le principe de fonctionnement du cache:

Lappel dune page spcifique se fait par lintermdiaire du fichier .php3. Par exemple, pour
appeler larticle n5, lurl correspondante est :
http://monsite.net/article.php3?id_article=5

c) Le fichier .PHP3 :

Le fichier .php3 est trs simple. Par exemple, article.php3 contient uniquement :

<?php
$f ond = "article";
$delais = 24 * 3600;
include ("inc-public.php3");
?>

Son seul but est donc de fixer deux variables ($fond et $dlais) et dappeler le fichier qui
dclenche le fonctionnement de SPIP (inc-public.php3).

La variable $fond est le nom du fichier qui contient la description de la mise en page (le
squelette). Ici, puisque $fond="article", le fichier de description sera contenu dans
article.html. Notez bien que, dans la variable $fond, on nindique pas la terminaison .html .

La variable $dlais est lge maximum pour lutilisation du fichier stock en /CACHE. Ce
dlai est fix en secondes. Un dlai de 3600 correspond donc une heure ; un dlai de
24*3600 est donc de 24 heures.
7/25

d) Le fichier .HTML:

Dans SPIP, on appel les fichiers .html les squelettes. Ce sont eux qui dcrivent linterface
graphique de vos pages.
Ces fichiers sont rdigs directement en HTML, auquel on ajoute des instructions permettant
dindiquer SPIP o il devra placer les lments tirs de la base de donnes (du genre :
placer le titre ici , indiquer cet endroit la liste des articles portant sur le mme
thme ...).
Les instructions de placement des lments sont rdiges dans un langage spcifique. Pour
obtenir la mise en page actuelle jai donc construis deux squelettes (stoker dans le dossier
dist ) rubrique.html et sommaire.html. Et cr un fichier CSS.

Exemple de code :

<table align="center" width="800" cellspacing="0" cellpadding="0" border="0">
<tr><td width="800">
<img src="entete22.jpg" BORDER="0"></td>
</td></tr>
<tr>
<td align="center"width="800" bgcolor="silver" height="23">

<BOUCLE_rubriques(RUBRIQUES) {racine} {par num titre}>
<a href="#URL_RUBRIQUE" [title="(#DESCRIPTIF|textebrut|entites_html)"]><b>#TITRE </b></a> |
</BOUCLE_rubriques>
</td>
</tr>
</table>

Le code en gras sert la mise en page alors que le code en italique sert pour la rcupration
des donnes, ici jai cr le menu de navigation du site.
Comme on peut le constater le code SPIP est bas sur un systme de boucles je vais vous en
expliquer le fonctionnement.

La boucle RUBRIQUES retourne une liste de... rubriques.

<BOUCLEn(RUBRIQUES){critres...}>

Remarque. Une boucle RUBRIQUES naffiche que des rubriques actives , cest--dire
contenant des articles publis, des documents joints, des sites publis - ou des sous rubriques
elles-mmes actives. De cette faon, on vite de se trouver dans des rubriques culs de sac
noffrant aucun lment de navigation.

8/25
1) Les critres de slection

On utilisera lun ou autre des critres suivants pour indiquer comment on slectionne les
lments.

{id_rubrique} retourne la rubrique dont lidentifiant est id_rubrique. Comme lidentifiant
de chaque rubrique est unique, ce critre retourne une ou zro rponse.

{id_secteur} retourne les rubriques de ce secteur.

{id_parent} retourne la liste des rubriques contenues dans une rubrique.

{racine} retourne la liste des secteurs (rigoureusement identique {id_parent=0}).

{id_enfant} retourne la rubrique qui contient la rubrique (une seule rponse ; ou zro
rponse si la prsente rubrique est situe la racine du site).

{meme_parent} retourne la liste des rubriques dpendant de la mme rubrique que la
rubrique en cours. Permet dafficher les rubriques qui se trouvent au mme niveau dans la
hirarchie.

{recherche} retourne les rubriques correspondant aux mots indiqus dans linterface de
recherche (moteur de recherche incorpor SPIP).

2) Les critres daffichage

Une fois fix lun des critres ci-dessus, on pourra ajouter les critres suivants pour
restreindre le nombre dlments affichs.

Les critres communs toutes les boucles sappliquent videmment.

{exclus} permet dexclure du rsultat la rubrique dans laquelle on se trouve dj (utile avec
meme_parent).

3) Les balises de cette boucle

Les balises tires de la base de donnes

Les balises suivantes correspondent aux lments directement tirs de la base de donnes.
Vous pouvez les utiliser galement en tant que critre de classement (gnralement : {par
titre}).

#ID_RUBRIQUE affiche lidentifiant unique de la rubrique.
#TITRE retourne le titre de la rubrique.
#DESCRIPTIF retourne le descriptif.
#TEXTE retourne le texte principal de la rubrique.
#ID_SECTEUR est lidentifiant du secteur dont dpend la rubrique (le secteur tant la
rubrique situe la racine du site).

9/25
Les balises calcules par SPIP

Les lments suivants sont calculs par SPIP. (Ils ne peuvent pas tre utiliss comme critre
de classement.)

#NOTES les notes de bas de page (calcules partir de lanalyse du texte).
#INTRODUCTION les 600 premiers caractres du texte, les enrichissements
typographiques (gras, italique) sont supprims.
#URL_RUBRIQUE est lURL de la page de la rubrique.
#DATE affiche la date de la dernire publication effectue dans la rubrique et/ou ses sous-
rubriques (articles, brves...).
#FORMULAIRE_FORUM fabrique linterface permettant de poster un message rpondant
cette rubrique.
#PARAMETRES_FORUM fabrique la liste des variables exploites par linterface du
formulaire permettant de rpondre cette rubrique. Par exemple :

Le logo

#LOGO_RUBRIQUE le logo de la rubrique, ventuellement avec la gestion du survol. Sil
ny a pas de logo pour cette rubrique, SPIP va automatiquement chercher sil existe un logo
pour la rubrique dont elle dpend, et ainsi de suite de manire rcursive.
Le logo sinstalle de la manire suivante :
[(#LOGO_RUBRIQUE|alignement|adresse)]
#LOGO_RUBRIQUE_NORMAL affiche le logo sans survol ;
#LOGO_RUBRIQUE_SURVOL affiche le logo de survol : ces deux balises permettent par
exemple, quand on est dans une rubrique, de grer un logo avec survol pour les liens vers
les autres rubriques, et de laisser le logo de survol seul dans la rubrique active.

e) Une interface diffrente dans le mme site:

Tout dabord, notez quil est possible de crer des couples de fichiers pour le mme lment
logique (articles, rubriques, ...). Par exemple, vous pouvez crer des fichiers pour visiter un
mme article avec des interfaces diffrentes : article.php3/html pour le format normal,
imprimer.php3/html pour le mme article dans un format adapt limpression, article-
texte.php3/html pour larticle dans un format texte (adapt aux malvoyants par exemple),
article-lourd.php/html avec une interface lourdingue adapte au haut dbit, etc.

Une interface diffrente selon les rubriques. Vous pouvez, pour un mme type de
document, crer des squelettes diffrents selon les rubriques du site. Il sagit de crer
simplement de nouveaux fichiers .html en fonction des rubriques (inutile, ici, de modifier le
fichier .php3, on se contente de jouer sur les noms des fichiers squelettes).
Il suffit de complter le nom du fichier squelette de -numro (un tiret suivi dun numro
de rubrique). Par exemple, si vous crez un fichier : article-60.html, tous articles contenus
dans la rubrique n60 utiliseront ce squelette (et non plus le squelette par dfaut article.html).
Notez bien : le numro indiqu est celui dune rubrique. Si cette rubrique 60 contient des sous
rubriques, les articles contenus dans ces sous rubriques utiliseront galement le nouveau
squelette article-60.html.
10/25
II) Les lments grs par SPIP:

a) La hirarchie des rubriques:

Une rubrique est un espace destin accueillir des articles, des brves...
Les rubriques peuvent tre installes les unes dans les autres, formant ainsi une hirarchie.
Une rubrique est soit lintrieur dune autre rubrique, soit elle nest rattache aucune autre
et constitue alors un point dentre dans le site (nous parlons alors de tte de rubrique, ou de
secteur). Lembotement des rubriques les unes dans les autres constitue lossature de votre
site, puisque cest autour de cette structure que viendront se greffer les diffrents lments de
votre site (articles, brves, sites syndiqus...)

Ci-dessous, les rubriques du site sont reprsentes laide des icnes en forme de cartons et
sont donc des secteurs (ces rubriques dfinissent les grands secteurs thmatiques du site).
Les sous rubriques sont reprsents laide des icnes en forme de dossier et pour finir les
articles sont reprsents par les icnes en forme de carr.

Voici la structure hirarchique du site pour laquelle jai opt :

11/25
b) Les articles:

Un article se trouve dans une rubrique. Cela se gre trs simplement par un menu droulant.
Notez quune rubrique contenant elle-mme des sous rubriques peut parfaitement recevoir des
articles.

La seule subtilit des articles, cest leur statut. Un article peut tre :

En cours de rdaction : son (ou ses) auteur(s) sont en train dy travailler, il napparat donc
pas sur le site public, et son accs est limit sur le site priv ;

Propos la publication : lorsque lauteur dcide que son article est termin, il le propose
au comit de rdaction (les administrateurs et les autres rdacteurs) afin de dcider sil doit
tre publi ou non. Larticle nest toujours pas visible publiquement, mais tous les participants
lespace priv peuvent le voir et son invits le commenter dans un forum li cet article ;

Publi : larticle est publi sur le site public ;

Refus : larticle nest pas publi.

12/25
MODE DEMPLOI

I) Rcuprer SPIP :

SPIP est disponible en tlchargement par le Web ladresse :
http://www.spip.net/spip-dev/DISTRIB

Dans ce dossier vous trouverez :

un fichier spip.zip : il sagit de la version complte de SPIP, comprenant toutes les
traductions existantes ;

un sous-dossier o sont dposes les versions monolingues de SPIP (identifies par le code
de la langue en deux ou trois lettres) ; celles-ci peuvent tre utiles pour minimiser lespace
dhbergement occup et/ou le temps de tlchargement.
Choisissez la version qui vous intresse, dcompactez larchive sur votre ordinateur dans un
rpertoire de votre choix, puis transfrez le contenu de ce rpertoire chez votre hbergeur via
FTP.

II) Installer les fichiers :

Installez lensemble des fichiers de SPIP sur votre site, lendroit o vous voulez que le site
gr par le systme soit accessible au public : le plus souvent la racine de votre site, mais ce
nest pas impratif.
titre dinformation, la structure est la suivante :

rpertoire racine
o squelettes .html
o nombreux fichiers .php3
o dossier /CACHE (vide)
o dossier /IMG
o dossier /NAVPICS
o dossier /ecrire (le plus important)
nombreux fichiers .php3
dossier /AIDE
dossier /img_pack
dossier /data (vide)
dossier /lang
dossier /upload (vide)

13/25
III) Procdure de configuration :

Dsormais tout se droule en ligne. Il vous suffit daller visiter votre dossier /ecrire par
le Web.

Lors de la premire connections cette adresse, une procdure dinstallation pas pas
dmarre. Linterface est trs simple, il suffit dentrer les informations demandes
(essentiellement les informations concernant la base de donnes mySQL indiques au dbut).
Une fois termin, le systme vous demande lidentification que vous avez indique et vous
pouvez commencer grer votre site. Par la suite, cest toujours dans ce dossier /ecrire
que vous irez travailler, munis de vos codes didentification.

14/25
IV) Lespace priv:

Plus couramment appele ladministration du site, cest linterface qui permet de grer le site.
Elle nest accessible quaux rdacteurs du site. Ils peuvent, en fonction des permissions qui
leur sont accordes, grer larborescence du site, crer des articles, y insrer des images ou
autres documents, mettre en place des forums ou des ptitions. De plus aucun logiciel nest
ncessaire puisque tout cela se fait au travers dun navigateur Web.

Pour y accder un lien est prvu cette effet :

Pour accder lespace prive il suffit de rentrer le login et le mot de passe. Lcran daccueil
de SPIP est relativement intuitif et de plus en franais ce qui facilite la comprhension. Les
diffrentes parties de lespace priv sont reprsentes par des icnes tout en haut de la page.

Les parties sur lesquelles je vais mtendre vont tre EDITION, AUTEURS et
CONFIGURATION.

15/25
Voici lcran daccueil de SPIP :

a) La partie EDITION:

Comme sont nom lindique la partie dition gre la structure du site, cest ici que lon ajoute
les rubriques, sous rubriques, et articles

Pour lajout dune rubrique, un bouton Crer une rubrique est prvu cet effet.

La routine de cration est assez simple car il suffit dentrer le nom de la rubrique dans le
champ prvu cet effet et valider.

A lintrieur dune rubrique plusieurs choix soffre nous :

- Crer une sous rubrique
- Ecrire un nouvel article
- Ecrire une nouvelle brve...

Important :

Les articles crs dans une rubrique saffichent les uns en dessous des autres dans lordre de
cration des articles.
16/25
Pour insrer une image ou un document dans un article, vous devez les crer lun des
formats suivants :

GIF (extension .gif),
JPEG (extension .jpg),
PNG (extension .png).

Veillez particulirement ce que le nom de vos fichiers ait une terminaison indiquant leur
format : .gif, .jpg ou .png. Si vous installez un fichier dont le nom ne contient pas cette
extension, le systme ne saura pas utiliser limage.

tape 1 : Installation des images sur le serveur

Avant de pouvoir insrer vos images lintrieur du texte, il faut bien
entendu installer ces images sur le serveur. Cela se fait, dans SPIP, par
linterface graphique.
Lorsque vous modifiez un article ou une brve, la colonne de
gauche vous propose une interface intitule : Ajouter une image .
Cela se prsente sous la forme dun champ suivi dun bouton nomm,
suivant les navigateurs, parcourir , Browse , Slectionner ,
File , Fichier ...
Lorsque vous cliquez sur ce bouton, une interface souvre, vous
permettant de visiter votre disque dur et dindiquer quel fichier
graphique vous voulez slectionner.
Cela fait, cliquez sur le bouton intitul Tlcharger .
Si lopration a russi, votre image apparat dans la colonne de gauche,
complte de plusieurs indications...

tape 2 : Les informations lies votre image

Une fois votre image envoye au serveur, une case apparat sur la
gauche de lcran. Il y a l toutes les informations ncessaires qui la
concernent. (Une partie de ces informations apparat masque, cliquer
sur le triangle pour dplier la bote dinformation.)
Affichage sous forme de vignette. Une prvisualisation de votre
image apparat. Si limage est de grande taille (plus de 200 pixels de
large), cest une version de taille rduite qui est affiche.
Raccourcis SPIP. Voir ci-aprs : SPIP vous rappelle les 3
raccourcis qui vous permettent dinsrer cette image lintrieur
de votre texte. Notez que chaque image est numrote ainsi :
IMG1 , IMG2 ... Ces raccourcis sont utiliss dans la
troisime tape.
Taille de limage. Juste au-dessus de limage, la largeur et la hauteur
de votre image (en pixels - ou points ) sont rappeles.
17/25
Titre et description de limage. Vous pouvez, si vous le dsirez, indiquer un nom et une
description pour chaque image. Par exemple une explication, ou une mention du copyright du
photographe...
Supprimer cette image. Comme son nom lindique, le bouton Supprimer cette image
permet deffacer ce fichier, si vous avez fait une erreur de manipulation, ou si vous dcidez
finalement de ne pas utiliser limage dans ce texte. Il est conseill deffacer les images
inutilises, afin dviter dencombrer votre serveur avec des fichiers inutiles.
Vous pouvez recommencer lopration avec autant dimages que vous le dsirez (un article ou
une brve peuvent contenir autant dimages que ncessaire).

tape 3 : Insrer une image lintrieur du texte

A ce stade, les fichiers graphiques sont bien prsents sur le serveur, mais il reste indiquer
quel endroit de votre texte vous voulez les insrer. Pour cela, inutile de faire du HTML, SPIP
vous propose un raccourci permettant dinsrer votre image simplement.

Images sans commentaire
Pour chaque image, voyez la mention des 3 raccourcis :

<img1|left>
<img1|center>
<img1|right>

Recopiez lun de ces raccourcis (le nombre correspond au numro de limage, il change donc
pour chaque fichier), et recopiez-le lintrieur de la case Texte , l vous dsirez le situer
dans votre article. left aligne limage gauche, right droite, et center place votre
image au centre du texte.
Lors de laffichage lcran, SPIP remplacera ces raccourcis par le code HTML
correspondant, en calculant automatiquement la taille des images.

Images avec titre et description
Si vous avez indiqu un titre et/ou une description, les mentions sont remplaces par :

<doc1|left>
<doc1|center>
<doc1|right>

Elles sutilisent de la mme faon que ci-dessus ; cependant, lorsque vous insrez un
raccourci de ce type, SPIP insre dans votre texte non seulement limage, mais le titre et la
description que vous lui avez donne. Votre image apparat ainsi avec, ventuellement, une
explication et des mentions de copyright, le nom de lartiste, etc.

18/25
b) La partie AUTEURS :

La partie auteurs permet dobtenir des informations sur les auteurs ainsi que la liste de leurs
articles. Il y a deux types dauteurs les administrateurs qui ont tout les droits et les rdacteurs
qui on juste le droits dcrire un article et de le proposer la publication.

c) La partie CONFIGURATION :

19/25
Pour accder aux onglets, le plus important de la partie configuration, il suffit de glisser la
souris sur licne. Un menu droulant apparat, le plus important est vider le cache outils
utiliser en cas de mise jour du site.

Et le deuxime choix tout aussi important est Maintenance du site qui permet de
sauvegarder la base de donnes et de la restaurer.

1) Sauvegarder la base de donnes

Il y a deux manipulations faire :

- sauvegarder la base des articles et des brves. Se connecter comme administrateur.
Interface complte, Administration du site/maintenance du site/sauvegarde-
restauration de la base. Choisir sauvegarde non compresse par exemple. Clic sur
Sauvegarder la base.

-

20/25
CONCLUSION

Je tiens tout dabord remercier Mr URBAN, qui ma permis de
travailler sur ce projet qui me tenait tout particulirement cur,
premirement par lintrt que je porte linformatique et la
programmation et deuximement au vue de mes connaissances qui mont
permis de mener bien ce projet. Le but tait donc de construire un site
Internet dynamique et facile mettre jour pour la formation EEA.
Challenge dsormais relev, le site tant en ligne actuellement ladresse
suivante : http://www.trop.uha.fr/master . Des amliorations seront
srement utiles dans un futur proche, de plus le site Internet de la licence
EEA est en cours dlaboration et sera oprationnel dici peu.
Du point de vue technique, ce projet ma permis denrichir mes
connaissances sur la programmation Web et ma fait dcouvrir des outils
trs intressants comme SPIP (Systme de Publication pour lInternet) qui
savre trs utile pour la construction de site.Jai ainsi pu dvelopper ma
technique de recherche dinformation ainsi que mon esprit dinitiative.
Aprs deux mois de travail, je tire de cette nouvelle exprience une
grande satisfaction.

21/25

22/25
I) Les raccourcis typographiques :

Ce tableau rappelle brivement les mthodes utiliser pendant l'criture d'un article pour
ajouter des titres, du texte en gras, en italique, etc..., sans avoir connatre HTML.

Fonctionnalits

Mthodes

Commentaires

Intertitre

{{{ le titre }}}

Le texte entre triples accolades est affich comme un titre.

Changement de
paragraphe

Passer une ligne

Caractres gras

{{texte en gras}}

Le texte entre doubles accolades apparatra en gras.

Caractres en
italique

{texte en italiques}

Le texte entre simples accolades est affich en italique.
Astuce: pour avoir du texte en gras et en italique, mettre trois accolades
en insrant une espace (pour faire 1+2), et en respectant la symtrie. Ex
:
{ {{ texte en gras et en italique }} }

Liste puces

- premier lment
- deuxime lment
- etc...

Le petit trait sera automatiquement remplac par une puce, telles qu'elle
est dfinie dans la charte graphique.

Trait de sparation

----

Entrer une ligne contenant quatre petits tirets (au moins).

Lien hypertexte

[texte -> URL]

Mettre le texte et l'URL entre crochets, spars par une flche.
Le texte devient une zone cliquable, et renverra le lecteur sur la page
Web indique par URL . Ex :
[le site EEA->http://www.trop.uha.fr/master]

Lien hypertexte vers
un article

[texte->nd'article]

Pour renvoyer vers un article du site, il suffit de donner le numro de
l'article. Par exemple, en supposant que l'article 12 donne la liste des
contacts :
[nous contacter->12]

Lien vers une
rubrique

[texte->rubxxx]

O xxx est le numro de la rubrique. Ex :
[voyez notre agenda->rub3]

Lien vers une brve

[texte->brxxx]

O xxx est le numro de la brve. Ex :
[Annonce de l'AG->br25]

Note de bas de page
automatique

[[texte de la note]]

Le texte entre doubles crochets droits apparatra en bas de la page, et
sera remplac par un numro gnr automatiquement.

Note de bas de page
numrote

[[<x>texte de la
note]]

Le texte entre doubles crochets apparatra en bas de page, et sera
remplac par le numro x indiqu entre < > .

Faire un tableau
simple

| aaa | bbb | ccc |
| xxx | yyy | zzz |

Pour faire un tableau simple il suffit de sparer les colonnes par la barre
verticale.
Cette mthode autorise uniquement des cellules d'une seule ligne. Pour
faire des tableaux plus complexes, utiliser le langage HTML.

Insrer une image

<IMG1|left>
<CENTER>
<IMG1|center>
</CENTER>
<IMG1|right>

L'image doit avoir t prcdemment tlcharge sur le site par la
fonction tlcharger une nouvelle image dans la colonne de gauche
affiche quand on rdige un article.
Le systme indique alors sous quel nom l'image est disponible, et c'est
ce nom qui doit tre utilis dans les commandes ci-contre.
Trois commandes sont disponibles, selon qu'on veut voir l'image
gauche, au centre ou droite.
23/25
II) Utilisez SPIP avec EasyPHP :

Procdure pour utiliser SPIP en local , cest--dire sur notre PC sans tre oblig de passer par
un hbergeur.

Ce tutorial se droulera en trois temps :
Premier temps linstallation deasyphp, second temps linstallation des fichiers de SPIP sur
votre Web local et enfin la configuration de SPIP.

- INSTALLATION DEASYPHP

1. Tout dabord, rcuprez le logiciel.
2. Une fois easyphp rcupr et dcompact sur votre disque, lancez le fichier setup.exe.
3. Une fois install, vous obtenez lcran suivant.

4. Cliquez sur Terminer et vous devez obtenir lcran suivant.


24/25

5. Si vous voyez lcran ci-dessus, cest que easyphp est bien install. A prsent, nous allons
voir comment lancer et excuter easyphp. Si vous lisez bien lcran, on vous indique la chose
suivante : Pour ouvrir le Web local ou l'administration, vrifiez qu'easyphp.exe est lanc et
que les serveurs fonctionnent (le point rouge de l'icne d'easyphp ct de l'horloge dans la
barre des tches doit clignoter)

6. Si l'icne d'easyphp ct de l'horloge clignote cest que tout est ok. Que faire si a ne
clignote pas ? Faites un clic droit sur licne, vous devez voir apparatre loption Dmarrer.
Cliquez dessus. Il se peut que cette option soit grise et donc inactive. Dans ce cas, cliquez sur
quitter et relancer EasyPHP.
Les fichiers deasyphp se trouvent dans le rpertoire Program Files/easyphp.

- INSTALLATION DES FICHIERS SPIP SUR LE WEB LOCAL

Maintenant nous allons voir comment installer SPIP.

7. Rcuprez SPIP.
8. Une fois rcupr le fichier, dcompressez le sur votre disque et copiez les fichiers dans un
rpertoire TestSpip que vous aurez pralablement cr dans C:/ Program Files/easyphp/www.
9. Lancer votre Web local

10. Cliquez sur le lien TestSpip, vous devez obtenir lcran suivant :

25/25
11. Il est normal que lcran suivant saffiche, SPIP nest pas encore configur.

- CONFIGURATION DE SPIP

Linstallation a t assez rapide et la configuration le sera tout aussi.

12. Dans la barre dadresse, inscrivez la fin de la commande ecrire, donc vous devez avoir
http://localhost/TestSpip/ecrire/ (voir schma ci-dessous)

13. Validez votre commande et vous devez obtenir lcran suivant :

14. Ensuite le reste est trs simple, il vous suffit de suivre les instructions donnes lcran.

Projet Elmarnaoui

Transféré par

Informations du document

Titre original

Copyright

Formats disponibles

Partager ce document

Partager ou intégrer le document

Options de partage

Avez-vous trouvé ce document utile ?

Ce contenu est-il inapproprié ?

Droits d'auteur :

Formats disponibles

Projet Elmarnaoui

Transféré par

Droits d'auteur :

Formats disponibles

Licence EEA / Projet Cration dun site Internet

Etudiants : EL MARNAOUI Azdine session : 2005

4. Cliquez sur Terminer et vous devez obtenir lcran suivant.

Licence EEA / Projet Cration dun site Internet

13. Validez votre commande et vous devez obtenir lcran suivant :

Vous aimerez peut-être aussi