Introduction à l'outil Spip (version 3)

Save this PDF as:
 WORD  PNG  TXT  JPG

Dimension: px
Commencer à balayer dès la page:

Download "Introduction à l'outil Spip (version 3)"

Transcription

1 Introduction à l'outil Spip (version 3) Objectifs Connaître les principales caractéristiques de cet outil Etre capable de mettre en place un site simple avec Spip Ce document d'enseignement est diffusé librement, pour usage individuel. Il est librement téléchargeable sur le site de l'auteur *. Michel Cartereau - Novembre 2013 AgroParisTech - UFR d'informatique - 16, rue Claude Bernard - F PARIS CEDEX 05 michel.cartereau à agroparistech.fr - Téléphone : *

2 PRÉSENTATION GÉNÉRALE UN OUTIL DE GESTION DE CONTENU STRUCTURATION DES CONTENUS ET D'UN ARTICLE PRINCIPE DE CONSTRUCTION D'UNE PAGE Introduction à Spip - Page 2

3 UN OUTIL DE GESTION DE CONTENU SPIP : SYSTÈME DE PUBLICATION POUR L INTERNET 1 SYSTÈME AUTOMATISANT LA CRÉATION DE PAGES WEB Espace privé Interface pour créer les contenus d'édition (articles, illustrations,...) Formulaires accessibles à des rédacteurs inscrits et l'administrateur Moteur de publication Production de pages Web à partir de contenus et de la mise en page Mise en page réalisée par des spécialistes («squelettes») OUTIL LIBRE TRÈS UTILISÉ DANS L'INTERNET NON MARCHAND 1 SPIP est présenté ici dans sa dernière version 3.0. Introduction à Spip - Page 3

4 STRUCTURATION DES CONTENUS MODÈLE ÉDITORIAL CALQUÉ SUR UN JOURNAL ORGANISATION ÉDITORIALE Une hiérarchie de rubriques Au premier niveau : têtes de rubriques ou «secteurs» Une rubrique regroupe des articles et-ou sous-rubriques Rubrique sans article : automatiquement inactivée (non publiée) Un ensemble d'articles Unité élémentaire de publication rattachée à une rubrique Différents états : en cours de rédaction, proposé à publication, publié Possibilité d'inclure une illustration ou d'adjoindre un document Eléments complémentaires et optionnels Brève : court article rattaché à un secteur Forum de discussion : rattaché à une rubrique, un article ou une brève Pétition : rattachée à un article PRÉSENTATION LIMITÉE ICI À L'ESSENTIEL DE L'OUTIL! Introduction à Spip - Page 4

5 STRUCTURE D'UN ARTICLE STRUCTURE EXTENSIBLE PRINCIPAUX COMPOSANTS Titre l'identification de l'article (obligatoire), auteur et date a priori ajoutés Texte le contenu de l'article, avec possibilités de raccourcis typographiques (mise en gras ou italique, intertitre, listes, liens, etc.) COMPOSANTS OPTIONNELS Compléments au texte images et documents joints Autres composants éditoriaux potentiels 1 présentés avec le texte : sur-titre (au-dessus du titre), sous-titre (endessous), chapeau (résumé ou introduction), post-scriptum (à la fin) utilisé dans une liste d'articles : descriptif UN ARTICLE EST TOUJOURS RATTACHÉ À UNE RUBRIQUE 1 Utilisation décidée par l'administrateur du site (espace privé : CONFIGURATION CONTENU DU SITE) Introduction à Spip - Page 5

6 PRINCIPE DE CONSTRUCTION D'UNE PAGE PAGE CRÉÉE DYNAMIQUEMENT PAR SPIP SQUELETTE DE PAGE Modèle de contenu générique pour un type de page du site incrustation de balises spécifiques à Spip dans du code XHTML Transformation dynamique en page Web exécution des balises spécifiques par le moteur de Spip, avec extraction de contenus dans la base de données et exploitation de feuille(s) de style associées SÉPARATION POUSSÉE DU CONTENU ET DE LA PRÉSENTATION Introduction à Spip - Page 6

7 SQUELETTES PRINCIPAUX SQUELETTES ECRITURE D'UN SQUELETTE EXEMPLE SIMPLE Introduction à Spip - Page 7

8 PRINCIPAUX SQUELETTES DU SITE UN SQUELETTE EST UN MODÈLE DE PAGE DANS SPIP ORGANISATION Hiérarchie des contenus page d'accueil du site : sommaire.html page du sommaire d'une rubrique : rubrique.html page de présentation d'un article : article.html Pages complémentaires plan du site : plan.html auteur d'article : auteur.html résultats d'une recherche dans le site : recherche.html signalement d'une anomalie : 404.html DOSSIERS POUR LES SQUELETTES Squelettes personnalisés : dossier squelettes (à créer si besoin) choisis en priorité avant un squelette fourni par Spip Jeu de squelettes fournis par Spip : dossier squelettes-dist 1 pris en compte en absence d'un squelette personalisé UTILISER LE DOSSIER DES SQUELETTES PERSONNALISÉS : squelettes 1 Dans les versions anciennes de Spip (1.9, 1.8 etc.), c'était le dossier dist Introduction à Spip - Page 8

9 ECRITURE D'UN SQUELETTE DE PAGE LANGAGE SPÉCIFIQUE À SPIP 1 [(#REM) Les 2 derniers articles ] <B_articles_recents> <ul> <BOUCLE_articles_recents(ARTICLES) {!par date} {0,2}> <li> #TITRE </li> </BOUCLE_articles_recents> </ul> </B_articles_recents> AJOUT DE BALISES DE SPIP À DU CODE XHTML Balises d'identification d'un élément de contenu exemple : #TITRE pour le titre d'article en élément de liste Balise d'itération exemple : liste des titres des 2 derniers articles, classés par le plus récent d'abord (ordre anté-chronologique) <B_articles_recents> <BOUCLE_articles_recents(ARTICLES) {!par date} {0,2}> <li> #TITRE </li> </BOUCLE_articles_recents> </B_articles_recents> Balises diverses exemple de commentaire : [(#REM) Les 2 derniers articles] DOCUMENTATION EN LIGNE : 1 Présentation ici du cas de la version 3.0 de Spip Introduction à Spip - Page 9

10 EXEMPLE D'UN SITE SIMPLE CAS D'UN PETIT SITE AVEC UN SEUL NIVEAU DE RUBRIQUES entête (header) zone de navigation (nav) contenu (content) pied de page (footer) colonne latérale (aside) CONSTRUCTION D'UNE PAGE PAR PAVÉS Modèle simple en 5 parties entête, zone de navigation, colonne latérale au contenu, et pied Structure inspirée selon le modèle retenu en HTML 5 COMPOSANTS DES PAGES Eléments communs à toutes les pages déclarations de feuilles de styles et de scripts, entête, pied de page Eléments pour certaines pages pavé de la navigation ORGANISATION INSPIRÉE DE CELLE DES SQUELETTES FOURNIS AVEC SPIP Introduction à Spip - Page 10

11 EXEMPLE SIMPLE : MISE EN PAGE RÉFÉRENCE : SQUELETTE EN HTML Divisions supplémentaires : wrapper et main respectivement parentes de contenu, et de wrapper + aside mécanisme facilitant la mise en forme avec CSS Code en HTML <div class="page"> <div class="header"> </div> <div class="nav"> </div> <div class="main"> <div class="wrapper"> <div class="content"> </div> </div> <div class="aside"> </div> </div> <div class="footer"> </div> </div> STYLES DE MISE EN PAGE Utilisation du positionnement en CSS attribut : float: Styles en CSS.wrapper { clear: both; float: left; width: 70%; }.aside { float: right; width: 25%; }.footer { clear: both; } MISE EN PAGE SIMPLE Introduction à Spip - Page 11

12 EXEMPLE SIMPLE : COMPOSANTS DU SOMMAIRE COMPOSANTS INCLUS DANS LE SQUELETTE DU SOMMAIRE INCLUSION D'UN COMPOSANT AVEC SPIP Balise spécifique : <INCLURE{fond=nom}> nom court du fichier contenant le composant, sans l'extension.html Contenu principal de sommaire.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " <html xmlns=" xml:lang="fr" lang="fr"> <head> <title>#nom_site_spip</title> <INCLURE{fond=inclure/head}> </head> <body> <div class="page"> <INCLURE{fond=inclure/header}> <INCLURE{fond=inclure/nav}> <div class="main"> <div class="wrapper"> <div class="content"> <INCLURE{fond=inclure/recents}> </div> </div> <div class="aside"> </div> </div> <INCLURE{fond=inclure/footer}> </div> </body> </html> CONVENTION DANS SPIP 3 : COMPOSANT DANS LE SOUS-DOSSIER «inclure» Introduction à Spip - Page 12

