CREATION DU SITE INTERNET POUR LA FORMATION EEA DE MULHOUSE
Champs technologiques : Informatique + Communication
Professeur responsable : J.P URBAN
Etudiant : EL MARNAOUI Azdine
Licence EEA / Projet Cration dun site Internet Etudiants : EL MARNAOUI Azdine session : 2005 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
Licence EEA / Projet Cration dun site Internet Etudiants : EL MARNAOUI Azdine session : 2005 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, ...). Licence EEA / Projet Cration dun site Internet Etudiants : EL MARNAOUI Azdine session : 2005 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
Licence EEA / Projet Cration dun site Internet Etudiants : EL MARNAOUI Azdine session : 2005 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.
Licence EEA / Projet Cration dun site Internet Etudiants : EL MARNAOUI Azdine session : 2005 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. Licence EEA / Projet Cration dun site Internet Etudiants : EL MARNAOUI Azdine session : 2005 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.
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.
Licence EEA / Projet Cration dun site Internet Etudiants : EL MARNAOUI Azdine session : 2005 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).
Licence EEA / Projet Cration dun site Internet Etudiants : EL MARNAOUI Azdine session : 2005 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. Licence EEA / Projet Cration dun site Internet Etudiants : EL MARNAOUI Azdine session : 2005 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 :
Licence EEA / Projet Cration dun site Internet Etudiants : EL MARNAOUI Azdine session : 2005 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.
Licence EEA / Projet Cration dun site Internet Etudiants : EL MARNAOUI Azdine session : 2005 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)
Licence EEA / Projet Cration dun site Internet Etudiants : EL MARNAOUI Azdine session : 2005 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.
Licence EEA / Projet Cration dun site Internet Etudiants : EL MARNAOUI Azdine session : 2005 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.
Licence EEA / Projet Cration dun site Internet Etudiants : EL MARNAOUI Azdine session : 2005 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. Licence EEA / Projet Cration dun site Internet Etudiants : EL MARNAOUI Azdine session : 2005 16/25 Pour insrer une image ou un document dans un article, vous devez les crer lun des formats suivants :
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. Licence EEA / Projet Cration dun site Internet Etudiants : EL MARNAOUI Azdine session : 2005 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.
Licence EEA / Projet Cration dun site Internet Etudiants : EL MARNAOUI Azdine session : 2005 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 :
Licence EEA / Projet Cration dun site Internet Etudiants : EL MARNAOUI Azdine session : 2005 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.
-
Licence EEA / Projet Cration dun site Internet Etudiants : EL MARNAOUI Azdine session : 2005 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.
Licence EEA / Projet Cration dun site Internet Etudiants : EL MARNAOUI Azdine session : 2005 21/25
Licence EEA / Projet Cration dun site Internet Etudiants : EL MARNAOUI Azdine session : 2005 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.
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. Licence EEA / Projet Cration dun site Internet Etudiants : EL MARNAOUI Azdine session : 2005 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.
Licence EEA / Projet Cration dun site Internet Etudiants : EL MARNAOUI Azdine session : 2005 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 :
Licence EEA / Projet Cration dun site Internet Etudiants : EL MARNAOUI Azdine session : 2005 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)