wordpress bases e-learning
DESCRIPTION
Formation Construction d'un site web avec WordPress sur mesure pour savoir plus www.ithelp4u.frTRANSCRIPT
![Page 1: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/1.jpg)
WordPress Fondamentaux
Antonio Soto www.ithelp4u.ca/fr [email protected] SOFTWARE ENGINEER, MCT, MCP, MCDBA, MCAD
![Page 2: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/2.jpg)
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
![Page 3: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/3.jpg)
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.
![Page 4: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/4.jpg)
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
![Page 5: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/5.jpg)
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
![Page 6: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/6.jpg)
6
Système de Gestion de Contenu
![Page 7: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/7.jpg)
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
![Page 8: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/8.jpg)
8
![Page 9: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/9.jpg)
cPanel
9
![Page 10: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/10.jpg)
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
![Page 11: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/11.jpg)
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
![Page 12: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/12.jpg)
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)
![Page 13: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/13.jpg)
Créer un blogue sur
wordpress.com
![Page 14: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/14.jpg)
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
![Page 15: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/15.jpg)
Définir les
Réglages
![Page 16: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/16.jpg)
16
![Page 17: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/17.jpg)
l’interface d’administration.
17
![Page 18: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/18.jpg)
Publier et Gérer les Pages / Articles
Les panneaux Articles, Médias et Pages vous permettent d’alimenter votre site.
![Page 19: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/19.jpg)
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
![Page 20: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/20.jpg)
Ecrire une nouvelle page
20
![Page 21: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/21.jpg)
LES ARTICLES
21
![Page 22: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/22.jpg)
L’Editeur de Texte
22
![Page 23: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/23.jpg)
Créer un lien
23
![Page 24: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/24.jpg)
24
![Page 25: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/25.jpg)
25
![Page 26: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/26.jpg)
Extrait - Articles
26
![Page 27: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/27.jpg)
Modifier les articles
27
![Page 28: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/28.jpg)
Settings Articles
![Page 29: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/29.jpg)
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
![Page 30: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/30.jpg)
![Page 31: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/31.jpg)
Insérer des Images et
des Vidéos
![Page 32: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/32.jpg)
AJOUTER ET GERER DES IMAGES
32
![Page 33: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/33.jpg)
33
![Page 34: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/34.jpg)
Options avancées de l’image
34
![Page 35: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/35.jpg)
La bibliothèque de médias
35
![Page 36: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/36.jpg)
Les Menus
36
![Page 37: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/37.jpg)
Comment gérer les menus
37
![Page 38: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/38.jpg)
Comment gérer les menus
38
![Page 39: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/39.jpg)
Les Widgets
![Page 40: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/40.jpg)
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
![Page 41: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/41.jpg)
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
![Page 42: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/42.jpg)
42
![Page 43: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/43.jpg)
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>
![Page 44: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/44.jpg)
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]“>
![Page 45: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/45.jpg)
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
![Page 46: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/46.jpg)
Exemple Bannière
46
![Page 47: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/47.jpg)
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
![Page 48: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/48.jpg)
48
![Page 49: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/49.jpg)
49
Iframe Widget
![Page 50: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/50.jpg)
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.
![Page 51: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/51.jpg)
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
![Page 52: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/52.jpg)
Gestion des utilisateurs
52
![Page 53: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/53.jpg)
Rôles des utilisateurs
53
![Page 54: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/54.jpg)
Qu'est-ce que
le RSS
![Page 55: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/55.jpg)
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
![Page 56: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/56.jpg)
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
![Page 57: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/57.jpg)
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
![Page 58: WordPress Bases e-learning](https://reader033.vdocuments.pub/reader033/viewer/2022051323/54828cf7b4af9f9b0d8b4845/html5/thumbnails/58.jpg)
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