13 EXEMPLE SIMPLE : COMPOSANTS ÉLÉMENTAIRES COMPOSANT DES DÉCLARATIONS : head.html inséré dans la partie de l'en-tête XHTML de la page Web (<head>) alphabet utilisé (#CHARSET) et version de Spip (#SPIP_VERSION) chemin interne d'accès à un fichier, déterminé par Spip : #CHEMIN{fichier} feuilles de styles multiples et complémentaires : layout.css (disposition), typo.css (élements de base), style.css (tout le reste) balises spéciales pour les extensions : #INSERT_HEAD et #INSERT_HEAD_CSS contenu de head.html <meta http-equiv="content-type" content="text/html; charset=#charset" /> <link rel="stylesheet" href="#chemin{css/layout.css}" type="text/css" /> <link rel="stylesheet" href="#chemin{css/style.css}" type="text/css" /> <link rel="stylesheet" href="#chemin{css/typo.css}" type="text/css" /> #INSERT_HEAD_CSS #INSERT_HEAD <meta name="generator" content="spip[ (#SPIP_VERSION)]" /> COMPOSANT DE L'ENTÊTE DE PAGE : header.html formulaire de recherche (#FORMULAIRE_RECHERCHE) logo (#LOGO_SITE_SPIP), adresse (#URL_SITE_SPIP) et nom du site (#NOM_SITE_SPIP) libellé pour désigner l'accueil du site traduit selon la langue du site (<:accueil_site:>) contenu de header.html <div class="header"> <a rel="start home" href="#url_site_spip/" title="<:accueil_site:>" >#LOGO_SITE_SPIP</a> <span class="titre_site">#nom_site_spip</span> </div> COMPOSANT DU PIED DE PAGE : footer.html adresse Web d'une page : #URL{nom court de page} libellé pour désigner le plan du site traduit selon la langue du site (<:plan_site:>), idem pour l'espace privé (<:espace_prive:>) balise spéciale pour le lien d'administration : #EVAL{_DIR_RESTREINT_ABS} contenu de footer.html <div class="footer"> <p class="colophon"> <a rel="contents" href="#url_page{plan}"><:plan_site:></a> <a href="#eval{_dir_restreint_abs}"><:espace_prive:></a> <a href=" avec SPIP</a> </p> </div> CONVENTION DANS SPIP 3 : FEUILLES DE STYLE DANS LE SOUS-DOSSIER «css» Introduction à Spip - Page 13

