P. 1
Tutoriel premier site web

Tutoriel premier site web

|Views: 3,964|Likes:
Publié parFrançois Hanat

Deux solutions : Google Sites (overview) et Wordpress (installation et paramétrage).

Deux solutions : Google Sites (overview) et Wordpress (installation et paramétrage).

More info:

Published by: François Hanat on Dec 09, 2012
Droits d'auteur :Attribution Non-commercial

Availability:

Read on Scribd mobile: iPhone, iPad and Android.
download as PPTX, PDF, TXT or read online from Scribd
See more
See less

09/17/2013

pdf

text

original

Site Web #socent

Blog | Site Institutionnel | Site E-commerce

Créer un premier site internet

Site Web #socent

Choix applicatifs
¬ Google Sites
– Inclus dans la suite Google Apps – Ajouts de fonctionnalités par des codes embedded – Apparence à partir de modèle

¬ Wordpress
– CMS open source, gratuit – Gestion de l’apparence par des thèmes – Ajout de fonctionnalités par des plugins

Site Web #socent

Google Sites

Site Web #socent

Guide technique

http://fr.scribd.com/doc/61156721/Google-Apps-4-socent

Site Web #socent

Usage & Fonctionnalités
¬ Usage
– Intranet d’entreprise (gestion des accès) – Site web « familial »

¬ Fonctionnalités
– Edition intuitive, modèles clés en main, contrôle d’accès, stockage

Site Web #socent

Exemples + back-office

Site Web #socent

Wordpress

Site Web #socent

Présentation
¬ CMS Open-source ¬ Version française ¬ Extensions
– Thèmes – Plugins

¬ En saas
– monsite.wordpress.com – gratuit – Peu de souplesse

¬ Hébergé
– à partir de 2,38€/mois chez OVH – avec nom de domaine – Installation plus complexe, mais grande liberté par la suite.

Site Web #socent

Architecture

Site Web #socent

Architecture #2 : le multi-site
¬ Intérêt : un seul back-office à tous ces sites, MAJ du noyau unique ¬ monsite.org
– monsite.org/evenement – monsite.org/boutique – …

¬ Une manipulation :
– http://freelance-web-consultant.fr/aide-wordpress/tutorielmettre-en-place-le-multi-sites-sur-wordpress-3

Site Web #socent

Installer Wordpress

Site Web #socent

Pré-requis
¬ Un nom de domaine avec hébergement et base de données

Site Web #socent

Installer WP
¬ ¬ ¬ ¬ http://fr.wordpress.org/ Télécharger la dernière version Décompresser Réglage important pour que WP ait accès à votre BDD.

Site Web #socent

¬ Copier-coller wp-config-sample.php, le renommer en wp-config.php

¬ Ouvrir wp-config.php avec le bloc-note ou NotePad+ ¬ Modifier les informations relatives à votre base de données (fournies par votre hébergeur)
– DB_NAME = DB_USER le plus souvent – DB_PASSWORD – DB_HOST fourni par votre hébergeur

¬ Voir slide suivante

Site Web #socent

Modifier wp-config.php

Site Web #socent

