I F
C IM
C ©
Supports de cours Quelques rappels en manipulation informatique Fabrice Papy Elisabeth de Pablo Parcours CIM‐Inalco, M2 "Conception et réalisation d'un projet de communication numérique" (CIM 5a01d) CFI‐Inalco, Magistère 1 "Communication interculturelle" (2012‐2013)
e r u t c e L
1 Supports de cours : parcours CIM‐Inalco, M2 "Conception et réalisation d'un projet de communication numérique" (CIM 5a01d) ; CFI‐Inalco, Magistère 1 "Communication interculturelle". (2012‐2013) depablo@msh‐paris.fr
INSTALLATION DE APACHE/PHP/MY SQL/WORDPRESS « Conception et réalisation d’un projet de communication numérique » (CIM 5a01d) Pour faire plus simple, nous préconisons de passer par un bundle afin de télécharger et d’installer les trois premiers outils : APACHE/PHP/MySQL. Pour toutes informations complémentaires, vous pouvez consulter les sites dédiés : •
C IM
C ©
e r u t c e L •
I F
APACHE : http://www.apache.org/
PHP : http://www.php.net/
2 Supports de cours : parcours CIM‐Inalco, M2 "Conception et réalisation d'un projet de communication numérique" (CIM 5a01d) ; CFI‐Inalco, Magistère 1 "Communication interculturelle". (2012‐2013) depablo@msh‐paris.fr
MySQL : http://www.mysql.com/
I F
C IM
1/ Téléchargez le bundle EASY PHP (WAMP) à l’adresse suivante : http://www.easyphp.org/
C ©
e r u t c e L
Ou MAMP pour les utilisateurs des MAC : http://www.mamp.info/en/index.html 3 Supports de cours : parcours CIM‐Inalco, M2 "Conception et réalisation d'un projet de communication numérique" (CIM 5a01d) ; CFI‐Inalco, Magistère 1 "Communication interculturelle". (2012‐2013) depablo@msh‐paris.fr
I F
C IM
C ©
e r u t c e L
Ou encore un LAMP pour les utilisateurs de LINUX : http://doc.ubuntu‐fr.org/lamp
4 Supports de cours : parcours CIM‐Inalco, M2 "Conception et réalisation d'un projet de communication numérique" (CIM 5a01d) ; CFI‐Inalco, Magistère 1 "Communication interculturelle". (2012‐2013) depablo@msh‐paris.fr
Cet exemple est développé pour les utilisateurs de PC sous Windows 7, mais les étapes à suivre pour les utilisateurs qui utilisent d’autres systèmes sont identiques. Sur Easyphp, choisissez le premier téléchargement 12.1 et cliquez sur la flèche
I F
C IM
Maintenant cliquez sur le petit carton
C ©
e r u t c e L
Le téléchargement doit s’effectuer automatiquement
5 Supports de cours : parcours CIM‐Inalco, M2 "Conception et réalisation d'un projet de communication numérique" (CIM 5a01d) ; CFI‐Inalco, Magistère 1 "Communication interculturelle". (2012‐2013) depablo@msh‐paris.fr
I F
C IM
C ©
e r u t c e L
Enregistrez l’exécutable et démarrez le ou exécutez le tout de suite
6 Supports de cours : parcours CIM‐Inalco, M2 "Conception et réalisation d'un projet de communication numérique" (CIM 5a01d) ; CFI‐Inalco, Magistère 1 "Communication interculturelle". (2012‐2013) depablo@msh‐paris.fr
I F
Choisissez la langue
C IM
C ©
e r u t c e L C’est parti !
Suivez les étapes 7 Supports de cours : parcours CIM‐Inalco, M2 "Conception et réalisation d'un projet de communication numérique" (CIM 5a01d) ; CFI‐Inalco, Magistère 1 "Communication interculturelle". (2012‐2013) depablo@msh‐paris.fr
I F
C IM
Enregistrez au bon emplacement sur votre ordinateur et cliquez sur Suivant
C ©
e r u t c e L
8 Supports de cours : parcours CIM‐Inalco, M2 "Conception et réalisation d'un projet de communication numérique" (CIM 5a01d) ; CFI‐Inalco, Magistère 1 "Communication interculturelle". (2012‐2013) depablo@msh‐paris.fr
I F
C IM
C ©
Cliquez sur Installer et Laissez faire
e r u t c e L
Cliquez sur terminer Une page s’ouvre, suivez les instructions 9 Supports de cours : parcours CIM‐Inalco, M2 "Conception et réalisation d'un projet de communication numérique" (CIM 5a01d) ; CFI‐Inalco, Magistère 1 "Communication interculturelle". (2012‐2013) depablo@msh‐paris.fr
I F
Vérifiez en bas à droite dans la barre que l’icône Easyphp est bien activée et que le serveur est démarré. En local, la machine s’appelle 127.0.0.1 ou localhost.
C IM
C ©
e r u t c e L
10 Supports de cours : parcours CIM‐Inalco, M2 "Conception et réalisation d'un projet de communication numérique" (CIM 5a01d) ; CFI‐Inalco, Magistère 1 "Communication interculturelle". (2012‐2013) depablo@msh‐paris.fr
CMS [Content Management System] Maintenant il faut aller sur le CMS choisi, c’est‐à‐dire sur l’interface qui va faire le relais entre vous et la gestion de php, MySql, Apache. (http://fr.wikipedia.org/wiki/Syst%C3%A8me_de_gestion_de_contenu) Dans ce cours, nous avons préconisé Wordpress mais Joomla [http://www.joomla.org/] , SPIP [http://www.spip.net/ ], ou DRUPAL [ http://drupal.org/ ] fonctionnent exactement de la même façon. Wordpress : http://wordpress.org/ Ou http://fr.wordpress.org/
I F
C IM
C ©
e r u t c e L
Téléchargez wordpress en cliquant dans le carré rouge. > Wordpress s'installe dans un fichier zippé directement sur votre ordinateur, il faut le dézipper. Mettre ensuite le dossier décompressé de wordpress dans : easyphp/www/wordpress à côté du dossier "my portable files". 11 Supports de cours : parcours CIM‐Inalco, M2 "Conception et réalisation d'un projet de communication numérique" (CIM 5a01d) ; CFI‐Inalco, Magistère 1 "Communication interculturelle". (2012‐2013) depablo@msh‐paris.fr
Connexion entre easyphp et wordpress De votre ordinateur connectez‐vous avec le serveur installé : http://127.0.0.1/home/ ou encore avec cette adresse : http://127.0.0.1/home/index.php Attention 127.0.0.1 peut être remplacé par localhost Toutes les données vont être stockées dans une base de données MySql, il va donc falloir lui donner un nom, lui attribuer un utilisateur et un mot de passe. Dans l’interface ouvrir Modules :
I F
>> Il faut maintenant créer une base de données : on clique sur l'onglet base de données
C IM
C ©
e r u t c e L
12 Supports de cours : parcours CIM‐Inalco, M2 "Conception et réalisation d'un projet de communication numérique" (CIM 5a01d) ; CFI‐Inalco, Magistère 1 "Communication interculturelle". (2012‐2013) depablo@msh‐paris.fr
I F
C IM
Par défaut, nous proposons les indications suivantes : nom de la BD : bdwp nom d'utilisateur : root mot de passe : rien (laissé vide) Pour information : le fichier de base de donnée que vous allez créer se trouve dans le répertoire : esayphp/mysql/data/bdwp Une fois créé, faire la connexion avec wordpress (fichier wp_config.php) Maintenant si vous allez sur http://127.0.0.1/wordpress/ vous devez avoir la fenêtre suivante :
C ©
e r u t c e L
Cliquez sur créer un fichier de configuration
13 Supports de cours : parcours CIM‐Inalco, M2 "Conception et réalisation d'un projet de communication numérique" (CIM 5a01d) ; CFI‐Inalco, Magistère 1 "Communication interculturelle". (2012‐2013) depablo@msh‐paris.fr
I F
C IM
C ©
Cliquez sur C'est parti, vous obtenez cette page :
e r u t c e L
14 Supports de cours : parcours CIM‐Inalco, M2 "Conception et réalisation d'un projet de communication numérique" (CIM 5a01d) ; CFI‐Inalco, Magistère 1 "Communication interculturelle". (2012‐2013) depablo@msh‐paris.fr
Remplissez les champs vides avec les informations sous‐mentionnées, à savoir : bdwp root rien localhost wp_ et cliquez sur Envoyer Vous accédez à la fenêtre « C'est parfait ; lancer l'installation »
Cliquez sur Lancer l'installation Vous voici devant l'interface administration « Bienvenue »
C ©
e r u t c e L
I F
C IM
15 Supports de cours : parcours CIM‐Inalco, M2 "Conception et réalisation d'un projet de communication numérique" (CIM 5a01d) ; CFI‐Inalco, Magistère 1 "Communication interculturelle". (2012‐2013) depablo@msh‐paris.fr
I F
C IM
C ©
e r u t c e L
Il faut maintenant remplir les champs, attention au mot de passe que vous allez donner : titre id : admin mot de passe : (bonjour) mot de passe (bonjour) redonner le même mail : dddd@fr Cliquez alors sur Installer Wordpress 16 Supports de cours : parcours CIM‐Inalco, M2 "Conception et réalisation d'un projet de communication numérique" (CIM 5a01d) ; CFI‐Inalco, Magistère 1 "Communication interculturelle". (2012‐2013) depablo@msh‐paris.fr
Vous devez accéder à l'interface suivante :
Succès id : admin mp : bonjour se connecter
I F
C IM
C ©
e r u t c e L
Cliquez sur « Se connecter » maintenant vous avez accès à l'interface administration de wordpress directement de votre ordinateur. Si vous tapez : http://127.0.0.1/wordpress/wp‐admin/
17 Supports de cours : parcours CIM‐Inalco, M2 "Conception et réalisation d'un projet de communication numérique" (CIM 5a01d) ; CFI‐Inalco, Magistère 1 "Communication interculturelle". (2012‐2013) depablo@msh‐paris.fr
Entrez vos identifiant et mot de passe et vous accédez à l'interface suivante :
I F
C IM
Vous pouvez maintenant retourner sur le site de wordpress et l'explorer afin de choisir des thèmes ou des plug‐ins que vous intégrerez dans votre site. http://wordpress.org/ Regardez et téléchargez des thèmes que vous installerez dans le répertoire suivant : esasyphp/www/wordpress/wp_content/themes Attention lorsque vous dézipper les dossiers, souvent vous enregistrez un dossier dans un autre, ce qui risque de poser problème. Téléchargement des images : wp_content/uploads/2012/...
C ©
e r u t c e L
18 Supports de cours : parcours CIM‐Inalco, M2 "Conception et réalisation d'un projet de communication numérique" (CIM 5a01d) ; CFI‐Inalco, Magistère 1 "Communication interculturelle". (2012‐2013) depablo@msh‐paris.fr
Installation sur le serveur à distance Il faut maintenant installer la même chose sur le serveur dédié.
Installer un FTP Plusieurs possibilités sont offertes : installer le module ftp sur Mozilla ou bien téléchargez un client FTP comme FileZilla (client FTP qui permet de charger ou télécharger les fichiers sur un serveur). Allez sur http://filezilla.fr/ Cliquez sur Téléchargez et suivez les procédures.
I F
C IM
C ©
Une fois installé, on ouvre le logiciel et on se connecte au serveur distant :
e r u t c e L
19 Supports de cours : parcours CIM‐Inalco, M2 "Conception et réalisation d'un projet de communication numérique" (CIM 5a01d) ; CFI‐Inalco, Magistère 1 "Communication interculturelle". (2012‐2013) depablo@msh‐paris.fr
La partie gauche présente les dossiers qui sont sur votre ordinateur, la partie droite correspond aux dossiers et fichiers qui se trouvent sur le serveur distant. Par défaut, Fabrice Papy vous a ouvert un dossier sur le serveur semiomedia. Votre login est votre nom XXX, votre mot de passe est votre YYY. Pour accéder à votre répertoire : www.semiomedia.org/2012/nom Informations de connexion via ftp ftp (vers semiomedia) www.semiomedia.org IP : 37.59.124.135 ftp.semiomedia.org Log in: mp : Une fois la connexion établie, vous allez transférer les 1090 fichiers de wordpress sur votre dossier serveur en un simple « glisser, déposer » entre les deux fenêtres. Une fois les fichiers transférés, il faut recréer le fichier de configuration. >> un souci survient à la fin de la configuration. Il faut donner une autorisation supplémentaire au fichier wp_config.php Prenez le texte du fichier wp‐config.php qui se trouve sur votre ordinateur, et copiez/collez le dans un bloc‐notes.
I F
C IM
C ©
e r u t c e L
Enregistrez ce fichier sur le bureau de votre ordinateur sous le nom suivant : ‘’wp_config.php’’ ATTENTION à ne pas oublier les ‘’ ‘’ lors de l’enregistrement. Maintenant retournez sur FileZilla et mettez ce fichier sur le serveur.
20 Supports de cours : parcours CIM‐Inalco, M2 "Conception et réalisation d'un projet de communication numérique" (CIM 5a01d) ; CFI‐Inalco, Magistère 1 "Communication interculturelle". (2012‐2013) depablo@msh‐paris.fr
Installer Wordpress sur le serveur Vous pouvez maintenant vous connectez à votre espace et configurez WORDPRESS avec vos paramètres http://semiomedia.org/2012/Nom/
Cliquez sur Installer Wordpress
I F
C IM
C ©
e r u t c e L
Maintenant vous pouvez administrer à distance.
Ouvrez votre page personnelle sur le serveur : http://semiomedia.org/2012/Nom/wp‐admin et connectez‐ vous en entrant votre log in et mot de passe que vous avez défini dans la procédure précédente.
Gestion des médias
Attention, il faut que le serveur reconnaisse un dossier pour accueillir les médias. Pour ce faire, créer un répertoire d’accueil sur le serveur. Sur votre ordinateur, créez un dossier wp_content et installez le via Filezilla dans le dossier uploads >> Vous avez créé un dossier wp_content Ensuite, se mettre dans le dossier uploads, faire un clic droit dessus et ouvrez les droits d’accès aux fichiers. Cochez tout (liste avec Lire, Ecrire, Exécuter) et Valider. Vous pouvez maintenant relancer le transfert des médias, qui vont se mettre dans le dossier créé. Si vous ouvrez ce dossier (toujours dans Filezilla) vous pouvez maintenant visualiser vos fichiers médias. 21 Supports de cours : parcours CIM‐Inalco, M2 "Conception et réalisation d'un projet de communication numérique" (CIM 5a01d) ; CFI‐Inalco, Magistère 1 "Communication interculturelle". (2012‐2013) depablo@msh‐paris.fr
Installer de nouveaux thèmes et extensions Wordpress D’une façon générale, allez dans l’interface « Theme » de Wordpress et choisissez un thème, téléchargez le et installer le en suivant les procédures. Le système vous redemandera vos identifiants. Quelques liens utiles : http://www.wordpress‐fr.net/ http://wordpress.org/extend/themes/ http://theme.wordpress.com/ http://www.lesthemeswordpress.fr/
I F
Attention, il va falloir transférer ce thème téléchargé et dézippé dans le dossier wp‐content/themes via Filezilla bien sûr.
C IM
C ©
e r u t c e L
De même, une adaptation riche des modèles est possible grâce aux modules d’extensions de Wordpress La procédure reste identique : vous choisissez votre extension (encore appelé plug‐in ou widget) vous la téléchargez et vous l’installer. Le système vous redemandera vos identifiants.
Retrouvez toutes les extensions à cette adresse : http://wordpress.org/extend/plugins/
22 Supports de cours : parcours CIM‐Inalco, M2 "Conception et réalisation d'un projet de communication numérique" (CIM 5a01d) ; CFI‐Inalco, Magistère 1 "Communication interculturelle". (2012‐2013) depablo@msh‐paris.fr