14 EXEMPLE SIMPLE : NAVIGATION LISTE DES RUBRIQUES SOUS FORME DE LIENS (AVEC LE LIEN VERS L'ACCUEIL DU SITE AU DÉBUT) COMPOSANT DE LA NAVIGATION : inclure/nav.html Forme générale d'une boucle d'itération sur des rubriques <B_identification> code HTML optionnel avant (si au-moins 1 élément) <BOUCLE_identification(RUBRIQUES) {critère 1 } {critère 2 }... > code HTML et balises de Spip </BOUCLE_identification> code HTML optionnel après (si au-moins 1 élément) </B_identification> Critères de sélection ou de tri des rubriques rubriques de tête seulement ({racine}) tri par ordre alphabétique du titre ({par titre}) Balises pour les données d'une rubrique titre (#TITRE), adresse de la page correspondante (#URL_RUBRIQUE) indicateur si rubrique en cours de consultation (#EXPOSE), vaut on si vrai SQUELETTE <B_nav> <div class="nav"> <ul> <BOUCLE_nav(RUBRIQUES) {racine} {par titre}> <li[ class="(#expose)"]><a href="#url_rubrique">#titre</a></li> </BOUCLE_nav> </ul> </div> </B_nav> Introduction à Spip - Page 14

15 EXEMPLE SIMPLE : ARTICLES RÉCENTS BOUCLE : LISTE DES 2 DERNIERS ARTICLES PARUS DANS LE SITE COMPOSANT DES ARTICLES RÉCENTS : inclure/recents.html Forme générale d'une boucle d'itération sur des articles <B_identification> code HTML optionnel avant (si au-moins 1 élément) <BOUCLE_identification(ARTICLES) {critère 1 } {critère 2 }... > code HTML et balises de Spip </BOUCLE_identification> code HTML optionnel après (si au-moins 1 élément) </B_identification> Critères de sélection ou de tri des articles tri par ordre chronologique ({par date}) ou à l'envers ({!par date}) limitation du nombre : N à partir du n P 1 ({P, N}) Balises pour les données d'un article titre (#TITRE), date de mise en ligne (#DATE), introduction (#INTRODUCTION), auteurs (#LESAUTEURS), adresse de la page de l'article (#URL_ARTICLE) Formatage d'une date valeur brute (horodate) : #DATE ; exemple : :40:18 forme réduite à la date en clair : [(#DATE affdate_jourcourt)] avec année absente si courante, exemple : 9 mars 2008 application d'un «filtre» : [(balise filtre)] EXTRAIT DU SQUELETTE <B_articles> <div class="menu menu_articles" id="articles_recents"> <h2><:articles_recents:></h2> <ul> <BOUCLE_articles(ARTICLES) {!par date} {0,2} > <li class="hentry"> <h3 class="entry-title"><a href="#url_article">#titre</a></h3> [(#DATE affdate_jourcourt)][, <:par_auteur:> (#LESAUTEURS)] [<div class="introduction">(#introduction)</div>] </li> </BOUCLE_articles> </ul> </div><!--#articles_recents--> </B_articles> 1 Attention : numérotation à partir de zéro (0) et non pas un (1). Introduction à Spip - Page 15

16 EXEMPLE SIMPLE : SQUELETTE DU SOMMAIRE <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " <html lang="fr" xmlns=" xml:lang="fr" > <head> <title>#nom_site_spip</title> <INCLURE{fond=inclure/head} /> </head> <body class="page_sommaire"> <div class="page"> <INCLURE{fond=inclure/header} /> <INCLURE{fond=inclure/nav} /> <div class="main"> <div class="wrapper"> <div class="content" id="content"> [<div class="chapo">(#descriptif_site_spip)</div>] <INCLURE{fond=inclure/recents} /> </div><!--.content--> </div><!--.wrapper--> <div class="aside"> #FORMULAIRE_RECHERCHE </div><!--.aside--> </div><!--.main--> <INCLURE{fond=inclure/footer} /> </div><!--.page--> </body> </html> Introduction à Spip - Page 16

17 EXEMPLE SIMPLE : SQUELETTE D'UNE RUBRIQUE (1) BOUCLE : LISTE DES ARTICLES PARUS DANS UNE RUBRIQUE FICHIER rubrique.html Identification de la rubrique par id_rubrique 1 fixation du contexte à la rubrique pour la page entière : <BOUCLE_principale(RUBRIQUES) {id_rubrique}> code HTML et balises de Spip pour la page </BOUCLE_principale> passage de l'identification à un autre composant (environnement : env) : <INCLURE{fond=composant,env} /> Chemin de navigation à partir de l'accueil du site (fil d'ariane) boucle spécifique : <BOUCLE_ariane(HIERARCHIE){id_rubrique}> code HTML et balises de Spip pour la rubrique parente </BOUCLE_ariane> Boucle d'itération sur les articles de la rubrique critère représentant la rubrique courante : {id_rubrique} <BOUCLE_identification(ARTICLES) {id_rubrique} {critère 1 }... > code HTML et balises de Spip </BOUCLE_identification> Balises pour les articles d'une rubrique titre (#TITRE), adresse de la page de la rubrique (#URL_RUBRIQUE) Filtrage d'un texte reprise au maximum des taille premiers caractères : (texte couper{taille}) Libellé traduit selon la langue du site accueil du site (<:accueil_site:>) 1 L'identification de la rubrique (id_rubrique) est déterminée par son numéro lors de l'appel de la page ; exemple : rubrique n 23 Introduction à Spip - Page 17

18 EXEMPLE SIMPLE : SQUELETTE D'UNE RUBRIQUE (2) SQUELETTE <BOUCLE_principale(RUBRIQUES) {id_rubrique}> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " <html lang="fr" xmlns=" xml:lang="fr" > <head> <title>#titre</title> <INCLURE{fond=inclure/head} /> </head> <body class="page_rubrique"> <div class="page"> <INCLURE{fond=inclure/header} /> <INCLURE{fond=inclure/nav,env} /> <div class="main"> [(#REM) Contenu principal : contenu de la rubrique ] <div class="wrapper"> <div class="content" id="content"> <p class="arbo"><a href="#url_site_spip/"><:accueil_site:></a> <BOUCLE_ariane(HIERARCHIE){id_rubrique}> > <a href="#url_rubrique">[(#titre couper{80})]</a> </BOUCLE_ariane> [ > <strong class="on">(#titre couper{80})</strong>] </p><!--.arbo--> <h1>#titre</h1> [<div class="texte">(#texte)</div>] [(#REM) Articles de la rubrique ] <B_articles> <div class="menu menu_articles"> <ul> <BOUCLE_articles(ARTICLES) {id_rubrique} {!par date}> <li> <strong><a href="#url_article">#titre</a></strong> <br />[(#DATE affdate_jourcourt)][, <:par_auteur:> (#LESAUTEURS)] </li> </BOUCLE_articles> </ul> </div> </B_articles> </div><!--.content--> </div><!--.wrapper--> <div class="aside"> #FORMULAIRE_RECHERCHE </div><!--.aside--> </div><!--.main--> <INCLURE{fond=inclure/footer} /> </div><!--.page--> </body> </html> </BOUCLE_principale> Introduction à Spip - Page 18

19 EXEMPLE SIMPLE : SQUELETTE D'UN ARTICLE (1) FICHIER article.html VISUALISATION D'UN ARTICLE Identification de l'article par id_article 1 fixation du contexte à la rubrique pour la page entière : <BOUCLE_principale(ARTICLES) {id_article}> code HTML et balises de Spip pour la page </BOUCLE_principale> réutilisation dans une boucle d'articles dans la page : #ENV{id_article} Balises complémentaires pour des données optionnelles d'un article surtitre (#SURTITRE), soustitre (#SOUSTITRE), chapeau (#CHAPO) Filtres utilisés pour la date de mise en ligne de l'article nom du jour de la semaine (nom_jour), en clair complète (affdate) Libellé traduit selon la langue du site dans la même rubrique (<:meme_rubrique:>) SQUELETTE <BOUCLE_principale(ARTICLES) {id_article}> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " <!-- article.html - revu par Michel Cartereau 20 XI > <html lang="fr" xmlns=" xml:lang="fr" > <head> <title>#titre</title> <INCLURE{fond=inclure/head} /> </head> <body class="page_article"> <div class="page"> <INCLURE{fond=inclure/header} /> <INCLURE{fond=inclure/nav,env} /> (suite du squelette à la page suivante) 1 L'identification de l'article (id_article) est déterminée par son numéro lors de l'appel de la page ; exemple : article n 3 Introduction à Spip - Page 19

20 EXEMPLE SIMPLE : SQUELETTE D'UN ARTICLE (2) (suite du squelette) <div class="main"> [(#REM) Contenu principal : contenu de l'article ] <div class="wrapper"> <div class="content" id="content"> <p class="arbo"><a href="#url_site_spip/"><:accueil_site:></a> <BOUCLE_ariane(HIERARCHIE){id_article}> > <a href="#url_rubrique">[(#titre couper{80})]</a> </BOUCLE_ariane> [ > <strong class="on">(#titre couper{80})</strong>] </p> <div class="cartouche"> [<p class="surtitre">(#surtitre)</p>] <h1 class="surlignable">#titre</h1> [<p class="soustitre">(#soustitre)</p>] <p class="info-publi"> <abbr class="published">[(#date nom_jour) ][(#DATE affdate)] </abbr>[<span class="sep">, </span> <span class="auteurs"><:par_auteur:> (#LESAUTEURS)</span>] </p> </div> [<div class="chapo">(#chapo image_reduire{500,*})</div>] [<div class="texte">(#texte image_reduire{500,*})</div>] [(#REM) Gestion du portfolio et des documents ] [(#INCLURE{fond=inclure/documents,id_article, env})] </div><!--.content--> </div><!--.wrapper--> <div class="aside"> #FORMULAIRE_RECHERCHE [(#REM) Articles dans la meme rubrique ] <B_articles_rubrique> <div class="menu"> <h2><:meme_rubrique:></h2> <ul> <BOUCLE_articles_rubrique(ARTICLES){id_rubrique} {id_article!= #ENV{id_article} } {!par date} {0,10}> <li><a href="#url_article">#titre</a></li> </BOUCLE_articles_rubrique> </ul> </div> </B_articles_rubrique> </div><!--.aside--> </div><!--.main--> <INCLURE{fond=inclure/footer} /> </div><!--.page--> </body> </html> </BOUCLE_principale> Introduction à Spip - Page 20

21 EXEMPLE SIMPLE : SQUELETTE DU PLAN DOUBLE BOUCLE : LISTE DES RUBRIQUES PUIS DE LEURS ARTICLES FICHIER plan.html Utilisation d'un modèle fourni par SPIP composant particulier appelé par : #MODELE{nom du modèle} SQUELETTE <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " <!-- plan.html - revu par Michel Cartereau 20 XI > <html lang="fr" xmlns=" xml:lang="fr" > <head> <title>#nom_site_spip</title> <INCLURE{fond=inclure/head} /> </head> <body> <div class="page"> <INCLURE{fond=inclure/header} /> <INCLURE{fond=inclure/nav} /> <div class="main"> <div class="wrapper"> <div class="content" id="content"> <p class="arbo"><a href="#url_site_spip/"><:accueil_site:></a> > <strong class="on"><:plan_site:></strong></p> <div class="cartouche"> <h1><:plan_site:></h1> </div> #MODELE{plan} </div><!--.content--> </div><!--.wrapper--> <div class="aside"> #FORMULAIRE_RECHERCHE </div><!--.aside--> </div><!--.main--> <INCLURE{fond=inclure/footer} /> </div><!--.page--> </body> </html> Introduction à Spip - Page 21

22 ANNEXES INSTALLATION DE SPIP EASYPHP SOUS WINDOWS Introduction à Spip - Page 22

23 INSTALLATION DE SPIP : ARCHITECTURE SPIP FONCTIONNE SUR UN SERVEUR ARCHITECTURE DES APPLICATIONS Serveurs pages Web avec le langage PHP + bases de données logiciels très utilisés et de code libre : Apache et MySQL diffusion conjointe : Windows (EasyPHP 1 ), Mac (MAMP 2 ), etc. Gestionnaire de contenu logiciel Spip installé sur le serveur Web, avec une base de données COMPÉTENCES NÉCESSAIRES EN ADMINISTRATION DE SERVEUR DANS LE CAS D'UN VÉRITABLE SITE PUBLIC 1 EasyPHP : voir en et dans la boîte à outils de Gaia à AgroParisTech. 2 MAMP : voir en et dans la boîte à outils de Gaia à AgroParisTech. Introduction à Spip - Page 23

24 INSTALLATION DE SPIP : PROCÉDURE 1) DOSSIER DE SPIP CAS D'INSTALLATION DE SPIP VERSION 3.0 Récupérer 1 l'archive au format ZIP du logiciel SPIP et la décompresser ; exemple : spip-v zip contenant le dossier spip 2) CAS DE L'ENVIRONNEMENT EASYPHP Copier le dossier spip dans le dossier des pages Web d'easyphp 2 Démarrer EasyPHP et afficher dans un navigateur la page d'accueil consultation à l'adresse ou il doit y apparaître ce dossier spip de Spip Vérifier le fonctionnement de Spip en cliquant sur son dossier consultation à l'adresse il doit y apparaître le message suivant : 1 Logiciel SPIP disponible en ou dans la boîte à outis de Gaia à AgroParisTech en 2 Exemple en salle d'informatique à AgroParisTech : dossier N:\www\ Introduction à Spip - Page 24

25 INSTALLATION DE SPIP : PROCÉDURE (SUITE) 2 BIS ) CAS D'UN HÉBERGEMENT AVEC APACHE Il faut copier le dossier spip dans le dossier des pages Web attribué sur le serveur d'hébergement ; exemple : dossier public_html du compte tdmc13 a) Lancer l'outil pour gérer le transfert de fichiers (FTP) ; exemple : WinSCP Indiquer protocole (SFTP ou FTP), adresse du serveur, nom d'utilisateur et mot de passe 1 b) Sélectionner dans le volet gauche le dossier de spip, et dans le volet droit ouvrir le dossier d'accueil du serveur c) Lancer le transfert du dossier spip vers le serveur via le bouton COPIER 1 Renseignements fournis par l'administrateur du serveur d'hébergement. Introduction à Spip - Page 25

26 INSTALLATION DE SPIP : PROCÉDURE (SUITE) d) Il faut effectuer des réglages complémentaires pour certains dossiers sur le serveur afin de régler les droits d'accès (autorisation générale d'écriture) Cela concerne les dossiers suivants : IMG tmp local config Dans un outil comme WinSCP, sélectionner chaque dossier à régler puis avec le bouton PROPRIÉTÉS, cocher W pour GROUPE et AUTRES puis valider e) Vérifier enfin dans un navigateur à l'adresse du site complétée par /spip/ exemple : il doit y apparaître le message suivant : Introduction à Spip - Page 26

27 INSTALLATION DE SPIP : PROCÉDURE (SUITE) 3) CONFIGURATION DU SITE AVEC SPIP Lancer la configuration à l'adresse a) Choisir la langue de Spip français a priori b) Indiquer les caractéristiques 1 du serveur de base de données Type : MySQL Login de connexion :... (donné par l'administrateur 2 ) Mot de passe :... (donné par l'administrateur) 1 Valeurs définies a priori après une installation normale d'easy PHP 3.0. Sinon, ces renseignements sont fournis par l'hébergeur du site. Enregistrement dans le fichier : config\connect.php 2 Dans le cas d'easy-php, c'est généralement root avec le mot de passe mysql ou vide Introduction à Spip - Page 27

28 INSTALLATION DE SPIP : PROCÉDURE (SUITE) 4) CHOIX DE LA BASE DE DONNÉE La base de données va contenir les contenus du site Si aucune base n'a été attribuée par l'administrateur, créer alors une nouvelle base intitulée spip 1 De même, conserver le préfixe du nom des tables proposé Cas d'anomalie lors de la connexion au serveur de base de données revenir à la page précédente et vérifier les informations (surtout le mode de passe) 1 Enregistrement dans le fichier : config\connect.php Introduction à Spip - Page 28

