WordPress Bases e-learning

WordPress Fondamentaux

Antonio Soto www.ithelp4u.ca/fr jsoto2000@gmail.com SOFTWARE ENGINEER, MCT, MCP, MCDBA, MCAD

PLAN

2

Pourquoi WordPress

Créer un blogue sur wordpress.com

Définir les réglages

Publier et gérer les pages / articles

Insérer des images

Les Widgets

Les Menus

Gérer les utilisateurs

Qu'est-ce que le RSS

Pourquoi WordPress

WordPress permet la gestion d’un site en toute simplicité sans avoir à connaitre les langages de programmations d’un site web ou d’un blog.

WordPress

• CMS(Gestionnaire de Contenu) WordPress, un outil libre, gratuit… et intuitif ! A partir d'une page HTML/CSS statique, entrez dans le monde des sites dynamiques.

• Objectif: Savoir créer et déployer un site WP.

4

Pour quoi WordPress

• Il suffit d’un navigateur Web • Multitude de thèmes • Plug in pour ajouter des fonctions • Intégration des galeries photo directe ou

externe • Facilité d’utilisation • Gratuit • Communauté forum d’aide

5

6

Système de Gestion de Contenu

Les Gestionnaires de contenus

• CMS (content management system)

– Permettent de créer des sites Web rapidement

– Séparation forme et contenu

– Mise a jour dynamique de sites

– Gestion des utilisateurs et des droits

– Bureau interface Homme Machine (front Office)

– Gestion des contenus (Back Office)

• Logiciels de type CMS

– Mise en forme teste , liens ..;

– Possibilités de réagir par des commentaires

– Liaisons possible avec canaux (ou fils ou flux) RSS

7

8

cPanel

9

Donc n’oubliez pas :

• Choisir un bon nom de domaine pour votre site (meilleur référencement)

• Utilisez préférentiellement un hébergeur payant !

• Customisez votre site avec le thème que vous voulez et les plugins que vous voulez !!!

10

Etape de planification

Répondez aux questions suivantes :

• Que vais-je faire de mon site ? • Qui va lire mon site ? • Quel type d'informations vais-je y mettre ? • Pourquoi fais-je cela ? • Pour qui fais-je cela ? • Que sera la périodicité de mes mises à jour ?

11

Plan du site (exemple) Pages

Accueil (1 video)

Presentation (2 images)

Contact (plugin)

Categories

Actualités

Évènements

À lire

- Mettons trois des vos articles (post) de test dans des catégories pour voir comment ça marche.

- Préparation d'images: (PS)

12

Mot clé: 5

(SEO Référencement)

Nos lien préférés chercher sociaux d'affaires

RSS: Sélectionner information d'autres sites Web, (des nouvelles de l'extérieur)

Thèmes: Sélectionner un modèle de trois colonnes

Banner

Gallerie de photos (plugin)

Créer un blogue sur

wordpress.com

Créer un compte

Pour créer un compte et démarrer son blogue, voici les étapes :

‣ Rendez-vous à l’adresse suivante : http://WordPress.com/

‣ Choisissez la version française du système (si désiré)

‣ Cliquez sur le gros bouton « Inscrivez-vous » (Sign-up now !) – di"cile à manquer…

14

Définir les

Réglages

16

l’interface d’administration.

17

Publier et Gérer les Pages / Articles

Les panneaux Articles, Médias et Pages vous permettent d’alimenter votre site.

Quelle différence y a-t-il entre une page et un article ?

• Les pages et les articles sont 2 moyens de publications

différents.

• Les pages sont des données statiques dans votre site. Contrairement aux articles, il sont indépendants du temps et de la chronologie de création. Une page peut contenir des informations statiques telles que votre CV, une page de contact, votre portfolio, ou tout simplement une présentation de votre blog et de vous.

• Les articles, objectif même du blog, vous permettent de publier des actualités, celles-ci sont affichées par date de publication.

19

Ecrire une nouvelle page

20

LES ARTICLES

21

L’Editeur de Texte

22

Créer un lien

23

24

25

Extrait - Articles

26

Modifier les articles

27

Settings Articles

Différence entre un tag et une catégorie.

• Les tags sont importants pour le référencement surtout.

• Il faut utiliser les catégories afin de "classer" le contenu et gérer l' affichage des articles en ajoutant des tags à chaque articles afin de faciliter la recherche et leur réferencement.

29

Insérer des Images et

des Vidéos

AJOUTER ET GERER DES IMAGES

32

33

Options avancées de l’image

34

La bibliothèque de médias

35

Les Menus

36

Comment gérer les menus

37

Comment gérer les menus

38

Les Widgets

Les widgets

Les widgets sont des outils que vous pouvez ajouter, déplacer ou retirer des colonnes (gauche, droite, entête ou pied-de-page) de votre site.

40

Voici quelques-uns des principaux widgets

