Personnaliser et adapter SPIP Développeur SPIP

Transcription

Personnaliser et adapter SPIP
Développeur SPIP
En pratique
Pour réaliser ce TD vous avez besoin de :
. Un navigateur web
. Un client FTP ou une invite de commande Unix
. Un éditeur de texte
Pour le TD nous avons mis à votre disposition l'ensemble des fichiers d'un site SPIP contenant
des articles déjà remplis.
Accédez à votre site SPIP préinstallé :
dans le navigateur saisissez l'adresse : http://wwwufe.obspm.fr/webfci/stag<votre numéro>/
tp-squelettes/
Dans une autre fenêtre de navigateur ouvrez l'interface d'administration de votre site spip :
http://wwwufe.obspm.fr/webfci/stag<votre numéro>/tp-squelettes/ecrire/
Login : stag<votre numéro>
Mot de passe : stag<votre numéro>
Créez en local sur votre bureau un dossier appelé squelette_voyage qui sera l'image locale du
dossier squelette_voyage sur le serveur.
connectez vous au dossier squelette_voyage de votre site SPIP par SFTP ou SSH:
serveur wwwufe.obspm.fr
login : webfci
mot de passe : webfci$2011
se placer dans le dossier squelette sur le serveur
cd public_html/votre nom/squelette_voyage/
se placer dans le dossier squelette local
lcd squelette_voyage
Conservez cette connexion ouverte pendant la durée du TD.
Contenu et design
Notre travail portera sur un site web de photos de voyage. Il propose une galerie de photos par
lieu visité avec un texte descriptif. Le plan du site est le suivant :
Voici la mise en page d'un article de notre site avec le squelette de base de SPIP :
La première étape consiste à définir une interface graphique pour notre site.
On peut réaliser une maquette sous Gimp ou Photoshop.
Voici le graphisme pour la mise en page d'un article.
Pour installer un squelette SPIP (Dans le cas de ce TP ces opérations ont déjà été effectuées :
vous n'avez rien à faire):
1) -Créer le dossier pour notre squelette SPIP. Appelons le squelette_voyage/.
Et y placer les fichiers du jeu de squelettes.
2) -Indiquer à SPIP d'utiliser le jeu de squelettes de ce dossier pour la mise en page.
Editer le fichier
/ecrire/mes_options.php3
qui doit contenir le code PHP suivant :
<?php
$GLOBALS["dossier_squelettes"] = "squelette_voyage";
?>
On affecte à la variable globale "dossier_squelettes" le nom du dossier qui contient le jeu de
squelettes que nous souhaitons utiliser.
La page sommaire
Nous allons commencer par créer la page d’entrée dans notre site web qui contiendra comme
information le nom du site ainsi que l'affichage des rubriques de niveau 0 (les secteurs) de notre site :
Cette page se nommera sommaire.html.
Créer le fichier sommaire.php dans le dossier squelette_voyage/ local (sur votre
bureau).
Créer le fichier site_voyage.css dans le dossier squelette_voyage/ local (sur votre
bureau).
Ce fichier contiendra l'ensemble des styles CSS de notre site web et sera appelé dans l'entête de
chacune des pages du squelette.
CSS et HTML
Pour le graphisme on découpe la page en "boîtes" qui correspondent aux balises <div> </div> en
HTML
Nous avons trois boîtes :
- Une boîte globale avec un cadre bleu, centrée dans la page. Nous appellerons cette boîte
"interface" et nous créerons un style .interface qui correspondra à son aspect graphique (centré, cadre
bleu). Cette boîte contient elle-même deux boîtes.
- Une des boîtes qui contient le titre du site. Nous appellerons cette boîte "titre_site" et nous
créerons un style .titre_menu qui correspondra à son aspect graphique.
- Une autre boîte qui contient le menu. Nous appellerons cette boîte "menu" et nous créerons un
style .menu qui correspondra a son aspect graphique.
En HTML le code correspondant à cette mise en page est :
Editer le fichier sommaire.html
Copier le code suivant
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.
w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
</head>
<body>
<div id="interface" class="interface">
<div id="titre_site" class="titre_site">
</div>
<div id="menu" class="menu">
</div>