29 INSTALLATION DE SPIP : PROCÉDURE (FIN) 5) DÉFINITION DE L'IDENTIFICATION DE L'ADMINISTRATEUR L'administrateur dispose de tous les droits dans l'espace privé de Spip. Identification SIGNATURE : nom d'auteur dans le système Spip VOTRE ADRESSE utile pour communiquer entre les auteurs VOTRE LOGIN : pour se connecter à l'espace privé VOTRE MOT DE PASSE : attention à ni l'oublier, ni le choisir trop simple Fin de la configuration Bouton ESPACE PRIVÉ pour accéder à l'administration Introduction à Spip - Page 29

30 CAS DE EASYPHP SOUS WINDOWS APERÇU DE LA VERSION 5.3 D'EASYPHP ( 1 ) CARACTÉRISTIQUES GÉNÉRALES Un environnement complet sous Windows libre de droits pour un usage non commercial serveur Apache + moteur PHP + SGBD MySQL + PhpMyAdmin Administration simplifiée manipulations facilitées via un navigateur outil PhpMyAdmin pour l'administration des bases de données INSTALLATION Mise en place automatisée environnement complet en C:\Program Files\Easy-PHP... lancement par DÉMARRER PROGRAMMES EASYPHP icône à droite dans la barre de tâches vérification du fonctionnement par consultation du site local adresse : 2 Utilisation de l'icône en bas à droite clic-doit : menu de commande page d'administration : ADMINISTRATION accès au dossier des pages : EXPLORER redémarrage des serveurs : REDÉMARRER arrêt des serveurs : ARRÊTER double-clic sur l'icône : état courant ATTENTION! PRÉSENTATION RAPIDE D'EASYPHP POUR UN USAGE PERSONNEL, INTERMITTENT ET NON PERMANENT AUTRE SERVEUR GRATUIT POUR MAC OS X : MAMP 3 1 A AgroParisTech, dans la boîte à outils de Gaia : 2 localhost et : adresses pour désigner le poste courant dans l'internet 3 MAMP disponible en : Introduction à Spip - Page 30

31 RECONFIGURATION DE EASYPHP CAS DU SERVEUR WEB : APACHE SERVEURS WEB ET DE BASES DE DONNÉES Fichier de configuration du serveur web : httpd.conf accessible via le menu d'easyphp : CONFIGURATION APACHE (ou en C:/Program Files/Easy-PHP.../conf_files/httpd.conf) Déplacement du dossier spécifique pour les pages du site 1 a priori, en C:/Program Files/Easy-PHP.../www création d'un dossier 2, exemple : c:/easy/www puis remplacements dans le texte du fichier httpd.conf : de : DocumentRoot "${path}/www" par : DocumentRoot "C:/easy/www" et : <Directory "${path}/www"> par : <Directory "C:/easy/www"> Restriction des possibilités d'accès au serveur 3 a priori, site accessible par tout le monde (donc risque de piratage) autorisation de consultation uniquement par le poste du serveur par remplacements partout dans le texte du fichier httpd.conf de : Allow from all par : Allow from localhost CAS DU SERVEUR DE BASES DE DONNÉES : MYSQL Fichier de configuration du gestionnaire de bases : my.ini accessible via le menu d'easyphp : CONFIGURATION APACHE (ou en C:/Program Files/Easy-PHP.../conf_files/my.ini) Déplacement du dossier spécifique pour les bases de données a priori, en C:/Program Files/Easy-PHP.../mysql/data copie dans un nouveau dossier 4, exemple : c:/easy/data puis remplacements dans le texte du fichier my.ini : de : datadir= "${path}/mysql/data/" par : datadir= "C:/easy/data" RECONFIGURATION NON INDISPENSABLE MAIS TRÈS FORTEMENT CONSEILLÉE NE PAS OUBLIER DE RELANCER LE SERVEUR APRÈS TOUTE MODIFICATION 5 1 Reconfiguration conseillée afin de séparer les données des programmes (sauvegardes facilitées). 2 A priori; en dehors du dossier des programmes sous Windows (C:\Program Files). 3 Reconfiguration conseillée si le poste est connecté à l'internet, en permanence ou épisodiquement. 4 Attention! veiller à copier le contenu original du dossier mysql\data (indispensable à MySQL) 5 Relance du serveur : commande REDÉMARRER d'easyphp. Introduction à Spip - Page 31

32 SOMMAIRE PRÉSENTATION GÉNÉRALE...2 Un outil de gestion de contenu...3 Structuration des contenus...4 Structure d'un article...5 Principe de construction d'une page...6 SQUELETTES...7 Principaux squelettes du site...8 Ecriture d'un squelette de page...9 Exemple d'un site simple...10 Exemple simple : mise en page...11 Exemple simple : composants du sommaire...12 Exemple simple : composants élémentaires...13 Exemple simple : navigation...14 Exemple simple : articles récents...15 Exemple simple : squelette du sommaire...16 Exemple simple : squelette d'une rubrique (1)...17 Exemple simple : squelette d'une rubrique (2)...18 Exemple simple : squelette d'un article (1)...19 Exemple simple : squelette d'un article (2)...20 Exemple simple : squelette du plan...21 ANNEXES...22 Installation de spip : architecture...23 Installation de spip : procédure...24 Installation de spip : procédure (suite)...25 Installation de spip : procédure (suite)...26 Installation de spip : procédure (suite)...27 Installation de spip : procédure (suite)...28 Installation de spip : procédure (fin)...29 Cas de EasyPHP sous Windows...30 Reconfiguration de EasyPHP...31 Introduction à Spip - Page 32

TECHNIQUE DE CONSTRUCTION D UN MODULE

TECHNIQUE DE CONSTRUCTION D UN MODULE TECHNIQUE DE CONSTRUCTION D UN MODULE Pilotage Infographie Description générale Romuald LORTHIOIR Stéphane RIO Aurélie PASSILLY Date de création du document 20 nov. 2006 Version 1.1 Validation pour le

Plus en détail

Présentation et explications

Présentation et explications Présentation et explications 1 SOMMAIRE I) Introduction... 3 II) Installation... 3 1) Localement... 3 2) Chez un hébergeur... 4 Installation automatique... 4 Installation manuelle... 4 III) Interface de

Plus en détail

Kits Spip CNRS Version 4.0

Kits Spip CNRS Version 4.0 Kits Spip CNRS Version 4.0 Documentation Julien Barnier, Jean-Baptiste Pressac CNRS 26 février 2009 Table des matières 1 Introduction 5 1.1 Présentation............................................ 5 1.2

Plus en détail

Offre de Service Hébergement Web Migration SPIP

Offre de Service Hébergement Web Migration SPIP CNRS Offre de Service Hébergement Web Migration SPIP [LAMP CMS] Direction des Systèmes d Information du CNRS [20/01/12] Référence : DSI/DR2/ Date : 20/01/2012 Version : 1.0 Auteur : Pascal Lechene Diffusion

Plus en détail

EXEMPLE PROJET. Objectifs de la séance : De l analyse à la conception Passage de l UML au Site Web

EXEMPLE PROJET. Objectifs de la séance : De l analyse à la conception Passage de l UML au Site Web EXEMPLE PROJET Objectifs de la séance : De l analyse à la conception Passage de l UML au Site Web Manuele Kirsch Pinheiro - UP1 / CRI / UFR06 Gestion 2 Projet Objectifs Mettre en application les concepts

Plus en détail

Programmation Tablette. Dominique Rossin Cours 1 - HTML / CSS

Programmation Tablette. Dominique Rossin Cours 1 - HTML / CSS Programmation Tablette Dominique Rossin Cours 1 - HTML / CSS Objectifs Comprendre le fonctionnement d une application Web Comprendre le fonctionnement d une application Smartphone Programmer et déployer

Plus en détail

Méthode pour rédiger et publier un article sur le site

Méthode pour rédiger et publier un article sur le site Méthode pour rédiger et publier un article sur le site http://rcanatation.free.fr 1 Comprendre la structure du site : Pour faciliter la mise à jour et permettre à chacun de proposer des articles, l'architecture

Plus en détail

Documentation OpenwebByCB. Squelette de site sous SPIP Christian Berrone

Documentation OpenwebByCB. Squelette de site sous SPIP Christian Berrone Documentation OpenwebByCB Squelette de site sous SPIP Christian Berrone Version 2.00 du 06.10.2009 Réalisé avec : OOo 3.0 Plate-forme / Os : Toutes Sommaire 1 Principes d'affichage...3 1.1 La page d'accueil...3

Plus en détail