‣ Archives : La liste des archives mensuelles de votre blogue (sous forme de liste déroulante ou non) ‣ Calendrier : La liste des archives sous forme de calendrier (le calendrier ne permet pas d’a"cher des événements à venir) ‣ Catégories : La liste des catégories d’articles de votre blogue ‣ Image : Permet d’a"cher une image dans la colomne ‣ Liens : Liste des liens ajoutés à la section « Liens » ‣ Pages : Liste des pages de notre site ‣ Articles récents : Le titre des derniers articles publiés sur votre blogue ‣ Commentaires récents : Le titre des derniers commentaires publiés sur votre blogue ‣ Recherche : ajoute un champ «Recherche» à votre blogue ‣ Texte : permet d’ajouter un extrait texte et même d’y insérer du code HTML (tableau, image etc.) ‣ Liens RSS : Les liens RSS de vos articles et/ou commentaires ‣ RSS : permet d’a"cher du contenu en provenance de flux RSS externes

41

42

Create a text widget using writing this text:

<ul>

<li><a href="http://www.ithelp4u.ca" title="Formateur Multimedia">Antonio Soto 24/7</a></li>

<li><a href="http://www.topwpthemes.com/ " title="Great Free Themes">Wordpress Themes</a></li>

</ul>

ADDING IMAGES TO THE TEXT WIDGET

Upload the image first to the WordPress Media Library.

Click the File URL button to put the image file location in the form above it (see screenshot below).

Copy the link that appears in the form for Link URL.

Click Save Changes.

Exit the Media Library.

Go to Appearance > Widgets.

Add or edit the Text Widget in which you wish the image to appear.

Enter the following, pasting in the image location or URL and editing the HTML accordingly, and save.

<img src="[Image Link URL]" alt="[description - what is this]“>

C'est quoi une Bannière? Une bannière publicitaire est une image associée à l'adresse url du site sur lequel l'internaute est dirigé lorsqu'il clique sur la bannière. C'est l'équivalent électronique d'un encart (oncart) publicitaire d'un support papier.

Votre message doit être clair, simple et attrayant (atrreyao). Un titre (accroche) et une à deux lignes suffisent et doivent être capables de détourner l'attention de l'internaute.

Une bannière peut être :

Fixe : une seule image aux formats JPEG, GIF, PNG

Animée : succession d'images avec différents textes au format GIF

En Flash : animations bien plus spectaculaires qu’une simple bannière animée

45

Exemple Bannière

46

Bannière Animée

• Préparer deux images (taille et couleur)

• Ouvrez le site Web de WP et charger les deux images (option Media)

• Générer le code HTML (Dreamweaver Insérez/Image Objets/Rollover Image)

• Copiez le code HTML

• Sélectionnez Options Apparence / Widgets / Texte

• Collez le code HTML

• Enregistrer le Widget

47

Twitter

48

49

Iframe Widget

Gérer les

Utilisateurs

Utilisateur: Permet d’ajouter un ou plusieurs utilisateurs du site web ou blog (contributeur, administrateur, éditeur, auteur). Permet aussi d’accéder à votre profil et vos paramètres personnels.

Gestion des utilisateurs Abonné: peut laisser des commentaires Contributeur: peut en plus soumettre un article à la publication Auteur: peut en plus publier ses articles et les gérer. Peut aussi s’occuper de la gestion des commentaires déposés sur ses propres articles Editeur: peut en plus gérer tous les articles et tous les commentaires du site ainsi que la blogoliste (liens vers vos amis) Administrateur: peut tout faire: gérer la base de données, les thèmes, les plugins, …

51

Gestion des utilisateurs

52

Rôles des utilisateurs

53

Qu'est-ce que

le RSS

Qu'est-ce que le RSS ?

RSS (Really Simple Syndication) désigne une famille de formats XML utilisés pour la syndication de contenu Web. (source : wikipedia) La « Syndication » consiste à vendre le droit de reproduire un contenu ou de diffuser un programme à plusieurs diffuseurs.

55

Comment faire une sauvegarde complète d’un blog WordPress

Pré-réquis :

Filezilla (logiciel gratuit disponible sur Windows ou sur Mac)

FireFTP (extension Firefox)

étapes

Installez l’un des deux logiciels à l’aide des liens ci-dessus

Créez un dossier sur votre bureau intitulé le nom de votre blog

Connectez-vous à votre FTP à l’aide de vos identifiants

Sélectionnez le dossier portant le nom de votre blog sur la fenêtre de gauche

Puis faîtes-y glisser tous les fichiers de la fenêtre de droite

En attendant que tout finisse, sauvegardez votre base de données

Installez simplement l’extension “WP-DB-Backup”

Mettez en place une sauvegarde régulière dans les options “Scheduled Backup” (minimum une fois par semaine)

Indiquez votre adresse mail dans “Backup Options”

Cliquez sur “Backup Now” pour lancer la sauvegarde

56

Quand la mise à niveau vers une nouvelle version de WordPress, vous devriez vérifier avec votre hébergeur les versions minimales requises suivantes :

Toutes ces réponses

WinZip et MySQL

PHP et SSH

PHP et FTP

PHP et MySQL

57

Qui soutient, maintient et mise à jour le code WordPress disponible sur WordPress.org?

La Communauté WordPress

Aide sur les forums, soumettre un rapport de bug, modifier le Codex (documentation), assister à Camp WordPress

58

Merci !!!