Upload et connexion
¬ Uploader sur votre FTP
– Utiliser Filezilla (http://filezilla-project.org/)

¬ Se connecter au wizard
– http://monsite.org/wp-admin/install.php

¬ Renseigner les champs

Site Web #socent

Site Web #socent

La fin approche
¬ Cliquer sur se connecter

Site Web #socent

Se logger
¬ Avec les identifiants rentrés au wizard d’installaiton ¬ Site installé !

Site Web #socent

Site Web #socent

Référence : http://freelance-web-consultant.fr/aidewordpress/tutoriel-mettre-en-place-le-multi-sites-surwordpress-3

Installer en Multi-site

Site Web #socent

¬ Deux possibilités :
– sous-domaines : site1.monsite.org – sous-dossiers : monsite.org/site1

¬ le second est plus souple à l’usage, et n’impliquer pas de gérer les redirections CNAME

Site Web #socent

Multisite ? Si oui, suivre ces point
¬ Dans wp-config.php ajoutez : define('WP_ALLOW_MULTISITE', true); juste avant le commentaire :
/* C'est tout, ne touchez pas à ce qui suit ! Bon blogging ! */

Site Web #socent

Création du réseau
¬ Rafraîchir (F5) ¬ Cliquer sur Outils, puis « Création du réseau »

Site Web #socent

« Installer »

Site Web #socent

Les instructions associées

Site Web #socent

Deux fichiers à modifier
¬ Sauvegarder wp-config.php et .htaccess si vous en avez un (sinon, créer un fichier texte, l’appeler htaccess.txt)

Site Web #socent

Dans Filezilla
¬ Créer le répertoire blog.dir dans le dossier wp-content ¬ CHMOD : 755

Site Web #socent

Modifier wp-config.php
¬ L’ouvrir en local avec NotePad++, ajouter les lignes énoncées par wordpress au dessus du commentaire « C’est tout, ne touchez pas… »

Site Web #socent

.htaccess
¬ Si vous n’en avez pas, créer un .txt avec le texte donnée par wordpress :

Site Web #socent

.htaccess #2
¬ Uplaoder le « htaccess.txt » sur le serveur, le renommer en « .htaccess »

Site Web #socent

Se reconnecter

Site Web #socent

Le réseau est prêt
¬ En haut à gauche, dans le back-office, un menu « super-admin » apparaît.

Site Web #socent

Ajouter un site
¬ ¬ ¬ Pointer sur Mes Sites, Admin du Réseau, cliquer sur Sites Cliquer sur Ajouter Ajouter l’adresse du site, son nom et le mail de l’administrateur

Site Web #socent

Personnaliser son site

Site Web #socent

Les Thèmes
¬ Gratuit, accessible du back-office de wordpress ¬ Payants, exemple : http://www.woothemes.com/
– Thèmes de qualité professionnelle, payants

¬ De nombreux thèmes gratuits existent, faire une recherche google.

Site Web #socent

Installer un thème
¬ Le télécharger (le plus souvent, format .zip) ¬ Pointer sur « Thèmes », puis cliquer sur « Ajouter ». ¬ Cliquer sur « Envoyer ». Charger votre thème, cliquer sur « installer maintenant. ¬ Si vous êtes en multi-site, cliquer sur « activer sur le réseau ».

Site Web #socent

Activer un thème
¬ Pointer sur Apparence, cliquer sur Thèmes. ¬ Activer votre thème.

Site Web #socent

Les plugins
¬ Exemples
– Un menu amélioré
 Démo : http://wpmegamenu.com/  18$

– Un grille d’images dynamique
 Démo : http://codecanyon.net/item/dynamic-grid-wordpressposts-feed-slider/full_screen_preview/2644510  18$

¬ Nombreux plugins gratuits
– Mailchimp, Page link to,…

Site Web #socent

Installer un plugin
¬ Pointer sur extensions, cliquer sur « ajouter », puis sur envoyer. ¬ Choisissez le .zip du plugin, installer.

Site Web #socent

Avec woocomerce

Site e-commerce

Site Web #socent

Un framework e-commerce open-source
¬ Télécharger woocommerce
– http://www.woothemes.com/woocommerce/

¬ Compléter éventuellement d’un thème adapté ¬ Exemple : http://www.capdigital.com/publications/

Site Web #socent

Auteur
¬ François Hanat
– Chargé de mission à Cap Digital – Pôle de Compétitivité des services et Contenus Numériques

¬ ¬

f@hanat.fr http://francois.hanat.fr

43

You're Reading a Free Preview

Télécharger
scribd
/*********** DO NOT ALTER ANYTHING BELOW THIS LINE ! ************/ var s_code=s.t();if(s_code)document.write(s_code)//-->