Insertion de citations et construction automatique d une liste de références dans Word

Insertion de citations et construction automatique d une liste de références dans Word Insertion de citations et construction automatique d une liste de références dans Word Fabrice Dessaint 1 Résumé. Le traitement de texte proposé par Microsoft dans sa suite Office offre, depuis la version

Plus en détail

Le langage de Transformation XSL

Le langage de Transformation XSL Le langage de Transformation XSL Formatage d un document XML, Le langage XSLT: Définition, Principe de fonctionnement, Structure d une feuille de style, Format d une règle de transformation, Tri, Choix

Plus en détail

Publication sur le site

Publication sur le site Site Web de l association des ingénieurs INSA de Lyon Publication sur le site Remarque : la suppression des contributions n est pas possible depuis le Front-Office. Publication, modification d un article

Plus en détail

1 Pages web dynamiques. 2 Un exemple. 2.1 Objectif

1 Pages web dynamiques. 2 Un exemple. 2.1 Objectif 1 Pages web dynamiques En schématisant on peut considérer que l accès à une pager web depuis une machine s effectue selon une architecture client/serveur. La machine client émet une requête de page web

Plus en détail

Joomla! 3.3 Créez et administrez vos sites Web

Joomla! 3.3 Créez et administrez vos sites Web Chapitre 1 : Découvrir Joomla! A. Les raisons de créer un site sous Joomla! 9 B. Se documenter sur Joomla! 9 C. La feuille de route de Joomla! 10 D. Qu est-ce qu un CMS? 12 E. HTML et XHTML 12 F. Différencier

Plus en détail

CMS SPIP et charte graphique CNRS

CMS SPIP et charte graphique CNRS CMS SPIP et charte graphique CNRS Atelier COMPIL 11/06/2010 Edyta Bellouni Plan Rappel sur les CMS Présentation du kit SPIP CNRS Installation / Configuration Gestion du contenu La simplicité de SPIP :

Plus en détail

Fiche descriptive. Présentation Dimitri Ange NIOSSOBATOU. JOOMLA Fiche descriptive Présentation : Dimitri Ange NIOSSOBANTOU

Fiche descriptive. Présentation Dimitri Ange NIOSSOBATOU. JOOMLA Fiche descriptive Présentation : Dimitri Ange NIOSSOBANTOU Fiche descriptive Présentation Dimitri Ange NIOSSOBATOU 1 Table des matières I INTRODUCTION.. Page 3 II ETUDE DE JOOMLA.... Page 4 1 Pré-requis..... Page 4 2 Installation....... Page 4 3 Fonctionnalités......

Plus en détail

DOSSIER D'ACTIVITES SUR LE PHP N 07 Supprimer des données d'une base de données

DOSSIER D'ACTIVITES SUR LE PHP N 07 Supprimer des données d'une base de données DOSSIER D'ACTIVITES SUR LE PHP N 07 Supprimer des données d'une base de données Objectifs : Apprendre à l apprenant à lancer un serveur local «Apache» Apprendre à l'apprenant à lancer un serveur MySQL

Plus en détail

Utilisation de SPIP en 4 leçons

Utilisation de SPIP en 4 leçons CRDP de l académie de Versailles Mission TICE Médiapôles mediapoles @crdp.ac-versailles.fr 584, rue Fourny 78530 Buc Tél. 01 39 45 78 78 Utilisation de SPIP en 4 leçons Février 2009 http://mediapoles.crdp.ac-versailles.fr

Plus en détail

Groupe Eyrolles, 2005, ISBN : 2-212-11428-1

Groupe Eyrolles, 2005, ISBN : 2-212-11428-1 Groupe Eyrolles, 2005, ISBN : 2-212-11428-1 Table des matières AVANT-PROPOS...XIII 1. PUBLIER SUR LE WEB... 1 Créer un site dynamique 2 Préparation du projet 3 Définition des objectifs 3 Réflexion sur

Plus en détail

IceCube.Net. Explicatif technique. Version 1.0

IceCube.Net. Explicatif technique. Version 1.0 IceCube.Net Explicatif technique Version 1.0 Structure IceCube.Net IceCube.Net est structurée de la même manière que des serveurs de type Solaris/Unix soit l arborescence suivante : ROOT _bin _htdocs _scripts

Plus en détail

FrontPage Express (v 2.0) Éditeur de pages Web Introduction

FrontPage Express (v 2.0) Éditeur de pages Web Introduction Éditeur de pages Web Introduction Plusieurs versions du logiciel Frontpage existent. Dont FrontPage Express, qui est gratuit et librement diffusable. Il permet de débuter dans la confection de sites Internet.

Plus en détail

Introduction. Principes de fonctionnement. Le squelette a son propre langage. Syntaxe

Introduction. Principes de fonctionnement. Le squelette a son propre langage. Syntaxe Introduction Ce document a pour objectif de présenter la conception «technique» des modèles de pages pour le logiciel de publication collaborative en ligne SPIP et de servir de «mémo» pour son utilisation.

Plus en détail

Organisation d un document XSLT

Organisation d un document XSLT Les comportements serveur XSLT CHAPITRE 6 375 tion, et générera un document résultat pouvant être une page XHTML, ou tout type de format selon le média visé (XML, WML, texte, etc.). Voir figure 6-5-a.

Plus en détail

Site internet pour ligues et clubs de sports d équipe. Manuel utilisateur. PhpMySport v1.0 Sorti le 25/10/2006

Site internet pour ligues et clubs de sports d équipe. Manuel utilisateur. PhpMySport v1.0 Sorti le 25/10/2006 Site internet pour ligues et clubs de sports d équipe Manuel utilisateur PhpMySport PhpMySport v1.0 Sorti le 25/10/2006 Logiciel distribué sous licence GNU/GPL Copyright 2006 PhpMySport Manuel utilisateur

Plus en détail

CIM120. Http:// (Creation Web) Page 1

CIM120. Http:// (Creation Web) Page 1 CIM120 Http:// (Creation Web) Page 1 Organisation du module CIM120 Evaluation: 1 eval sur table 1 eval des TP Page 2 Le Web: un peu d'histoire D'Arpanet à Internet... http://fr.wikipedia.org/wiki/histoire_d'internet

Plus en détail

QCM AVEC NETQUIZ 2.9 INSTALLATION, PREMIÈRE UTILISATION

QCM AVEC NETQUIZ 2.9 INSTALLATION, PREMIÈRE UTILISATION Centre Académique de Ressources et Maintenance Informatique Tertiaire Lycée Emmanuel Mounier 6 avenue Marcelin Berthelot 38029 GRENOBLE CEDEX 2 04 76 86 58 15 carmit@ac-grenoble.fr site collaboratif :

Plus en détail

Le travail collaboratif

Le travail collaboratif Le travail collaboratif Module 3 Introduction : publication, rubriques et populations 1. La définition des groupes. La création des rubriques associées aux groupes 3. Le partage des dossiers 4. Les sessions

Plus en détail

MISE EN PLACE D'UN SITE INTERNET CHEZ FREE

MISE EN PLACE D'UN SITE INTERNET CHEZ FREE MISE EN PLACE D'UN SITE INTERNET CHEZ FREE En dehors de la partie création du compte, les autres informations ont un caractère général et s'appliquent à d'autres fournisseurs Internet. Il est ici question

Plus en détail

L objectif de cette étape est de se familiariser avec la création de site web sous VS 2012.

L objectif de cette étape est de se familiariser avec la création de site web sous VS 2012. L objectif de ce tutoriel est de créer un site web statique avec Visual Studio. Le site sera composé d une page HTML, une feuille de style CSS et d un fichier Javascript. Etape 1 Lancer Visual Studio L

Plus en détail

Eclipse et quelques notions de Jquerry

Eclipse et quelques notions de Jquerry Eclipse et quelques notions de Jquerry Tout d abord, une petite présentation s impose. Eclipse est un outil de développement qui permet d éditer du code et de visualiser le résultat grâce à des émulateurs

Plus en détail

HTML 5 CSS 3 Responsive

HTML 5 CSS 3 Responsive HTML 5 CSS 3 Responsive Programme de formation Microsoft Partner France Belgique Suisse - Canada Formez vos salariés pour optimiser la productivité de votre entreprise Dernière mise à jour : Avril 2014

Plus en détail

Installer PHP Sous Windows

Installer PHP Sous Windows Installer PHP Sous Windows Afin d appréhender le fonctionnement de PHP, des exercices et des exemples de code vous sont fournis. Pour exécuter les scripts, il vous faut un environnement de travail. Sous

Plus en détail

Créer un modèle pour Joomla 1.5

Créer un modèle pour Joomla 1.5 Créer un modèle pour Joomla 1.5 Dans le dossier templates de Joomla, créer un nouveau dossier au nom du modèle (lettres-chiffres-tirets, éviter caractères accentués et spéciaux) Dans ce dossier template/nom_du_modèle,

Plus en détail

TP PHP (/HTML/CSS/PostgreSQL)