<div style="clear :both;"></div>
</div>
</body>
</html>
Sauvegarder le fichier.
Nous devons ensuite créer une feuille de style CSS pour gérer l’aspect graphique de cette
interface. La boîte "interface" a les caractéristiques suivantes :
Largeur : 1000px
Hauteur minimale : 750px
Alignement dans le navigateur : centré
Une bordure bleu (la couleur exacte est codée #8CBCEC en hexadécimal) de 1px de large
Les boîte "titre_site" et "menu" ont les caractéristiques suivantes :
Alignement : centré
Editer le fichier le fichier site_voyage.css.
Copier le code suivant :
.interface
{
width:1000px;
margin:auto;
min-height:500px;
border:#8CBCEC;
border-width:1px;
border-style: solid;
}
.titre_site
{
text-align:center;
}
.menu
{
text-align:center;
}
Sauvegarder le fichier.
Il faut ensuite associer cette feuille de style au fichier sommaire.html du squelette :
ajoutez la ligne suivante à l’intérieur de l’élément <head> du fichier sommaire.html :
<head>
<link href="squelette_voyage/site_voyage.css" rel="stylesheet" type="text/
css"/>
</head>
...
sauvegarder le fichier
Placer les fichier sommaire.html et site_voyage.css sur le serveur via la connexion
SFTP.
Recalculer la page dans le navigateur
Les balises de SPIP
Jusque là nous n'avons utilisé que du code HTML et des styles CSS. Nous allons à présent
utiliser du code propre à SPIP pour afficher le titre du site à l'intérieur de la boîte "titre_site".
Le titre d'un site SPIP correspond à la valeur spécifiée dans l'interface d'administration de SPIP,
via l'onglet "Configuration -> Contenu du site", c'est le premier champ.
Dans notre cas, le site s'appelle "Voyages"; mais on pourrait utiliser notre squelette pour un autre
site et ce serait un autre texte qu'on indiquerait à cet emplacement.
Dans les squelettes SPIP il correspond à une balise qu'on peut utiliser à n'importe quel endroit
d'un squelette la balise #NOM_SITE_SPIP ( http://www.spip.net/fr_article1902.
html ).
Lorsqu'on l'utilise, SPIP remplace cette balise par le nom du site web.
Modifier le fichier sommaire.html en ajoutant la balise #NOM_SITE_SPIP dans la boîte
titre_site :
...
<div class="titre_site">
[(#NOM_SITE_SPIP)]
</div>
...
sauvegarder
Placer le fichier sommaire.html sur le serveur via la connexion FTP.
On peut agrémenter notre CSS afin que notre titre ressemble à un vrai titre de site
Modifier le fichier site_voyage.css
.titre_site
{
text-align:center;
font-family: Arial, Helvetica, sans-serif;
font-size: 36px;
font-weight: bold;
color: #8CBCEC;
}
sauvegarder
Placer le fichier sommaire.html sur le serveur via la connexion FTP.
Recalculer la page dans le navigateur
Les Boucles de SPIP
La réalisation d'un menu des rubriques de premier niveau nous offre une bonne occasion
d'utiliser les boucles de SPIP.
Mais avant toute chose nous devons nous replonger un peu dans le HTML et le CSS ; en effet
notre menu devra avoir cet aspect là :
Nous pouvons le décomposer en petites boîtes (une par item du menu) qui auront les
caractéristiques suivantes :
Largeur fixe : 200px;
Hauteur variable
Police de caractère : arial 12px gris
Notre code HTML sera donc (ne pas modifier le fichier sommaire.html pour l'instant) :
(...)
<div class="menu">
<div class="item">
item 1
</div>
<div class="item">
item 2
</div>
</div>
(...)
et chaque fois on remplacera item 1, item 2... par le titre d'une rubrique de niveau 1.
Pour lister les titres des rubriques de niveau 1 nous allons utiliser la boucle RUBRIQUES (
http://www.spip.net/fr_article904.html )
La boucle rubrique s'utilise de la façon suivante :
<Bn(RUBRIQUES){critères...}>
Instructions conditionnelles
<BOUCLEn(RUBRIQUES){critères...}>
Données à afficher
</ BOUCLEn>
Instructions conditionnelles
</Bn(RUBRIQUES){critères...}>
Instructions conditionnelles si aucun résultat n'est renvoyé
<//Bn(RUBRIQUES){critères...}>
Pour lister les rubriques de premier niveau nous pouvons utiliser deux critères différents :
- Le critère {racine} qui sélectionne les rubriques racines d'un site SPIP. Ces rubriques sont
appelées "secteur"
-Le critère {id_parent=0} qui sélectionne toutes les rubriques filles de la rubrique dont le
numéro est 0. Or il n'y a pas de rubrique de numéro 0 et ce critère sélectionne toutes les rubriques à la
racine de SPIP.
On utilise cette dernière solution. Nous n'utilisons pas d'instructions conditionnelles ici et les
données à afficher seront les titres des rubriques imbriqués dans des boîtes "item".
Pour afficher les titres des rubriques on peut utiliser la balise #TITRE de la boucle RUBRIQUE
qui affiche le texte du titre d'une rubrique.
modifier le code de sommaire.html en ajoutant la boucle _rubriques :
<div class="menu">
<BOUCLEmenu_rubriques(RUBRIQUES){id_parent=0}>
[<div class="item">(#TITRE)</div>]
</BOUCLEmenu_rubriques>
</div>
Sauvegarder.
Placer le fichier sommaire.html sur le serveur via la connexion SFTP.
Afficher la première page du site recalculer la page et regarder le code HTML généré par SPIP
pour comprendre le fonctionnement des boucles SPIP.
Il nous reste a mettre en page ce menu en créant un style CSS pour les éléments "item".
Modifiez le fichier site_voyage.css en ajoutant le style suivant à la suite des autres :
.item
{
width : 300px;
float:left;
font-size: 18px;
font-weight: bold;
color: #a6a6a6;
}
Sauvegarder.
Placer le fichier site_voyage.css sur le serveur via la connexion FTP.
Actualiser la page dans le navigateur
A présent nous voulons créer un lien sur chaque Item du menu afin que lorsqu'on clique sur une
rubrique, on accède a la page de la rubrique en question qui affichera le texte descriptif de la rubrique.
Pour cela on utilise la balise #URL_RUBRIQUE qui affiche l'URL de la page de la rubrique.
Essayez de deviner comment modifier le fichier sommaire.html pour définir un lien vers
cette URL sur chaque item .
Solution :
<div class="menu">
[<div class="item"><a href="[(#URL_RUBRIQUE)]">(#TITRE)</a></div>]
</div>
Modifier le fichier sommaire.html et placer le fichier sur le serveur pour tester le résultat
dans le navigateur.
Modifier le fichier site_voyage.css et placez les styles suivants à la suite des autres :
/*texte des boutons de rubrique*/
.item a
{
width : 300px;
float:left;
font-size: 18px;
font-weight: bold;
color: #a6a6a6;
text-decoration: none;
}
/* effet de survol sur les rubriques*/
.item a:hover
{
width : 300px;
float:left;
font-size: 18px;
font-weight: bold;
color: #000000;
}
placer le fichier sur le serveur actualiser le navigateur.
La balise #INCLURE
Voici à quoi devra ressembler notre page rubrique :
On remarque que toute une série d'éléments sont identiques à la page sommaire, à quelques
détails près. Par exemple le cadre bleu le titre et le menu.
Pour créer la page des rubriques nous devons créer et éditer un nouveau fichier rubrique.
html dans notre dossier squelette_voyage/. On pourrait recopier toute une partie du code de
sommaire.html.
Mais nous allons utiliser une autre solution : la balise <INCLURE>(http://www.spip.
net/fr_article1828.html).
La balise <inclure> permet d'intégrer dans un fichier de squelette SPIP du code contenu dans un
autre fichier du même dossier squelette.
On peut donc découper nos fichiers de squelettes SPIP en petites parties communes à plusieurs
fichiers de squelettes.
Nous allons par exemple extraire le code de notre menu du fichier sommaire.html et le
remplacer par une balise <inclure>.
Ensuite, nous pourrons utiliser de nouveau une balise inclure pour intégrer le menu au fichier
rubrique.html.
Créer un nouveau fichier menu.html et éditer ce fichier.
Copier le code suivant (extrait du fichier sommaire.html ):
<div class="menu">
[<div class="item"><a href="[(#URL_RUBRIQUE)]">(#TITRE)</a></div>]
</div>
Remplacer ce même code dans le fichier sommaire.html par
(...)
<INCLURE{fond=menu}>
(...)
Sauvegarder, placer les fichiers sommaire.html et menu.html sur le serveur, reclalculer
la page.
Copier-coller l'intégralité du code du fichier sommaire.html dans le fichier rubrique.
html.
Sauvegarder, placer le fichier rubrique.html sur le serveur, reclalculer la page.
Il n'y a aucune différence entre la page sommaire et une page rubrique. Il faudrait au moins que
la rubrique en cours soit d'une couleur différente dans le menu du haut.
La balise #EXPOSE
Pour cela on peut utiliser la balise #EXPOSE (http://www.spip.net/fr_
article2319.html)
L’objet qui est « exposé » est l’article (ou la brève, la rubrique, le mot-clé ou l’auteur) qui
appartient au « contexte » courant. La Balise #EXPOSE est remplacée par les caractères "on" si
une rubrique listée par une boucle RUBRIQUES correspond à la rubrique contextuelle (passée en
paramètre a la page).
Si vous cliquez sur la rubrique "Irlande", vous remarquerez que l'URL se termine par "spip.
php?rubrique2", la rubrique numéro 2 est la rubrique contextuelle dans ce cas là. Et lorsque la boucle
RUBRIQUES du menu traitera la rubrique 2, la balise #EXPOSE affichera les caractère "on", si ce
n'est pas la rubrique 2 qui est traitée, la balise #EXPOSE n'affichera rien.
- On crée une nouvelle classe CSS item_on avec une couleur différente pour indiquer dans quelle
rubrique on se situe.
Editer le fichier site_voyage.css. en ajoutant le style suivant à la suite des autres:
.item_on a
{
width : 300px;
float:left;
font-size: 18px;
font-weight: bold;
color: #87b7e8;
}
sauvegarder
Editer le fichier menu.html de façon a intégrer la balise #EXPOSE
<div class="menu">
<BOUCLE_menu_rubriques(RUBRIQUES){id_parent=0}>
[<div class="item[_(#EXPOSE)]"><a href="[(#URL_RUBRIQUE)]">(#TITRE)</a></
div>]
</BOUCLE_menu_rubriques>
</div>
- ! Important : comme on a utilisé une balise <INCLURE> dans nos fichiers de squelettes, nous
devons passer les informations de contexte (ID de la rubrique ou de l'article en cours) au fichier inclus,
ceci se fait à l'aide de paramètres.
Rien n'est à modifier dans le fichier sommaire.html, puisqu'il n'y a pas de contexte sur cette
première page.
En revanche on appelle le fichier rubrique.html avec un numéro de rubrique.
Modifier la balise <INCLURE> dans le fichier rubrique.html :
(...)
<INCLURE{fond=menu}{id_rubrique}>
(...)
Sauvegarder
Placer les fichier rubrique.html, menu.html et site_voyage.css sur le serveur,
reclalculer la page.
Mise en page de la liste des articles en colonne à gauche
Nous allons à présent réaliser un menu pour lister l'ensemble des articles d'une rubrique en
prenant exemple sur le fichier menu.html.
Lorsqu'on intégrera ce menu dans une page (rubrique ou article) on passera en paramètre un
contexte de rubrique (et éventuellement un contexte d'article).
Le menu affichera l'ensemble des articles de cette rubrique.
On suppose que {id_rubrique} est défini. On peut lister les titres des articles de cette rubrique
avec une boucle ARTICLE (http://www.spip.net/fr_article902.html) et la balise
#TITRE selon un système similaire au menu des rubriques.
Le menu sera contenu dans une boîte "menu_articles".
On inclura les items de ce menu dans des boîtes qu'on appellera "item_articles".
Créer un fichier menu_articles.html dans le dossier squelette_voyage/.
Essayez de trouver le code du fichier menu_articles.html.
Solution :
<div class="menu_articles">
<BOUCLEmenu_articles(ARTICLES){id_rubrique}>
[<div class="item_articles[_(#EXPOSE)]"><a href="[(#URL_
ARTICLE)]">(#TITRE)</a></div>]
</BOUCLEmenu_articles>
</div>
Sauvegarder
Intégrer ce menu dans la page rubrique.html, comme on à déjà intégré le premier menu,
avec la balise <INCLURE> :
(...)
<INCLURE{fond=menu_articles}{id_rubrique} {id_article} >
(...)
sauvegarder
Editer le fichier site_voyage.css. en ajoutant les styles suivants à la suite des autres :
.item_articles
{
margin-top:10px;
font-size: 14px;
font-weight: bold;
color: #a6a6a6;
}
.menu_articles
{
float:left;
margin-top:90px;
margin-left:15px;
width:150px;
}
.item_articles a
{
font-size: 14px;
font-weight: bold;
color: #a6a6a6;
}
.item_articles a:hover
{
font-size: 14px;
font-weight: bold;
color: #000000;
}
.item_articles_on
{
margin-top:10px;
font-size: 14px;
font-weight: bold;
color: #a6a6a6;
}
.item_articles_on a
{
font-size: 14px;
font-weight: bold;
color: #87b7e8;
}
Sauvegarder
Placer les fichier rubrique.html, menu_articles.html et site_voyage.css
sur le serveur, reclalculer la page.
Affichage du texte de la rubrique
Nous allons créer une nouvelle boîte pour afficher le contenu de la rubrique.
Cette boîte contiendra elle même deux boîtes : une pour le titre de la rubrique et une pour le
texte descriptif de la rubrique.
Editer le fichier rubrique.html
Après la balise <INCLURE> du menu des articles ajouter le code suivant :
(...)
<div class="contenu">
<div class="titre"> </div>
<div class="texte"> </div>
</div>
(...)
sauvegarder
Editer le fichier site_voyage.css. en ajoutant les styles suivant à la suite des autres:
/* boîte qui contient les titres et les textes des pages*/
.contenu
{
float:left;
margin-top:150px;
width:400px;
}
/*Boîte qui contient les titres des pages*/
.titre
{
font-size: 24px;
font-weight: bold;
color: #8CBCEC;
}
/*Boîte qui contient les textes des pages*/
.texte
{
font-size: 12px;
color: #a6a6a6;
}
sauvegarder
Pour afficher le contenu de la rubrique nous allons utiliser une boucle RUBRIQUES qui ne
sélectionnera que la rubrique en cours via le critère {id_rubrique}. On affichera le titre avec la balise
#TITRE de la boucle RUBRIQUES et le texte via la balise #TEXTE de la boucle RUBRIQUES.
Editer le fichier rubrique.html en ajoutant juste après les menus
(...)
<BOUCLE_rubrique_actuelle(RUBRIQUES){id_rubrique}>
<div class="titre">[(#TITRE)]</div>
<div class="texte">[(#TEXTE)]</div>
</div>
</BOUCLE_rubrique_actuelle>
(...)
sauvegarder
page.
Placer les fichier rubrique.html et site_voyage.css sur le serveur, reclalculer la
Affichage des articles
Nous pouvons réutiliser une bonne partie du code du fichier rubrique.html pour créer notre
fichier article.html.
Créer un fichier article.html.
Editer ce fichier, copier-coller le code suivant en modifiant la boucle RUBRIQUE en boucle
ARTICLE et le critère {id_rubrique} en critère {id_article}:
<head>
css" />
</head>
<body>
<div class="interface">
[(#NOM_SITE_SPIP)]
</div>
<INCLURE{fond=menu_articles}{id_rubrique}>
<BOUCLE_article_actuel(ARTICLES){id_article}>
</div>
</BOUCLE_article_actuel>
</div>
</body>
</html>
sauvegarder
Placer le fichier articles.html sur le serveur, reclalculer la page.
On remarque que le menu des articles (à droite) ne s'affiche plus sur la page article et que la
rubrique en cours n'est pas affichée sur le menu du haut.
Cela vient du fait qu'on passe le critère {id_rubrique} dans les balises <INCLURE> alors
qu'on appelle le fichier article.html non plus avec un numéro de rubrique mais avec un numéro
d'article. {id_rubrique} n'est donc pas défini dans la page et {id_article} prend la valeur passée en
paramètre.
Il faut donc se placer dans le contexte de l'article avant d'afficher les menus. Lorsqu'un article
a été sélectionné avec une boucle ARTICLES, on se trouve dans le contexte de cet article. Le critère
{id_rubrique} correspond alors au numéro de la rubrique de l'article sélectionné.
Modifier le fichier article.html en déplaçant le début de la boucle
_article_actuel avant les balises <INCLURE> :
<head>
css" />
</head>
<body>
<div class="interface">
[(#NOM_SITE_SPIP)]
</div>
<BOUCLE_article_actuel(ARTICLES){id_article}>
<INCLURE{fond=menu_articles}{id_rubrique}>
</div>
</BOUCLE_article_actuel>
</div>
</body>
</html>
sauvegarder
Placer le fichier article.html sur le serveur, reclalculer la page.
Les documents associés : une photothèque
Nous allons à présent utiliser la boucle DOCUMENTS pour lister les éléments multimédia
associés a un article et réaliser une photothèque.
Nous allons créer une boîte "document_associes" cette boîte contiendra une boîte "photo" pour
l'image affichée en grand et une boîte "planche_contact" pour la planche contact.
La boîte "planche_contact" contiendra elle même des petites boîtes "photo_icone" pour les
miniatures de chaque images. Au niveau HTML on obtient le code suivant :
Ne rien saisir pour le moment
(...)
<div class=" document_associes">
<div class="photo"> </div>
<div class="planche_contact">
<div class="photo_icone"></div>
</div>
</div>
(...)
Pour la photo en grand :
Si un paramètre id_document est passé dans l'URL alors on peut faire une requête sur ce
document et l'afficher dans la boîte "photo".
Pour la planche contact on utilise la boucle DOCUMENTS avec le critère {id_article} afin de
récupérer tous les documents associés à l'article en cours. On affiche ensuite le résultat dans les boîtes
prévues.
Pour afficher les images on utilisera la balise #FICHIER de la boucle DOCUMENTS et le filtre
image_reduire qui permet de générer des miniatures d'images automatiquement. Ce filtre prend en
critère la dimension maximale de l'image réduite.
Modifier le fichier article.html en ajoutant le code suivant juste avant </BOUCLE_
article_actuel>
(...)
<div class="document_associes">
<BOUCLE_photo(DOCUMENTS){id_document}>
<div class="photo">[(#FICHIER|image_reduire{300})]</div>
</BOUCLE_photo>
<B_planche_contact>
<div class="planche_contact">
<BOUCLE_planche_contact(DOCUMENTS){id_article}>
<div class="photo_icone"> [(#FICHIER|image_reduire{50})] </div>
</BOUCLE_planche_contact>
</div>
</B_planche_contact>
</div>(...)
Sauvegarder
Editer le fichier site_voyage.css. en ajoutant les styles suivant à la suite des autres:
/*la boîte pour l'ensemble photo en grand + planche contact*/
.document_associes
{
margin-top:150px;
margin-left:80px;
margin-bottom:50px;
width: 300px;
float:left;
}
/*la boîte pour la photo en grand*/
.photo
{
width:300px;
}
.photo img
{
border: 3px solid #000000;
}
/*La boîte planche contact*/
.planche_contact
{
}
/*les boîtes pour les miniatures*/
.photo_icone
{
float:left;
margin:5px;
width:50px;
height:50px;
}
/*le miniatures avec un cadre noir*/
.photo_icone img
{
border: 3px solid #000000;
}
Sauvegarder
Sur chaque image de la planche contact nous devons ajouter un lien vers la page article en cours
avec un paramètre en plus : l'id_document du document sur lequel on vient de cliquer ; pour cela on
utilise la balise #URL_ARTICLE de la boucle ARTICLES _article_actuel.
On utilise aussi le filtre technique parametre_url ():
Modifier le fichier article.html en ajoutant les liens sur les miniatures.
(...)
<div class="photo_icone"> [<a href="[(#_article_actuel:URL_ARTICLE|parametre_
url{id_document,[(#ID_DOCUMENT)]})]">(#FICHIER|image_reduire{50})</a>] </div>
(...)
page.
sauvegarder
Placer les fichier article.html et site_voyage.css sur le serveur, reclalculer la

Personnaliser et adapter SPIP Développeur SPIP

Transcription

Documents pareils

sarl div`in nature - Le portail des produits fermiers du Mont d`or

- TEST - Lecture fichier PDF

TP14- Passage HTML5

L`innovation en Biologie Médicale

francois sanchez consultants

calendrier rattrap examens lap sem 5 2015.2016

Ce document n`existe plus. Veuillez consulter la rubrique `Contact

Quand l`Ecole est finie. Premiers pas dans la vie active

Grille thématique EIP4_pdf

Oscilloscope HAMEG 303-6