TP PHP (/HTML/CSS/PostgreSQL) TP PHP (/HTML/CSS/PostgreSQL) ENSIIE - 2015/2016 Le but de ce TP est de compléter les fichiers fournis pour réaliser une micro-application interactive qui permet, suivant le choix de l utilisateur, de

Plus en détail

PARTENARIAT ICI FORMATION

PARTENARIAT ICI FORMATION PARTENARIAT ICI FORMATION Guide d installation de la vignette ICI Formation sur un site partenaire SOMMAIRE Le Partenariat ICI Formation... 3 Script de partenariat ICI Formation... 3 Génération de l'aperçu

Plus en détail

Fiche Technique CANTE. Intégration d un poste sous Windows XP Professionnel dans un réseau géré par Kwartz

Fiche Technique CANTE. Intégration d un poste sous Windows XP Professionnel dans un réseau géré par Kwartz Fiche Technique CANTE Intégration d un poste sous Windows XP Professionnel dans un réseau géré par Kwartz But du document Ce document décrit la méthode d intégration d un poste fonctionnant sous Windows

Plus en détail

<link rel =" stylesheet " type =" text / css " href =" monstyle. css " />

<link rel = stylesheet  type = text / css  href = monstyle. css  /> Programmation Web AGRAL-3 et MTX-3, 2012-13 SÃl ance TP N o 5 Mars 2013 Objectifs Langage CSS Interactions HTML/CSS Manipulation [Où mettre ses fichiers? ] Pour ce TP vous allez mettre votre fichier HTML

Plus en détail

INSTALLATION DE WAMP MAMP - XAMPP

INSTALLATION DE WAMP MAMP - XAMPP INSTALLATION DE WAMP MAMP - XAMPP https://openclassrooms.com/courses/concevez-votre-site-web-avec-php-et-mysql/preparer-sonordinateur-2 Open Class Room SOMMAIRE Sommaire... 1 Les outils de développement...

Plus en détail

Mise à jour V9. Service d'assistance Téléphonique 0 826 888 488

Mise à jour V9. Service d'assistance Téléphonique 0 826 888 488 Mise à jour V9 Service d'assistance Téléphonique 0 826 888 488 Mise à jour V9 Sommaire 1. A LIRE AVANT INSTALLATION... 3 Pré-requis système... 3 Cegid Business sur DVD... 3 Nouveaux assistants d installation

Plus en détail

Installer un serveur web pour NExEv (ou autre application en PHP)

Installer un serveur web pour NExEv (ou autre application en PHP) Installer un serveur web pour NExEv (ou autre application en PHP) Par Yann MARSAUD yann.marsaud@ac-guyane.fr Mars 2008 NExEv - La Nouvelle EXpérience de l'evaluation http://www.nexev.org Introduction Pour

Plus en détail

Une rapide introduction à HTML / CGI

Une rapide introduction à HTML / CGI Une rapide introduction à HTML / CGI Patrick Fuchs Université Paris 7 Equipe de Bioinformatique Génomique et Moléculaire PLAN 1. Généralités 2. Les Bases d HTML 3. Outils HTML avancés 4. HTML dynamique

Plus en détail

Boite à outils PHP. Environnement de travail A connaître sur son hébergement Installer A.M.P. Saisir le code

Boite à outils PHP. Environnement de travail A connaître sur son hébergement Installer A.M.P. Saisir le code Boite à outils PHP. Environnement de travail A connaître sur son hébergement Installer A.M.P. Saisir le code Scripts déjà faits Introduction Outils de publications 1 Fonctionnement d'un site dynamique

Plus en détail

Université de Toulouse II - Formation Continue. Diplôme Universitaire. Technologies de l Information Et de la Communication Option Animateur Web

Université de Toulouse II - Formation Continue. Diplôme Universitaire. Technologies de l Information Et de la Communication Option Animateur Web Université de Toulouse II - Formation Continue Diplôme Universitaire Technologies de l Information Et de la Communication Option Animateur Web Annexes Auteur : Céline MASCLEF 21 rue du dix avril 31500

Plus en détail

Langage (X)HTML Damien Nouvel

Langage (X)HTML Damien Nouvel Langage (X)HTML Plan Quelques statistiques du web Architecture client / serveur Langage XML Mise en forme HTML Structure d'un document HTML 2 / 36 Plan Quelques statistiques du web Architecture client

Plus en détail

Office 365 (3ième édition) Travaillez en ligne avec Office Online, SharePoint, OneDrive, OneNote et Skype Entreprise

Office 365 (3ième édition) Travaillez en ligne avec Office Online, SharePoint, OneDrive, OneNote et Skype Entreprise Découverte Présentation générale 11 Découvrir les nouveautés 11 Choisir l offre Office 365 appropriée 15 Configuration requise 21 Les applications et services en ligne 22 Se connecter à son espace Office

Plus en détail

Manuel SPIP. SPIP vous donne la possibilité de changer votre mot de passe très simplement.

Manuel SPIP. SPIP vous donne la possibilité de changer votre mot de passe très simplement. Manuel SPIP Se connecter à la partie Administration Pour créer un article, il faut entrer dans la partie administration du site en cliquant sur «Administration» en bas de la page d accueil du site, et

Plus en détail

Plugin Gadgets - Manuel d'intégration v1.3.0, v1.4.0

Plugin Gadgets - Manuel d'intégration v1.3.0, v1.4.0 Plugin Gadgets - Manuel d'intégration v1.3.0, v1.4.0 Installation Bibliothèque de gadgets Exemple Gadgets UWA I-frame contenant un gadget personnalisé Fin de l'intégration Installation Arrêter le serveur

Plus en détail

Dreamweaver CS6 pour PC/Mac

Dreamweaver CS6 pour PC/Mac ENVIRONNEMENT. Généralités 1 A- La page de démarrage 1 B- L écran principal 2 C- La barre d état 3 D- Utiliser les règles 4 E- Utiliser la grille 4 F- Utiliser les repères 5 G- Modifier le zoom 6 1.2 Les

Plus en détail

Réservez votre place! Au Théâtre Grenette

Réservez votre place! Au Théâtre Grenette Alexis Roméro N INE IDF076400 Conservatoire des Arts et métiers Centre FOD IDF Année universitaire 2010-2011 Certificat professionnel Webmestre UA 3323 Mémoire Réservez votre place! Au Théâtre Grenette

Plus en détail

Le filtre internet académique ou proxy-filtre

Le filtre internet académique ou proxy-filtre Le filtre internet académique ou proxy-filtre L Académie de La Réunion met à disposition des écoles un serveur proxy qui filtre les sites consultés à partir des ordinateurs de votre salle informatique,

Plus en détail

STRUCTURE D UNE PAGE HTML/CSS

STRUCTURE D UNE PAGE HTML/CSS STRUCTURE D UNE PAGE HTML/CSS C01 1. STRUCTURE Le langage Html est composé de balises ou (tags) qui permettent de structurer le texte, de le mettre en forme et d insérer des images. Ces instructions sont

Plus en détail

Sommaire. 1 Créer un premier site Élaborer un contenu...69

Sommaire. 1 Créer un premier site Élaborer un contenu...69 Partie 1 Votre site web personnel...25 1 Créer un premier site...27 1.1 Installer le serveur web personnel de Microsoft...29 1.2 Créer un nouveau site web...31 1.3 Découvrir et personnaliser l environnement

Plus en détail

Navigateur Internet. Google Chrome

Navigateur Internet. Google Chrome Navigateur Internet Google Chrome Mode d emploi Gilbert LECOCQ - 1 - SOMMAIRE Installation Introduction... p. 3 Installation... p. 3 Paramétrage Récupérer les liens d Internet Explorer... p. 4 Définir

Plus en détail

CSS avancées. Vers HTML 5 et CSS 3. Raphaël Goetter. Préface de Daniel Glazman. Groupe Eyrolles, 2011, ISBN : 978-2-212-12826-0

CSS avancées. Vers HTML 5 et CSS 3. Raphaël Goetter. Préface de Daniel Glazman. Groupe Eyrolles, 2011, ISBN : 978-2-212-12826-0 CSS avancées Vers HTML 5 et CSS 3 Raphaël Goetter Préface de Daniel Glazman Groupe Eyrolles, 2011, ISBN : 978-2-212-12826-0 122 Tirer le meilleur de CSS première partie background: gray; margin: 5px; padding:

Plus en détail

Introduction à XML. 1. Notions de base. Introduction à XML

Introduction à XML. 1. Notions de base. Introduction à XML Introduction à XML INTRODUCTION À XML 1. NOTIONS DE BASE 2. EXEMPLE SIMPLE 3. SYNTAXE XML 3.1. LES CARACTÈRES SPÉCIAUX 4. DTD 5. DOCUMENT XML AVEC FEUILLE DE STYLE CSS 6. XLS ET XSLT 6.1. EXEMPLE DE DOCUMENT

Plus en détail

Moodle - Gestion des cours, groupes, ressources et activités

Moodle - Gestion des cours, groupes, ressources et activités Moodle - Gestion des cours, groupes, ressources et activités [ Document du Créateur de cours ] Table des matières Moodle - Gestion des cours, groupes, ressources et activités...1 1. Introduction à Moodle...2

Plus en détail

présentation de SPIP contact : Patrick VINCENT pvincent@erasme.org

présentation de SPIP contact : Patrick VINCENT pvincent@erasme.org présentation de SPIP contact : Patrick VINCENT pvincent@erasme.org Le réseau SPIP : Système de Publication sur Internet site Internet dynamique : base PHP/Mysql. site contributif : permet de gérer et/ou

Plus en détail

Espace Numérique Régional de Santé Formation Agora Project

Espace Numérique Régional de Santé Formation Agora Project Espace Numérique Régional de Santé Formation Agora Project Sommaire 1. Introduction 2. Se connecter 3. Présentation Générale 4. Utilisateur de l espace 5. Gestionnaire de fichier 6. Agenda 7. Actualités

Plus en détail

Environnement Client/Serveur. Cours 7 JavaServer Pages (1) kn@lri.fr

Environnement Client/Serveur. Cours 7 JavaServer Pages (1) kn@lri.fr Environnement Client/Serveur Cours 7 JavaServer Pages (1) kn@lri.fr Plan 1 Rappels sur les systèmes d'exploitations / Communication par mémoire partagée 2 Réseaux généralités, IP, UDP 3 TCP, Rappels sur

Plus en détail

SITE INTERNET LPR DU HAUT FOREZ MODE D EMPLOI

SITE INTERNET LPR DU HAUT FOREZ MODE D EMPLOI SITE INTERNET LPR DU HAUT FOREZ MODE D EMPLOI SOMMAIRE I) ECRIRE UN ARTICLE... 3 II) LE TEXTE DE L ARTICLE... 8 III) INSÉRER UN DOCUMENT... 11 IV) SE DÉCONNECTER DE L ESPACE PRIVÉ... 14 V) SE CONNECTER

Plus en détail

UDA Stage. Manuel utilisateur

UDA Stage. Manuel utilisateur UDA Stage Manuel utilisateur 11/02/2011 Sommaire 1. Introduction... 4 1.1. Objectif de l application... 4 1.2. Utilisateurs cibles... 4 1.3. Compatibilité navigateurs... 4 1.4. Éléments d interface...

Plus en détail

Le site de l A P M E P : Guide pratique à l usage des rédacteurs et administrateurs

Le site de l A P M E P : Guide pratique à l usage des rédacteurs et administrateurs Le site de l A P M E P : Guide pratique à l usage des rédacteurs et administrateurs Yvon Poitevineau (Dernière mise à jour le 15 octobre 2014) Table des matières I La rédaction dans SPIP 4 1 Présentation

Plus en détail

Par le département Documentation Services and Standards de Citrix. Citrix Systems, Inc.

Par le département Documentation Services and Standards de Citrix. Citrix Systems, Inc. Licences : la console License Management Console Par le département Documentation Services and Standards de Citrix. Citrix Systems, Inc. Avis Les informations contenues dans cette publication peuvent faire

Plus en détail

I. Définition du site

I. Définition du site I. Définition du site Utilisation de Dreamweaver La création du site ne devrait se faire qu'une seule fois. En effet, sur un ordinateur personnel, cette définition est enregistrée dans le profil de l'utilisateur

Plus en détail

K-d école 3.6 Twilight Nouveautés et paramétrages de la version annuelle 2013

K-d école 3.6 Twilight Nouveautés et paramétrages de la version annuelle 2013 K-d école 3.6 Twilight Nouveautés et paramétrages de la version annuelle 2013 Source Kosmos : Atelier F-PARAM du 17 avril 2013 Emmanuel LESCURE Sylvain THOMAS K-d école «Twilight» Modifiés par Twilight

Plus en détail

Introduction à la Simulation

Introduction à la Simulation ou comment créer votre premier jeu vidéo Jacques Duma http://math.et.info.free.fr/ http://ateliermathematique.free.fr/ Aspect visuel souhaité Aspect visuel souhaité Code source de la page HTML Feuille

Plus en détail

ARTICLE : élément de «base» contenant texte et ressources diverses. Peut avoir plusieurs statuts (visible ou non publiquement, entre autres),

ARTICLE : élément de «base» contenant texte et ressources diverses. Peut avoir plusieurs statuts (visible ou non publiquement, entre autres), Terminologie ARTICLE : élément de «base» contenant texte et ressources diverses. Peut avoir plusieurs statuts (visible ou non publiquement, entre autres), RUBRIQUE : contenant d'articles et/ou de rubriques

Plus en détail

LES LOGICIELS DE LA SWL

LES LOGICIELS DE LA SWL DÉPARTEMENT DU FINANCEMENT ET DU SUPPORT Direction de l Informatique LES LOGICIELS DE LA SWL Guide applicatif Contenu 1. INTRODUCTION... 1 2. L EXTRANET DE LA SWL... 2 CONNEXION À L EXTRANET... 2 CONNEXION

Plus en détail

Antoine Cailliau. Dotclear 2. Créer et administrer son blog. Groupe Eyrolles, 2009, ISBN

Antoine Cailliau. Dotclear 2. Créer et administrer son blog. Groupe Eyrolles, 2009, ISBN Antoine Cailliau Dotclear 2 Créer et administrer son blog Groupe Eyrolles, 2009, ISBN 978-2-212-12407-1 Table des matières AVANT-PROPOS............................................................ V 1.

Plus en détail

InfoLogger User Manual FR. InfoLogger Manuel d Utilisation!LFBTSSNT122674!

InfoLogger User Manual FR. InfoLogger Manuel d Utilisation!LFBTSSNT122674! InfoLogger Manuel d Utilisation!LFBTSSNT122674! CONTENTS INTRODUCTION... 3 FONCTIONS... 3 COMPOSITION PRODUIT... 3 TELECHARGEMENT ET INSTALLATION... 4 TELECHARGEMENT LOGICIEL ET INSTALLATION... 4 UTILISATION

Plus en détail

Formulaire de contact avec Xtreme Web Designer

Formulaire de contact avec Xtreme Web Designer Formulaire de contact avec Xtreme Web Designer Pour faire un formulaire avec Xtreme Web Designer, j'utilise 5 pages, vous n'êtes pas obligé, en effet 2 pages peuvent suffir mais c'est moins jolie. Donc

Plus en détail

Intranet d'établissement avec Eva-web Document pour les auteurs

Intranet d'établissement avec Eva-web Document pour les auteurs Intranet d'établissement avec Eva-web Document pour les auteurs Trois types d'utilisateurs d'eva Les administrateurs d'eva - Ils peuvent paramétrer le site, effectuer des sauvegardes, des restaurations,

Plus en détail

Gestion du site web www.college-st-paul.qc.ca. Manuel d instructions

Gestion du site web www.college-st-paul.qc.ca. Manuel d instructions Gestion du site web www.college-st-paul.qc.ca Table des matières Accéder au panneau d administration...3 Ajouter un administrateur...5 Structure du site...6 Ajouter une page...8 Éditer une page nouvellement

Plus en détail

Créer mon premier squelette

Créer mon premier squelette Créer mon premier squelette Avec ce tutoriel, découvrez progressivement le fonctionnement de SPIP en construisant votre premier squelette. Pas à pas, comment créer un SPIP qui défie les limites. Créer

Plus en détail

Notice et présentation WeSend Outlook V1.0

Notice et présentation WeSend Outlook V1.0 Notice et présentation WeSend Outlook V1.0 Plugin Outlook d envoi sécurisé de fichiers volumineux. «Envoyer des fichiers volumineux directement depuis Outlook de Microsoft.» Sommaire Sommaire... 2 1 Introduction...

Plus en détail

Objectifs. Programmation Tablette. Journée type. Organisation. Dominique Rossin Cours 1 - HTML / CSS

Objectifs. Programmation Tablette. Journée type. Organisation. Dominique Rossin Cours 1 - HTML / CSS Objectifs Programmation Tablette Dominique Rossin Cours 1 - HTML / CSS Comprendre le fonctionnement d une application Web Comprendre le fonctionnement d une application Smartphone Programmer et déployer

Plus en détail

MISE À JOUR DU LOGICIEL VERSION MULTIPOSTES

MISE À JOUR DU LOGICIEL VERSION MULTIPOSTES Accueil > Mises à jour du logiciel > Mise à jour du logiciel version multipostes MISE À JOUR DU LOGICIEL VERSION MULTIPOSTES INSTALLATION MULTIPOSTES DE SPAIECTACLE 5.2 SOUS WINDOWS INSTALLATION MULTIPOSTES

Plus en détail

Etre rédacteur (trice) sur le site SPIP du lycée (louisemichelbobigny.fr)

Etre rédacteur (trice) sur le site SPIP du lycée (louisemichelbobigny.fr) Etre rédacteur (trice) sur le site SPIP du lycée (louisemichelbobigny.fr) I - Accès à la partie publique du site : http://louisemichelbobigny.fr Il est possible de consulter les articles, mais aussi d

Plus en détail

RE41 : Compte-rendu de Travaux Pratiques Configuration d un moteur de recherche. Jocelyn Gourronc - Pierre Mauduit

RE41 : Compte-rendu de Travaux Pratiques Configuration d un moteur de recherche. Jocelyn Gourronc - Pierre Mauduit RE41 : Compte-rendu de Travaux Pratiques Configuration d un moteur de recherche Jocelyn Gourronc - Pierre Mauduit 1 1 Introduction Le but de cette séance de travaux pratiques a été de déployer sous un

Plus en détail

Cahier de conception Ecovoiture. Version n 2 (version finale)

Cahier de conception Ecovoiture. Version n 2 (version finale) Cahier de conception Ecovoiture Version n 2 (version finale) Lamoure Le Govic Loulier Cantal Massip 29/05/2015 Sommaire I. Diagramme d activité... 3 II. Planning... 4 III. Choix techniques... 7 A. Langages...

Plus en détail

Guide d'utilisation. Contao CMS

Guide d'utilisation. Contao CMS Guide d'utilisation Contao CMS 1 Sommaire 1. Avant propos... 3 2. Se connecter... 3 3. Le panneau d'administration...4 4. Méthodologie... 6 5. La structure du site... 6 6. Création d'un article... 10 7.

Plus en détail

Manuel d utilisation des blogs des projets de Défis solaires

Manuel d utilisation des blogs des projets de Défis solaires Manuel d utilisation des blogs des projets de Défis solaires Version du 9 février 2013 Les dernières informations sont sur : http://www.planete-sciences.org/blogs/defissolaires/ 1 / 27 Sommaire I. CONNEXION

Plus en détail

Worry-Free TM Remote Manager TM 1

Worry-Free TM Remote Manager TM 1 Worry-Free TM Remote Manager TM 1 for Small and Medium Business Manuel d'installation des agents Trend Micro Incorporated se réserve le droit de modifier ce document et les produits décrits ici sans préavis.

Plus en détail

B2i Lycée : 2nde Arts visuels Participer à la vie du site Internet de l'établissement 1

B2i Lycée : 2nde Arts visuels Participer à la vie du site Internet de l'établissement 1 B2i Lycée : 2nde Arts visuels Participer à la vie du site Internet de l'établissement 1 SOMMAIRE DE LA SEANCE : 1) Site Internet de l'établissement et compétences B2i Lycée. 2) Présentation du site Internet

Plus en détail

TD 3 : Intégration HTML

TD 3 : Intégration HTML Programmation Web IMAC 2015-2016 TD 3 : Intégration HTML 14 octobre 2015 Objectif: Ce TD a pour but de se servir des concepts appris dans les TDs précédents pour intégrer entièrement une maquette de site

Plus en détail

Rédaction d une fiche thématique Mutuelles étudiantes : Se grouper pour agir

Rédaction d une fiche thématique Mutuelles étudiantes : Se grouper pour agir Rédaction d une fiche thématique Mutuelles étudiantes : Se grouper pour agir Philippe Marcy (webmaster) Table des matières 1. QU EST-CE QU UNE FICHE THÉMATIQUE?... 2 2. FAIRE UNE PROPOSITION DE FICHE THÉMATIQUE...

Plus en détail

Table des matières. TP Ajax. Séquence 1 L'objet XMLHttpRequest...2 Séquence 2 L'API jquery...3 Séquence 3 XML...4 Séquence 4 L'auto complétion...

Table des matières. TP Ajax. Séquence 1 L'objet XMLHttpRequest...2 Séquence 2 L'API jquery...3 Séquence 3 XML...4 Séquence 4 L'auto complétion... Table des matières Séquence 1 L'objet XMLHttpRequest...2 Séquence 2 L'API jquery...3 Séquence 3 XML...4 Séquence 4 L'auto complétion...7 Bibliographie : http://fr.wikipedia.org/wiki/asynchronous_javascript_and_xml

Plus en détail

Système de publication pour lʼinternet

Système de publication pour lʼinternet Système de publication pour lʼinternet 1.8 Cahier 03 Comment écrire un article dans le site Web de votre école Suzanne Harvey Conseillère pédagogique Service local du RÉCIT Commission scolaire de Saint-Hyacinthe

Plus en détail

Signets. Documentation utilisateur tout public disposant d'un compte ENT - Accès : Personnalisation de l'ent

Signets. Documentation utilisateur tout public disposant d'un compte ENT - Accès : Personnalisation de l'ent Documentation utilisateur tout public disposant d'un compte ENT - Accès : Personnalisation de l'ent Version 1.0.0 Da te Décembre 2010 Rédacteur Pédagogique et Médiatisation Torrent Stéphanie - Direction

Plus en détail

PHP / MySQL. Cours n 1

PHP / MySQL. Cours n 1 PHP / MySQL Cours n 1 COURS 1- EAA 2008 Présentation Visite de sites web connus (statique vs dynamique) Architecture d un site web statique Architecture d un site web dynamique Vocabulaire web Configuration

Plus en détail

Date Version Auteur Notes 14/09/ Direction Informatique Création. Portail Zimbra. Aide utilisateur

Date Version Auteur Notes 14/09/ Direction Informatique Création. Portail Zimbra. Aide utilisateur Date Version Auteur Notes 14/09/2014 1.1 Direction Informatique Création Portail Zimbra Aide utilisateur Ce document explique le fonctionnement du portail Zimbra, comment l utiliser et le personnaliser.

Plus en détail

Manuel utilisateur du back-office Wordpress

Manuel utilisateur du back-office Wordpress 1- Connexion à l administration Pour vous connecter à l administration de votre site, tapez : wp-admin ou admin à la suite de votre nom de domaine exemple : www.nomdedomaine.fr/wp-admin 2- Le tableau de

Plus en détail

Programmation Web SPIP. Sylvain Rampacek. IQ-S4 Programmation Web

Programmation Web SPIP. Sylvain Rampacek. IQ-S4 Programmation Web Programmation Web SPIP 1 Plan CMS Présentation de SPIP Première installation Sauvegarde d'un site SPIP Restauration d'un site SPIP 2 SPIP SPIP est un CMS... 3 Définition d'un CMS CMS : Content Management

Plus en détail

Installer une nouvelle version de PMB

Installer une nouvelle version de PMB Installer une nouvelle version de PMB Fiche technique PMB n 2.10 Objectif : Mettre à jour le logiciel en remplaçant les fichiers de PMB par ceux de la nouvelle version contenus dans le zip à télécharger

Plus en détail

logimot Gestion de parc de véhicules

logimot Gestion de parc de véhicules Gestion de parc de véhicules logimot 155-157 cours Berriat 38028 Grenoble cedex 1 FRANCE Téléphone : (+33) (0)4.76.70.94.70 Fax : (+33) (0)4.76.70.93.22 E-mail : info@logimot.com Site Web : www.logimot.com

Plus en détail

Leçon 5. Gérer l'administration du site

Leçon 5. Gérer l'administration du site 1 Leçon 5. Gérer l'administration du site Objectifs Préliminaire Au terme de cette leçon vous devrez être capable de configurer correctement le site gérer les langues Suivre la maintenance Vider le cache

Plus en détail

LE B. A. BA DU. POUR SPIP EVA WEB 2 Version élève

LE B. A. BA DU. POUR SPIP EVA WEB 2 Version élève LE B. A. BA SPIP- EVA WEB 2 DU RÉDACTEUR POUR SPIP EVA WEB 2 Version élève Michel LAURENT Animateur T.I.C.E. Annecy-Ouest Michel Laurent Le B.A.Ba du rédacteur pour Eva-web 2 http://www.tice.edres74.net

Plus en détail

Ecole - utilisation en équipes. Guide d utilisation du logiciel de gestion pour les

Ecole - utilisation en équipes. Guide d utilisation du logiciel de gestion pour les Guide d utilisation du logiciel de gestion pour les écoles (utilisation en équipes) 1 Sommaire 1. Conditions requises.......3 2. Téléchargement et sauvegarde corrects du logiciel..3 3. Activation des macros

Plus en détail

Exercices et corrections. Licence QCI - module O21

Exercices et corrections. Licence QCI - module O21 Exercices et corrections Licence QCI - module O21 Exercice 1 Ecrivez le squelette d une page avec les caractéristiques suivantes - encodage : utf-8 - titre de la page : première page XHTML - auteur : vous

Plus en détail

Déroulement. Conception de Sites Web dynamiques. 2 ème année en général. Conception de Sites Web 28/01/2010. Cours 1+2

Déroulement. Conception de Sites Web dynamiques. 2 ème année en général. Conception de Sites Web 28/01/2010. Cours 1+2 Déroulement Conception de Sites Web dynamiques Cours 1+2 Patrick Reuter http://www.labri.fr/~preuter/cswd2010 CM vendredi de 8h00 à 9h00 (Amphi Bât. E 3ème) TD - Groupe 1 : vendredi, 9h00 10h30 (R1-14)

Plus en détail