Académie WordPress : Apprendre WordPress étape par étape

1. Bienvenue dans le cours !: WordPress puise un énorme pourcentage de sites Web disponibles aujourd'hui. Vous avez presque certainement visité un site qui fonctionne sur WordPress. Certains des plus grands noms et marques de WordPress de confiance, y compris Disney, PlayStation, MTV, Microsoft, Sony, et bien d'autres encore. La bonne nouvelle est qu'il est facile pour les débutants de commencer avec et vous n'avez pas besoin de connaître de codage pour construire des sites Web incroyables. Au cours de ce cours, je vais vous guider dans le processus de construction de plusieurs sites WordPress. Y compris une page d'accueil du festival de musique, un blog et aussi un site de commerce électronique. Une fois que vous êtes familier avec WordPress de ces projets, nous augmentons les choses encore plus loin et introduisons du code en convertissant un site Web régulier en un thème WordPress entièrement personnalisé. Avant d'arrondir les choses en jetant un oeil sur la façon dont nous pouvons configurer une installation multi-site WordPress. Qui suis-je ? m'appelle Chris et je suis un développeur web du Royaume-Uni. Pour moi, WordPress m'a permis de créer beaucoup de sites étonnants pour des clients ou des entreprises ou pour un usage personnel à partir d'une seule page de destination jusqu'à un site e-commerce complexe. Il le fait en fournissant un noyau flexible, puis pose en tant qu'utilisateur et l'étend avec un grand choix de plug-ins, il a étendu la fonctionnalité. Jumentons dans l'apprentissage WordPress ensemble en construisant un projet amusant et éducatif. Je te verrai dans la première leçon. 2. Partagez votre travail sur Skillshare !: Lorsque vous suivez un cours, il est très important de ne pas prendre l'habitude de suivre un cours juste pour le plaisir de cocher une autre conférence. Prenez le temps de comprendre chaque leçon. revue le code que vous écrivez et réfléchissez à la manière dont vous pourriez aborder ces solutions vous-même. Dans cet esprit, ce cours est basé sur des projets et vous donne l'opportunité de vraiment créer quelque chose de personnel et d'unique. Vous n'avez pas besoin de trop vous perdre et de vous éloigner de la classe Vous pouvez même prendre du recul une fois que vous avez terminé le cours, revenir et apporter des modifications au projet par la suite. Cela vous donnera vraiment une bonne chance de mettre en pratique ce que vous avez appris en classe. Pensez également à partager votre projet ici sur Skillshare. Non seulement je vais y jeter un coup d'œil, mais cela inspirera également les autres étudiants. Pour plus d'informations sur le projet de classe, rendez-vous dans l'onglet Projet et ressources, où vous pouvez non seulement télécharger votre projet, mais également voir d'autres projets de classe. Dans cet esprit, j'ai hâte de voir ce que vous créerez et téléchargerez ici sur Skillshare. 3. Pourquoi WordPress ?: WordPress a commencé sa vie comme une plate-forme de blogs et il est maintenant devenu le système de gestion de contenu le plus populaire disponible aujourd'hui, qui alimente également certains des sites Web les plus populaires au monde. WordPress est entièrement gratuit à utiliser, gratuit à télécharger, et il est également construit par des centaines de bénévoles communautaires ainsi que toutes les grandes fonctionnalités que WordPress fournit. Nous les découvrirons pendant le cours. Une des choses que j'aime vraiment à propos de WordPress est qu'il a quelque chose pour tout le monde. Si vous êtes une personne non technique ou un débutant, vous pouvez acheter un hébergement web simple, utiliser une installation en un clic, sélectionner votre thème et vous avez votre propre site web ou blog en moins d'une demi-heure. Pour les concepteurs web ou les développeurs ou les gens en général qui veulent sauter un peu plus profondément, il y a aussi beaucoup de choses formidables que vous pouvez faire techniquement pour faire un site Web vraiment puissant. Vous pouvez appeler vos propres thèmes et aussi des plugins pour faire regarder WordPress et fonctionner exactement comme vous voulez qu'il soit. WordPress est également en constante évolution, son amélioration constante, que ce soit un correctif de sécurité ou une nouvelle fonctionnalité pour empêcher WordPress de devenir obsolète. Aussi les créateurs de WordPress ont rendu ces mises à jour vraiment facile à appliquer aussi. Vous n'avez pas à vous soucier des mises à jour et des installations compliquées. Ces mises à jour sont généralement effectuées à partir du tableau de bord WordPress et impliquent souvent simplement le clic d'un bouton. Comme vous pouvez également le voir sur la page d'accueil WordPress qui est wordpress.org, il y a aussi beaucoup de thèmes différents que vous pouvez choisir. Si nous allons dans la section thématique, nous pouvons voir qu'il y a plus de 7 000 thèmes différents sont présents. Ceux-ci nous permettront de construire presque n'importe quel type de site que nous voulons créer. Lorsque nous créons réellement un site Web WordPress, tout le contenu reste exactement le même, et nous pouvons ensuite basculer entre différents thèmes pour donner à notre contenu ou à notre site un aspect complètement différent. Sur le premier ensemble de WordPress certains des thèmes seront pré-installés, ou nous pouvons chercher à travers l'un de ces thèmes à partir de wordpress.org. Ce sont des thèmes gratuits pour mettre en place nos projets. Avec ces thèmes gratuits, il y a aussi des thèmes premium disponibles aussi, que vous pouvez également acheter sur des sites tels que ThemeForest, mais nous allons examiner cela plus en détail au fur et à mesure que nous progresserons dans le cours. Le noyau WordPress que nous allons télécharger est vraiment simple mais très puissant, et aussi rempli de nombreuses fonctionnalités. Cependant, s'il manque certaines fonctionnalités dont votre application ou votre site Web a besoin, cette fonctionnalité sera probablement disponible en tant que plugin. plugins sont à peu près ce qu'ils ressemblent. Ils sont quelque chose que vous pouvez télécharger pour plugin et étendre le noyau WordPress. Ils ajoutent des fonctionnalités et des fonctionnalités qui sont généralement simples à installer en cliquant sur quelques boutons, mais encore une fois nous allons jeter un oeil aux plugins plus en détail plus tard dans le cours. Certains des autres avantages WordPress sont qu'il est vraiment convivial pour les moteurs de recherche. En utilisant WordPress, de nombreuses meilleures pratiques de référencement sont déjà prises en charge pour nous dans les coulisses. Si vous voulez l'aller encore plus loin, il y a aussi quelques grands plugins, qui bien jeter un coup d'oeil dans la vidéo des plugins. Enfin, WordPress a une application mobile très utile pour iOS et Android qui est gratuite à télécharger. L' application vous permet d'écrire des contenus WordPress et de mettre à jour votre site Web en mouvement. Il peut même télécharger des photos, gérer des billets de blog, gérer tous les commentaires, et également modifier des pages à mesure que vous allez. Ce sont quelques bonnes raisons de choisir WordPress. Bien sûr, il y en a beaucoup d'autres et je suis sûr que vous trouverez vos propres raisons d'utiliser WordPress au fur et à mesure que vous progressez dans ce cours. 4. WordPress.org ou WordPress.com ?: Commençons par WordPress.org, qui est la page d'accueil du populaire logiciel WordPress open source. Open Source signifie que tout le monde peut l'utiliser ou y contribuer gratuitement. C' est le site pour le logiciel WordPress officiel, que nous allons utiliser pour créer notre projet à travers ce cours. Nous le téléchargeons, nous pouvons le personnaliser et le télécharger sur un serveur en direct une fois terminé. Il nous donne fondamentalement la flexibilité totale car il est complètement auto-hébergé, et aussi les coûts d'hébergement pour WordPress relativement pas cher quand il a commencé. En haut de cette page, vous pouvez voir ici que nous avons les plugins et les thèmes disponibles que nous pouvons ensuite utiliser. Nous utiliserons les deux tout au long de ce cours. Il y a aussi une section de support où nous pouvons avoir un accès complet à la documentation WordPress, laquelle nous allons faire référence assez souvent, et bien sûr, tout ce dont nous avons besoin depuis l'installation de thèmes jusqu'à sujets de sécurité. Le logiciel réel est disponible en cliquant sur ce bouton get WordPress, et c'est l'une des options de configuration que nous allons jeter un oeil à très bientôt. Télécharger ce logiciel comme mentionné nous donnera flexibilité totale et le contrôle sur tout ce que nous allons faire avec notre site WordPress, ou il y a une alternative qui est disponible sur WordPress.com. WordPress.com est plus d' un service qui nous permettra d'avoir un site WordPress, posté des photos. Il utilise le même logiciel WordPress que nous venons de regarder, il enlève cette configuration et fournit l'hébergement pour ce logiciel. Ce site a été créé par l'un des fondateurs de WordPress. Pour la facilité de configuration ne vient à un coût. Nous n'avons pas la flexibilité dont nous disposons lors de l'auto-hébergement. Sous aussi par des restrictions sur quels thèmes plugins nous pouvons utiliser, en fonction exactement quel plan payant que vous utilisez. Avec cela à l'esprit, si nous cliquons sur un Forfaits and Pricing de la navigation, il y a différents niveaux de prix ainsi qu'une option gratuite, que nous pouvons voir en haut, est 3ca à venir option au début. Mais il place également des bannières publicitaires sur votre site, ce que vous ne voulez probablement pas. Nous avons ensuite des options d'un côté personnel jusqu'à un magasin de commerce électronique. Nous pouvons voir ces options plus en détail, si nous faisons défiler vers le bas jusqu'à ce tableau. Pour autant que je l'ai mentionné, il y a quelques restrictions, comme vous pouvez le voir ici lors de l'utilisation de WordPress.com, et ces restrictions sont levées au fur et à mesure que nous traversons des options de prix plus élevés. WordPress.org est celui à choisir si nous voulons un contrôle total sur notre site, et nous sommes heureux de faire un peu de travail de mise en place. Nous allons choisir ce chemin à travers ce cours, ou ce site qui est WordPress.com est une bonne option si vous voulez que tout soit pris en charge pour vous. Mais rappelez-vous qu'il y a des restrictions à moins que vous optiez pour les plans plus chers. 5. Où trouver des thèmes WordPress: Ce cours ne nécessite aucun achat pour un thème ou un logiciel supplémentaire. Bien qu'à un moment donné dans le futur, vous pouvez utiliser WordPress pour construire beaucoup et beaucoup de sites, que ce soit pour un emploi, ou pour des clients payants, ou pour des entreprises. Pour ce cas d'utilisation, vous pouvez également regarder certaines options de thème premium. L' une des options pour cela est themeforest.net. C' est un marché pour non seulement les thèmes WordPress, mais aussi l'argent d'un code, des extraits, des photos, et aussi des vidéos. Nous allons nous concentrer sur les thèmes WordPress que nous pouvons aller à partir de cet onglet. De là, nous pouvons vérifier toutes les différentes catégories, nous pouvons également rechercher en utilisant la barre de recherche en haut et il y a généralement des thèmes disponibles pour presque tout type de site WordPress que vous voulez créer. Par exemple, si nous voulons créer un site Web de mariage, nous pouvons faire une recherche, et la recherche de mariage renvoie plus d'un millier de thèmes différents à choisir. Comme je l'ai mentionné, c'est principalement du contenu payant sur ce site, mais ce prix inclut également souvent le support aussi. Il y a aussi beaucoup de gens et d'entreprises qui gagnent leur vie à temps plein, créent des thèmes et les vendent sur des marchés comme ça. Si nous revenons aux articles populaires, nous pouvons voir certains des thèmes populaires tels que le thème Avada, c'est actuellement l'un des thèmes les plus populaires et il a des centaines de milliers de ventes. Nous pouvons jeter un oeil à l'aperçu en direct et voir exactement à quoi ressemblera ce thème avec différentes mises en page, nous pouvons faire défiler l'un de ces thèmes et vérifier toutes les fonctionnalités qui viennent avec elle et généralement, beaucoup de ces thèmes ont beaucoup d'options différentes pour la mise en page ou le changement de couleur et ils sont également très flexibles pour que nous puissions l'utiliser pour des pages de produits comme les sites de commerce électronique, nous pouvons l'utiliser pour des blogs et aussi pour des sites personnels aussi. En plus de voir comment notre site Web ressemblera et se sentira avec un thème particulier, il est également très important de consulter toutes les informations qui sont énumérées ci-dessous. Nous voulons nous assurer que notre thème est régulièrement mis à jour, nous voulons nous assurer qu'il a obtenu de bonnes critiques et aussi c'est possible avec notre version de WordPress. Lors du choix d'un thème, il ne s'agit pas seulement de son apparence, mais aussi des fonctionnalités et des choses que nous pouvons faire avec. L' une des bonnes indications des caractéristiques est les étiquettes qui sont en bas. Ces balises reflètent souvent exactement les entités incluses dans un thème, telles que le nombre d'options de mise en page, si elle doit avoir une mise en page à deux colonnes, si elle doit avoir une mise en page à trois colonnes, si elle est compatible avec WooCommerce pour les magasins de commerce électronique, s'il est prêt à traduire et aussi quelles personnalisations sont disponibles pour ce thème particulier. Nous pouvons également voir exactement avec quels navigateurs cela est compatible et aussi quelles versions des plug-ins WordPress sont également compatibles avec ce thème aussi. Celui-ci est également prêt à l'emploi, qui signifie que nous pouvons activer des widgets qui sont des éléments autonomes de contenu que nous pouvons placer sur notre site, ainsi que tous les thèmes payants qui sont disponibles sur le site. Comme nous l'avons regardé plus tôt, le site officiel wordpress.org a également une option de thèmes en haut. Il y a aussi des thèmes payants de cette section commerciale, mais nous allons seulement nous concentrer sur les trois thèmes que nous avons énumérés ici. Nous pouvons télécharger n'importe lequel de ces thèmes à partir du tableau de bord WordPress et nous allons le faire lorsque nous configurerons notre premier projet. Tout comme les thèmes que nous venons d'examiner, nous allons pouvoir cliquer sur n'importe lequel de ces thèmes, nous pouvons consulter un aperçu et cela nous donnera une idée de l'apparence de notre thème avec certains contenus de blog. Encore une fois, il vaut également la peine de consulter toutes les informations supplémentaires telles que la dernière fois qu'il a été mis à jour, les évaluations et les évaluations, ainsi que les tags aussi. Nous pouvons voir que celui-ci est prêt à l'accessibilité, il a plusieurs personnalisations telles que l'arrière-plan, les couleurs, le logo, l'en-tête, et aussi le menu. Il est compatible avec le commerce électronique, sa traduction prête, et dispose également de différentes mises en page telles qu'une colonne et aussi une mise en page à deux colonnes. Ce sont des choses vraiment importantes à considérer pour votre site mais ne vous inquiétez pas encore de sélectionner des thèmes avec toutes ces options de balises car nous allons découvrir exactement ce que sont la plupart d'entre eux au fur et à mesure que nous progressons dans le cours. Avoir tous ces thèmes disponibles pour WordPress nous permet découpler le contenu que nous avons sur nos sites avec le look and feel. Même si nous avons un blog que nous appelons des centaines et des milliers de billets de blog, nous pouvons également changer complètement l'apparence et la sensation en changeant simplement le thème. Ce thème n'affectera pas le contenu original et nous avons toujours toutes ces informations disponibles et la plupart de ces thèmes sont généralement personnalisables à partir du tableau de bord WordPress ainsi que le téléchargement de thèmes comme celui-ci. Nous pouvons également créer nos propres thèmes personnalisés, nous pouvons soit utiliser ces thèmes pour un usage personnel, pour un client payant, soit nous pouvons également les télécharger dans le magasin à thème. Comme pour tout, si vous faites une recherche en ligne, il y aura des centaines, voire des milliers options que vous pouvez choisir, mais pour l'instant, nous allons revenir à nos thèmes et jeter un oeil sur la façon dont nous pouvons ajouter à nos sites. Tout d'abord, nous devons jeter un oeil à la façon d'installer WordPress. 6. Le serveur Web WordPress: Si vous avez construit un site Web dans le passé en utilisant HTML et CSS, vous serez habitué à simplement écrire ceci dans un fichier HTML, ouvrant ce fichier dans le navigateur, et tout fonctionne juste. Eh bien, c'est un peu différent lorsque vous utilisez WordPress parce que WordPress a besoin d'un serveur Web pour s'exécuter. Pourquoi c'est ça ? Eh bien, c'est parce que WordPress est écrit dans un langage de programmation appelé PHP. PHP ne fonctionnera que sur le serveur, il ne fonctionnera pas dans le navigateur. Pour WordPress, vous n'avez pas besoin de comprendre un cours PHP. Une bonne compréhension de PHP est en cours d'exécution sur le serveur, est la clé pour comprendre comment WordPress fonctionne. Si vous considérez un site comme Facebook ou Twitter, ou généralement un site de blog, application de chat, ou même un réseau social, ils ont tous la même apparence pour chaque utilisateur, mais les détails sur la page sont différents. Tels que le nom d'utilisateur qui changera vos amis personnels ou vos connexions, vos billets de blog, et ainsi de suite. Nous pouvons penser à des choses comme Facebook et Twitter comme un modèle et tous les détails sont injectés en cas de besoin, et ceux-ci sont tous basés sur l'utilisateur connecté. Ceci est un exemple de ce que PHP fait, il peut générer une page web qui change les détails particuliers pour chaque utilisateur ou chaque page. Ceci est un exemple de ce qu'on appelle une page Web dynamique. C' est sur un serveur web, où ces pages sont générées. Sur le serveur, il aura le modèle ou la configuration de base. Ensuite, il placera dans tous les détails que vous extrayez dans la base de données, comme un utilisateur, ou les billets de blog que nous venons de mentionner précédemment. Vous n'avez pas besoin de comprendre tout cela pour le moment, mais sachez simplement que c'est la raison pour laquelle nous avons besoin d'un serveur Web pour exécuter WordPress, plutôt que de simplement l'ouvrir à l'intérieur du navigateur comme nous pouvons le faire avec une page HTML régulière. Malheureusement, nous pouvons configurer un serveur web sur notre propre ordinateur pour l'exécuter. En outre, WordPress a aussi besoin d'une base de données, qui est utilisée pour stocker toutes les pages, les billets de blog, les images, et toutes les informations dont il a besoin. C' est ce serveur web que nous allons également parler la base de données et récupérer toutes ces informations pour nous. Cela nous laisse maintenant quelques options. Si vous avez déjà acheté un hébergement web dans le passé, qui peut exécuter WordPress, vous pouvez, bien sûr, l'utiliser pour ce cours. Allons-nous parcourir certaines de ce qu'on appelle les options locales, qui est la possibilité de configurer un serveur Web localement sur notre propre ordinateur ? Il y aura quelques options différentes, alors assurez-vous d' en utiliser une, et je recommanderais la vidéo suivante si vous voulez vous assurer. Avec cela comme arrière-plan, nous allons maintenant courir à travers comment définir un WordPress dans cette prochaine vidéo. 7. Option1 : installer en local (recommandé): Maintenant, nous comprenons que WordPress a besoin d'un serveur Web pour réellement fonctionner. Dans cette vidéo et aussi la suivante, nous allons examiner quelques options pour commencer à créer un serveur Web sur notre propre ordinateur. Cette vidéo va se concentrer sur un service appelé Local by Flywheel qui nous permettra de créer un serveur web sur notre propre ordinateur, et ensuite nous pouvons créer nos sites WordPress. Vous n'avez qu'à suivre cette vidéo ou la vidéo suivante, et la vidéo suivante se concentrera sur une solution alternative appelée MAMP. Je vous recommande de suivre cette vidéo plutôt que la suivante. Pour commencer, nous allons nous rendre sur localwp.com. De là, nous allons cliquer sur le bouton de téléchargement, où nous pouvons télécharger à la fois pour Mac, Windows et Linux. Il y a aussi une version payante pour les équipes et les agences, mais nous avons juste besoin de l'édition communautaire gratuite. Flywheel va nous permettre d'évaluer rapidement les projets WordPress sur notre propre ordinateur, ce qui va être très simple et prendre soin de toute la configuration, du serveur, et aussi de la base de données pour nous. Local a beaucoup de grandes fonctionnalités. Nous pouvons consulter notre site et la section d'administration en cliquant sur un bouton. Nous pouvons générer un lien en direct pour voir notre projet n'importe où et aussi partager avec d'autres aussi, avec beaucoup plus de fonctionnalités avancées telles que la possibilité de configurer WordPress multi-site et bien plus encore. Choisissez votre plate-forme particulière, téléchargez, puis passez par les étapes d'installation. Une fois que Local est entièrement installé et configuré, vous êtes dirigé vers un écran qui ressemble exactement à ceci. C' est là que nous pouvons ajouter et gérer nos sites Wordpress. J' ai déjà quelques sites configurés ici si c'est votre première fois, vous ne verrez aucun dans la barre latérale. Pour ajouter un nouveau projet, nous devons cliquer sur ce bouton vert dans le coin gauche, puis donner un nom à notre site. Je vais donner ce titre de Festival, et nous n'avons besoin d'aucune de ces options avancées pour l'instant. Continuez, je vais m'en tenir à l'environnement par défaut préféré. Ensuite, nous devons ajouter un nom d'utilisateur, un mot de passe et un e-mail. Le nom d'utilisateur, allons-y pour le festival_admin, et ce sera les détails dont nous avons besoin pour vous connecter dans le back-end de notre site WordPress. Nous allons jeter un coup d'oeil à ça dans un instant. Le mot de passe, assurez-vous de modifier votre adresse e-mail si nécessaire. Cliquez sur Ajouter des sites. Si vous utilisez un Mac, vous devrez peut-être également ajouter le mot de passe administrateur. Bien, une fois que cela est fait, notre site est automatiquement démarré. Nous pouvons voir cela parce que nous avons la possibilité d'arrêter notre site dans le coin. Si le vôtre est vert et il dit site de démarrage, vous devrez cliquer dessus pour démarrer le serveur. Nous pouvons voir tous les numéros de version de nos serveurs, pour PHP et aussi la base de données que nous utilisons aussi. Nous n'avons pas besoin de changer aucune de ces informations, mais tout est là si nous en avons besoin à l'avenir. L' une des grandes choses à propos de l'utilisation de Local est ce lien en direct vers le bas. Nous pouvons cliquer sur Activer, et cela nous donnera une URL en direct que nous pouvons partager avec d'autres aussi. Cela signifie que nous pouvons partager notre travail avec des collègues, des amis ou de la famille, et c'est également utile pour obtenir des commentaires sur notre site pour diriger d'autres personnes. Nous allons passer la plupart du temps pendant ce projet dans ces deux sections en haut. Nous avons une section d'administration qui nous reliera au back-end de notre site. Pour vous connecter, nous avons besoin d'ajouter des détails que nous avons ajoutés dans Local juste avant. Mon nom d'utilisateur était l'administrateur du festival et le mot de passe. Cliquez sur Login et cela nous redirigera ensuite vers le tableau de bord WordPress. Le tableau de bord WordPress est comme le centre de contrôle de nos sites où nous pouvons ajouter de nouvelles fonctionnalités, nous pouvons le mettre à jour, nous pouvons changer de thème, et nous allons jeter un coup d'oeil à cela en seulement une seconde. L' autre bouton est d'ouvrir notre site, et c'est notre site Web WordPress réel. Si le vôtre semble un peu différent de cela, ne vous inquiétez pas, le thème par défaut change de temps en temps. Cela va maintenant nous donner notre back-end ou front-end en utilisant ces deux termes. Si nous voulons basculer entre ces derniers manuellement, si nous sommes sur le site comme ça, nous pouvons passer le curseur sur le titre du site, puis passer au tableau de bord. À l'intérieur du tableau de bord, nous pouvons faire le contraire et ensuite retourner visiter notre site. Au tableau de bord, nous examinerons de plus près toutes ces options dans la prochaine vidéo. Car c'est à partir d'ici que nous pouvons mettre à jour nos sites si nous avons des thèmes et des plug-ins ou même l'appel WordPress. Si des mises à jour sont disponibles, nous en serons informés à partir de cette vue. Nous pouvons gérer et mettre à jour nos publications. Nous pouvons télécharger différents éléments et médias tels que des images, des vidéos et des fichiers audio. Nous pouvons travailler avec nos pages. Nous pouvons les éditer, nous pouvons ajouter de nouveaux, nous pouvons gérer tous les commentaires sur nos articles de blog. Il y a une section d'apparence où nous pouvons personnaliser l'apparence de notre site. Nous pouvons télécharger différents thèmes. Nous pouvons changer les menus, les images d' arrière-plan, et bien plus encore. Nous avons brièvement parlé des plug-ins tôt et c'est à partir de cette section que nous pouvons gérer nos plug-ins ou en ajouter de nouveaux aussi. Par exemple, si nous voulions ajouter un e-mail à notre site, c'est la section plugin où nous pourrions ajouter ceci. Nous pouvons gérer nos utilisateurs, comme voir qui est inscrit. Nous pouvons changer les préférences. Nous pouvons mettre à jour les profils et les autorisations et bien plus encore. Nous avons une section d'outils où nous pouvons faire des choses comme l'importation et l'exportation de données. Nous avons également une section de réglage où vous pouvez affiner toutes les options pour notre site. Pour tous ces projets dans ce cours, nous allons passer beaucoup plus de temps dans ce back-end. À partir de la prochaine vidéo, nous allons examiner plus en profondeur toutes ces options. 8. Option 2 : installer avec MAMP: Ceci est une vidéo d'option pour configurer WordPress en utilisant un service appelé MAMP. Si vous avez installé WordPress avec succès dans la dernière vidéo en utilisant local, vous pouvez ignorer cette vidéo. Cependant, si vous utilisez un mois avant ou que vous voulez simplement essayer quelque chose différent, vous pouvez suivre avec cette vidéo et la configuration en utilisant MAMP. Commençons par aller sur mamp.info. Cela va également créer un serveur de développement local gratuit et aussi prendre soin de la base de données pour ces deux, nous pouvons télécharger une version gratuite en cliquant sur le lien ici puis télécharger pour votre système d'exploitation. Je vais aller pour la version mac et lui donner quelques minutes pour le télécharger. Une fois que cela a téléchargé, devra passer par les étapes d'installation à votre ordinateur appuyez sur Continuer à travers chacun de ces. Peut également avoir besoin d'ajouter un mot de passe pour l'installer. MAMP est également livré avec une version payante appelée MAMP PRO. Cela se télécharge également en même temps, mais vous n'avez pas besoin de l'utiliser. Nous avons juste besoin de rester avec la version gratuite de MAMP car nous n'avons pas besoin d'aucune des prophètes. Une fois que MAMP a terminé l'installation sur votre machine vous serez amené à un écran d'étoiles qui devrait ressembler à ceci. Vous pouvez également être invité à mettre à niveau la base de données MySQL. Je vais y aller et faire ça aussi. A l'intérieur, la chose clé à noter est les deux lumières vertes en haut. Cela signifie que notre serveur web et aussi une base de données sont ouverts et en cours d'exécution. Nous pouvons maintenant télécharger le noyau WordPress et l'ajouter à notre dossier MAMP. Pour moi, MAMP est stocké dans mes applications, alors nous avons ce dossier MAMP à l'intérieur ici. Le dossier clé avec lequel nous allons travailler est ces htdocs. Ce sera l'endroit où nous ajouterons tous nos projets WordPress tout au long de ce cours. Pour ce faire, nous devons aller à WordPress.org et à partir de la page d'accueil aura un bouton get WordPress juste en bas. Cela nous amène ensuite à cette section de téléchargement où vous pouvez télécharger le noyau WordPress. s'agit d'un fichier zip qu'il ne devrait pas prendre trop de temps à télécharger. Une fois cela fait, nous pouvons cliquer sur ce paquet et ouvrir ce. Ceci est maintenant notre dossier de projet WordPress. Nous pouvons aller de l'avant et renommer ceci, je vais appeler ce wpfestival Ensuite, nous pouvons faire glisser ce projet vers nos htdocs. Prenons ceci, place ceci à l'intérieur des htdocs, ouvrez ceci et nous pouvons vérifier que c'est ça. La prochaine chose que nous devons faire est de créer une base de données pour notre projet. A l'intérieur de l'écran de démarrage MAMP, nous ouvrons la page webstar. De là, nous pouvons aller à PHPMYADMIN. Si nous cliquons sur les outils, cliquez sur PHPMYADMIN où nous pouvons ajouter une nouvelle base de données. Vous pouvez voir à gauche que j'ai déjà beaucoup de bases de données déjà configurées, mais je vais cliquer sur Nouveau et puis créer une nouvelle base de données. Cela peut être n'importe quel nom de notre choix. Je suis ce qu'on appelle ça, le festival WP. Cliquez sur Créer, alors nous n'avons pas besoin de créer de tables ou de données. Depuis WordPress va gérer ces photos. Avec cette configuration maintenant, nous pouvons revenir à MAMP, ajouter à l'écran de démarrage. Maintenant, les anciennes versions de MAMP avaient les préférences ici, mais maintenant il est disponible dans les options principales. Si vous utilisez un Mac, vous pouvez vous diriger vers l'icône MAMP dans le coin supérieur, puis cliquer sur le lien des préférences. Cela mettra fin à ce lien vers la section où vous pouvez vérifier quel port nous utilisons. Si nous cliquons sur les ports, nous pouvons voir le port du serveur Web par défaut est 8888. Nous allons maintenant l'utiliser pour accéder à notre projet dans le navigateur. Tout ce que nous devons faire est de cliquer sur localhost. Puis 8888, appuyez sur Entrée. Ensuite, nous le prenons à l'index de nos htdocs. Cela contiendra tout le projet que nous sommes à l'intérieur d'un MAMP. On veut le WPfestival. En cliquant dessus, vous commencerez à monter les scripts d'installation de WordPress. La première étape consiste à choisir la langue. Je veux aller pour l'anglais et ensuite continuer. Cette page est juste de nous faire savoir que nous devons d' abord mettre en place notre base de données uniquement pour avoir accès à toutes ces informations. Cliquez sur Allons au nom de la base de données, qui était wp-festival. Le nom d'utilisateur de base de données, qui est racines et aussi toit pour le mot de passe, travaillant sur le localhost, puis cliquez sur soumettre. Une fois connecté à notre base de données, nous pouvons alors exécuter les scripts d'installation. Nous devons tout d'abord ajouter le sous-titre. Je vais aller au festival WP. Cela peut être modifié plus tard dans le tableau de bord WordPress. Ne vous inquiétez pas trop à ce sujet. Nous devons ensuite ajouter un nom d'utilisateur et un mot de passe pour vous connecter à un backend WordPress. Je veux aller pour l'administrateur du festival, un mot de passe et ensuite aussi un e-mail. Je vais décocher ça pour l'instant puisque la société n'est pas vivante. Ensuite, cliquez sur installer WordPress. Nous pouvons ensuite nous connecter en utilisant nos données, que nous venons de fournir. Mon nom d'utilisateur était administrateur du festival, puis collez le mot de passe. Cela nous amène ensuite au tableau de bord WordPress où nous pouvons contrôler notre site. Nous allons y jeter un coup d'oeil plus en détail très bientôt. Nous pouvons également cliquer sur cette icône d'accueil juste au-dessus du haut. Cela passera ensuite à notre site WordPress. Si vous êtes allé à la scène, félicitations, WordPress est maintenant ouvert en cours d'exécution en utilisant MAMP. 9. Le tableau de bord WordPress: Nous avons eu un aperçu rapide du tableau de bord WordPress, juste avant la mise en place de nos projets. C' est le centre de contrôle de notre site Web où nous pouvons ajouter de nouveaux contenus, nous pouvons mettre à jour, et aussi supprimer notre contenu aussi. Nous pouvons également l'utiliser pour installer de nouvelles fonctionnalités telles que des plugins ou des thèmes. Mais actuellement, je ne vais pas aller trop loin dans le tableau de bord WordPress parce que nous allons sauter dans toutes ces options plus en profondeur tout au long de ce cours. Pour commencer, nous avons cette page d'accueil qui nous donne une mise à jour de l'état où nous pouvons voir que notre site est en bonne santé. C' est aussi une section où nous pouvons personnaliser et nous pouvons également voir les activités récentes telles que les commentaires récents. Nous serons également informés de toutes les mises à jour requises pour WordPress et aussi de tous les plugins ou thèmes aussi. La première option sur la gauche est notre article de blog. Lorsque nous avons mis un WordPress pour la première fois, nous voyons que nous avons un exemple de blog bonjour monde post. Nous pouvons survoler cela et nous pouvons éditer cela, nous pouvons supprimer cela. Nous pouvons également voir combien de commentaires sont fournis pour ce billet de blog. Nous pouvons ajouter de nouvelles et nous pouvons également créer différentes catégories et tags aussi, sorte que nous pouvons organiser notre billet de blog en différentes sections. Sur cela, nous avons la médiathèque qui est une collection de tous les actifs dont nous avons besoin pour notre site Web. La médiathèque peut contenir des éléments tels que des images, des clips audio, des vidéos, et ceux-ci sont tous organisés en une seule bibliothèque facile à utiliser. Nous avons également accès à tous ces éléments lorsque nous créons un nouveau billet de blog et de nouvelles pages, sorte que ceux-ci sont faciles à sélectionner. Après cela, nous avons la section des pages qui est disposée de la même manière que le billet de blog. De là, nous pouvons accéder à toutes les pages de notre site, nous pouvons les éditer, nous pouvons les supprimer, et aussi ajouter de nouvelles avec ce bouton aussi. La section commentaires est liée à notre article de blog. De là, nous pouvons avoir un contrôle total sur la façon dont un utilisateur interagit avec notre blog. Par exemple, nous pouvons les modérer. Si quelqu'un a des commentaires offensants, nous pouvons les examiner en premier. Ensuite, nous pouvons également les supprimer ou les autoriser à être affichés sur le site Web. La section « apparence » est l'endroit où nous allons contrôler l'aspect et la sensation de notre site. Nous pouvons télécharger différents thèmes, nous pouvons personnaliser notre thème actuel, nous pouvons organiser des widgets qui sont des sections de contenu à afficher dans différentes parties de notre thème. Nous pouvons créer et éditer différents menus pour différentes parties de nos sites, et aussi jouer avec différentes mises en page et couleurs. La section plugins est l'endroit où nous allons gérer toutes les extensions pour nos sites. C' est là que nous ajoutons les différentes fonctionnalités qui ne sont pas incluses avec le noyau WordPress. Par exemple, nous allons utiliser des plugins, qui vont ajouter des fonctionnalités e-commerce, nous allons ajouter des fonctionnalités e-mail, et comme un plugin pour à peu près tout type de fonctionnalité que vous voulez ajouter à votre site. Après cela, nous avons la section utilisateur où nous pouvons gérer tous nos utilisateurs pour notre site. Actuellement, nous avons juste nous-mêmes parce que nous venons de mettre en place ce site. Chacun de ces utilisateurs se voit attribuer un rôle différent. Nous avons un accès complet à ce tableau de bord et nous pouvons mettre à jour tout le contenu que nous voulons utiliser. Nous avons le rôle d'administrateur. Mais il y a aussi d'autres rôles qui sont pour les utilisateurs réguliers, donc ils ne peuvent pas simplement se connecter au tableau de bord et changer notre site. Mais plus à ce sujet plus tard. La section outil va nous permettre de faire des choses telles que l'importation contenu et aussi l'exportation de nos données. Enfin, nous avons également beaucoup de paramètres ou d'options différents pour notre site, et nous allons également nous familiariser beaucoup plus avec toutes ces options au fur et à mesure que nous suivons le cours. C' est donc juste un aperçu rapide de ce qui est inclus avec le tableau de bord WordPress et exactement ce que nous pouvons contrôler aussi. Ensuite, nous allons jeter un oeil aux fichiers et dossiers qui sont inclus lors de la configuration de WordPress. 10. Fichiers et dossiers WordPress: Sur la première configuration un projet WordPress. Nous téléchargeons le noyau WordPress. Le noyau WordPress contient tous nos fichiers et dossiers, qui est ce dont une personne a besoin pour fonctionner correctement. Maintenant, nous n'avons pas besoin de connaître les rôles exacts de chacun de ces fichiers et dossiers, car il y a beaucoup de code à l'intérieur de ceux-ci. Mais comprendre les bases nous aidera vraiment. Pour trouver tous les fichiers et dossiers, cela dépend si vous utilisez local ou MAMP pour configurer votre projet. Si vous utilisiez le local, vous devez aller à l'écran d'accueil et cliquer sur cette flèche. Cela ouvrira alors une fenêtre avec l'emplacement de nos projets. Si nous allons ici et puis à l'intérieur de notre application puis public, ce sont tous les fichiers et dossiers de base qui est nécessaire pour que WordPress fonctionne. Si nous utilisons un MAMP, tout comme nous l'avons vu avant nous devons aller dans le htdocs, puis dans notre dossier de projet, puis nous sommes présentés avec les mêmes fichiers et dossiers, qui est ce qu'on appelle le noyau WordPress. Le noyau WordPress n'est pas destiné à être édité, donc nous les laissons généralement tels qu'ils sont. L' un des principaux fichiers que nous avons est le wp-config, qui est un fichier PHP. Ce fichier est l'endroit où nous indiquons à WordPress tous les paramètres de base de données que nous aurons pour nos projets. Ce fichier peut être créé manuellement, mais dans notre cas, ce fichier a été défini pour nous lorsque nous avons créé notre site en utilisant local. Ou si vous avez choisi d'utiliser MAMP pour ce projet, ce fichier a été créé lors de l'exécution du script d'installation précédemment. Juste en dessous de cela, nous avons le contenu wp-. C' est probablement l'endroit où nous passerons la plupart de notre temps. s'agit d'un dossier important car il contient tout ce que nous utiliserons pour notre site, ainsi que toutes les images ou vidéos qui seront stockées dans le dossier des téléchargements. Vous pouvez également voir souvent une mise à niveau pliée trop, qui est un dossier temporaire utilisé par WordPress lors de la mise à jour de notre site. Vous pouvez également voir un dossier de langues, si vous utilisez d'autres langues pour votre thème. Si nous ouvrons le dossier themes, par défaut, WordPress fournit quelques thèmes par défaut pour commencer. Sur la gauche ici, nous pouvons voir le thème par défaut, qui est actuellement 2020, et nous pouvons changer cela à l'intérieur du tableau de bord. Nous pouvons également télécharger de nouveaux thèmes et les faire glisser dans ce dossier, puis les activer de cette façon. Nous avons aussi les plugins juste au-dessus, et ce sera l'endroit où nous stockons nos plugins, soit via le tableau de bord, soit en les téléchargeant et en les ajoutant à ce dossier. Si nous voulons apporter quelques modifications à nos thèmes, nous pouvons faire glisser notre dossier thématique. Par exemple, 2020. Nous pouvons le faire glisser vers un éditeur de texte et nous le ferons dans l'un de nos projets plus tard dans le cours, y compris la création de nos propres modèles de page. Voici un aperçu rapide de certains des fichiers principaux, et nous allons sauter dans ce dossier comme nous le devons pendant le cours. Maintenant, nous comprenons un peu plus sur WordPress, passons à la création de notre premier projet. 11. Projet de festival de musique : ce que nous allons construire: Nous allons commencer par un projet simple pour nous habituer au fonctionnement de WordPress, y compris la mise en place de pages, y compris des thèmes et l'ajout de contenu général. Jetons un coup d'oeil à ce que nous allons construire au cours de cette section. Ce sera ma version du projet, qui sera une page d'accueil pour un festival de musique. Vous pouvez suivre et créer cette version exacte ou vous pouvez la faire vous-même aussi en utilisant un thème ou un design différent. Si vous venez de commencer et êtes tout nouveau à WordPress, vous voudrez peut-être suivre avec les mêmes étapes dans la conception que j'ai créé puis éventuellement personnaliser à la fin lorsque vous vous sentez plus à l'aise de le faire. C' est le projet que nous allons construire dans cette section. Il comprend une barre de navigation en haut. Nous allons seulement créer une page de destination, donc nous n'avons qu'un seul lien de menu. Nous allons également créer le titre de notre site tout en haut. Nous aurons des liens sur les réseaux sociaux à gauche, que vous pouvez utiliser pour relier à vos profils. Nous aurons une image d'arrière-plan pleine taille dans la section d'en-tête. Ensuite, en faisant défiler vers le bas, nous allons utiliser le nouvel éditeur de WordPress pour créer toute la mise en page et le contenu de notre page d'accueil. Nous allons créer différentes lignes et blocs de contenu à l'aide de cet éditeur. Apprendre à ajouter différents types de contenu tels que des images, des galeries et des listes. Nous découvrirons également comment mettre en page les choses dans différentes colonnes afin que nous puissions structurer notre contenu exactement comme nous le souhaitons. Nous allons également découvrir comment utiliser des éléments tels que la Médiathèque, comment inclure des widgets pour des blocs de contenu, et aussi comment définir un thème arc. Nous allons lancer les choses en ajoutant ce thème dans la prochaine vidéo. 12. Projet de festival de musique : installer des thèmes: Pour commencer, nous allons installer un nouveau thème pour notre projet. Je vais choisir un thème gratuit de wordpress.org, mais c'est complètement à vous de décider. Je vous recommande si vous êtes un débutant, rester avec le même thème que j'utilise, car si vous choisissez un thème différent, il peut venir avec des options différentes ou peut avoir un aspect ou une sensation différent, ou il peut aussi ont aussi quelques options supplémentaires. Si vous êtes un débutant, je vous recommande de vous en tenir à ce même thème, ou si vous voulez jouer avec les choses par la suite, vous pouvez jeter un coup d'oeil autour et choisir un thème différent aussi. Allons dans l'installation de notre thème WordPress. Pour le moment, nous avons juste les thèmes par défaut de base que nous avons inclus lorsque nous avons mis en place un WordPress à l'origine. Nous pouvons voir ces si nous allons sur le bouton de visite du site ou j'ai encore le mien déjà disponible dans le navigateur. C' est le thème par défaut qui est inclus et nous pouvons le voir si nous allons au tableau de bord, puis dans la section apparence et thème. De là, nous avons actuellement trois thèmes différents installés, et nous utilisons le thème 2020 pour le moment. Nous pouvons également survoler l'un de ces thèmes différents, et aussi les activer. Voici à quoi ressemble actuellement le thème 2020, et par défaut, nous allons d'abord configurer WordPress, tous les blogposts sont affichés sur la page d'accueil. Pour le moment, nous aurions juste ce simple blog Hello World et aussi cet exemple de commentaire juste en dessous. Nous avons également un exemple de page, et nous pouvons également réorganiser le contenu de n'importe laquelle de ces pages à partir du tableau de bord WordPress. Par exemple, nous pouvons déplacer tous les blogs qui sont actuellement sur notre page d'accueil pour être sur une page de blog dédiée. Pour commencer avec ce projet, nous allons installer notre nouveau thème. De wordpress.org, nous pouvons aller dans la section thématique et nous pouvons inclure l'un de ces thèmes disponibles pour rendre notre site aussi différent ou personnel que nous le voulons. Les options que vous avez pour installer un thème est que nous pouvons soit sélectionner l'un de ceux-ci et cliquer sur le bouton Télécharger. Ce fichier que nous avons téléchargé, nous le déposons dans la section thème de tous les fichiers ou dossiers que nous avons examinés précédemment. Alternativement, et probablement un moyen plus simple est de revenir sur le tableau de bord, et nous pouvons cliquer sur « Ajouter nouveau ». Ce projet, je vais utiliser un thème qui s'appelle Asura. Nous pouvons faire une recherche et le thème Asura sera celui que nous voyons ici. Pour installer, il suffit de cliquer sur le bouton Installer, puis une fois que cela a été téléchargé, nous avons juste besoin d'activer ce thème comme notre thème actuel. Une fois activé, nous avons la possibilité de personnaliser notre thème. Le personnalisateur nous donne les options qui sont sur la gauche et nous pouvons voir un aperçu en direct de l'un des changements sur la droite. Par exemple, si vous entrez dans l'identité du site, nous pouvons changer le titre de notre site et aussi le slogan aussi. Nous pouvons inclure un logo et une icône de site et nous avons beaucoup d'options différentes pour changer l'apparence de notre thème. Juste parce que nous utilisons un thème pré-construit, cela ne signifie pas que nous nous contentons de respecter le look exact qui est fourni. Nous utiliserons beaucoup de ces options au fur et à mesure que nous progressons dans le cours, et nous pouvons également voir notre thème actif si nous rechargeons le front end. Il semble actuellement un peu différent de son apparence dans les images, mais c'est juste parce que nous n'avons pas le même contenu configuré que la démo. Le travail d'un thème est juste de fournir une peau ou un schéma de couleurs pour notre contenu. 13. Projet de festival de musique : créer notre première page: Comme nous l'avons découvert dans la dernière vidéo, WordPress affichera par défaut nos billets de blog sur notre page d'accueil. Nous pouvons changer cela pour afficher ces messages sur n'importe quelle autre page, mais nous devons d'abord créer une nouvelle page pour les afficher sur. Vers le tableau de bord. A partir de là, nous avons l'option pages sur la gauche. Si nous cliquons dessus, nous pouvons ajouter et gérer toutes les pages qui se trouvent sur notre site. Je vais laisser un endroit la politique de confidentialité qui est déjà configuré, mais nous pouvons supprimer l'exemple de page. Supprimons ceci, et puis nous pouvons ajouter une nouvelle page, qui va être notre page d'accueil. La première chose que nous devons faire lors de la création d'une nouvelle page est d'ajouter le titre de la page. Ensuite, nous pouvons ajouter tout notre contenu ci-dessous. Nous allons couvrir l'ajout de notre contenu de page l'éditeur de contenu plus en détail dans la prochaine vidéo. Nous avons également quelques options pour publier cette page immédiatement, ou nous pouvons planifier une liste pour une date ultérieure. Nous avons une section permalien où nous pouvons définir le lien vers cette page. Par exemple, ce serait notre URL, puis barre oblique vers la maison. Si vous aviez une section de blog ce sera avant slash blog et ainsi de suite. Nous avons une image en vedette qui est l'image principale, que nous pouvons utiliser quand au moins dans cette page. Nous pouvons lier cela en cliquant sur ce bouton, et celui-ci sera téléchargé dans notre médiathèque. Avoir la section de discussion où nous pouvons autoriser les commentaires pour cette page, ainsi que tous les attributs que vous souhaitez ajouter, tels que l'ordre dans lequel cette page apparaîtra. Également inclus avec ce thème, est quelques options où nous pouvons disposer la barre latérale. Nous pouvons avoir la barre latérale sur la gauche ou la droite ou aucune barre latérale du tout. Ces options de mise en page de la barre latérale ont été codées par le créateur de ce thème. Le vôtre peut être un peu différent si vous avez choisi un thème différent. Maintenant, avec le titre de notre site en place, ce que nous devons faire est de cliquer sur « Publier » puis « Confirmer » et cette page d'accueil est maintenant en ligne. Retour à notre front de notre site et rafraîchir. Je veux que nous ayons accès à notre page d'accueil, cliquez dessus. C' est le permalien que nous avons vu avant qui est barre oblique vers la maison, puis le titre de notre page. Nous n'avons pas encore de contenu de page, mais il y a quelques choses à noter. Tout d'abord, ce titre de la page d'accueil est affiché, et il est assez audacieux, donc vous pouvez garder cela en place selon votre projet. Mais je vais supprimer ça du tableau de bord. Retournez à votre page. Ensuite, en bas, où se trouve notre section de mise en page, nous pouvons aller à la section des éléments de désactivation. De là, nous pouvons vérifier le titre du contenu, fermer la section vers le bas. Nous avons maintenant accès à un bouton de mise à jour. Ensuite, actualisez la page pour confirmer qu'elle a été supprimée. La deuxième chose est que nous voulons réellement que cette page d'accueil soit la page d'accueil de notre site, plutôt que le billet de blog que nous voyons actuellement. Pour changer cela, nous pouvons aller sur le tableau de bord, et si nous cliquons sur l'icône WordPress, va alors le ramener à la section principale du tableau de bord. Dans la section des paramètres, nous pouvons aller en lecture. De là, nous pouvons changer ce que la page d'accueil affichera. Actuellement, il est configuré pour afficher les derniers articles de blog, mais nous allons changer cela pour être une page statique, où nous pouvons sélectionner notre nouvelle page d'accueil. Cliquez sur « Enregistrer ». Maintenant, si nous rechargeons le projet, nous voyons maintenant notre page d'accueil vide. Si nous avions une page de blog dédiée, nous pourrions également définir cela aussi, mais nous allons regarder cela dans une prochaine vidéo. Juste avant d'ajouter plus de contenu, nous pouvons également configurer le titre du site, ainsi que le slogan de ce projet. En ce qui concerne ce retour dans le personnalisateur, qui est disponible sous la section apparence. Nous avons déjà examiné comment nous pouvons modifier le titre du site et aussi le slogan en utilisant cette section d'identité du site. Le slogan n'a pas d'importance pour le moment parce que nous l'avons déjà caché, mais si nous le voulions, nous pourrions également ajouter un logo à l'en-tête. Mais je vais laisser ceci et ajouter ceci directement à notre page. Nous pouvons également définir une icône de site qui apparaîtra dans l'onglet du navigateur. Nous voulons faire les deux dans la prochaine vidéo. Retour au menu principal. Nous utiliserons beaucoup plus de ces options tout au long du cours. Mais ensuite, nous pouvons également utiliser les liens de médias sociaux, qui ont été fournis avec ce thème. À partir de cette section, nous pouvons ajouter les liens vers tous nos profils de médias sociaux. À titre d'exemple, je vais ajouter mon URL Twitter. Si nous publions maintenant ceci, comme les tests sont, nous pouvons fermer le personnalisateur et actualiser le navigateur. Cliquez sur l'icône Twitter, et cela ne nous mènera qu'à notre lien de médias sociaux. Avec cette première page maintenant configurée, passons à la médiathèque où nous pouvons ajouter des images à notre projet. 14. Projet de festival de musique : la bibliothèque de médias: Tôt ou tard, vous aurez besoin de télécharger différents types de médias, tels que des images, votre projet. WordPress nous fournit une solution vraiment simple et facile à utiliser, qui est la Médiathèque. La Médiathèque est un endroit central où nous pouvons placer tous nos actifs, tels que des images, des clips vidéo, des fichiers audio, ou même des fichiers aussi. Il nous donne ensuite accès à cette médiathèque lorsque nous créons des objets tels que de nouveaux articles de blog ou de nouvelles pages. Jetons un coup d'oeil à la façon dont nous pouvons l'utiliser maintenant. Depuis le tableau de bord, nous avons cette option de bibliothèque multimédia à partir de la barre latérale. Si nous cliquons dessus, nous pouvons voir n'importe lequel des actifs existants que nous avons à l'intérieur de notre projet. Cette médiathèque n'est pas seulement les images, mais aussi d'autres types de médias tels que les vidéos, les documents et l'audio. Vous pouvez utiliser ces mêmes images que moi pour ce projet qui sont disponibles en téléchargement, ou vous pouvez également sélectionner les vôtres si vous préférez. De cette vue, nous pouvons soit cliquer sur le bouton Ajouter un nouveau où nous pouvons glisser et déposer tous les fichiers [inaudibles], soit nous pouvons sélectionner des fichiers de notre machine. Sur la gauche, j'ai un dossier qui a toutes les images pour ce projet. Nous pouvons soit glisser sur chacun de ces individuellement ou à la place, nous pouvons simplement glisser sur le dossier complet. Une fois qu'ils ont été importés, nous pouvons cliquer sur l'un de ces éléments individuellement. Il est également recommandé, si vous poussez ce site à la production, de remplir également les détails supplémentaires, en particulier le texte alt. Nous pouvons également éditer le titre, la légende, la description, côté de l'URL du fichier, que nous pouvons lier dans n'importe quel article ou page de blog web. Comme il s'agit d'un projet de démonstration, je vais laisser toutes les informations d'image supplémentaires vides, mais assurez-vous de remplir ces informations supplémentaires si vous utilisez un site en direct, ce qui aidera avec les moteurs de recherche et l'accessibilité. Maintenant, ces images sont incluses dans notre médiathèque, nous pouvons maintenant y accéder dans nos pages ou articles de blog ou nos pages si nous allons dans notre section d'accueil, cliquez sur « Modifier ». Nous pouvons directement ajouter des images à notre page en ajoutant un bloc d'image, et nous allons jeter un oeil sur la façon de le faire dans la vidéo suivante. Maintenant, bien que nous allons juste aller dans la section document et ensuite définir notre image vedette. Je vais sélectionner celui-ci, puis définir ceci comme notre image en vedette. Une image en vedette est une image qui représente notre blog ou notre page. La page est en vedette image peut être affichée dans un certain nombre d'endroits. Dans notre cas, l'auteur des thèmes, vous définissez ceci pour être à l'intérieur de l'en-tête. Maintenant, si nous mettons à jour ceci et actualisons notre site, nous voyons maintenant que cela a été placé dans l'en-tête. Nous pouvons voir ici que nous avons un peu d'espace sur le côté droit. C' est parce que pour ce projet de cours, nous gardons la taille des fichiers image à un niveau bas. Je n'ai pas inclus d'images énormes. Nous aurons différentes façons de réparer ça. Nous pouvons soit télécharger une image plus grande ou si nous le voulions, nous pourrions également ajuster le CSS. Nous pouvons ajouter notre propre CSS personnalisé en allant sur le tableau de bord, jusqu'au personnalisateur, puis nous avons une section CSS supplémentaire. Nous pouvons cibler notre image HTML, qui est « img » Ensuite, à l'intérieur des accolades, nous pouvons définir la largeur de l'image à 100 pour cent. Rafraîchissez notre site, et maintenant notre image a été étirée à toute la largeur du navigateur. Ceci est l'image en vedette de notre page, mais si nous devions ajouter une image en vedette à un billet de blog, ceux-ci sont souvent affichés à côté de chaque billet de blog sur la liste de page de blog. Aussi, comme note de côté, ces images en vedette étaient appelées vignettes de poste. Ceux-ci étaient dans les premières versions de WordPress, donc vous pouvez toujours voir quelques références à cela dans la documentation ou aussi quelques guides. De retour au personnalisateur, je vais également définir l'icône du site. Retour dans le menu principal et à partir de l'identité du site, nous pouvons sélectionner l'icône du site. Nous voulons opter pour la même image, sélectionner ceci, puis nous pouvons également recadrer ceci pour être une taille plus petite. Je vais aller chercher l'image, les mains, recadrer ça, publier nos changements. Nous pouvons maintenant voir l'icône du site à l'intérieur de l'onglet du navigateur a été mis à jour avec notre nouvelle image recadrée. 15. Projet de festival de musique : l'éditeur Gutenberg: Dans la version 5 de WordPress, ils ont publié un tout nouvel éditeur remanié pour éditer nos articles de blog et pages. Ça s'appelait Gutenberg. Cela nous permet de nous éloigner approche de l'éditeur de tri et de remplacer notre contenu en utilisant des blocs. Nous allons maintenant jeter un oeil sur le site Web de Gutenberg et donner un aperçu rapide du fonctionnement de ces blocs. Je suis actuellement sur wordpress.org, qui a cette section Gutenberg. Cela va nous donner un aperçu de certains des blocs qui sont disponibles pour créer nos articles de blog et nos pages. Maintenant, nous n'avons pas besoin de nous diriger vers cette page, mais cela va vous donner une idée de exactement ce qui est disponible. Nous avons quelques blocs de texte de base, nous avons des images, nous avons des boutons, et aussi ceux pour aider avec la mise en page comme les colonnes. Nous pouvons les éditer, nous pouvons les réorganiser, et dans certains cas, nous pouvons également les imbriquer l'un à l'autre aussi. Si nous revenons au tableau de bord, nous pouvons les utiliser à l'intérieur de nos pages. Actuellement, notre page d'accueil est vide, donc nous allons passer à cela, et nous allons dans la section d'édition, où nous pouvons utiliser certains de ces blocs. Pour ajouter un bloc, nous pouvons simplement commencer à taper ici. Cela nous donnera un simple bloc de texte ou nous pouvons cliquer sur l'icône plus en haut à gauche. Nous pouvons faire défiler tous les différents types de blocs et de sections qui sont disponibles. Nous avons à peu près n'importe quel type de contenu qui va être nécessaire pour construire la page. Nous avons des tableaux, nous avons des images, nous avons des galeries, nous avons des sections vidéo, nous avons cette section de conception où nous pouvons éclairer notre page en différentes sections et colonnes. On peut briser nos pages. Nous éditons les séparateurs, nous avons tous ces widgets pré-construits qui nous permettront d'ajouter des calendriers et des liens à notre dernier article de blog. Nous avons des liens sur les réseaux sociaux, et aussi différents plugins peuvent ajouter différents blocs ici aussi, comme WooCommerce, ce qui nous permettra d'ajouter fonctionnalités e-commerce dans nos pages. Pour commencer, je vais ajouter un titre dans notre page, qui va être un titre de niveau 2. Nous cliquons sur cela, assurez-vous que le H2 est sélectionné. Ensuite, nous pouvons simplement ajouter le texte que nous voulons comme titre de page. Comme il s'agit d'un festival, je vais dire un week-end complet de musique live et de divertissement. Tout ce que nous avons à faire est de cliquer dessus et maintenant notre rubrique est en place. Comme il s'agit d'un festival et qu'il est basé sur le week-end, le prochain bloc que je vais créer sera une mise en page à deux colonnes. La colonne de gauche sera pour le samedi, et la colonne de droite sera pour les événements qui se déroulent le dimanche. Retournez à notre icône plus, et à l'intérieur, si nous faisons défiler vers le bas jusqu'à la section de conception, nous pouvons cliquer sur « Colonnes » Nous allons aller pour une disposition 50/50 deux colonnes. Tout d'abord, la colonne de gauche sera pour le samedi. Je vais imbriquer un nouveau bloc à l'intérieur qui va être un cap. Cette fois, nous allons faire ce cap de niveau 3 donc il est un peu plus petit, et c'est pour notre samedi. Nous pouvons également formater cette section. Je vais aligner le texte au centre. Je vais également aller aux paramètres de couleur et ajuster cela aussi. Je vais chercher la couleur verte pour cette section. Ensuite, avec cette sélection, nous pouvons cliquer sur l'icône plus ou juste en dessous. Cela ajoutera un nouveau bloc directement en dessous de notre rubrique de niveau 3. Ce sera une liste qui va énumérer tous les événements ou toutes les informations sur ce samedi. On va dire huit groupes live. Alors, si on touche « Entrée », on peut continuer avec notre liste. On dira 20 chanteurs, deux DJ, huit stands de nourriture et de boissons, quatre scènes et trois arènes. Puis enfin, nuit de camping gratuite avec des billets. Une fois qu'on aura fini, on pourra sortir de ça, et enlever le dernier point. Ensuite, c'est la section du samedi tout complète. Maintenant sur la droite, nous pouvons créer la section du dimanche, commençant à nouveau par un titre de niveau 3, qui va avoir le texte du dimanche sur cela, et nous allons ensuite aligner cela au centre. Ensuite, faites correspondre la couleur à partir de la gauche. Ensuite, si nous cliquons sur l'icône plus, nous pouvons alors ajouter notre liste juste en dessous. Ce dimanche aura 10 groupes live, 18 chanteurs, trois DJs, huit stands de nourriture et de boissons, mêmes quatre scènes et trois arènes. Enfin la soirée de clôture. À tout moment, nous pouvons cliquer sur « Mise à jour » et nous pouvons vérifier à quoi cela ressemble. Nous allons visiter notre page d'accueil. Descendez. Nous voyons notre titre ainsi que les deux listes à gauche et à droite. Vous voudrez peut-être aussi centrer ce titre de niveau 2, alors passons à cela. Si nous survolons, nous pouvons aligner ce texte au centre. Mettez à jour ceci. Ensuite, nous allons introduire un bloc média et texte. Si nous cliquons sur l'icône plus, nous pouvons réellement faire une recherche pour cela ou dire Media and Text. Ensuite, sur le côté gauche, nous pouvons ajouter une image ou une vidéo. Si nous passons à la Médiathèque, nous pouvons sélectionner l'une de ces images pré-chargées. Je veux sélectionner l'image de la guitare, puis dire les tickets de début d'oiseau maintenant disponibles. Entre chacun de ces blocs, je vais aussi ajouter un séparateur. Si nous cliquons sur l'icône plus, nous pouvons utiliser la recherche d'un séparateur. Ensuite, nous pouvons cliquer sur l'icône vers le haut pour réorganiser cela et placer cela au-dessus de nos médias et texte. Nous ferons la même chose juste en dessous, nous allons également ajouter un séparateur. Cette fois, nous allons garder ceci sous notre section. Même s'il s'agit d'un média et d'une section de texte nous ne sommes pas seulement limités à ajouter du texte dans cette section. Si nous appuyons sur « Entrée », nous pouvons alors cliquer sur l'icône plus, et nous pouvons également ajouter un bouton à l'intérieur ici. Ce bouton va nous permettre de créer un lien vers les tickets que nous offrons actuellement, donc nous allons le dire maintenant. Pour donner à cela un peu de style, je vais aussi utiliser la même couleur verte que nous avons utilisée auparavant. Mettons à jour ceci et voyons à quoi cela ressemble sur le front-end. La prochaine chose à laquelle nous allons passer est une galerie d'images de l'événement de l'an dernier. Dans la section suivante, nous allons ajouter un titre de niveau 2, qui aura le texte de l'événement de l'année dernière. Nous pouvons également placer cela dans le centre. Ensuite, juste en dessous de ce clic sur l'icône plus et nous pouvons ajouter une galerie d'images. Encore une fois, nous pouvons télécharger de nouvelles images ou nous pouvons utiliser la Médiathèque pour réutiliser les images existantes. Choisissons n'importe lequel de ces quatre, et nous pouvons sélectionner plusieurs images en même temps. Cliquez sur « Créer une nouvelle galerie » et insérez. Cliquer sur l'une de ces images nous permettra de cliquer sur les boutons gauche et droit afin que nous puissions réorganiser l'ordre de ces images. Après cela, nous allons ajouter notre séparateur, le garder cohérent. La dernière section sera pour les informations sur les billets. Donnons à ceci un titre d'infos sur les billets. Nous allons également aligner cela au centre. Le dernier bloc que nous allons utiliser bas va être pour une mise en page à trois colonnes. Je vais sélectionner les colonnes. A l'intérieur, nous pouvons aller pour trois colonnes égales. Cela va être aménagé à peu près comme une table pour tous les prix de nos billets. Nous allons avoir une section pré-vente, une section « tôt », puis les tarifs standard des billets. Nous pourrions également ajouter cette table avec un bloc de table qui est disponible. Mais je vais créer le mien en utilisant trois colonnes, bien que nous n'ayons pas les frontières autour de chaque section. De la même manière que nous l'avons fait avec la section de deux colonnes juste au-dessus, à l'intérieur de chacune de nos colonnes, nous pouvons ajouter de nouveaux blocs. Ce ne seront que des sections de texte. Cliquez sur le « Paragraphe » pour chacun de ces morceaux de texte. Le premier est la pré-vente. Puisqu' il s'agit d'un en-tête, nous allons le rendre audacieux. Assurez-vous que tout est sélectionné, puis cliquez sur « Bold » Aussi, nous allons mettre cela au centre. Il peut être un peu difficile de cliquer sur l'icône plus sur le bon point. Si nous venons de sortir de cela, la prochaine icône plus nous allons créer cette section en dessous de toute cette mise en page de trois colonnes. Au lieu de cela, avec notre texte sélectionné, si nous appuyons sur « Entrée », nous avons alors la possibilité d'ajouter une nouvelle ligne de texte. On dira que tout est parti. Entrez ceci. Comme il s'agit d'une section épuisée, nous allons changer la couleur du texte en rouge. Cliquez à l'intérieur de notre section de texte, puis appuyez « Entrée » Le prochain sera pour le prix. Comme il s'agit d'une section épuisée, nous mettrons en évidence notre texte. Ensuite, nous allons ajouter un barré pour montrer que c'est en cours de vente. Placez ça au centre. Notre première colonne est maintenant terminée. Dans la section du milieu, ce sera pour la section des premiers oiseaux. Placez cela au centre et faites-le également audacieux. Cliquez sur « Enter » Cela va être en vente maintenant. C' est la section active, donc au lieu de l'avoir en rouge, nous allons mettre en évidence ceci comme la couleur verte. Une fois de plus, appuyez sur « Entrée » et nous pouvons ajouter un prix à cela pour 35. Après la section « tôt », la dernière sera pour le tarif standard. Sélectionnez tout, je vais faire cette audacieuse, placer dans le centre. La deuxième ligne sera après le 20 août. Placer dans le centre. Puis enfin le prix pour la section standard de 49. Placez ceci au centre, et notre section est maintenant terminée. Mettez à jour ceci. Il y a notre galerie d'images et nos informations sur les billets en bas. 16. Projet de festival de musique : widgets: Le thème que j'ai choisi, avec beaucoup d'autres, prend en charge les widgets complémentaires. Un widget est une petite fonctionnalité ou un petit morceau de contenu que nous pouvons placer dans notre thème. Maintenant, nous ne pouvons pas simplement aller de l'avant et placer ces widgets dans n'importe quelle zone que nous aimerions. Ces zones de widget dans lesquelles nous pouvons les déposer a été prédéfini par l'offre de thèmes. Jetons un coup d'oeil à la façon dont nous pouvons travailler avec des widgets avec notre thème actuel. Si nous revenons à notre page d'accueil et dans la section d'édition, tout en bas en bas de tous nos blocs avec la section sous la section de mise en page, nous avons ces widgets de pied de page. L' auteur de ce thème nous a permis d'évaluer nombre de zones que nous voulons personnaliser à l'intérieur du pied de page. La valeur par défaut est libre, ce qui signifie que le pied de page est divisé en trois sections où nous pouvons ajouter nos blocs de contenu. Aussi, rappelez-vous juste au-dessus de cela, nous avons cette section de la barre latérale, où nous pouvons exposer notre contenu à côté d'une barre latérale. Eh bien, à la fois la section de barres latérales et aussi la section de pied de page et les deux widget exact. Pour accéder à nos widgets, nous revenons au tableau de bord principal, puis dans la section d'apparence où nous avons un menu de widgets dédié. Cette page a été divisée en deux sections, où à gauche nous avons les widgets disponibles que nous pouvons ajouter à notre projet tels que des calendriers, des menus, des boîtes de recherche, et aussi des choses liées à notre blog, donc juste des commentaires et des messages récents. Ensuite, sur la droite, nous avons toutes les zones de thème disponibles où nous pouvons ajouter ces widgets aussi, toutes ces sections peuvent être personnalisées, et je vais maintenant ajouter quelques widgets dans le pied de page. Pied de page Widget 1 est la première position à l'intérieur de notre pied de page. Cela va être placé sur le côté gauche. Ce premier widget va être un simple blocs de texte de sorte que vous pouvez glisser sur les widgets de texte, le titre de Go VIP, puis du texte dans le bloc ci-dessous de la mise à niveau vers VIP, et profiter de votre week-end encore plus. L' éditeur de texte est assez simple, je vais ajouter une liste à puces juste en dessous. Sur la première ligne va être exclusif VIP seulement bars, la prochaine sera pour les toilettes exclusives, et la dernière sera l'aire de camping à proximité des principales étapes. Maintenant, on va passer à la zone de pied de page 2. Ce sera la section médiane de notre libre. À l'intérieur, nous allons créer un lien vers nos derniers articles de blog. Pour ce faire, nous avons un widget de post récent que nous pouvons glisser sur. Si nous le voulions, nous pourrions également ajouter plusieurs widgets dans l'une de ces sections. Nous ne sommes pas limités à un seul. Le titre de garder à jour avec notre blog, puis nous pouvons définir combien de messages récents que nous voulons montrer. Notre site, actuellement, a le seul billet de blog qui a été créé lorsque nous avons installé WordPress. Eh bien, plus bien que nous pouvons limiter cela à cinq et nous pouvons également afficher la date de publication un trop comme ça et enregistrer notre widget. Le troisième sera un clip audio des événements de l'année dernière. Pour ce faire, j'ai un clip audio qui vient d'être enregistré sur mon bureau. Maintenant, je n'ai pas inclus ce fichier audio avec le coût, car il s'agissait d'un morceau audio sous licence. Mais vous pouvez utiliser votre propre clip audio ou effectuer une recherche en ligne, puis l'inclure si vous le souhaitez. Cela va aller dans Pied de page Widget 3. Faites glisser le curseur sur la section audio, ajoutez un titre de, écoutez un échantillon des événements de l'année dernière. » Nous pouvons ensuite accéder à la médiathèque où nous pouvons glisser sur notre clip audio à ce, puis enregistrer notre widget. Allons maintenant voir notre zone de pied de page sur le front. Descendez en bas et voici nos sections gratuites que nous venons de recréer. Nous avons nos widgets texte, avons la section blog, et nous pouvons cliquer sur l'un de ces liens. Nous avons seulement cet exemple bonjour post de blog mondial. Mais rappelez-vous que cela montrera un maximum de cinq. Ensuite, dans la troisième section de notre pied de page, nous avons ce clip audio, qui est un lecteur audio entièrement fonctionnel. Nous pouvons jouer, nous pouvons faire une pause, nous pouvons passer à travers différentes parties de notre piste, et nous pouvons également contrôler le volume audio aussi. C' est maintenant notre premier projet terminé. Nous avons un beau projet en très peu de temps. Cette page Web est également réactive par défaut. Si nous réduisons cela à une taille plus petite, il ajustera la mise en page et aussi la mise à l'échelle en fonction de cet appareil. Le prochain projet, nous allons aller un peu plus loin dans WordPress, où nous allons construire notre propre blog personnel et nous allons également en apprendre davantage sur de nouvelles choses telles que maintenant les menus, les utilisateurs, les commentaires, et bien plus encore. 17. Ce que nous allons construire: Pour cette section, nous allons construire un tout nouveau projet. Comme vous pouvez le voir, il s'agit d'un blog de développement web, et cela nous apprendra quelques techniques différentes. Nous utilisons quelques options différentes des sections précédentes. Nous allons utiliser un thème complètement différent. Nous allons utiliser beaucoup de widgets différents, nous allons ajouter un carrousel coulissant, comme nous le voyons ici, et cela va créer un lien vers différentes pages. Ces pages sont également disponibles à partir des différentes sections ci-dessous. Nous avons quelques zones de widget. Nous allons construire cette page en utilisant un modèle qui devrait être fourni avec ce thème. Nous avons quelques zones en vedette qui se concentreront sur certaines sections de notre site, et ceux-ci seront tous liés à différentes pages. Nous avons quelques bannières, nous avons quelques témoignages, nous avons des études de cas, nous avons un domaine d'intérêt sur une section particulière. Ensuite, on a un pied de page tout en bas. Ce pied de page fera également un lien vers toutes les pages, nous avons un calendrier qui reliera aux billets de blog précédents, nous intégrerons des icônes de médias sociaux, et aussi un lien vers des commentaires récents aussi. Les icônes des médias sociaux seront également placées à différents endroits. Nous pouvons les voir survoler en haut à droite de notre site, et ceux-ci sont entièrement fonctionnels. Nous allons voir comment déplacer nos articles de blog sur différentes pages, nous allons voir comment changer la mise en page et le style dans, et faire largement usage du personnalisateur pour changer l'apparence de notre site. Pour n'importe lequel de ces billets de blog, nous pourrons également cliquer sur la version complète où nous verrons également une barre latérale sur la droite, et nous pouvons également laisser des commentaires pour chaque utilisateur. En plus de cela, nous allons avoir différentes pages telles que la page À propos de nous, sur laquelle nous pouvons cliquer et être amenés à cette page. Nous aurons également une page Contactez-nous. Il s'agit d'un formulaire de contact entièrement fonctionnel, et nous allons également jeter un oeil à la façon de personnaliser cela et également ajouter et supprimer différents champs. Ce projet est fortement basé sur l'ajout et la mise à jour de billets de blog, comment inclure les médias pour rendre notre article vraiment bon. Nous mettrons également l'accent sur la façon dont nous pouvons travailler avec différents utilisateurs, différents niveaux d'autorisation, ainsi que sur le type d'accès que chaque utilisateur a à notre site. Nous allons travailler avec les menus de navigation, les modèles de page de personnalisation, ajout d'un curseur, l'utilisation de plugins, et bien plus encore. À la fin de ce projet, vous aurez une très bonne idée de la façon de personnaliser votre site, même en utilisant un thème préexistant. Pour arrondir les choses, nous allons également examiner comment nous pouvons améliorer l'optimisation de notre moteur de recherche de site, et aussi comment effectuer des sauvegardes régulières, nous assurer que nous ne perdons pas toutes nos données précieuses. J' espère que vous êtes excité par ce projet, et nous commencerons dans la prochaine vidéo en mettant en place ce projet. 18. Blog WordPress : mise en place du projet: Allons-y avec notre prochain projet qui va être un blog WordPress. Maintenant, un blog était traditionnellement ce que WordPress était bien connu pour les premiers jours, bien qu'il ait grandi et élargi pour être en mesure de construire n'importe quel type de site Web que vous voulez créer. Pour commencer, je vais commencer par local pour créer les sites. Ci-dessous, nous aimerions juste dans l'ensemble des vidéos pour le dernier projet, il peut également choisir [inaudible] si vous préférez. Une fois que Local est ouvert, si vous avez déjà un site Web existant ouvert, vous devrez peut-être cliquer sur le bouton « Arrêter le site » dans le coin supérieur, bien que je n'ai aucun projet en cours d'exécution, bien que nous puissions cliquer sur le bouton vert plus icône pour commencer par un nouveau projet. Comme toujours, donnons à cela un nom de site, et appelons mon nouveau webdev-blog. Nous n'avons besoin d'aucune de ces options avancées, donc nous pouvons continuer avec la configuration préférée 2. Ensuite, les détails de connexion pour l'administrateur. Tout d'abord, le nom d'utilisateur. Nous voulons aller pour l'administrateur de blog, un mot de passe, et j'espère que le vôtre est plus fort que le mien, et aussi une adresse e-mail aussi. Nous pouvons ajouter les sites et juste nous donner quelques instants à configurer. Tout comme pour le dernier projet, si vous utilisez local, vous devrez peut-être ajouter le mot de passe administratif si vous utilisez un Mac. Ok, bien. Le mien est maintenant installé. Je vais me connecter au tableau de bord avec les détails que vous venez de fournir. C' était blog-admin et aussi un mot de passe aussi. Nous nous sommes tous connectés et nous pouvons ouvrir le front-end de nos sites. Je vais voir à quoi ressemble WordPress avec le thème par défaut. Revenons au tableau de bord, le seul changement que nous allons apporter dans cette vidéo est de présenter notre nouveau thème. Pour ce faire, nous descendons à l'apparence sur dans la section thème, et nous pouvons ajouter un nouveau thème avec ce bouton. Maintenant, comme pour n'importe quel projet dans ce cours, vous pouvez choisir n'importe quel thème que vous aimez pour votre projet. Cependant, si vous êtes un débutant, je vous recommande de rester avec les mêmes thèmes que j'utilise. Vous avez vu des choses comme les mêmes options qui sont disponibles afin que vous ne soyez pas trop confus. Celui que je vais utiliser va être spacieux. Je vais taper ça et nous pouvons chercher ça. C' est le thème juste ici. Vous pouvez prévisualiser si vous voulez voir à quoi cela ressemblerait, mais je vais cliquer sur le bouton « Installer », puis activer ceci une fois prêt. Avec ceci maintenant comme thème actif, nous pouvons revenir au front end. Si nous rechargeons la page, vous verrez maintenant une configuration différente pour tous les projets. Il a exactement le même contenu. Nous avons le blog Hello world exemple, nous avons quelques exemples de commentaires, et aussi un exemple de page sur le top 2, mais cela est juste en train d'être couvert d'un thème complètement différent. C' est ce thème que nous allons travailler dans le reste de ce projet. À partir de la vidéo suivante, nous allons extraire quelques exemples de données afin que nous puissions voir exactement à quoi ressemblerait ce thème avec beaucoup plus de contenu. 19. Blog WordPress : importer des échantillons de données: Bienvenue de retour. Maintenant, nous avons notre nouveau thème installé pour notre projet. Nous allons maintenant voir à quoi cela ressemble avec du contenu. Pour le moment, nous avons juste quelques exemples de données, le blogpost, le commentaire, et aussi la page exemple aussi. Une façon d'ajouter du contenu est d'écrire beaucoup de blogs différents, d'ajouter beaucoup de pages différentes, et généralement de créer beaucoup de contenu. Au fur et à mesure que nous progressons dans ce projet, nous ajouterons beaucoup de notre propre contenu. Mais pour l'instant, nous allons mettre dans quelques exemples de données, pour vérifier ce thème avec plus de contenu. La façon de le faire est de se rendre sur le site WordPress et de télécharger les données Theme Unit Test. Ce sont les mêmes données de test qui sont utilisées par l'équipe WordPress pour examiner tous les thèmes nouvellement téléchargés. Tout le but de ceci est de s'assurer que vous avez tous les angles couverts. Par exemple, si nous créons un nouveau thème et que nous voulons le télécharger sur WordPress.org, si nous ne l'avons pas entièrement testé nous-mêmes avec beaucoup de données, nous pouvons trouver que la mise en page semble un peu étrange quand nous avons un certain type d'image, un certain nombre de blogposts. En remplissant cela avec toutes ces données, nous pouvons être sûrs que notre thème semble bon pour toutes les situations. Mais dans notre cas, nous allons simplement télécharger ceci pour nous donner une longueur d'avance avec notre nouveau projet. La façon d'installer ceci est de descendre à la section Installation et nous pouvons télécharger une copie à partir de ce lien. Je vais cliquer avec le bouton droit sur ce, puis Enregistrer le lien sous, puis enregistrer ceci sur le bureau. Pour importer cela, nous revenons sur le tableau de bord WordPress, puis descendons à la section outil, et à l'intérieur, nous avons cet importateur. Il y a déjà divers importateurs ou configuration pour juste si nous voulons importer des données à partir d'un blogueur ou un flux RSS. Mais celui dont nous avons besoin est cet importateur WordPress vers le bas en tirant nos données à partir d'un fichier d'exportation. Cliquez sur Installer maintenant, configurez ceci. Ensuite, exécutez notre importateur, sélectionnez notre fichier et le mien est enregistré sur le bureau, et c'est le fichier XML juste ici. Ouvrez ceci, cliquez sur Charger. Juste avant le téléchargement de toutes ces informations, nous pouvons également assigner différents auteurs à ces nouveaux blogs et à ces pages qui sont en cours de création. Nous aurions pu créer un nouveau nom d'utilisateur, ou nous pouvons sélectionner celui que vous avez déjà mis en place, et dans notre cas, nous n'avons que cet administrateur de blog. Nous pouvons assigner ça si nous le voulons. Cependant, cependant, je vais juste laisser ceci vide, ou je vais vérifier la section des pièces jointes d'importation. Cela va télécharger des choses comme les images, dont nous allons avoir besoin pour notre projet. Cliquez sur Soumettre et donnez quelques instants à télécharger. Super. Une fois qu'il a terminé, nous pouvons aller à l'extrémité frontale de notre site, appuyez sur Rafraîchir. Tous ces exemples de données ont maintenant été importés. Nous pouvons voir toutes nos pages en haut, nous avons aussi quelques menus déroulants. Nous avons tous nos blogposts. Si nous faisons défiler vers le bas, nous pouvons voir certains des médias qui ont été téléchargés, nous avons différentes images. Ceux-ci ont diverses dates, ils ont diverses offres, aussi certains d'entre eux auront des commentaires et aussi divers tags et catégories. Vous voyez les commentaires sur la droite, nous pouvons cliquer sur ceux-ci. Cela nous laisse maintenant une partie des données de blogpost à utiliser dans notre projet. Si vous avez eu des problèmes lors du téléchargement de ces données, ne vous inquiétez pas, ce ne sont que quelques exemples de données à utiliser. Ensuite, nous allons passer à la prochaine vidéo où nous allons voir comment nous pouvons ajouter nos propres blogs et aussi mettre à jour tous ceux qui existent déjà. 20. Blog WordPress : ajouter et mettre à jour des publications: Dans la vidéo précédente, nous avons ajouté beaucoup d'exemples de contenu, et en particulier, nous voyons maintenant beaucoup de billets de blog sur notre page d'accueil. Dans cette vidéo, nous allons ajouter notre propre billet de blog et aussi jeter un oeil à la façon dont nous pouvons éditer les articles existants aussi. Comme toujours, la façon de le faire est de se diriger vers le tableau de bord. Ensuite, nous allons à cette section Messages juste ici. La mise en page aujourd'hui est similaire aux pages que nous avons examinées dans la dernière vidéo. Nous pouvons passer en revue cela et nous cliquons sur tous nos messages. Nous pouvons en ajouter directement un nouveau et nous pouvons également passer à toutes les catégories et tags aussi. Allons dans tous les messages et nous pouvons voir tous ceux qui ont été créés avec nos exemples de données. Nous avons aussi ce monde Hello ! que nous avons mis en place lors de la première configuration de notre installation Wordpress. Nous pouvons voir l'auteur de l'un de ces, ce Theme Buster un et le Theme Reviewer est des exemples de données. Avec n'importe quel billet de blog que nous ajoutons nous-mêmes, nous aurons notre auteur actuel connecté. Nous pouvons voir à quelles catégories cela a été attribué et aussi toutes les balises qui ont été ajoutées. Après cela, nous pouvons voir les commentaires qui sont en cours de création. Celui-ci a un seul commentaire qui a été attribué à ce billet de blog. Si vous le vouliez, nous pourrions cliquer dessus. Vous serez directement dirigé vers ces commentaires, où nous pouvons l'approuver, nous pouvons répondre, nous pouvons les éditer, et nous pouvons également supprimer tout commentaire inapproprié aussi. Cliquez sur le bouton Précédent pour revenir à Tous les messages. La dernière section est la date de publication de cet article. Lorsque nous créons un nouveau billet de blog, nous pouvons le publier immédiatement ou nous pouvons le programmer pour un moment ultérieur. Si vous survolez l'un de ces billets de blog, nous pouvons également les modifier. Nous pouvons également les supprimer. Pour l'instant, cliquez sur le bouton « Ajouter nouveau » en haut et créez notre propre article de blog. Lors de l'ajout d'un nouveau billet de blog, cela va également profiter de l'éditeur Gutenberg basé sur un bloc, tout comme nous l'avons regardé lorsque nous avons créé nos pages dans le projet précédent. En haut, nous ajoutons un titre de billet de blog. Je veux juste aller pour My First Post. Ensuite, nous pouvons ajouter différents blocs de contenu tels que des images, texte, et tout autre chose, que nous avons vu dans les vidéos précédentes. Je vais juste ajouter un exemple de texte et la façon dont je vais le faire est de faire une recherche pour lorem ipsum. Cela nous mènera à lipsum.com, qui est juste un site simple pour générer des exemples de données. Ce que nous devons faire est de faire défiler vers le bas et nous pouvons générer un certain nombre de paragraphes de mots, cinq paragraphes, c'est bien, cliquez sur « Générer ». Ensuite, cela nous donnera nos cinq paragraphes, que nous pouvons maintenant copier et coller dans notre projet, coller ceci dans. Nous avons maintenant cinq paragraphes de données. Nous pouvons survoler l'une de ces sections et voir également un menu contextuel. On peut faire des choses comme réorganiser l'ordre. Nous pouvons rendre le texte en gras, italique. Nous pouvons créer des liens en sélectionnant n'importe quelle partie de ce texte, puis une URL vers laquelle vous souhaitez lier. Nous pouvons également définir des choses comme l'alignement. Nous avons également différentes options avec ce menu déroulant sur la droite. Aussi avec ce texte sélectionné, nous avons cinq options sur la barre latérale. Nous pouvons changer la taille de police par défaut. Nous pouvons modifier les paramètres de couleur. Si vous voulez que la première lettre soit plus grande, nous pouvons également sélectionner cela aussi, et si nous cliquons sur le bouton Post en haut, cela vous donnera maintenant quelques paramètres généraux pour notre billet de blog. Tout d'abord, nous avons la visibilité et nous pouvons sélectionner ceci pour être public afin que tout le monde puisse lire notre article. Nous ne pouvons le rendre disponible qu'aux administrateurs et éditeurs du site. Tout cela est basé sur les rôles particuliers que nous donnons aux utilisateurs. Nous aurons une vidéo dédiée à ce sujet très bientôt. Si nous avons des informations sensibles, nous pouvons également protéger par mot de passe notre blog aussi. Nous avons ensuite la date, nous pouvons la publier immédiatement, ou nous pouvons planifier cette date pour n'importe quelle date future. Ensuite, beaucoup de ces options similaires que nous avons vu dans les vidéos précédentes, où nous avons créé à différentes pages. Nous avons le permalien, qui est un lien direct vers ce post. Nous pouvons assigner les différentes catégories ou tags. Nous pouvons soit sélectionner n'importe quelle catégorie existante, soit en ajouter une nouvelle. La même chose pour les étiquettes. Nous avons une image en vedette que vous pouvez également ajouter. Ceci est une image qui apparaîtra à côté de notre billet de blog, n'importe quelle liste de page de blog dans. L' extrait, c'est un aperçu ou une version abrégée de notre billet de blog. C' est ce que nous voyons si nous allons à l'extrémité frontale de notre site. C' est toutes les versions raccourcies que vous voyez ici. Puisque nous ne voulons pas afficher le billet de blog complet sur cette annonce parce que cette page sera vraiment, vraiment longue. Si nous n'ajoutons aucun extrait ici, WordPress prendra automatiquement les premières sections de notre article de blog. Après cela, nous pouvons également définir si les discussions ou les commentaires sont autorisés pour ce post. Ce thème particulier nous permet également de sélectionner une mise en page différente. Nous pouvons ajouter des barres latérales à gauche et à droite. Nous pouvons supprimer la barre latérale et avoir un contenu pleine taille. Je vais juste laisser ceci comme la valeur par défaut. Jusqu' au sommet, publions ceci pour que nous puissions voir cela sur notre site. Confirmez. Vers le front end et actualisez le navigateur. Vous voyez que Mon premier message apparaît maintenant. Puisque celui-ci est le billet de blog le plus récent, vous pouvez vous attendre à ce qu'il apparaisse en haut, et ce sera souvent le cas, mais lors de l'importation de toutes les données d'échantillon, un de ces messages a été défini pour être collante. Si nous cliquons sur cela, nous prenons ensuite dans la version complète de notre post et allons à « Modifier Post ». Ensuite, dans les paramètres sur la droite, nous pouvons voir que cela a été collé en haut de la page. Nous pouvons décocher ceci, mettre à jour notre post, et revenir sur notre site. Cela mène maintenant notre premier billet de blog tout en haut. Ici, nous pouvons voir notre éditeur personnalisé et nous pouvons voir les différentes couleurs. Nous pouvons voir la première lettre plus grande et aussi nous pouvons faire à peu près tout ce que nous voulions avec tous nos blocs de contenu. En outre, si notre message devient vraiment long, nous pouvons également insérer un saut de page. Cliquez sur l'icône Plus. Recherchez le saut de page. Cela va maintenant diviser notre contenu en deux pages. Nous pouvons ajouter autant de sauts de page que nous le souhaiterions. Je vais juste garder celle-là pour l'instant. Mettre à jour ce post. Maintenant, si nous actualisons notre site, nous voyons que la moitié inférieure de notre contenu a maintenant été supprimée. Nous pouvons également basculer entre nos pages en bas. C' est ainsi que nous pouvons ajouter un nouveau billet de blog et également éditer des publications existantes. Si vous le souhaitez, vous pouvez aller de l'avant et ajouter autant de messages différents que vous le souhaitez ou même mettre à jour l'un des messages existants aussi. Une façon de vraiment donner vie à notre article de blog est d'ajouter différents médias tels que des images. C' est ce sur quoi nous allons maintenant passer dans les prochaines vidéos. 21. Blog WordPress : où trouver de belles photos pour vos publications de blog: Bienvenue de retour. La dernière chose que vous voulez faire est de passer beaucoup et beaucoup de temps à écrire de bons billets de blog. Si vous ne trouvez pas d'images géniales ou de médias pour aller avec elle. Cette vidéo est tout au sujet de vous montrer quelques ressources qui peuvent vous aider à trouver des images de haute qualité. Aussi, des illustrations, des graphiques vectoriels et des vidéos. Ceux-ci peuvent tous être inclus dans vos sites Web ou dans vos billets de blog. La première ressource est un site Web appelé Pixabay, et c'est notre pixabay.com. Il y a des milliers de photos, des vecteurs, et aussi des vidéos. Nous pouvons faire une recherche en utilisant la boîte de recherche en haut, ou si vous faites défiler un peu plus loin, il y a des onglets, attendre, illustrations, graphiques vectoriels, et aussi des vidéos. L' une des grandes choses à propos de Pixabay est, comme vous pouvez le voir, toutes les vidéos et images sont libérées de droits d'auteur sous Creative Commons. Cela signifie essentiellement que vous êtes libre de télécharger, libre de changer, libre de distribuer les images, et vous n'avez pas besoin de payer des redevances au bureau et également l'attribution n'est pas requise. Cela signifie que parfois la photographie de stock est libre de télécharger et d'utiliser gratuitement, mais parfois vous devez fournir un lien vers le site Web à partir duquel vous l'avez téléchargé ou un lien vers l'offre en échange de l'image fournis gratuitement. Mais ce n'est pas nécessaire sur Pixabay. Si vous voulez en savoir un peu plus sur les droits d'utilisation, suffit de cliquer sur le bouton « En savoir plus » et il y a une liste de questions fréquemment posées. Une fois que vous êtes sur le site et que vous trouvez une image que vous aimez, il suffit de cliquer sur l'image et vous pouvez télécharger l'image en différentes tailles. Vous devez être connecté pour télécharger les versions plus importantes, mais les images sont toujours libres de télécharger. Il y a aussi une confirmation que l'image est gratuite pour un usage commercial. y a pas non plus d'attribution à Pixabay ou à l'auteur. Ensuite, le prochain site Web que je vais regarder est un site appelé Unsplash.com. Unsplash.com est également une ressource gratuite pour les photos de stock. Si vous cliquez sur le lien « Faites ce que vous voulez », vous pouvez obtenir plus d'informations sur la licence. Comme sur Pixabay, toutes les photos publiées sur Unsplash sont sous licence Creative Commons Zero. Nous pouvons copier, modifier, distribuer et utiliser les photos gratuitement, et cela inclut également un usage commercial. Nous n'avons pas non plus besoin de la permission du photographe ou de Unsplash. Nous n'avons pas non plus besoin de fournir une attribution si nous ne le voulons pas. Retourne à la page d'accueil. Il est vraiment simple de rechercher des photos, et aussi nous pouvons parcourir par ce qui est nouveau et aussi diverses collections. Il y a aussi une option pour vous abonner et obtenir 10 nouvelles photos tous les 10 jours. La ressource suivante est une société appelée Shutterstock. Ceci est disponible à partir de Shutterstock.com. Ce sont probablement les plus grands d'entre eux. Il y a une image, un clip vidéo de presque tout ce que vous pouvez imaginer. Cependant, le site Web n'est pas libre d'utiliser. Il existe différents plans de tarification que vous pouvez choisir, mais vous pouvez trouver presque tout ce que vous cherchez. Cherchons des tigres. Cela m'amène à la recherche qui a beaucoup de photos de tigres, prises par des photographes, mais aussi des images prises par des illustrateurs. Si vous faites défiler vers le bas, vous pouvez voir que la recherche a 1 147 pages différentes. Aussi, cette semaine seulement a été 924 000 nouvelles images de stock vient d'ajouter cette semaine. Cela vous donne une idée de la taille de Shutterstock. La prochaine ressource qui est également gratuite est le site Web Wikimedia Commons. Il s'agit d'une base de données de 31 millions de fichiers multimédias librement réutilisables auxquels tout le monde peut contribuer. Ceux-ci sont organisés en images, sons, et aussi vidéos. Elles sont toutes sous licence Creative Commons. Encore une fois, ceux-ci sont tous gratuits à télécharger. Mais il suffit de vérifier chaque image individuelle. Il suffit de vérifier les contrats de licence et aussi s'il y a une attribution requise. Enfin, si vous voulez juste faire une recherche Google. Regardons à nouveau les tigres, puis allons aux images. Un outil utile que nous pouvons utiliser est les outils de recherche. Nous cliquons sur « Outils de recherche » puis sur « Droits d'utilisation ». Nous pouvons ensuite filtrer les images par type de licence. Je vais juste chercher des tigres étiquetés pour être réutilisés avec modification. Ensuite, ceux-ci sont filtrés jusqu'à ceux que nous pouvons modifier. Mais encore une fois, cliquez sur l'image individuelle et allez sur le site Web. Il suffit de vérifier que l'image est gratuite à télécharger et si une attribution est nécessaire ou non. Bien sûr, vous pouvez trouver beaucoup plus de sites de photographie de stock gratuit et payant avec une recherche rapide Google, mais ce sont quelques grands sites pour vous aider à démarrer. 22. Blog WordPress : inclure des médias: Jusqu' à présent, nous avons créé notre propre billet de blog avec un texte simple et nous pouvons vraiment donner vie à notre article de blog en ajoutant les différents éléments de médias tels que des images, des clips vidéo, et aussi de l'audio aussi. Maintenant, pour ce faire, nous allons commencer par ajouter une image en vedette. Nous avons déjà envisagé d'ajouter des images en vedette dans le premier projet, où nous les avons ajoutées à nos pages. Avec ce projet lors de l'ajout à notre billet de blog, dans ce thème, l'image en vedette s'affichera à côté notre billet de blog, sauf juste à l'intérieur de cette liste de billet de blog. Si nous faisons défiler vers le bas jusqu'à nos articles de blog exemples, nous pouvons voir l'image en vedette juste ici. Ajoutons ces si nous allons dans notre billet de blog ou peut également accéder directement à partir de notre tableau de bord aussi, nous pouvons également aller dans le lien de publication d'édition. Sur la droite, nous avons la section d'image en vedette dans le menu où nous pouvons définir ceci pour notre billet de blog. Vous pouvez sélectionner votre propre image à télécharger ou accéder directement à la médiathèque. Toutes ces images ont été fournies lorsque nous avons téléchargé les échantillons de données. Nous avons donc quelques images avec lesquelles travailler pour ce projet. Sélectionnez l'un de ces éléments et commodément nous avons aussi des choses comme le texte alt déjà rempli pour nous. Nous pouvons simplement définir ceci comme notre image, Mise à jour, puis revenir à notre projet, visitez le site. Nous avons maintenant une image pour notre article de blog. Maintenant, c'est un excellent moyen d'ajouter une image lorsque nous affichons une liste de tous nos billets de blog comme celui-ci. Mais qu'en est-il si nous cliquons dessus pour voir le blog complet ? Nous voulons aussi parfois ajouter des images entre tout ce contenu de blog aussi. Maintenant, pour ce faire, je vais en fait revenir à la vue Tableau de bord, et actualisons simplement ceci afin que nous ayons la version mise à jour. Les images peuvent également être ajoutées en bloc. Nous pouvons survoler la zone où nous voulons ajouter un nouveau bloc. Cliquez sur « Ajouter ». Ce bloc d'image est actuellement en haut ou nous pouvons également rechercher. Cliquez dessus. Ensuite, nous pouvons également télécharger une nouvelle image ou en sélectionner une dans la Médiathèque. Comme avant, nous l'avons pris à toutes nos images que nous avons actuellement. Nous pouvons sélectionner l'un de ces, mettre à jour notre post, et aussi à l'extrémité frontale de notre site, nous pouvons rafraîchir. Nous voyons maintenant que notre image a été insérée. Comme avec la plupart de ces blocs de contenu, nous pouvons également cliquer sur ceux-ci ou survoler et nous pouvons voir huit options menu. Nous avons beaucoup d'options différentes telles que le recadrage de l'image, nous pouvons lier à différentes URL. Nous pouvons également réorganiser notre contenu pour être au-dessus ou au-dessous de différents blocs et aussi sur la droite, nous avons aussi quelques options. Nous pouvons jouer avec le style de notre image en arrondissant les coins, nous pouvons changer les textes alt, nous pouvons changer la taille, et aussi j'ajoute une seule image comme celle-ci. Nous pouvons également télécharger plusieurs images sous la forme d'une galerie. Une galerie est aussi un bloc de contenu et nous avons juste besoin de sélectionner un endroit où nous le voulons, faire une recherche pour la galerie. Ensuite, nous avons les options habituelles de télécharger de nouvelles images ou d'accéder à la Médiathèque. Une fois que nous respectons la Médiathèque, nous pouvons sélectionner plusieurs images à afficher dans cette galerie et choisir l'une d'entre elles. Nous voulons sélectionner ces cinq. Cliquez sur « Créer ». Juste avant de les insérer dans notre galerie, nous pouvons également faire glisser et déposer ces images pour les réorganiser. Une fois que nous sommes heureux, insérez-les. Ces images de galerie peuvent également être liées à des URL, et nous pouvons également modifier le nombre de colonnes que vous voulez. C' est vraiment flexible à utiliser. Mettez à jour ceci et plus sur le site Web et actualisez notre billet de blog. Tout d'abord, nous voyons notre image a les coins arrondis. Si nous allons à la page 2, nous avons maintenant une belle galerie d'images. En plus des images, nous pouvons également insérer différents types de médias, tels que des clips vidéo. Ceci est inséré à peu près de la même manière si nous revenons à notre écran d'édition. Ensuite, si nous trouvons un endroit où nous voulons ajouter un bloc, cliquez sur « Ajouter ». Recherchez la vidéo. Si vous avez déjà un clip vidéo enregistré sur votre ordinateur, vous pouvez, bien sûr, l'utiliser aussi. Je vais aller sur pixabay.com. Si vous cliquez sur la liste déroulante, nous pouvons rechercher des vidéos. Appuyez sur « Entrée ». Il nous donnera une liste de toutes les vidéos que nous pouvons sélectionner sur ce site. Celui-ci a l'air bien. Cliquez sur ce « Téléchargements ». Je vais juste aller pour la plus petite version pour l'instant. Ensuite, une fois cela terminé, rappelez-vous que celui-ci n'est pas inséré dans la Médiathèque, donc nous devons aller à Télécharger, dans les Téléchargements. Sélectionnez ce clip, et le téléversement le placera automatiquement dans la Médiathèque 2. Sur la droite, nous avons différentes options vidéo, comme nous pouvons boucler cette vidéo, nous pouvons la couper quand elle est initialement chargée, nous pouvons également ajouter le contrôle tel que la lecture et la pause, et aussi jouer aussi. Une image d'affiche, c'est une image fixe qui s'affichera lorsque la vidéo n'est pas en cours de lecture. C' est une fonctionnalité très pratique à avoir aussi. Encore une fois, vous pouvez également réorganiser ces blocs et modifier certaines options. Une fois que vous êtes heureux, cliquez sur « Mettre à jour ». Nous pouvons vérifier si cela fonctionne en rafraîchissant notre billet de blog. Nous avons les contrôles en bas avec le temps. Cliquez sur « Play » et tout cela fonctionne bien. Ensuite, vous pouvez également ajouter un clip audio dans votre billet de blog et cet endroit vers le bas tout en bas. Cliquez sur le bouton « Insérer le bloc ». Comme vous pouvez vous y attendre, cela s'appelle le bloc audio. Pour récupérer un clip audio, je vais aller sur bensound.com. Cela donnera quelques échantillons audio gratuits que vous pouvez télécharger. Ou vous pouvez également utiliser le vôtre si vous préférez. Cliquez sur le bouton Télécharger pour n'importe lequel d'entre eux et nous pouvons télécharger une version gratuite à utiliser avec attribution. L' attribution signifie que nous devons créditer benson.com avec ce clip audio. Pour ce faire, nous avons juste besoin de copier cet exemple en bas. Téléchargez ceci. Tout comme nous l'avons fait avec le clip vidéo, revenez au post, sélectionnez ceci dans nos téléchargements. Ce clip audio est maintenant inséré. Nous avons le bouton Lecture et nous pouvons également modifier les paramètres audio sur la droite aussi. Ces valeurs par défaut sont bien pour moi. Je vais juste cliquer ci-dessous ce clip audio, puis insérer l'attribution. Mettez à jour ce billet de blog, actualisez le navigateur et nous pouvons tester si cela fonctionne. Vous ne pouvez peut-être pas entendre ça de votre côté, mais tout fonctionne bien. Si nous jetons un oeil à travers tous les différents types de blocs, il varie également sur les types de blocs dans les médias que vous pouvez insérer dans ces billets de blog aussi. La dernière chose que je vais vous montrer est comment insérer des médias directement à partir d'une URL. Pour cela, nous allons placer dans ajouter le bloc d'image, et puis nous pouvons utiliser la troisième option qui est insérer à partir de l'URL. Mais cela, bien sûr, nous avons besoin d'une URL média pour lier. Le site Wikimedia Commons, disponible sur Commons.Wikimedia.org, est un bon endroit pour en profiter . Vous pouvez rechercher dans l'immense bibliothèque d'images gratuites à sélectionner. Tout ce que je vais sélectionner cette image du jour. Cliquez dessus et puis nous sommes amenés à la version pleine grandeur où nous pouvons cliquer avec le bouton droit de la souris. Nous pourrions enregistrer cette image et l'ajouter à la Médiathèque. Mais au lieu de cela, je vais copier l'adresse de l'image , puis coller ceci comme notre URL. Appuyez sur « Entrée ». Il y a un aperçu de notre image. Mise à jour, rechargement. C' est juste une façon différente d'ajouter des images plutôt que d'utiliser la bibliothèque médiale. Nos images sont également affichées en bas. C' est juste une autre façon d'ajouter des images plutôt que d'accéder à la médiathèque. 23. Blog WordPress : utilisateurs, autorisations et gestion des commentaires: Maintenant, il est temps de penser à qui va réellement utiliser notre blog et aussi combien d'accès chaque utilisateur a réellement. Lorsque vous êtes à l'intérieur de la vue du tableau de bord, vous avez peut-être déjà remarqué que nous avons cette option « Utilisateurs » sur la gauche. Si je survole cela, nous avons la possibilité d'aller dans tous les utilisateurs, nous pouvons directement en ajouter un nouveau, ou nous pouvons aller dans notre profil actuel. Notre profil actuel a certaines options, telles que changer le schéma de couleurs, nous pouvons également mettre à jour nos informations personnelles, nos coordonnées, notre photo de profil, et également réinitialiser le mot de passe aussi. Mais cette vidéo n'est pas à propos de ceux-ci, s'agit d'ajouter de nouveaux utilisateurs, et aussi de vérifier les différentes autorisations qu'ils ont aussi. Passons à la section Tous les utilisateurs. En haut, nous voyons notre administrateur de blog, qui est le seul et unique utilisateur que nous avons configuré. Nous pouvons également ajouter un nouveau nom si nous le voulions à partir de l'écran d'édition. Nous pouvons voir notre e-mail. Nous avons également ce rôle d'administrateur. Un administrateur est un utilisateur qui dispose de toutes les autorisations requises pour faire ou modifier tout ce qu'il veut sur ce site. C' est pourquoi nous avons toutes ces options à gauche. Nous pouvons supprimer, poster, nous pouvons ajouter de nouvelles pages, nous pouvons approuver les commentaires, et aussi changer l'apparence de ce site. Quand nous n'avons qu'un seul site, comme nous le faisons ici, c'est le rôle de premier niveau. Nous avons créé deux articles de blog alors qu'en fait nous n'en avons créé qu'un. Mais quand nous avons configuré WordPress pour la première fois, l'exemple « Hello world » a été attribué à notre utilisateur aussi. Celle-ci, nous avons ajouté les exemples de données. Deux autres utilisateurs étaient également inclus dans ces données. La différence entre ces deux et nous-mêmes est ce rôle d'abonné. Nous allons jeter un coup d'oeil plus en détail dans un instant. Étant donné que nous sommes actuellement connectés en tant qu'administrateur, nous avons également le pouvoir de sélectionner n'importe lequel de ces utilisateurs supplémentaires. Nous pouvons également aller dans l'écran d'édition et modifier l'un des détails. En outre, très important encore, nous pouvons changer le rôle actuel aussi. Si nous voulions avoir un administrateur supplémentaire, nous pourrions, et aussi généralement mettre à niveau ou rétrograder n'importe quel rôle d'utilisateurs. Accéder à tous les utilisateurs si nous le voulions, nous pourrions même supprimer des utilisateurs. Nous le faisons de la même manière que lorsque nous avons traité les pages et les articles de blog. Tout ce que nous avons à faire est de survoler l'un de ces utilisateurs et de sélectionner le bouton « Supprimer » ou nous pouvons également les appliquer en vrac aussi en sélectionnant plusieurs, puis vous voyez le menu déroulant d'en haut. Comme nous venons de le voir avec la liste déroulante dans l'écran d'édition, côté de l'administrateur et de l'abonné, nous avons également plusieurs autres rôles. Pour en savoir plus sur ces paramètres, nous pouvons aller sur notre moteur de recherche et faire une recherche pour les rôles WordPress. Ma recherche la plus importante provient du site WordPress.org et il nous emmène directement dans les rôles et les capacités. Cliquez dessus, faites défiler vers le bas, puis nous verrons un résumé de chacun de ces rôles. J' ai déjà mentionné, quand nous avons un seul site Web comme nous le faisons, que l'administrateur est le rôle de premier niveau. Comme nous pouvons le voir, c'est quelqu'un qui a accès à toutes les fonctionnalités administratives de ce seul site. Cependant, comme nous le découvrirons plus tard dans ce cours, nous pouvons également créer un réseau WordPress ou une installation multi-sites WordPress. Ce type de configuration WordPress génère également un nouveau type de rôle appelé le super admin. Un super administrateur est quelqu'un qui est responsable de toutes les fonctionnalités d'administration sur le réseau de sites. Nous n'avons pas besoin de nous soucier de ce super administrateur pour l'instant, tout ce que nous devons nous concentrer sur ce sont les cinq rôles juste en dessous. Juste en dessous de l'administrateur, nous avons aussi l'éditeur. Cet éditeur a également une certaine responsabilité. Ils peuvent également publier et gérer leurs propres billets de blog, et aussi ils publient pour d'autres utilisateurs aussi. Après cela, nous avons l'auteur. C' est quelqu'un qui peut publier et gérer uniquement son propre post et pas tout post d'autres utilisateurs. Après cela, nous avons un contributeur qui est quelqu'un qui peut écrire ses propres publications, mais il ne peut pas les publier directement sans une confirmation de l'administrateur. Enfin, le rôle le plus bas est l'abonné. C' est juste quelqu'un qui peut s'inscrire à nos sites et aussi gérer leur propre profil. Ils ne peuvent pas créer de contenu, ils ne peuvent pas gérer le contenu d'autres personnes. Tout ce qu'ils peuvent faire est de s'inscrire et de modifier les coordonnées de leur utilisateur. Nous pouvons également voir ici que notre compte administrateur a été automatiquement créé lors de la première configuration de WordPress. Maintenant, avec cela à l'esprit, nous pouvons ajouter manuellement un nouvel utilisateur à notre site. Rendez-vous sur le tableau de bord et nous avons ce bouton « Ajouter nouveau » en haut, auquel nous pouvons également accéder depuis la barre latérale. Je clique dessus et je vais ajouter un exemple d'utilisateur de test et un e-mail. Il suffit de tester pour l'instant, un terrible mot de passe. test 2, confirmera que c'est bien parce que nous sommes juste en train de créer un exemple d'utilisateur. Ensuite, en bas, nous pouvons également changer le rôle aussi, que nous voulons laisser en tant qu'abonné, qui était le niveau inférieur des rôles. Confirmez ceci. Un nouvel utilisateur a été créé. Nous pouvons également modifier l'un de ces détails si nous le voulons. Mais je vais maintenant me déconnecter du profil d'administrateur en survolant cette section dans le coin. Cliquez sur « Déconnexion » et puis nous pouvons nous connecter en tant qu'utilisateur de test, qui était le test @test, un mot de passe super-fort. Connectez-vous, et maintenant nous accédons au profil de notre utilisateur test. Nous avons vu auparavant à partir des rôles et des capacités qu' un abonné ne peut gérer que son propre profil. Ils n'ont accès à aucune des autres fonctionnalités d'administration, et c'est pourquoi nous ne voyons aucune des fonctionnalités d'administration dans la barre latérale. Nous ne pouvons pas créer de nouvelles publications ou pages ou avoir généralement une entrée dans le site. De plus, tout contenu créé doit également être approuvé par l'administrateur. Nous pouvons voir cela si nous allons sur notre site et ensuite rafraîchir. Nous voyons que notre utilisateur a été mis à jour à notre test. Rendez-vous sur la page d'accueil et sélectionnez l'un de ces billets de blog. Rappelez-vous que les commentaires ont été activés pour ce post. Je vais laisser un commentaire en bas de « Bonjour », puis cliquez sur « Poster ». Nous avons un message de « Votre commentaire est en attente de modération ». Puisque nous n'avons pas l'autorisation de publier du contenu sur ce site, ce que nous devons maintenant faire est de nous déconnecter de notre propre nom. Déconnectez-vous, puis reconnectez-vous en tant qu'administrateur, c'était l'administrateur du blog. Une fois de plus, nous avons accès à toutes nos fonctionnalités d'administration. Ensuite, à gauche, nous pouvons voir que nous avons quatre commentaires en attente d'approbation, tête dans cette section. Nous pouvons voir en incluant nos échantillons de données, nous avons 34 commentaires au total, 30 ont été approuvés, et nous avons quatre qui est en attente. Cliquez sur cela aussi, filtrez ceci vers le bas, et nous avons les commentaires de notre utilisateur test en haut à côté des trois commentaires de l'échantillon de données. Nous pouvons soit passer le curseur sur ces manuellement et approuver. Nous pouvons éditer le contenu. Nous pouvons soit supprimer cela si nous ne voulons pas que cela soit publié sur notre site, soit si nous voulions approuver tous ces commentaires à la fois, nous allons cliquer sur cette case à cocher. Dans les « Actions en vrac », nous pouvons approuver, appliquer ceci, et les quatre commentaires ont maintenant été approuvés. Plus à nos articles de blog et rafraîchir. Les commentaires de bonjour ont maintenant été approuvés et sont visibles juste en dessous de notre article de blog. Par défaut, lorsque nous inscrivons nos utilisateurs, nous avons vu que cela a le rôle d'abonné. Nous pouvons également changer cela à l'intérieur de nos paramètres si nous le voulions, dans l'option « Paramètres » puis dans « Général ». L' une des options à l'intérieur est le « rôle par défaut des nouveaux utilisateurs » ; actuellement, il est défini sur abonné. Que se passe-t-il si nous avions un certain cas d'utilisation pour un niveau de rôle plus élevé ? Nous pourrions également définir cela comme une valeur par défaut différente aussi. En tant qu'administrateur, nous avons également beaucoup plus d'options pour contrôler les paramètres de la discussion ou les commentaires. Toujours à l'intérieur des paramètres, nous avons ces discussions lien, et cela nous permet vraiment de peaufiner tous ces paramètres liés à nos commentaires. Nous pouvons avoir des choses, telles que des confirmations par e-mail lorsqu'un nouveau commentaire est posté. Nous pouvons vérifier si l'auteur doit remplir son nom et son e-mail. Nous pouvons vérifier s'ils ont besoin d'être enregistrés et connectés pour commenter. Nous pouvons fermer les commentaires après un certain nombre de jours, ainsi que diverses autres options aussi, comme la liste noire de certains mots qui peuvent être inclus dans un commentaire. On y va. C' est ainsi que nous pouvons gérer différents utilisateurs sur notre site WordPress, comment nous pouvons modifier les autorisations d'un utilisateur, et comment nous pouvons contrôler en toute sécurité les commentaires affichés sur notre blog. 24. Blog WordPress : ajouter des pages: Maintenant, nous nous sommes surtout concentrés sur notre blog et aussi sur nos articles de blog, mais dans cette vidéo, nous allons voir comment nous pouvons ajouter des pages personnalisées, comme une page À propos de nous et aussi une page Contactez-nous aussi. pages qui ont été ajoutées avec le contenu de l'échantillon précédemment ont été automatiquement ajoutées à notre menu en haut. Nous n'avons pas besoin d'aucune de ces pages pour notre projet, nous allons donc les supprimer, puis créer la nôtre, la vue Tableau de bord et dans les pages, sélectionnez « Tous ». À partir de là, nous pouvons survoler et supprimer l'un de ces manuellement ou nous pouvons cliquer sur la case à cocher supérieure, puis les supprimer avec les actions en vrac, passer à la corbeille, et appliquer ceci à tous ces éléments. Nous avons aussi une deuxième page. Je vais supprimer ces derniers aussi, Ajouter Nouveau. Cette première page sera la page À propos de nous, donc ajouter le titre de la page. Ensuite, nous pouvons aller de l'avant et ajouter du contenu juste en dessous. Vous pouvez créer des informations à propos de nous que vous voulez, mais je vais aller à Lorem Ipsum et ensuite prendre un échantillon de contenu, placer à l'intérieur ici. Recherchez « Lorem Ipsum », rendez-vous sur lipsum.com. Nous pouvons générer autant de paragraphes que nous le souhaiterions. Je vais rester avec cinq. Copiez tout cela vers une nouvelle page, puis nous pouvons coller cela dans le bloc juste en dessous. Aussi, tout comme précédemment, nous pouvons passer le curseur sur l'une des sections et nous pouvons les éditer, nous pouvons changer les couleurs, nous pouvons changer tous les paramètres de police. Cependant, je vais juste laisser ceci en texte clair pour l'instant. Mais c'est une option d'ajouter du contenu par page, ainsi que d'ajouter tous ces blocs de contenu, si nous allons à la section de la page survolent sur la droite, parmi toutes les autres options, nous avons les attributs de page où nous peut sélectionner un modèle. Un modèle est quelque chose qui est fourni par le Créateur de Thèmes et il nous permet de créer différentes mises en page et à différents types de contenu à nos pages WordPress. Ces modèles sont des fichiers spéciaux qui sont insérés dans notre thème, et nous pouvons utiliser sur une seule page comme celle-ci, donc il ne s'applique qu'à une seule page, ou nous pouvons avoir un modèle plus générique que vous voulez appliquer à plusieurs pages. Par exemple, nous pourrions avoir un modèle qui est pour une page 404, alors nous pourrions avoir un modèle multi-usage différent, qui est appliqué à toutes les pages pour nous donner un aspect et une sensation cohérents. Nous examinerons les modèles plus en détail lorsque nous arriverons à créer notre propre thème à partir de zéro, ce que nous ferons plus tard dans le cours. Mais pour l'instant, nous allons simplement rester avec ce contenu de page que vous avez ajouté à l'intérieur des blocs, publier notre page, confirmer. Maintenant, si nous actualisons, tous ces exemples de pages ont été supprimés et la page À propos de nous a été automatiquement ajoutée à ce menu. Cliquez dessus. Il y a tous les textes que nous avons ajoutés à notre page. Bien sûr, nous sommes libres d'utiliser autant de blocs que nous le voulons. Nous pouvons ajouter des médias et tous les différents types de blocs que nous avons vus dans les vidéos précédentes, ainsi que ce contenu et aussi les modèles, nous cliquons sur cela. Nous avons également différentes options de mise en page en bas. Nous utilisons actuellement cette mise en page par défaut, que vous pouvez voir est le texte sur la gauche et la barre latérale sur la droite. Nous pouvons également changer cela, par exemple, si l'un de ces barres latérales remplacé sur la gauche, nous pouvons mettre à jour ceci, rafraîchir. Nous pouvons également supprimer la barre latérale et avoir le contenu soit toute la largeur de la page. Ceci est vraiment utile pour changer l'apparence de nos pages. Je veux laisser ceci comme par défaut, qui est la barre latérale sur la droite. N' oubliez pas que toutes ces options sont disponibles raison du thème spécifique que nous avons choisi. Vous pensez peut-être, « Eh bien, comment pouvons-nous savoir exactement quelles options sont disponibles avant de télécharger un thème ? » Eh bien, cela est disponible lors du téléchargement d'un thème à partir de wordpress.org et aussi certains des fournisseurs de thèmes globaux aussi. Si nous allons dans la section thème, regardons notre thème spacieux. C' est un ici, donc nous pouvons cliquer sur « Plus d'infos » et puis nous voyons cela a 13 zones de widget différentes ; il a quatre mises en page différentes, différents modèles de page, il est réactif, et partout avec une mise en page différente et options de couleur aussi. Maintenant, bien que nous ayons examiné ces options de thème dans le passé et aussi les balises qui étaient disponibles, espérons maintenant que vous avez vu l'inaction à l'intérieur d'un site. Vous devriez maintenant être beaucoup plus à l'aise avec Slack et un thème particulier, basé sur ces options. Je passe à notre diapositive. Maintenant, je vais ajouter le reste des pages dont nous avons besoin, qui sera la page Contactez-nous et aussi la page Blog. Assurez-vous que cela est mis à jour, puis nous pouvons cliquer sur le « Icône WordPress », nous sommes repris à toutes les pages, « Ajouter Nouveau ». Celui-ci sera pour le Contact Us. Juste en dessous de cela, je vais ajouter un bloc de contenu qui est une liste. Cherchons ceci et juste quelques lignes d'exemples de données d'adresse, la ligne d'adresse 1. Copiez ceci, appuyez sur « Entrée » et nous pouvons ajouter autant de lignes que vous voulez à l'intérieur ici. Ça n'a pas vraiment d'importance pour cette démonstration. Comme pour tous vos blocs, nous pouvons sélectionner n'importe laquelle de ces lignes. Nous pouvons changer cela pour être une liste ordonnée avec les nombres, mais je vais garder ceci comme la liste à puces, qui n'est pas ordonnée. Tout comme avec la plupart des blocs de texte, nous pouvons formater le texte, nous pouvons changer la couleur, et aussi changer les liens si nous le voulons. Maintenant, nous pourrions aller de l'avant et publier cette page si nous le voulions, et cette page sera automatiquement ajoutée à notre menu à côté du lien À propos de nous. Cependant, bien que je vais le faire un peu différemment, ce que je voudrais pour la page Contactez-nous est que cela n' apparaisse que lorsque nous survolons le lien À propos de nous. Donc, lorsque nous plaçons la souris sur ce, est va obtenir un menu déroulant où nous pouvons sélectionner notre page de contact. Pour ce faire, au lieu de publier ceci directement, nous allons aller dans les paramètres de la page, puis vers le bas dans la « Page parent ». Nous avons seulement cette page À propos de nous, donc nous pouvons sélectionner ceci. Si nous avons plusieurs pages, nous pourrions également réorganiser la commande. Mais pour l'instant, appuyez sur « Publier », « Confirmer », actualiser notre blog. Ensuite, passez le curseur sur le lien À propos de nous révélera notre nouvelle page de contact. Nous pouvons également sélectionner ceci et nous serons redirigé vers notre page Contactez-nous, qui est imbriquée dans le lien À propos de nous. Maintenant, ce ne sont que quelques données qui vont s'afficher, mais plus tard, nous allons revenir sur cette page et ajouter un formulaire de contact. Juste pour compléter cette vidéo sur le tableau de bord dans les pages où nous allons ajouter notre troisième et dernière page pour le blog. La page du blog sera l'accueil de nos articles de blog plutôt que la page d'accueil par défaut, que nous avons actuellement, si nous cliquons sur notre « Icône du site ». Pour le moment, tous ces articles de blog sont listés sur cette page d'accueil, mais plus tard, nous aurons une page de blog dédiée où ils seraient placés à l'intérieur. Tout ce que nous avons à faire est de publier ceci, actualiser et maintenant cette page vide est maintenant également placée à l'intérieur de la barre de navigation. C' est toutes les pages dont nous avons besoin pour le moment. Ensuite, nous allons jeter un oeil aux menus de navigation et comment ajouter un menu personnalisé à notre site. 25. Blog WordPress : ajouter notre menu de navigation: Comme nous l'avons découvert dans la vidéo précédente, chaque fois que nous ajoutons une nouvelle page, elle est automatiquement ajoutée à notre menu et aussi, ce menu est déjà créé pour nous. Nous n'avons rien fait pour le créer nous-mêmes. Ce menu particulier a été ajouté lorsque nous avons créé les exemples de données dans les premières vidéos. Mais bien sûr, nous ne voulons pas compter sur les exemples de menus. Nous voulons savoir comment créer le nôtre. Comme avec tout le reste dans WordPress, nous devons aller sur le tableau de bord, puis dans les options principales. Pour créer ou gérer nos nouveaux menus, nous devons aller à l'apparence. Ceci a un lien de menu dédié. En haut, nous avons un menu déroulant avec tous les menus disponibles qui sont fournis avec les exemples de données. Actuellement, nous avons toutes les pages sélectionnées et pour le moment nous voyons que nous avons quelques erreurs à l'intérieur de ce menu et ceux-ci ont tous été changés à cette couleur rose, donc nous savons qu'il y a une erreur. Chacun de ces blocs roses va être un lien de menu. Nous avons une page de blog, nous avons la première page, nous avons le sujet des tests et ce sont toutes sous-pages qui sont imbriquées juste en dessous de cette page aussi. La raison pour laquelle nous voyons ces erreurs est que nous avons supprimé toutes les pages inutilisées de notre site. C' est juste la façon de WordPress de nous avertir que nous n'avons plus accès à aucune de ces pages. Nous pourrions aller de l'avant et supprimer l'un de ces liens ou aussi supprimer le menu complet aussi. Même pour l'un de ces menus existants, nous pouvons les sélectionner. On peut aller à « Sélectionner ». Ensuite, nous pouvons également supprimer l'un de ces menus inutilisés. Mais pour le moment, je vais juste aller de l'avant et créer notre nouveau menu avec ce lien juste ici. Ce menu va remplacer notre menu tout en haut. Je vais donner à cela un titre de navigation supérieure. Créez notre menu et puis nous pouvons sélectionner quelques options dans les paramètres ci-dessous. La première option consiste à ajouter automatiquement de nouvelles pages de niveau supérieur à ce menu. Cela signifie, comme dans la vidéo précédente, que chaque fois que nous créons une nouvelle page, celle-ci sera automatiquement ajoutée à notre menu. Ce thème est déjà livré avec trois endroits différents où nous pouvons placer notre menu. Ce sera le menu principal. Cliquons sur ceci. Nous pourrions enregistrer ceci et le vérifier, mais nous n'avons pas encore de pages à afficher dans notre thème. Ce que nous devons faire est d'aller ajouter éléments de menu et ensuite nous pouvons sélectionner le contenu que nous voulons placer dans ce menu. Sous l'onglet Pages, je vais sélectionner tout, ajouter ceci à notre menu, et maintenant nous avons nos trois liens de menu. Nous pouvons également choisir différents articles de blog que vous souhaitez ajouter. Nous pouvons également créer des liens personnalisés pour accéder à des sites Web externes. Pour cela, nous ajoutons simplement une URL vers laquelle vous voulez lier, puis quelques textes que vous voulez afficher pour notre lien de menu. Enfin, nous avons également des catégories où nous pouvons sélectionner différentes catégories où nous voulons fournir un lien direct vers. Mais pour l'instant, les trois pages sont bien, alors sauvegardons ce menu. Il est tout dimensionné et rafraîchissant. Il y a nos trois liens en place. Nous pourrions laisser cela structuré exactement comme il est. Ou si vous voulez avoir un sous-menu comme nous l'avons vu auparavant où le contact est placé sous le lien À propos de nous, nous devons revenir à nos pages, puis le lien enfant, nous devons cliquer sur, déplacer ceci vers la droite. Pop ceci en place et ceci est maintenant classé comme un sous-élément. Si nous voulons que ce soit à nouveau déplacé vers le niveau supérieur de notre menu, nous pourrions soit faire glisser ce dernier, soit aller dans notre article et cliquer sur le lien Sortir de sous À propos de nous. Sauvegardez ceci, rechargez. Je veux passer le curseur avec le menu déroulant en place. Allons aussi de l'avant et ajoutons un menu de plus, qui va placer à l'intérieur de la zone de pied de page. Ceci sera placé à côté de notre texte sur le côté droit, dans l'option de notre menu. Nous pourrions soit créer un nouveau menu et le placer dans la zone de pied de page, soit plutôt, si nous allons gérer des emplacements, nous pouvons réaffecter différents menus à différents endroits. Le menu du pied de page, allons-y pour le menu social préexistant. Sauvegardez nos modifications. Maintenant, si nous nous rafraîchissons, nous voyons que nos liens vers les médias sociaux sont placés en bas. Si nous voulons réorganiser l'ordre de chacun de ces liens, vous suffit de sélectionner le menu que vous souhaitez éditer. Par exemple, le menu social. Sélectionnez ceci et nous pouvons réorganiser chacun de nos liens. Aussi, si nous voulons modifier cela d'une manière plus visuelle, nous pouvons également aller dans le personnalisateur de thèmes, je sélectionne un nouveau lien personnalisé, et le personnalisateur nous donnera un aperçu visuel de tous les changements que nous avons apportés à notre site. Il dispose d'une section de menu où nous pouvons accéder à tous les emplacements et à tous les menus existants. Par exemple, le menu social, nous pouvons cliquer sur ce. Nous pouvons également modifier nos liens et tous ces changements en temps réel. Si nous changeons l'une des étiquettes et puis descendons vers le bas, nous pouvons voir que cela a été prévisualisé dans le navigateur. C' est ainsi que nous pouvons ajouter des menus, comment nous pouvons supprimer des menus, aussi comment nous pouvons les modifier et les réorganiser et dans la prochaine section, et les réorganiser et dans nous allons nous familiariser beaucoup plus avec ce personnalisateur. J' ai pour vous beaucoup des options de personnalisation disponibles pour rendre ce thème plus personnel. 26. Blog WordPress : L'outil de personnalisation en détails: Dans les vidéos précédentes, nous avons déjà eu un bref aperçu du personnalisateur, qui est disponible à partir de l'onglet Apparence du tableau de bord. Le personnalisateur est un moyen d'apporter des modifications à notre thème et de voir un aperçu en direct de ces modifications avant de les enregistrer et de les appliquer à notre projet. Nous allons maintenant revoir le personnalisateur et apporter quelques modifications à l'aspect et à la convivialité de notre site. Sur mon bureau, j'ai un dossier Images pour ce projet et ceci est inclus dans ce cours. Vous pouvez le télécharger vous-même et utiliser les mêmes images que moi. Ou plutôt, si vous préférez, vous pouvez choisir le vôtre et les utiliser à la place pour la médiathèque. Nous avons ces disponibles. Allons dans la bibliothèque médiale maintenant, et ensuite nous pouvons glisser sur le dossier complet du projet, et déposer ceci à l'intérieur d'ici. Vous avez divers logos et images, vous avez quelques icônes, et aussi une texture que nous utiliserons bientôt. Avec cela maintenant en place, nous pouvons maintenant revenir à l'apparence, puis dans l'option de personnalisation. Certaines de ces options auront des vidéos dédiées à venir. Nous n'allons pas passer en revue toutes les options pour l'instant dans cette vidéo, mais nous allons commencer en haut à l'intérieur de la section d'en-tête et commencer par ajouter un logo. Nous pouvons le faire à l'intérieur de l'option En-tête, puis dans l'Identité du site. De là, nous allons ajouter un logo qui apparaîtra à côté du titre de notre site. Vous pouvez choisir n'importe quel logo, bien sûr. Je vais utiliser celui-ci qui est inclus avec le cours comme celui-ci. Nous pouvons aussi recadrer cela si nous le préférons. Je vais en faire la pleine taille. Vous pouvez recadrer. Pour le moment, nous ne voyons aucune modification apparaissant dans notre aperçu. C' est parce que si nous faisons défiler vers le bas, nous avons aussi une troisième option, si nous voulons montrer le logo, ou les textes, et nous pouvons réellement sélectionner les deux, donc ceux-ci apparaissent côte à côte. À côté du titre, cela est automatiquement défini lorsque nous avons créé un site WordPress tôt, et vous pouvez changer cela si vous le souhaitez. Je vais laisser ceci tel quel, mais je vais changer la ligne de balise juste en dessous. Ce sera tout ce qui va être le développement web. Nous pouvons voir que nous tapons, ceci est automatiquement mis à jour dans l'aperçu, et la dernière chose que je vais mettre à jour dans la section sera l'icône du site. C' est la petite image qui apparaît à l'intérieur de l'onglet du navigateur. Nous pouvons sélectionner une icône, je vais aller pour celle-là, en dessous de ceci. Nous voyons que cela est automatiquement appliqué à notre sommet. Si vous le souhaitez, vous pouvez également changer la couleur du texte d'en-tête, mais je suis satisfait de la couleur, qui est fournie par défaut. Quelques autres choses à noter ici, c'est que nous avons également quelques options pour voir à quoi ressemble le site dans différentes tailles d'écran. En bas, nous sommes actuellement sur la vue du bureau, nous pouvons également prévisualiser l'aspect et la sensation de cela dans une tablette. Nous pouvons cliquer sur le bouton du milieu pour ce faire, ainsi que sur la vue mobile de l'écran plus petit aussi. Cela nous donne une bonne chance de prévisualiser à quoi ressemblerait les choses si nous téléchargeons peut-être une image qui est trop grande, texte génial qui ne correspond pas tout à fait, mais généralement beaucoup de ces thèmes que vous avez téléchargés sur le Theme Store, sont généralement pleinement réactifs. Nous ne pouvons pas publier nos modifications une fois que nous sommes heureux, et celles-ci seront également reflétées à l'intérieur de notre site. De retour dans le personnalisateur, nous avons beaucoup d'options différentes à l'intérieur ici. Nous voyons quelques raccourcis sur la droite. Nous pouvons cliquer sur l'icône de crayon à côté de l'une de ces zones modifiables, puis nous avons pris directement à la section de personnalisation, où nous pouvons apporter nos modifications. Retour au menu principal tout en haut, nous avons cette option globale où nous pouvons appliquer quelques paramètres pour différentes couleurs, notre typographie, ainsi que nos mises en page et fond aussi. Si vous le vouliez, vous pouvez changer toutes les couleurs. Nous avons une couleur primaire définie par l'offre de thèmes, et nous pouvons changer cela afin qu'il s'applique à tous les espaces verts de nos sites. Vous pouvez également changer ce mode pour qu'il s'agisse d'un mode sombre. Si vous préférez cela pour votre blog, l'option typographie nous donnera une chance de changer les polices standard que nous allons utiliser pour notre projet, et nous pouvons changer ceci pour être soit quelques-unes de ces polices standard fournies, ou l'un des sélectionnés de Google aussi. Ce qui a changé à la fois le corps et les balises de titre pour être Roboto, publiez ceci. La couleur d'arrière-plan, nous pouvons sélectionner n'importe quelle couleur d'arrière-plan différente qui s'applique à l'extérieur de notre zone de contenu principale. Actuellement, il s'agit d'une barre de couleur gris clair que vous pouvez voir. Nous pouvons déplacer la couleur autour de l'une de ces couleurs et changer la sensation de notre site. Si nous le voulions, nous pourrions également télécharger une image d'arrière-plan ou une texture pour remplacer cette couleur standard. Layout, cela nous donnera une chance de définir la largeur du contenu, qui est cette couleur sombre et grise. Nous pouvons soit avoir une boîte comme nous le voyons ici avec une certaine largeur, soit nous pourrions avoir pour être la mise en page plus large et ensuite nous allons au contenu boxy dans le centre. En plus de modifier nos pages à partir de ce personnalisateur, nous pouvons également changer le positionnement de la barre latérale d'ici si vous voulez avoir un jeu et voir comment cela se sent avec différentes options de mise en page. C' est la mise en page par défaut pour commencer, qui s'appliquera à toutes les pages, puis nous avons une mise en page qui est plus spécifique aux pages et aussi à la publication de blog aussi. Peut-être que sur cette liste d'articles de blog, nous ne voulons pas de barre latérale du tout, donc nous pouvons sélectionner cette vue, puis lorsque nous cliquons sur l'un de ces billets de blog, pour être pris dans la vue complète des messages. Nous pouvons ensuite réintroduire une barre latérale sur n'importe quel côté que nous voulons. Encore une fois, cela peut également être différent pour toutes les pages, donc si nous allons dans la page « À propos de nous », nous verrons toujours une barre latérale à l'intérieur, et nous pouvons également supprimer cela aussi. Je vais publier ces modifications, puis cliquer sur le logo du site pour revenir à notre page d'accueil. Si je pouvais juste rendre ça un peu plus étroit. Ouais, ça a l'air mieux, publiez ça. Retournez au sommet. Nous aurons des vidéos dédiées pour beaucoup de ces options, mais juste une dernière chose que je voudrais vous montrer est le bouton de téléchargement CSS supplémentaire. Si vous savez comment utiliser CSS, c'est un endroit où vous pouvez l'ajouter. Mais ne vous inquiétez pas si vous ne connaissez pas ce code, va juste être un exemple de ce que nous pouvons faire. Par exemple, si nous voulons cibler l'un des textes, qui est un élément EP, nous pourrions appliquer notre CSS personnalisé comme ceci, étant donné que le contrôle total sur l'ensemble du style et de la mise en page de notre thème. Ne vous inquiétez pas si vous ne savez rien de tout cela, c'est juste quelque chose de plus que vous pouvez peut-être utiliser à l'avenir. C' est le personnalisateur et aussi une chose à retenir lors de l'utilisation du tableau de bord, certaines des options à l'intérieur ici vont également nous relier au personnalisateur aussi. Par exemple, si vous allez à l'apparence, puis vers le bas vers le lien d'en-tête, cela nous mènera à la section d'en-tête du personnalisateur. Je vais quitter le site tel qu'il est pour l'instant et vous pouvez faire quelques changements supplémentaires si vous préférez, en utilisant le customizer sans avoir besoin d'appliquer de codage. Nous allons laisser cette vidéo là parce que nous allons couvrir le reste des options au fur et à mesure que nous avançons dans cette section. 27. Blog WordPress : ajouter des images d'en-tête: Nous allons maintenant faire un peu plus de personnalisation avec notre en-tête de projet. Aussi, ajoutez cette image d'en-tête que vous pouvez voir à l'intérieur de l'aperçu du thème spacieux. L' image d'en-tête est cette grande image de fond avec ce livre et ce téléphone, qui apparaît en haut de notre site Web. Il est idéal pour l'image de marque et donne à notre site un aspect et une sensation uniques. Cela peut également être fait dans le tableau de bord à l'intérieur du personnalisateur. Retour à l'apparence et dans la section de personnalisation où nous allons sauter dans l'en-tête. Pour changer ces images, nous devons aller dans la section média d'en-tête où nous pouvons télécharger une nouvelle vidéo ou une nouvelle image d'en-tête. Nous pourrions lire une vidéo en arrière-plan si nous le voulions, ou créer un lien vers une URL YouTube. Au lieu de cela, je vais aller pour l'image d'en-tête. Cliquez sur « Ajouter une nouvelle image » où nous pouvons télécharger une nouvelle image ou sauter dans la médiathèque. L' image que je vais utiliser est celle-ci juste ici. Sélectionnez ceci et nous pouvons également recadrer la taille si nous le voulons ou cliquez sur « Recadrer ». Celui-ci sera téléchargé en haut de notre projet. Nous pouvons également ajouter plusieurs images aussi. Il y a un deuxième cours fourni avec ce cours. C' est l'image de l'ordinateur juste ici. Encore une fois, sélectionnez et recadrez. À partir du personnalisateur, nous pouvons voir que c'est l'en-tête actuel et nous avons également certains précédemment téléchargés aussi. Si nous le voulions, nous pourrions rester avec une seule image, ou à la place, nous pouvons cliquer sur « En-têtes téléchargés randomisés ». Ensuite, un aléatoire s'affiche chaque fois que la page a été chargée. Par défaut, cela apparaît au-dessus de notre section d'en-tête. Nous pouvons déplacer cela juste en dessous en cliquant sur « Position ci-dessous » à l'intérieur de cette section en bas. Si nous publions maintenant ces modifications et que nous allons sur notre site, actualisez. Si nous continuons à rafraîchir le navigateur, nous voyons une image aléatoire est sélectionnée chaque fois que la page se charge. Nous reviendrons également à cette image d'en-tête plus tard dans le projet où nous allons la remplacer par un carrousel. Maintenant, c'est bien. Revenons au personnalisateur. Si nous revenons d'un niveau dans la section d'en-tête, nous pouvons également cliquer dans le menu principal aussi. À partir de là, nous allons activer l'icône de recherche dans l'en-tête. Cela nous donnera une boîte de recherche que nous pouvons rechercher n'importe quel billet de blog, ou page sur nos sites. Par exemple, nous avons inclus quelques Lorem Ipsum. Si nous cherchons cela, nous verrons ce sera alors retourner notre billet de blog avec le texte de Lorem. Nous pouvons également changer cela pour être le nouveau menu responsive aussi. Pour cela, nous descendons la taille du navigateur. C' est à quoi ressemble le menu déroulant normal. Si nous le voulions, nous pourrions également changer le nouveau menu responsive, qui apparaît en haut à droite, comme ceci. Le choix du menu est entièrement à vous de décider, mais je veux laisser cela comme non coché, puis publier nos modifications. Maintenant, nous avons ces images vraiment larges, je vais revenir aux paramètres globaux et dans la mise en page. Où je vais revenir à la mise en page de la boîte. Cela empêchera simplement l'image de devenir beaucoup plus large que le reste du contenu. Publiez nos modifications, actualisez le navigateur. Nos modifications ont été mises à jour. Dans la vidéo suivante, nous allons jeter un oeil sur la façon d'ajouter une image d'arrière-plan. 28. Blog WordPress : ajouter une image d'arrière-plan: Plus tôt en regardant le personnalisateur, nous avons ajouté une couleur différente à notre arrière-plan. C' est la couleur qui entoure tous ces contenus plus sombres au milieu. Nous avons fait cela dans le personnalisateur, le tableau de bord, dans l'apparence et la personnalisation. Sur les options globales, nous avions une option d'arrière-plan juste ici, et c'est là que nous définissons cette couleur d'arrière-plan. Une autre chose que nous avons mentionnée était que nous pouvions également changer l'image de fond. Nous pouvons sélectionner n'importe quelle image que nous aimerions placer en arrière-plan ou même une texture d'arrière-plan. Fourni avec les images pour cela est bien sûr une couleur de texture grise, que je vais appliquer à cet arrière-plan. Nous pouvons voir tout de suite que cette texture s'est appliquée tout autour de notre projet. Nous avons différents presets où nous pouvons répéter l'image, nous pouvons remplir l'écran, mais nous pouvons actuellement voir notre image est déjà remplir l'écran parce que cela est répété. Même si la texture fournie est juste un petit carré, si nous décochons l'image de fond Répéter, nous pouvons voir que nous avons juste ce petit carré dans le coin. Il est placé dans le coin en raison de la position de l'image. Je n'ai jamais eu une image différente que vous vouliez placer dans un coin particulier ou même au centre. On pourrait changer l'emplacement avec ces boutons. La taille de l'image peut également être mise à jour. Une autre fonctionnalité que nous avons en bas est la possibilité de faire défiler l'image d'arrière-plan avec la page. Ce que cela signifie est si cela est vérifié, et si nous faisons défiler vers le bas, nous pouvons voir l'image d'arrière-plan est poussé vers le haut avec le reste du contenu. Si cela, cependant, n'est pas coché comme ça, la position de fond reste dans un emplacement fixe. Je ne ferai pas défiler avec le reste du contenu. Je préfère ça dans l'autre sens. Je vais cliquer sur le défilement avec la page et répéter cela afin qu'il couvre l'image d'arrière-plan complète. Beaucoup de ces options ne sont pas vraiment utiles lors de l'utilisation d'une petite texture comme celle-ci. simple fait de répéter cela est généralement bien pour nos besoins. Cependant, si vous utilisez une image différente, beaucoup de ces options seront beaucoup plus utiles. Cliquez sur « Publier » pour enregistrer nos modifications, actualiser le navigateur, et les modifications sont maintenant entrées en vigueur. 29. Blog WordPress : plugins et intégration de médias sociaux: Bienvenue dans cette vidéo sur les plugins. plugins sont une partie vraiment importante de WordPress et ils nous permettent d'étendre le noyau WordPress. Maintenant par cela, nous voulons dire que nous avons un WordPress téléchargements lorsque nous avons initialement configuré l'un de nos projets WordPress. Ensuite, nous pouvons l'étendre pour fournir beaucoup plus de fonctionnalités différentes et un ensemble différent de fonctions. Nous pourrions donc inclure des éléments tels que les formulaires de contact. Nous pourrions ajouter des outils pour le référencement. Dans cette vidéo particulière, nous allons jeter un oeil en ajoutant un plugin pour ajouter quelques icônes de médias sociaux à partir de la page d'accueil wordpress.org. Nous pouvons aller dans la section plugin, comme nous l'avons fait tôt avec les thèmes. Nous pouvons voir actuellement que nous avons plus de 50 000 plug-ins disponibles pour étendre notre site WordPress. Nous avons des choses telles que les calendriers de réservation, nous avons des galeries, nous avons des formulaires de contact. Nous pouvons ajouter une protection anti-spam, la possibilité de sauvegarder notre site et si nous n'avons pas aimé le nouvel éditeur Gutenberg, qui est appliqué sur la version 5 et supérieure, nous pouvons également revenir à l'éditeur classique si nous le préférons. Pour ajouter ces plugins et aussi voir quels plugins sont disponibles pour notre site, nous pouvons revenir sur le tableau de bord, assurez-vous que les modifications sont enregistrées dans le personnalisateur. Nous avons une section de plugin dédiée. Cliquez dessus. Actuellement, nous avons le mot politique pressante, que nous avons utilisé plus tôt. Cela a été activé lorsque nous avons installé les échantillons de données. Les connexions sont vraiment simples à ajouter, il suffit de cliquer sur le bouton Ajouter un nouveau. L' isolation est très similaire à un thème. Nous pouvons voir toutes les fonctionnalités et aussi les plug-ins populaires et nous pouvons directement les installer à partir de l'écran. Ou comme nous l'avons vu, il y a tellement de plugins différents disponibles que nous pouvons également avoir besoin de rechercher le désir de vouloir. Dans notre cas, je vais faire une recherche de social, remplir toutes les icônes des médias sociaux. Celui que je vais utiliser est celui-ci, qui est finalement social. Il est également très important de noter que lors de l'installation de plug-ins, il vaut la peine de vérifier quand il y a eu la dernière mise à jour pour s'assurer qu'ils sont maintenus régulièrement et également s'assurer qu'ils sont également compatibles avec votre version actuelle de WordPress. Habituellement, les commentaires sont une bonne indication de si vous installez un plugin utile ou non. Tout ce que nous avons à faire est de cliquer sur Installer, qui téléchargera ce plug-in et une fois cela fait, nous pourrons alors activer cela pour l'utiliser sur notre site. Activez ce plugin. Une fois que nous autorisons ce plug-in, nous pouvons alors voir dans la barre latérale, nous avons maintenant une nouvelle icône à l'intérieur du tableau de bord. On peut cliquer dessus. Nous prenons en compte nos options, nous devrons exécuter la configuration de notre plugin. Nous allons fermer cela, puis exécuter certains des paramètres requis. Nous avons trois paramètres différents que nous devons configurer en haut. Le premier est l'icône à afficher sur notre site. C' est à vous de décider. Je vais aller sur Twitter et aussi YouTube. Gardez cela assez simple. Nous allons juste confirmer l'activation. Aussi le flux RSS, nous pouvons supprimer cela. Si vous avez des comptes avec l'un de ces autres fournisseurs, vous n' hésitez pas à vérifier ces boutons aussi. Sauvegardez notre première option. La deuxième option est qu'est-ce que nous voulons que ces icônes fassent ? Par exemple, avec Twitter, lorsque l'utilisateur clique sur l'icône Twitter, vous voulez qu'il visite notre profil, vous voulez qu'il nous suive ou vous voulez tweeter sur la page en question. Dans mon cas, je vais définir ça pour être, suivez-moi sur Twitter. Ensuite, ajoutez dans mon handle Twitter. Jusqu' à YouTube, nous pouvons également insérer l'URL YouTube, que vous allez lier à votre page YouTube. Vous pouvez également autoriser les gens à s'abonner directement à votre chaîne aussi, enregistrer l'option sur. Ensuite, le troisième est où ces boutons seront-ils affichés ? Nous pourrions les laisser flotter sur les pages du site. Nous définissons la position de ces icônes pour être dans les coins supérieurs ou au centre de notre site. Nous pourrions également ajouter une marge en haut à droite, en bas ou à gauche. C' est un espacement qui poussera sur les icônes de n'importe quel côté particulier. Ceci est peut-être utile si ces boutons couvrent un certain contenu et que nous voulons juste affiner les mises en page afin qu'elles ne couvrent pas les informations importantes. Nous pouvons également vérifier autant de ces options que nous le souhaiterions. Si vous le souhaitez, nous pouvons également placer ces boutons dans un widget. Cela permettra au widget de médias sociaux d' être glissé dans l'un de nos thèmes, zones de widget. Je vais décocher ça car on n'en a pas besoin. L' option suivante consiste à placer via un shortcode. Nous n'avons pas encore couvert un shortcode, mais il s'agit d'un petit extrait de code que vous pouvez placer dans n'importe lequel de nos articles de blog ou pages. Nous allons également examiner cela plus tard, mais pour l'instant, nous pouvons l'insérer en copiant le code à l'intérieur de ces crochets. En copiant cette section, nous pouvons placer nos widgets dans n'importe quelle page ou publication. Voyons cela en action en enregistrant. Nous pouvons aller sur l'une de nos pages, sélectionner l'une de ces pages et aller en édition. Ensuite, tout ce que nous avons à faire est de coller cela dans une mise à jour de bloc de texte. Ensuite, nous pouvons consulter notre page à propos de nous dans le navigateur. Descendez et en dessous de tous nos textes, nous pouvons maintenant voir ces icônes de médias sociaux ont été insérées avec ce shortcode. Ceci est vraiment utile si nous voulons inclure cela sur une page particulière, sur un billet de blog particulier. Je vais laisser ces icônes sur cette page à propos de nous car il peut être utile pour l'utilisateur de partager cette page avec d'autres. Retour au tableau de bord, cliquez sur l'icône WordPress. De retour dans nos icônes, nous pouvons maintenant terminer la configuration. À l'endroit, je vais placer le mien en haut à droite. On peut laisser le shortcode. Si vous le souhaitez, vous pouvez également placer cela dans l'en-tête du thème et également montrer cela après tous nos messages. Il y a aussi quelques paramètres optionnels juste en dessous. Par exemple, si vous voulez jouer avec la conception et l'animation de ceux-ci, vous pouvez changer l'apparence et la sensation de toutes nos icônes. Nous pouvons ajouter un compteur à côté de chacune de ces icônes et généralement adapter la façon dont celles-ci agiront sur notre site Web. Je vais laisser toutes ces options et enregistrer notre plugin sur le site. Maintenant, nous pouvons voir si nous visitons l'une de nos pages, nous avons ces icônes apparaissent en haut à droite. Nous pouvons cliquer sur l'icône Twitter, qui est un bouton de suivi, où nous sommes instantanément pris à notre profil et nous pouvons suivre directement cet utilisateur. Nous avons également un lien YouTube qui ne fonctionnera probablement pas puisque nous n'avons pas ajouté d'URL, mais vous pouvez aller de l'avant et ajouter votre propre URL ici, ou toute autre icône de médias sociaux si vous le souhaitez. Bien, avec nos icônes de médias sociaux maintenant toutes en place et mises en place. Ensuite, nous allons passer à la modification de cette page d'accueil et aussi à l'introduction de quelques widgets. 30. Blog WordPress : configuration de la page d'accueil et widgets: Dans cette vidéo, nous allons nous concentrer sur cette page d'accueil et la reconstruire à l'aide de widgets. Nous avons examiné l'utilisation de widgets tôt dans ce cours, dans l'autre projet. Les widgets, si vous vous en souvenez, sont comme un morceau de contenu autonome que nous pouvons glisser dans un endroit particulier à l'intérieur de notre thème. Avec le thème spacieux, nous avons également accès à quelques widgets personnalisés qui avaient été fournis avec ce thème. Également fourni à côté de ces widgets est un modèle de page d'accueil qui va nous permettre de réorganiser cette page d'accueil, ressemblant plus à ce que nous avons fait lors de la première consultation de ce thème sur WordPress.org. Maintenant, pour ce faire, nous allons déplacer toute cette section de blog, tous nos articles de blog, vers la page de blog personnalisée. Ensuite, cela va nous laisser un peu d'espace pour créer une nouvelle page d'accueil où nous pouvons ajouter ce nouveau modèle. Commençons à l'intérieur du tableau de bord. Nous allons descendre sur les pages et ajouter notre nouvelle page d'accueil. Donc le titre de Home. Ensuite, sur la droite, à l'intérieur de la section des attributs de page, nous pouvons sélectionner un modèle que nous voulons utiliser. Pour le moment, nous utilisons simplement ce modèle par défaut. Mais nous pouvons voir, nous avons d'autres modèles qui sont fournis avec ce thème. Celui que nous allons utiliser pour cette page d'accueil est ce modèle d'affaires, publiez ceci. Si nous nous rafraîchissons, nous voyons notre page d'accueil en haut ici. Mais comme nous l'avons mentionné tout à l'heure, nous allons en faire notre page d'accueil réelle lorsque nous visiterons la racine de notre projet. La façon de basculer autour de nos pages est de revenir au tableau de bord, vers le bas dans les paramètres. On doit se diriger vers l'option de lecture. Au lieu de notre page d'accueil, est d'apporter nos derniers messages, nous allons changer cela pour être une page statique qui est la page d'accueil nouvellement construite. Ensuite, déplacez tous les messages vers notre page de blog personnalisée. Sauvegardez nos modifications. Vérifions que tout cela a pris effet à l'intérieur du navigateur. Bien. Voilà notre page d'accueil. Nous n'avons pas encore de contenu, mais nous reviendrons sur ce blog. Nous verrons que nos articles de blog ont maintenant été déplacés vers ce lien de blog. Pour construire cette page d'accueil, nous allons ajouter quelques widgets. Tout comme précédemment, nous allons à la section Apparence dans la section Widget, puis nous pouvons glisser sur l'un de ces widgets disponibles dans les zones de widget de thèmes. Ce thème particulier a également quelques widgets personnalisés, aura tous les widgets personnalisés commençant par ATG. Nous savons quels sont ceux qui sont fournis par ce thème réel. Nous avons les icônes de médias sociaux qui ont été fournis par le plug-in, et puis la plupart de ceux ci-dessus sont juste des widgets WordPress généraux qui sont toujours disponibles jusqu'à ce que vous construisez cette page d'accueil. C' était les modèles d'affaires. Nous allons utiliser ces quatre sections commerciales. En commençant par le top de l'entreprise. La section du milieu est divisée entre la gauche et la droite, alors nous avons une section inférieure. Du haut, ouvrez ceci, et nous pouvons voir quel type de widgets convient à cette zone. Celui que je vais utiliser est ce TG Services. Comme vous pouvez le voir, ceci est utilisé pour afficher certaines pages en tant que service. Déposez ceci dans la section supérieure, puis nous allons lier ceci pour libérer de nouvelles pages. Nous n'avons actuellement aucune page qui affiche les services du site Web, donc ce que nous allons faire est d'aller sur nos pages, ajouter trois nouvelles pages. Le premier sera pour la conception et le développement web. Ensuite, nous allons juste ajouter un texte simple juste en dessous. Je vais dire que nous créons des designs réactifs époustouflants en utilisant WordPress. Vous pouvez placer dans n'importe quel texte que vous voulez à l'intérieur d'ici, et vous pouvez également voir en bas, nous avons une section sur les réseaux sociaux qui avait été ajoutée à l'aide du plug-in. C' est une fonctionnalité premium donc nous allons juste ignorer cela. Si vous voulez supprimer cela, vous pouvez cliquer sur ces paramètres en haut, descendre aux préférences, puis nous pouvons fermer le panneau des médias sociaux. Maintenant, revenons à notre page, nous allons juste ajouter une image en vedette pour cette section, puis placer l'icône WordPress. C' est notre image en vedette, puis publier. C'est tout ce qu'il nous faut faire. Maintenant, si nous revenons à nos pages, ajoutez une nouvelle page, et cette seconde sera pour l'image de marque. Ensuite, quelques textes dans le bloc juste en dessous, je vais dire laissez-nous prendre soin de tous vos besoins de branding. La section de la page contient l'image en vedette. C' est l'icône du crayon. Définissez ceci, puis publiez. La troisième et dernière page sera pour le service de développement mobile. Ajoutez une troisième page avec le titre de Mobile Development. Ensuite, un texte que je vais dire, nous créons des applications mobiles personnalisées étonnantes pour tous les appareils. Retour à l'onglet de la page sur l'image en vedette, celui-ci va être pour l'icône Android. Publié ceci. Maintenant, si nous revenons à nos Widgets sous Apparence, nous pouvons ajouter ces trois nouvelles pages à nos Services TG. Nous avons le design web, nous avons l'image de marque, le développement mobile, et ensuite nous pouvons enregistrer ce widget. Avant d'aller plus loin, actualisons la page d'accueil. Cliquez sur Logo. Nous allons maintenant voir nos trois pages dans cette zone de widget. Juste en dessous de cela, nous allons à la prochaine section Appel à l' action qui va inviter l'utilisateur à entrer en contact. Pour ce faire, nous avons un widget d'appel à l'action qui est juste ici. Faites glisser ceci ci-dessous et à l'intérieur de la même section. Le texte principal de l'appel à l'action sera  : « Besoin de parler à quelqu'un de vos idées ? Ensuite, les textes supplémentaires de, « Entrez en contact aujourd'hui. » Cela va également avoir un bouton sur lequel l'utilisateur peut cliquer et dira : « Entrez en contact. » Ensuite, nous voulons également que ce bouton redirige vers un certain lien. Maintenant, juste avant de faire ça, on va sauver ça. Nous voulons que ce lien vers la page Contactez-nous. Pour obtenir le lien vers la page Contactez-nous, nous devons passer à l'onglet Pages, dans Contact. Ensuite, on peut prendre le permalien de la barre latérale. C' est toute cette section juste ici. Si nous cliquons dessus, nous pouvons alors récupérer l'URL vers les widgets dans la barre latérale, puis coller dans notre permalien. Sauvegardez ceci et testons ceci. Rafraîchir. Nous avons notre appel à l'action. Cliquez sur le bouton, et cela nous relie maintenant à notre page Contactez-nous. Rappelez-vous, cela aura un formulaire de contact plus tard, mais pour l'instant, tout fonctionne bien. Ensuite, nous avons la section centrale qui est divisée en sections gauche et droite. À gauche, je vais ajouter quelques témoignages récents, et la droite va présenter une seule page. Commençons par la gauche qui est TG Témoignage. Faites glisser ça dedans. Le titre de Témoignages récents. Ensuite, la description en bas. Placer dans n'importe quelle description de témoignage à l'intérieur d'ici. Nous pouvons alors placer dans un nom juste en dessous, et le byline qui est PDG. Enregistrez ce widget. Nous pouvons également fermer ces sections et ensuite nous irons à la section médiane droite. Celui-ci va être la seule page en vedette. Laissez tomber ça. Celle-ci va présenter l'une des pages de notre site. Pour cet exemple, je vais mettre l'accent sur la section de développement mobile. Le titre qui apparaîtra à côté de ceci est En savoir plus sur nos services de développement mobile. Ensuite, nous avons également la possibilité de supprimer l'image en vedette si nous le voulons, mais je vais laisser cela tel quel. Enfin, nous avons la section inférieure de l'entreprise qui sera pour un widget en vedette, et cela nous permettra d'ajouter quelques études de cas. Faites glisser ça dessus. Titre des études de cas. Ensuite, nous pouvons ajouter une description, je vais dire, Ici, nous allons plonger en profondeur dans certains de nos projets les plus récents pour vous montrer ce qui se passe dans les coulisses. Ensuite, ci-dessous, nous pouvons créer un lien vers diverses pages. Maintenant, nous pourrions aller de l'avant et créer trois nouvelles pages avec quelques études de cas. Nous pourrions ajouter des textes à certaines images et créer ces pages si vous le souhaitez. Cependant, cependant, juste pour gagner un peu de temps, je vais juste lier à trois pages existantes qui est le Web Design, le Branding, et aussi le Mobile Development aussi. Vous pouvez les créer si vous le souhaitez, mais je vais enregistrer ce widget et vérifier cela dans le navigateur. Rafraîchir. Nous aurons notre section supérieure que vous avez déjà vu, nous avons la section centrale, et ceci est divisé avec la section gauche pour les témoignages, puis la page de développement mobile en vedette sur la droite. Puis, enfin, au bas, nous pouvons lier à quelques études de cas. Celui-ci est tout complet, et vous pouvez avoir un jeu avec ceci si vous aimez et le rendre plus personnel. Juste avant de terminer cela, je vais supprimer automatiquement les liens supplémentaires qui sont ajoutés à notre menu. Je vais à la section de menu sur l'apparence, nous devons sélectionner la navigation supérieure, nous pouvons supprimer le lien d'accueil, et aussi les trois pages supplémentaires. Menu Enregistrer. Notre page d'accueil est maintenant mise en place. Dans la prochaine vidéo, nous allons jeter un oeil sur la façon dont nous pouvons créer notre pied de page. 31. Blog WordPress : créer le pied de page: Faites maintenant défiler vers le bas de notre projet et travaillez sur cette zone de pied de page. Pour la zone de pied de page, nous allons également utiliser des widgets pour créer jusqu'à quatre sections différentes. Pour ce faire, nous passons au tableau de bord, dans l'apparence, et dans la section widget. L' auteur des thèmes a fourni quatre emplacements de pied de page différents. Psi bar 1 est terminé en bas à gauche, puis deux, trois et quatre. Tout comme lorsque nous avons utilisé des widgets dans le passé, nous pouvons glisser-déposer n'importe lequel de ces widgets dans nos quatre zones de widget différentes. Vous n'avez même pas besoin d'utiliser les mêmes que je vais utiliser. Barre latérale 1, qui est sur le bas à gauche, nous voulons faire glisser dans le widget pages. Tirez ça. Comme nous pouvons le voir ici, il s'agit d'une liste des pages de votre site, mais c'est essentiellement comme un menu où l'utilisateur peut cliquer sur toutes les pages et ensuite être amené à la page complète. Nous pouvons ajouter un titre facultatif si nous le voulons. Nous pouvons également résoudre ces pages par le titre, l'ordre des pages qui est disponible lorsque nous allons à l'écran d'édition des pages, ou même l'ID de page. Cet ID de page peut également être utilisé juste en dessous de deux si nous voulons exclure certaines pages que nous ne voulons pas afficher dans cette section. La façon de saisir l'ID d'une page est si nous allons dans le lien de nos pages, cliquez dessus. Si nous cliquons sur l'une de nos pages ou même aller dans l'écran d'édition, nous pouvons voir l'ID des pages apparaître dans l'URL. Celle-ci est en 1872. Essayons un autre pour nous contacter. C' est 1874, mais la vôtre peut être une carte d'identité complètement différente de la mienne, et c'est tout à fait bien. La même chose aussi si jamais nous avons besoin d'accéder à l'un des messages ID, nous pouvons cliquer dessus. C' est l'ID numéro un. Essayons un de plus. C' est 1788. C' est vraiment pratique si vous avez besoin de connaître le message ou l'ID de la page. Je vais aux widgets. Tout cela est sauvegardé et c'est tout ce dont nous avons besoin pour notre barre latérale 1 dans la barre latérale 2. Je vais glisser et déposer sur un widget de calendrier. Ceci est un calendrier des publications de notre site. Si vous avez un billet de blog disponible à une certaine date, cela devient alors un lien à l'intérieur du calendrier où l'utilisateur peut cliquer sur et être amené à n'importe lequel des publications de ce jour particulier. On verra à quoi ça ressemble dans un instant. Nous pouvons ajouter un titre facultatif, mais je vais juste laisser cela par défaut car c'est assez explicite. Mise en mémoire tampon du site, celui-ci va être occupé par quelques boutons de médias sociaux. C' est le plugin ultime des médias sociaux. Faites glisser ça dessus. Celui-ci a été généré quatre lignes à partir de notre page de médias sociaux. Nous pouvons aller à cette page si nous voulons ajuster l'une des préférences avec ce lien. Nous pouvons aussi changer le titre, mais c'est bien. Sidebar 4 qui se trouve en bas à droite de notre page. Je vais faire glisser quelques commentaires récents. Maintenant, les commentaires récents ne sont que les commentaires qui avaient été placés sur nos articles de blog. Par défaut, ce sont les cinq messages les plus récents que nous pouvons ajuster, mais cinq sont bien pour l'instant. Tous ceux-ci sont automatiquement enregistrés, donc si nous passons au navigateur, actualisez la page. Le premier bloc est nos pages et nous pouvons cliquer sur l'une de ces pages pour l'amener à la page complète. Nous avons une section de calendrier et nous pouvons cliquer sur n'importe lequel de ces jours et voir n'importe quel billet de blog disponible pour ce jour particulier. Nous pouvons également faire défiler en arrière et en avant à travers les dates et voir la vue du calendrier pour chaque mois. La section des médias sociaux, principalement le Twitter et aussi les liens YouTube que nous avons créés précédemment. Ensuite, enfin, les cinq commentaires les plus récents, lesquels vous pouvez également cliquer si nous le voulions. Maintenant, nous avons une section de pied de page. Nous pourrions également supprimer les liens de pied de page vers le bas, mais c'est bien pour notre utilisation. Juste une dernière chose dans le personnalisateur est peu d'options pour ce thème particulier pour personnaliser le pied de page. Les seules options que nous avons si nous allons au lien de pied de page est de modifier le nombre de zones de widgets. Nous sommes actuellement définis sur la valeur par défaut, qui est quatre, mais nous pourrions également réduire cela à vous trois, deux ou un si nous préférons si nous avons moins de contenu à placer dans le pied de page. 32. Blog WordPress : ajouter un curseur: Plus tôt dans le cours, nous avons ajouté deux images d'en-tête différentes affichées juste en dessous de cette section logo. Ces deux images s'afficheront au hasard, donc nous pouvons obtenir une image différente chaque fois que nous rechargeons cette page. Dans cette vidéo, nous allons vous montrer comment nous pouvons utiliser ces mêmes images, ou vous pouvez même choisir des images différentes si vous préférez. Mais nous allons les incorporer dans un curseur. Comme avec beaucoup de choses, WordPress a beaucoup et beaucoup de différents plugins de curseur, que nous pouvons intégrer dans notre site ou ce thème réel est livré avec son propre outil de curseur, qui est vraiment simple à utiliser. D' abord, nous devons aller dans le customizer. C' est l'une des options à l'intérieur de l'apparence et du personnalisateur. Ensuite, nous verrons que nous avons cette option de curseur juste ici. Entrez ici. La première option est que nous avons réellement besoin d'activer le curseur. Donc, nous allons cliquer dessus et puis nous avons l'option si vous voulez que ce curseur apparaisse dans notre page de publication. Nous n'avons pas vraiment besoin du curseur pour apparaître lorsque nous voyons le billet de blog. Donc je vais décocher ça. Eh bien, c'est totalement à vous de décider. Puis en dessous, nous ajoutons notre contenu, qui est les images. Pour afficher dans notre curseur, nous pouvons sélectionner une image à partir de la médiathèque ou télécharger une image totalement différente. Je vais rester avec ces deux mêmes images que nous avons déjà utilisées dans l'en-tête. Vous pouvez voir tout de suite que cette image est apparue encore en dessous de l'en-tête, mais cette fois nous avons aussi un bouton Read More. Nous pouvons également superposer quelques textes juste au-dessus cet outil en ajoutant un titre et aussi une description. Donc, le titre de celui-ci sera Mobile Development. Nous pouvons voir ces mises à jour dans l'aperçu. Sur la ligne ci-dessous, nous pouvons également ajouter un outil de description. Je vais dire de la conception à l'App Store. Si vous le souhaitez, vous pouvez également modifier le texte du bouton Lire la suite. abord, je vais laisser ceci tel quel, mais cela va aussi faire un lien vers une certaine page. Puisque cette image particulière dans cette section est pour le développement mobile, il serait logique de lier à notre page mobile. Pour ce faire, si nous allons sur notre site, puis si nous cliquons sur le « Développement mobile », tout ce que nous avons à faire est de saisir le lien de page, qui est la section juste après cette première barre oblique avant. Commandez ou contrôlez C pour copier ceci, puis collez-le à l'intérieur de notre lien. contenu du curseur 2 est réveillé à notre deuxième image pour faire pivoter entre. Encore une fois, je vais utiliser le même que l'en-tête. Un titre de Web Design & Development. Une description, ce sera le développement WordPress des experts. Nous avons également besoin d'un lien vers cette page, qui est la page Développement Web. Pour revenir à notre page d'accueil, nous pouvons cliquer sur le « Web Design and Development », lien, puis saisir le lien vers cette page, coller ceci dans. Oups, mauvais. Collez ceci dans le numéro 2 et comme vous pouvez le voir, vous pouvez aller encore plus loin en ajoutant plus d'images juste en dessous de deux. Donc, bien sûr, nous ne voulons pas le curseur et aussi l'image d'en-tête en même temps. Donc, ce que nous pourrions faire est de retourner à la section Image d'en-tête, ou nous pouvons cliquer sur cette icône de crayon pour aller directement dans notre section. Cachez cette image et puis nous avons juste le curseur pris effet. Publier. Passez à l'extrémité avant et actualisez. C' est notre curseur. Cela bascule entre nos deux images disponibles. Essayons si ces liens fonctionneront. Il s'agit de la page Web Design and Development. Celui-ci est très bien. Retour à la page d'accueil. Notre lien de développement mobile fonctionne aussi. Donc, tout cela fonctionne maintenant et c'est à quel point il est rapide et facile d'ajouter un curseur. Dans la vidéo suivante, nous allons travailler sur notre page Contactez-nous et remplacer ce texte brut par un formulaire de contact. 33. Blog WordPress : créer le formulaire de contact: Hé, bienvenue. Dès le début, lorsque nous avons créé nos pages en haut, je vais passer la souris sur la page À propos de nous. Cela révélera alors une page Contactez-nous. Nous avons dit tôt que nous venons de mettre quelques exemples de lignes d'adresse juste ici et ensuite nous allons revenir à cette page et ajouter un formulaire de contact de travail. C' est ce que nous allons faire dans cette vidéo. Cela sera rendu disponible en ajoutant un plugin appelé Formulaire de contact 7. Cela nous permettra d'ajouter autant de champs différents que nous le souhaiterions ici. Cela permettra de saisir les entrées de l'utilisateur telles que le nom d'utilisateur, l'adresse e-mail, un message, éventuellement toute adresse ou numéro de téléphone, et tout cela peut être soumis avec ce formulaire. Vous l'avez deviné, revenons au tableau de bord, et à partir de là, nous allons dans la section plugin. Comme vous pouvez l'imaginer, il y a beaucoup et beaucoup de différents plugins qui peuvent faire des formulaires de contact, mais je vais utiliser un formulaire populaire appelé Contact Form 7. Nous pouvons ajouter cela comme un nouveau plugin en haut, alors si vous voulez peut-être disponible dans certains des onglets comme un populaire que vous voyez ici. Si ce n'est pas le cas, vous devrez le rechercher avec la boîte de recherche en haut. C' est le formulaire de contact particulier que je vais utiliser, alors installons ceci. Comme nous pouvons le voir, il a été régulièrement mis à jour et également compatible avec cette version actuelle de WordPress. Activer, et cela va maintenant nous donner une option dédiée à l'intérieur de la barre latérale. Cliquez dessus et cela révélera ensuite tous les formulaires de contact que nous avons actuellement disponibles pour notre site. Nous avons juste celui-ci qui est créé automatiquement pour nous, et nous pouvons aller de l'avant et ajouter autant de formulaires de contact différents que nous le souhaiterions. Nous pouvons en avoir une autre pour différentes sections de notre site, et chacune peut collecter des informations différentes. Au lieu d'éditer celui-ci, je vais ajouter de nouveaux en haut et ensuite donner à ce formulaire de contact un nom descriptif. Je vais dire Contactez-nous formulaire, puis ci-dessous, nous aurons la mise en page de notre formulaire. Maintenant, si vous ne connaissez pas de codage et que ça a l'air un peu fou, ne vous inquiétez pas pour le moment. Si nous examinons de plus près chacun de ces domaines, cela ne devrait pas être trop difficile à comprendre. Chacun d'entre eux est une entrée de formulaire différente. Par exemple, si nous voulons collecter le nom de l'utilisateur, l'e-mail de l'utilisateur, et nous avons une section pour le sujet de l'e-mail, puis nous avons le message qui va être envoyé à l'administrateur. Celui-ci, par exemple, comme le reste d'entre eux, est entouré dans l'étiquette , puis le texte qui va apparaître à côté de chacune de ces entrées. Celui-ci est également facultatif contrairement aux trois ci-dessus, ce qui signifie que ce formulaire peut être vide lorsque celui-ci est soumis. Ensuite, à l'intérieur des crochets, nous avons le type d'entrée de formulaire qui est actuellement utilisé. Ne vous inquiétez pas de tout cela car nous pouvons générer chacun d' automatiquement en utilisant ces options en haut. Par exemple, si nous voulions créer une nouvelle entrée de texte, collecter une adresse e-mail, si nous voulons rassembler un numéro de téléphone, une date, une zone de texte, des cases ou des boutons radio, tout cela peut être généré en cliquant sur ces boutons juste ici. Enfin, pour un formulaire, nous avons également besoin de la possibilité de l'envoyer réellement. Lorsque toutes les données ci-dessus ont été saisies, nous avons alors besoin d'un bouton pour réellement cliquer sur, et le renvoyer à l'administrateur du site. C' est ce que fait ce bouton Envoyer ici. Je vais laisser à peu près toutes les valeurs par défaut juste ici. Ajoutons un champ supplémentaire. Ce champ va être une case à cocher où nous pouvons demander à l'utilisateur comment il a entendu parler de notre site. Donc, je vais cliquer sur la case à cocher et puis toutes les options que nous ajoutons ici aboutiront alors à une entrée de formulaire générée comme nous l'avons déjà fait. abord, nous voulons savoir s'il s'agit d'un champ obligatoire, donc l'utilisateur doit entrer une valeur à l'intérieur ici avant que le formulaire puisse être soumis. Le nom, nous pouvons laisser cela par défaut. Ceci est juste un nom unique généré. Pour ce champ particulier, nous pouvons ajouter plusieurs options où nous ajoutons une option par ligne. Chaque nom que nous ajoutons ici va générer une nouvelle case à cocher. Le premier que je vais ajouter est pour le moteur de recherche. Rappelez-vous que ces options décrivent comment l'utilisateur a entendu parler de notre site. Nous pouvons aussi dire une recommandation. Sur la ligne suivante, nous allons dire utiliser précédemment, puis le quatrième et dernier est pour l'autre. Je veux laisser tous ces paramètres par défaut juste en dessous. Je vais également ajouter un ID facultatif ou un attribut de classe à cette entrée. C' est juste pour que nous puissions cibler ce que nous avons ajouté quelques CSS. Si vous voulez appliquer un style supplémentaire, nous n'avons pas besoin de le faire, tout ce que nous avons à faire est de cliquer sur « Insérer » et ensuite nous avons généré notre nouvelle section case à cocher. Enregistrez ceci et puis une fois cela fait, nous voyons un shortcode en haut entre ces crochets. Encore une fois, c'est un shortcode comme nous l'avons utilisé dans une vidéo précédente, où nous avons cherché à ajouter les icônes des médias sociaux à l'une de nos pages ou billets de blog. Il en va de même pour notre formulaire de contact. Nous avons juste besoin de copier ceci et ensuite nous pouvons aller à nos pages et l'insérer dans notre formulaire de contact. Choisissez cette section, et je vais supprimer ce bloc particulier, juste en dessous, collez-le comme un bloc de texte. Nous pouvons alors choisir l'un de nos formulaires de contact que nous voulons afficher. C' est le contact, donc c'est tout à fait bien. Mettez à jour notre page ou vers le navigateur et actualisez sur la page Contactez-nous, je vais maintenant voir que notre formulaire est apparu. Nous avons une entrée de nom, nous avons un e-mail, nous avons le sujet, puis nos cases à cocher personnalisées que nous avons ajoutées. Ainsi, l'utilisateur peut dire comment il a entendu parler de nous ou avoir le message facultatif en bas, puis il peut le renvoyer à l'administrateur. Bien sûr, c'est un peu inutile d'avoir un formulaire Contactez-nous si le message est facultatif. Nous allons donc rapidement changer cela dans le tableau de bord. Retour dans la section Contact, nous allons modifier notre nouveau formulaire. Tout ce que nous devons faire est de supprimer ce texte facultatif juste ici et ensuite enregistrer ceci. Cela a maintenant été supprimé, en plus de créer réellement sur le formulaire de contact, il y a aussi quelques options que nous pouvons changer aussi. Nous avons plusieurs termes en haut comme le courrier. Voici quelques-unes des options pour modifier la mise en page de nos e-mails. Si un qui est placé à l'intérieur de ces crochets est effectivement certaines données qui peuvent changer. Donc c'est un peu comme une variable. Ce sont toutes les sections que WordPress injectera dynamiquement. Donc, lorsque nous recevons un e-mail de l'utilisateur final, nous voyons des choses comme le titre du site, donc nous savons exactement de quel de ces sites est envoyé. Nous recevrons ensuite les sujets et cela sera extrait du champ sujet avec toutes les autres sections, nous recevrons également l'e-mail de l'utilisateur, qui sera tiré dans le champ e-mail et nous pouvons ensuite construire le corps du message vers le bas ou changer cela autour si nous le voulions. Je ne vais pas apporter de changements à cela car c'est bien aménagé. Nous avons le champ De avec le nom et l'e-mail. Nous avons le sujet dans le champ correct, puis le message à l'intérieur de la section du corps. Une fois que nous sommes satisfaits de cela, nous pouvons également aller dans l'onglet Messages et à partir de là nous pouvons modifier tous les messages par défaut qui sont envoyés à l'utilisateur. Par exemple, lorsque l'utilisateur a posté le message avec succès sur notre site, il verra alors ce message juste ici. Nous voyons des échecs d'envoi de messages, nous voyons des erreurs de validation. C' est lorsqu'un champ particulier n'a pas été saisi ou que le type de données incorrect a été utilisé. Par exemple, si nous avons un champ numérique et que quelqu'un essaie d'entrer du texte, cela provoquerait une erreur de validation. Nous voyons également des choses comme la longueur maximale et minimale de l'entrée, qui est autorisée, et beaucoup plus d'autres options pour changer tout le texte par défaut. Enfin, nous avons les paramètres supplémentaires où nous pouvons aller sur site du formulaire de contact et tirer dans toutes les options supplémentaires si nous le voulons. Je veux laisser ceci tel quel et enregistrer notre formulaire de contact, mais c'est un plugin vraiment utile pour collecter des informations sur notre site. N' oubliez pas que vous pouvez créer plusieurs formulaires Contactez-nous et les placer dans différentes sections. 34. Blog WordPress : améliorer le référencement: Il ne sert à rien de mettre beaucoup d'efforts pour rendre notre site vraiment bon et avoir beaucoup de contenu incroyable si aucun utilisateur ne peut le trouver à partir des moteurs de recherche. Nous avons mentionné plus tôt dans le cours que WordPress par défaut est assez convivial pour les moteurs de recherche. Cependant, comme tout, il y a toujours place à l'amélioration. Dans cette vidéo, nous allons couvrir un grand plugin appelé Yoast SEO, qui prend notre base WordPress SEO à un autre niveau. Si vous voulez tirer de ce que le SEO est, il doit tomber l'optimisation des moteurs de recherche. C' est essentiellement le processus d'optimisation de notre contenu sur notre site Web pour apparaître plus haut dans l'ordre des résultats des moteurs de recherche. Nous optimisons les mots-clés, les descriptions et optimisons également des choses comme nos articles de blog. Le plus pertinent dans les moteurs de recherche est le plugin aide vraiment en mettant en évidence toutes les choses que nous faisons bien et toutes les choses sur lesquelles nous devons améliorer, comme tous nos mots-clés, nos descriptions, le longueur de notre contenu, et les images alt texte. Cela peut également aider avec quelque chose appelé métadonnées, c' est-à-dire les informations sur nos sites rendues visibles par les moteurs de recherche. Vous pouvez également générer des sitemaps et les soumettre à Google, avec tant d'autres choses. Passons à la section plugin où nous pouvons rechercher ce plugin particulier. Allez à ajouter un nouveau. Il y a de très bonnes chances que cela apparaisse dans la section populaire. Si ce n'est pas le cas, vous devrez faire une recherche pour Yoast SEO dans la boîte de recherche en haut. C' est ce dont nous avons besoin. C'est possible avec notre version de WordPress. Installons ceci, activez-le. Cela nous laissera également avec une option de référencement dans le menu aussi. Vous pouvez voir un aperçu de notre configuration ainsi que tous les problèmes liés aux notifications. Mais en général, beaucoup de choses qui vont traiter avec Yoast vont être en fait à l'intérieur de notre contenu. Par exemple, si vous allez à une page particulière, je veux aller pour la conception web. Si nous retournons maintenant dans l'écran d'édition, vôtre fournira maintenant une nouvelle section à l'intérieur de cet écran d'édition. En haut, la première chose que nous devons faire est de fournir une phrase clé de focus pour cette page. Une phrase clé focus est le mot-clé principal sur lequel vous souhaitez vous concentrer pour cette page. Il s'agit d'une page de conception web. Je vais définir la phrase clé pour être web design. Activez tout cela, nous avons vu un aperçu de la façon dont l'extérieur apparaîtra à l'intérieur d'une recherche Google. Nous pouvons également vérifier cela pour le mobile et aussi le résultat de bureau aussi. Si nous le voulions aussi, nous pourrions également jouer avec le titre SEO et aussi insérer différentes variables pour changer l'ordre et l'apparence de toutes ces données apparaîtront. Nous pouvons aussi changer cette limace si nous le voulions. [ inaudible] c'est la conception et le développement de web. On peut voir ça dans le permalien aussi. Une méta-description si nous voulions remplacer toute la description de cet aperçu. On pourrait aussi le changer à l'intérieur d'ici aussi. Comme vous pouvez le voir, cela sera automatiquement mis à jour dans notre aperçu. C' est à quoi cela ressemblera dans une recherche Google. Je vais laisser cela vide, mais c'est une bonne idée de le faire sur toutes les pages web en direct. Nous pouvons également insérer des variables telles que le titre du site, le titre de la page et aussi les catégories. Ci-dessous, nous avons une analyse SEO, qui va être une partie vraiment importante à aller pour vous. Cela nous dira quelles parties de nos pages sont bonnes pour référencement et quelles pièces ont besoin d'être améliorées. Au fond, nous voyons que nous avons ces feux verts. C' est la bonne section. Nous avons une bonne terre à partir de la phrase clé. Cette clé est également unique et n'est pas utilisée dans d'autres pages ou billets de blog. Nous avons le mot clé et le titre. Si nous allons au sommet, nous voyons qu'il s'agit de la conception et du développement web. Nous aurons notre mot clé juste ici. Si nous devions changer cela, juste comme ça, alors mettre à jour et actualiser. Revenons à l'analyse, nous voyons alors que cela manque et c'est aussi maintenant une amélioration recommandée. Les autres améliorations recommandées sont le texte de l'image alt. On va modifier ça à l'intérieur de la barre latérale. Sous l'image en vedette, nous cliquons dessus. Nous pouvons ensuite ajouter la phrase clé dans le texte alt. C' était la conception web, mettre à jour notre page, rafraîchir. Ce problème a maintenant été supprimé. Nous retournerons également le titre de cette page. Revenons aux améliorations. Nous avons ensuite une section rouge qui est les améliorations les plus sérieuses que nous devons apporter. Une grande partie de cela est dû au fait que nous n'avons pas de contenu sur cette page. Nous avons juste un titre et une très courte description juste en dessous. Il est également recommandé d'ajouter un peu plus de contenu tel que la longueur du texte. Actuellement, nous n'avons que sept mots, bien que le minimum recommandé soit en fait 300. Nous pourrions également utiliser une partie de ce texte descriptif et aussi le placer dans la méta description. Si nous ne faisons pas cela, comme nous le verrons ci-dessous, le moteur de recherche prendra automatiquement une section de cette page pour nous. Cette section qu'il saisit peut ne pas être le contenu exact que nous voulons afficher. Tout ce texte devrait également contenir notre phrase clé dans le premier paragraphe. Il est également recommandé d'avoir des liens internes et externes aussi. Nous devrions ajouter des liens vers d'autres pages sur notre propre site et également idéalement des liens vers d'autres sites web aussi. Après cela, une fois que nous aurons traversé toutes ces améliorations, nous aurons alors une phrase clé connexe. Il s'agit d'une phrase clé secondaire que nous voulons ajouter. Mais cela n'est disponible que pour la version payante de ce plugin. Je vais quitter cette section. Ensuite, nous avons le contenu de la pierre angulaire. Pour n'importe laquelle de nos pages ou articles de blog, nous pouvons activer ou désactiver cette option. Un élément de contenu de pierre angulaire est le contenu le plus important de notre site. Par exemple, si votre site WordPress est célèbre pour ses brownies au chocolat, la page des brownies au chocolat doit être marquée comme le contenu de la pierre angulaire. Mais c'est quelque chose que vous devez décider en fonction de votre contenu. Enfin, nous avons un onglet avancé en bas où nous pouvons définir, si nous voulons, cette page particulière pour apparaître dans ces résultats de moteurs de recherche. On va laisser ça comme oui. Eh bien, on pourrait aussi l'éteindre aussi. Vous voudrez que les moteurs de recherche suivent les liens sur cette page. Nous pouvons sélectionner oui ou non. Nous avons une section avancée de méta-robot où nous pouvons affiner la façon dont nous voulons que nos méta-robots se comportent. Nous ne couvrirons aucun de ces paramètres avancés, mais vous pouvez avoir une recherche Google et en savoir plus sur les méta-robots. Enfin, nous avons l'URL canonique. Une URL canonique est un moyen de traiter le contenu en double sur notre site. Par exemple, si nous avions une boutique de commerce électronique, nous avions deux produits identiques répertoriés sur notre site. Nous devons dire à ces moteurs de recherche lequel ils devraient utiliser. Si nous ne faisons pas cela et que nous avons beaucoup de morceaux de contenu en double, moteurs de recherche croiront que nous essayons de jouer le système en dupliquant simplement les choses plutôt que de créer de nouveaux contenus. Si nous avions un magasin de commerce électronique, par exemple, et nous avions un t-shirt bleu. On aurait peut-être un nom de produit comme ça. Pour l'URL, nous pouvons avoir ceci à l'intérieur de la section chemise. Nous aurions notre nom de commerce électronique, puis l'URL qui ressemble à ceci. Mais qu'en est-il si nous mettions cette chemise bleue aussi dans une catégorie bleue ? On pourrait aussi avoir la même chemise à l'intérieur d'une catégorie cellulaire. Maintenant, nous avons trois des mêmes produits dans trois sections différentes sur notre site. Bien sûr, nous n'essayons pas de tromper les moteurs de recherche en fournissant du contenu en double de cette façon. Nous devons marquer l'un de ces éléments de contenu comme le principal que vous voulez afficher. Pour cela, nous devons laisser ceci vide pour le contenu principal. Ensuite, pour les deux autres sections, qui était la catégorie bleue et aussi la catégorie de vente. Nous devrons ensuite pointer vers notre URL, qui était la chemise/chemise bleue. Juste pour clarifier, le contenu principal est vide, puis nous pointerons tous les morceaux dupliqués vers l'URL principale. C' est toutes les options. Nous mettrons à jour nos sites. Nous pouvons également répéter ce processus pour toutes nos autres pages ainsi que pour toutes ces pages. Nous pouvons également faire la même chose pour tous nos articles de blog. Si nous avions à l'intérieur ici, sur la droite, nous savons aussi avoir ce score SEO. Nous avons aussi un score de lisibilité ainsi que le nombre de liens de cette page. Si nous allons dans l'un de ces, nous obtenons exactement la même section SEO que nous pouvons parcourir sur chaque morceau de contenu sur notre site. C' est ainsi que nous pouvons utiliser le plugin Yoast SEO pour améliorer notre positionnement dans les résultats des moteurs de recherche. C' est quelque chose dont vous devriez vraiment être conscient, même si vous l'utilisez simplement pour cibler les gains rapides, comme l'optimisation de vos pages et publications. Il y a, bien sûr, d'autres plugins SEO, qui font aussi un bon travail. Mais c'est un très populaire que j'utilise personnellement. C' est aussi très efficace. 35. Blog WordPress : sauvegarder votre site: Si tous les soins dans le monde, les choses peuvent et font mal tourner quand il s'agit de la technologie. Si le pire devait arriver et que nous avons perdu toutes les données de notre site Web, nous voulons nous assurer que tout notre travail acharné ne soit pas perdu. Nous pourrions passer des heures, des jours, des semaines, années à créer beaucoup de contenu différent, beaucoup de billets de blog, et nous ne voulons pas que tout cela soit perdu. Il est logique de couvrir cette possibilité en créant des sauvegardes de nos sites Web. Nous avons beaucoup de plugins excellents disponibles pour le faire facilement. Il n'y a vraiment aucune excuse pour ne pas le faire. Alors que ce cas d'utilisation, nous allons également faire usage d'un autre plugin. Déconnectez-vous de la section plugin et descendez à l'Ajouter nouveau, recherchez celui que nous allons utiliser, qui est BackWPup. C' est celui que je vais utiliser, alors cliquez sur « Installer » et activez-le une fois téléchargé. Ici, nous avons également cette section BackWPup. Si nous cliquons sur cette icône, nous pouvons alors aller aux étapes à l'intérieur de cette section. La première étape consiste à vérifier l'installation, qui nous mènera ensuite à une page de paramètres. Vous pouvez voir toutes les informations sur notre site ainsi que les résultats de divers tests. Tout semble bien être à l'intérieur de cette section. Aussi si nous avons des problèmes avec ce plugin, nous devons contacter le support BackWPup. Nous pouvons également cliquer sur ce bouton juste ici pour obtenir toutes ces informations de débogage, que nous pouvons également envoyer sans question. Tout va bien ici. On ne voit aucun problème. Ensuite, nous pouvons voir tous les termes différents que nous avons en haut. La plupart d'entre eux peuvent être laissés par défaut. Mais nous pouvons également changer les choses pour changer le nombre maximum de fichiers journaux, qui se trouve à l'intérieur de l'onglet journaux. Cela signifie que nous n'enregistrerons qu'un maximum de 30 fichiers de sauvegarde. Nous pouvons également choisir de les compresser, si vous le souhaitez. À partir de là, nous pouvons également sélectionner l'endroit où nous voulons placer ces sauvegardes. Ensuite, nous avons l'emplacement par défaut qui est à l'intérieur de nos projets dans le dossier WP Content. Ensuite, à partir d'ici, nous pouvons sélectionner exactement quel dossier nous voulons stocker cela à l'intérieur. Ici, nous pouvons voir que nous sauvegardons ces à l'intérieur d'un dossier uploads. Je veux laisser cela comme standard, mais vous pouvez changer cela si vous voulez. Ensuite, revenez au tableau de bord, nous devrons passer à l'étape 2, qui consiste à créer une tâche de sauvegarde. D' abord, on donne un nom à son travail, on veut appeler ça le Weekly Backup. Ensuite, nous pouvons sélectionner exactement les éléments d'information que nous voulons sauvegarder. Nous voulons sauvegarder la base de données dans tous nos fichiers, ainsi qu'une liste de tous les plugins qui ont été installés aussi. Par défaut, nous n'avons pas vérifié les exportations XML ou les tables de base de données. C' est très bien. Ensuite, nous pouvons sélectionner comment nous voulons nommer notre nouveau fichier. Le bouton par défaut pour nos fichiers sauvegardés sera l'année, le mois, le jour, l'heure au format 24 heures. La minuscule i, qui est la représentation de la minute. Ensuite, les minuscules s, qui sont les secondes. Vous pouvez jouer avec ce nom de fichier si vous le souhaitez, mais il est déjà enregistré dans un format raisonnable. Je vais laisser ça tel quel. Le fichier zip est bien. Je vais sauvegarder cela dans le dossier uploads que nous avons vu auparavant. Mais si vous le souhaitez, vous pouvez sauvegarder cela dans différents endroits tels que Dropbox. Vous pourriez recevoir un e-mail avec la sauvegarde, ainsi que divers services Cloud que vous voyez ici, voir ceci ? Ensuite, nous avons l'onglet Planification. De là, nous allons planifier exactement quand nous voulons que cette sauvegarde ait lieu. Nous ne pouvions pas le planifier du tout et laisser cela comme manuel. Nous devons déclencher cela manuellement ou nous allons utiliser un WordPress Chrome. Cela nous permettra de planifier un jour ou une heure particulière lorsque nous voulons que ces sauvegardes aient lieu, c'est presque hebdomadaire. Nous pouvons également fixer le jour où nous voulons que cela se produise. Aussi l'heure et la minute aussi, dimanche matin est bien par moi, alors sauvegardez nos changements. Ensuite, nous avons la sauvegarde DB. Ici, nous pouvons sélectionner exactement les tables de base de données que nous voulons sauvegarder. Actuellement, toutes nos tables de base de données sont sélectionnées. Mais vous pouvez décocher l'un de ces éléments si vous ne voulez pas les inclure dans la sauvegarde, si vous n'êtes pas sûr, laissez simplement ceux-ci tels qu'ils sont. Nous avons l'onglet Fichiers à côté. A partir de là, nous pouvons choisir d'exclure tous les fichiers que nous ne voulons pas inclure dans la sauvegarde. Par exemple, si vous avez plusieurs plugins que vous ne voulez pas de sauvegarde, nous pouvons les vérifier pour exclure l'un de ces plugins. Si nous avons des thèmes que nous n'utilisons pas comme celui de 2019. Nous pourrions également vérifier l'un de ces éléments pour exclure ceux-ci des sauvegardes ainsi que tout ancien contenu des années précédentes, nous pouvons également exclure l'une de ces données également. Ensuite, nous avons les plugins, où tout ce que nous pouvons faire ici est de changer le nom du fichier et aussi ajouter la compression de fichier si nous le voulions. Dossier, nous avons déjà traité, c'est l'emplacement où toutes les sauvegardes seront enregistrées. Nous pouvons également modifier le nombre de fichiers à conserver dans ce dossier aussi. Si vous avez apporté des modifications, cliquez sur « Enregistrer », revenez au tableau de bord. Ensuite, nous allons réellement exécuter le travail créé. Cliquez sur l'étape 3. Cela nous mènera ensuite à l'onglet Jobs, où nous pouvons voir notre sauvegarde hebdomadaire. Au cours de cela, nous pouvons éditer ceci, et nous pouvons également exécuter cette sauvegarde immédiatement. Cliquez dessus et laissez-nous quelques instants pour exécuter notre première sauvegarde de notre site. Une fois que cela atteint 100 pour cent et que cela est terminé, nous pouvons voir quand c'était la dernière exécution. Nous pouvons également voir la date de la prochaine course aussi. Si vous voulez vérifier si cela a fonctionné, nous pouvons aller dans local. Allons l'ouvrir. Apportez l'administrateur principal et à partir de ce bouton, juste ici, nous pouvons aller dans nos fichiers et dossiers enregistrés. À l'intérieur de notre projet, nous devons aller dans l'application, public. Comme nous l'avons vu à partir de l'emplacement du fichier, c'est à l'intérieur du contenu WP, et nous avons créé ce dossier de téléchargement juste ici, et ici, alors nous pouvons voir une liste de tout notre contenu qui a été enregistré. Si nous allons là-dedans, c'est tout le contenu tel que nos images d'arrière-plan, nos en-têtes, notre logo. Il s'agit de tout le contenu du fichier maintenant enregistré. Parallèlement à cela, nous voyons les journaux et ensuite si nous allons dans le dossier des sauvegardes, nous voyons que nous avons une seule sauvegarde. Nous pouvons également voir cela si nous revenons au tableau de bord et cliquez sur l'option de sauvegarde, il y a confirmation de notre première sauvegarde que nous venons de créer. Nous pourrions également supprimer ou télécharger ceci si nous le voulons. Comme vous pouvez l'imaginer, sauvegarder votre site WordPress est vraiment important. C' est un moyen facile de le faire avec ce plugin. C' est maintenant la fin de ce projet et aussi cette section, donc je vais maintenant vous voir dans la prochaine section où nous voulons tout savoir sur WordPress e-commerce. 36. E-commerce WordPress : configuration du projet: Ici, nous allons avec notre prochain projet, et celui-ci va être un magasin de commerce électronique. Pour commencer, je vais créer notre nouveau site en utilisant local. Cliquez sur l'icône « Plus » en bas, et je vais donner à cela le nom du site de shirtstore. Rappelez-vous également, si vous utilisez [inaudible], configurez le projet avec les mêmes instructions que nous l'avons fait précédemment. Mais je veux procéder à l'utilisation locale. Cliquez sur « Continuer » avec les paramètres préférés, puis le nom d'utilisateur et le mot de passe, que nous allons utiliser pour vous connecter à notre administrateur. Le mien sera le shirtstore_admin. Le mot de passe. Vous pouvez utiliser les mêmes e-mails et mots de passe que vous utilisez dans le projet précédent. C' est tout à fait bien et cela vous permettra toujours de vous connecter à ces nouveaux projets sur le site. De plus, si vous utilisez un MAC comme précédemment, vous devrez peut-être ajouter un mot de passe pour terminer l'installation. Bien, nous avons tous terminé, et nous pouvons voir notre site est en cours d'exécution, et tout comme dans les projets précédents, nous pouvons cliquer sur le « Admin » pour être pris au back-end de notre site. Nous voyons shirtstore admin et aussi le mot de passe. Encore une fois, et tout va bien. Nous pouvons également cliquer sur « Open Site » et jeter un oeil à l'interface de notre projet par défaut. C' est ce que nous allons faire dans cette vidéo. Nous avons notre site sur notre installation. Dans la prochaine vidéo, nous allons présenter WooCommerce pour commencer à transformer notre site WordPress en boutique e-commerce. 37. E-commerce WordPress : commencer avec WooCommerce: Maintenant, j'ai ce magasin WordPress vide qui a le thème par défaut actuel. Pour transformer cela en magasin de commerce électronique, nous aurons besoin d'outils supplémentaires. Après cela, nous allons profiter de WooCommerce. Cela va nous permettre de transformer nos côtés de deux façons. Tout d'abord, nous utiliserons le thème de la vitrine, qui est un thème pour transformer l'aspect et l'aspect de notre site pour être plus comme un magasin de commerce électronique. Deuxièmement, par le même auteur, nous aurons également accès au plugin WooCommerce, qui nous donnera la fonctionnalité de transformer notre site WordPress en boutique e-commerce. Il fournit toutes les fonctionnalités essentielles dont nous avons besoin, comme la possibilité d'ajouter des produits, créer des frais d'expédition, ajouter des taxes, de s'occuper de notre stock, gérer notre stock, s'intégrer à les fournisseurs de paiement et tout le reste dont nous allons avoir besoin. Tout d'abord, le thème, si vous allez sur le marché, puis vers le lien du thème et à l'intérieur, nous allons utiliser les thèmes vitrine. Il y a aussi des thèmes enfants disponibles et nous allons jeter un oeil à ce qu'ils sont dans la prochaine vidéo. Bien que nous ayons besoin du cadre de vitrine et que nous pouvons l'ajouter comme le reste de nos thèmes à l'intérieur du tableau de bord. Mais pour l'instant, nous pouvons jeter un coup d'oeil sur ce qui est inclus dans ce thème. Il a à peu près tout ce que vous attendez. Il est entièrement réactif, ce qui signifie que notre magasin aura fière allure sur toutes les tailles d'écran. Il s'intègre parfaitement avec le plug-in WooCommerce. Il est convivial pour les moteurs de recherche, et il fournit généralement un excellent look et une sensation que nous pouvons utiliser comme un bon point de départ pour notre projet. Comme pour tous les thèmes, il est également entièrement personnalisable. Nous n'avons pas besoin de nous soucier d'être coincé avec le thème par défaut exact, ainsi que WooCommerce est propre [inaudible]. Il s'intègre également avec le personnalisateur afin que nous puissions facilement mettre à jour toute la marque, les couleurs, le look et la sensation, et généralement faire ressembler exactement comme je veux. WooCommerce existe depuis longtemps et il est bien développé, et il alimente également des dizaines de milliers de magasins de commerce électronique disponibles en ligne aujourd'hui. Passons à notre tableau de bord et nous pouvons d'abord commencer par installer notre thème en apparence dans la section thème sur new et rechercher vitrine. Ceci est un [inaudible] nécessaire juste ici, installez et activons ceci et vérifions ceci sur l'extrémité frontale. O2O côtés et recharger. Nous pouvons immédiatement voir que nous avons un changement à notre thème. Actuellement, tout ce que nous avons est notre page d'accueil par défaut qui montre nos billets de blog uniques et aussi cet exemple de pages ici. Actuellement, il ne ressemble pas beaucoup à un magasin de commerce électronique, mais rappelez-vous le but du thème est juste de changer l'apparence de notre contenu actuel. Pour le moment, nous n'avons pas beaucoup de pages, nous n'avons pas beaucoup de billets de blog, nous n'avons pas de produits ou quoi que ce soit comme ça. C' est quelque chose que le plugin WooCommerce va nous fournir. La deuxième partie, si vous revenez au tableau de bord, est d'installer le plugin, appuyez sur « Ajouter nouveau ». Faisons une recherche pour WooCommerce. C' est ce dont nous avons besoin ici par automatique et il a récemment mis à jour et également compatible avec notre version de WordPress. Cela va nous donner nos pages par défaut. Cela va nous donner toutes les fonctionnalités dont nous aurons besoin pour commencer. S' il y a des fonctionnalités supplémentaires qui ne sont pas incluses, si nous recherchons quelque chose de spécialiste, il y a aussi beaucoup d'autres plugins tiers que nous pouvons intégrer dans notre site. Bien, activons ça. La première chose que nous voyons est que nous sommes pris à travers certaines étapes d'installation. Nous pourrions également ignorer cela aussi parce que toutes ces options sont disponibles à partir du tableau de bord. Je vais passer par quelques étapes de configuration simples. Aussi il suffit d'ajouter quelques données fictives. Nous n'avons pas besoin d'ajouter notre adresse exacte pour le moment , mais ce qui est bénéfique est d'ajouter également le pays. C' est parce que cela permettra à WooCommerce de configurer certaines choses en fonction de notre emplacement, comme la devise et aussi certains frais d'expédition aussi. Après cela continuer ou de l'industrie, ceux-ci sont encore exploités. Nous allons créer Asia store, donc je vais cliquer sur « Fashion ». Ensuite, nous aurons une sélection de différents types de produits que nous allons mettre en vente. Ensuite, nous pouvons sélectionner le type de produits que nous allons mettre en vente. Les produits physiques sont des produits réels que nous allons expédier au client à leur emplacement. Nous pouvons avoir des téléchargements qui sont des produits virtuels, puis nous aurons également diverses options telles que les abonnements, abonnements, les réservations, les lots et aussi les produits personnalisés aussi. Cependant, ils sont tous payables, mais nous n'avons besoin que des produits physiques pour l'instant. Continuer. Je vais dire que nous n'avons pas encore de produits et que nous ne vendons pas ailleurs et décochons tous ces produits. Nous pouvons également les réactiver plus tard si nous le voulons. Comme le thème, nous allons nous en tenir à la vitrine par défaut. Nous avons également accès à différents thèmes payants et gratuits aussi. Maintenant, nous allons laisser de côté jetpack mais nous pouvons également réactiver cela plus tard. Une fois que nous avons terminé, nous sommes ramenés au tableau de bord. Comme pour la plupart des plugins, cela nous donne également beaucoup de paramètres à l'intérieur du tableau de bord. Nous pouvons gérer nos commandes, nos clients, nos coupons et divers autres paramètres que nous allons suivre au cours de ce projet. Nous avons également une option de produit dédiée deux. Maintenant, cela est activé. Revenons à notre front-end et rafraîchissons. Instantanément, nous pouvons voir que nous avons d'autres pages ajoutées à notre menu. Nous avons un panier. Nous n'avons pas encore ajouté de produits à ce panier, donc c'est vide. Nous avons également une page dédiée à la caisse. Il y a une page de compte client où nous pouvons voir des choses telles que nos commandes précédentes. Nous pouvons télécharger tous les produits virtuels que nous avons achetés. Nous pouvons gérer nos adresses, les détails de notre compte et modifier l'une de ces options au besoin. Enfin, nous avons également l'option boutique. Nous n'avons actuellement aucun produit à l'intérieur ici. Ce que nous allons faire pour nous donner un démarrage rapide, c'est d'ajouter des exemples de données. C' est juste pour des choses telles que divers produits pour nous aider à commencer avec notre magasin. Bien sûr, nous allons examiner comment les ajouter manuellement, mais pour l'instant, nous allons passer au tableau de bord dans la section outil. Ensuite, nous pouvons importer nos données. Cela utilisera l'importateur WordPress. Puisque c'est la première fois que nous allons exécuter l'importateur WordPress. Nous devons installer ceci, puis cliquez sur « Exécuter ». Ici, tout ce que nous avons à faire est de choisir notre fichier qui contient nos exemples de données, puis de vous diriger vers l'emplacement de votre projet local. Le mien est dans mon espace utilisateur, puis dans les sites locaux, dans le magasin de chemise, dans l'application, puis public. Ensuite, à partir de là, nous devons aller dans le contenu et la section plugin. Les plugins en ce moment contiennent notre importateur Wordpress, que nous utilisons couramment dans et aussi notre plugin WooCommerce. Ceci a un exemple de dossier de données qui contient ce fichier XML dont nous avons besoin pour importer nos données. Si vous utilisez maman pour cela, vous devrez aller dans le dossier maman, puis dans les documents HD, puis dans vos projets de magasin de partage. Avec cela maintenant sélectionné, nous allons télécharger ceci. Parce que WooCommerce crée des choses comme des produits pour nous, nous avons également besoin d'ajouter un auteur ou un créateur. Nous pouvons en créer un nouveau ou utiliser notre shirtstore, que nous avons déjà configuré. Cliquez sur les pièces jointes d'importation, puis soumettez. Bien, nous le faisons maintenant, nous pouvons cliquer sur le lien de ce produit et nous pouvons voir quelles données ont été incluses. J' ai beaucoup de produits différents avec nos images, nous avons nos unités de stock, qui est le code produit. Nous avons le drapeau en stock, nous avons un prix, les catégories. Nous pouvons également ajouter des balises. Aussi avec la boutique, nous pouvons présenter tous les produits à apparaître sur la première page de son site Web, sur le rafraîchissement frontal. Maintenant, parce que nous sommes sur le lien boutique, nous pouvons voir tous ces produits et maintenant afficher. Automatiquement nous avons les boutons, vous ajoutez l'un de ces produits à notre panier. Nous pouvons ensuite voir nos chariots et voir tous les produits que vous avez ajoutés. Nous pouvons modifier les détails, la quantité. Nous pouvons appliquer différents coupons. Nous avons également une page de paiement. Nous pouvons passer par l'utilisateur, peut ajouter tous les détails de facturation. Nous pouvons voir un aperçu de la commande. Actuellement, nous n'avons pas de moyens de paiement disponibles car nous n'avons pas encore mis en place. Nous allons corriger cela dans une vidéo ultérieure. Chacun de ces produits, si nous retournons à la boutique, a également une page détaillée du produit. Nous pouvons cliquer sur ceux-ci pour être pris à travers une vue détaillée complète où nous pouvons zoomer sur l'image. Nous avons des descriptions étendues, des informations supplémentaires. Nous pouvons voir tous les commentaires précédents. De plus, lorsque nous mettons en place ces produits, nous pouvons également lier ces deux produits connexes. Cela nous permettra de fournir des ventes incitatives et croisées aussi. Super, c'est maintenant notre thème et aussi notre fonctionnalité WooCommerce tous inclus avec le plugin. Aussi juste comme une note de côté rapide aussi, automatique qui crée le plugin WooCommerce, est aussi le créateur original de WordPress aussi. Nous sommes entre de bonnes mains en utilisant ce plugin. Ensuite, nous allons jeter un oeil à la façon dont nous pouvons utiliser thèmes enfants et pourquoi cela est vraiment important pour les sites WordPress. 38. E-commerce WordPress : pourquoi utiliser des thèmes enfants ?: Juste avant de travailler à apporter des changements pour la nouvelle boutique de commerce électronique, nous allons d'abord jeter un oeil à ce qu'est un enfant et aussi un thème parent. Jusqu' à présent, nous avons utilisé ce qu'on appelle un thème parent. C' est un thème complet que nous avons utilisé dans nos projets précédents, ainsi que ce thème de vitrine aussi. C' était un peu comme un thème principal ou un thème de haut niveau. D' un autre côté, un thème enfant est un sous-thème qui est basé sur un parent. Tout thème parent actuel, tel que notre équipe fonctionne, peut être utilisé comme base ou point de départ. Ensuite, nous pouvons créer un Thème Enfant qui va hériter de tout le style et la fonctionnalité de ses parents. Nous sélectionnons effectivement un thème, branchant ce thème, puis il crée toutes les modifications apportées à cette nouvelle version. Mais pourquoi voudrait-on faire cela plutôt que d'apporter toutes les modifications à ce thème principal des parents ? Eh bien, est différentes raisons différentes pour lesquelles nous voulons faire cela, et probablement la raison la plus importante est de préserver le thème original. Si vous apportez des modifications tout au long du thème à partir du tableau de bord à l'aide d'outils tels que le personnalisateur, la mise en page modifiable, les combinaisons de couleurs ou les menus modifiables, tout est très bien. Tous ces outils de tableau de bord tels que le personnalisateur, sont un moyen sûr et approuvé de modifier et de mettre à jour l'aspect et la sensation de notre thème. Cependant, si nous voulons aller encore plus loin et aller dans notre dossier de thèmes, nous pourrions ajouter de nouveaux fichiers, nous pourrions ajouter un nouveau modèle, nous pourrions mettre à jour ceux existants, et généralement apporter des changements plus étendus. Nous voulons le faire dans un thème enfant. Si vous deviez apporter l'un de ces changements dans le thème parent, cela fonctionnerait toujours complètement bien. Cependant, bien que le problème se pose, quand nous avons besoin de mettre à jour ce thème. Si les thèmes offrent créer une nouvelle mise à jour et une nouvelle version de sécurité, où apporte généralement des modifications au thème parent. Une fois que nous téléchargeons cette nouvelle version, toutes nos modifications seront perdues. Cependant, si nous utilisons ce thème comme modèle ou point de départ, nous pouvons alors apporter nos modifications à notre thème enfant, puis nous pouvons mettre à jour en toute sécurité les parents. Cela a également beaucoup d'un avantage aussi. Par exemple, c'est un bon moyen d'avoir une longueur d'avance sur la création de notre thème. Nous ne pouvons pas utiliser tous les travaux éprouvés à partir d'un thème éprouvé. Ensuite, nous pouvons le débrancher et créer notre propre version basée sur cela. Cela nous permet également de mieux organiser notre code puisque nous savons exactement où tous nos propres changements personnalisés seront stockés. Aussi, si nous le voulions, nous pourrions également créer un thème enfant différent basé sur ce thème enfant aussi. Généralement, si nous apportons des modifications importantes à notre thème, y compris les modifications à l'intérieur des fichiers et des dossiers. Nous voulons faire un thème enfant pour rendre cela beaucoup plus sûr. C' est pourquoi nous avons besoin d'un thème enfant. Ensuite, nous allons jeter un oeil à la configuration d'un thème enfant pour notre projet actuel. 39. E-commerce WordPress : configuration du thème enfant: Nous savons maintenant ce qu'est un thème enfant et quels sont les avantages d'en créer un. Pour ce projet, je vais en créer un pour la boutique e-commerce. Avant d'apporter des modifications à ce thème parent, en configurer un est assez simple. La première chose que nous devons faire est de passer à notre dossier de projet, donc je vais ouvrir Local, puis trouver l'emplacement de notre dossier. Nous pouvons cliquer sur ce bouton « Raccourci » juste ici, puis dans l'application, dans le public, le contenu, puis dans notre répertoire de thèmes. Ici, nous pouvons voir notre vitrine que nous avons téléchargée avec les thèmes par défaut que nous avons téléchargés lors de la mise en place de WordPress. Si vous utilisez MAMP, allez dans htdocs, et suivez les mêmes étapes pour accéder au répertoire themes. Nous allons créer un nouveau thème, et nous allons le faire dans un éditeur de texte. Vous n'avez pas besoin de connaître de codage pour commencer avec cela. Tout ce que nous devons faire, c'est suivre quelques étapes simples. Tout d'abord, nous allons créer un nouveau dossier qui est le nouveau dossier thématique de notre projet. On peut appeler ça n'importe quel nom que nous voulons. Donnez cette description. Je vais l'appeler l'enfant de la vitrine, que nous puissions facilement le reconnaître à l'intérieur du tableau de bord. Vous pouvez utiliser n'importe quel éditeur de texte que vous souhaitez modifier. Je vais utiliser un éditeur de codage appelé Visual Studio Code. Vous pouvez le télécharger à partir du lien sur l'écran juste ici. Il est gratuit à utiliser sur Windows, Mac et Linux. Je vais l'utiliser pour créer nos fichiers requis pour ce thème enfant. Si vous n'avez pas d'éditeur de texte, mettez cette vidéo en pause, puis téléchargez-la à partir de ce lien, puis revenez lorsque celle-ci est configurée. Je l'ai déjà installé, donc je vais l'ouvrir à l'intérieur d'une nouvelle fenêtre. Tout ce que nous devons faire pour commencer est de glisser sur notre dossier de projet. Nous pouvons voir à partir du tableau de bord que cela ouvre cela dans la barre latérale, puis nous devons créer deux nouveaux fichiers. Le premier fichier que nous devons créer, si nous survolons la barre latérale, nous pouvons cliquer sur cette icône « Nouveau fichier », ou nous pouvons aller à Fichier et sélectionner un « Nouveau fichier » à partir d'ici. Celui-ci s'appellera le style.css. CSS est un moyen d'ajouter n'importe quel style et mise en page à votre site Web. Nous n'ajouterons pas de CSS personnalisé à ce projet, mais ce que nous devons faire à l'intérieur de ce fichier style.css est d'ajouter quelques informations WordPress requises. Cette information contient certains paramètres dont nous avons besoin pour notre thème. Pour ce faire, passons au navigateur, et dirigeons vers ce lien en haut. Nous devons aller dans developer.wordpress.org/themes/advanced-topics, puis dans la section thème enfant. De là, nous voyons les informations que nous avons vues dans la vidéo précédente. Ensuite, si nous faisons défiler un peu plus loin, nous verrons comment créer un thème enfant. La première étape consiste à créer un dossier de thème enfant, ce que nous avons déjà fait pour que nous puissions ignorer cela, et descendre à l'étape 2. Étape 2, nous avons déjà créé notre style.css, puis nous verrons un exemple de cette déclaration que nous devons ajouter dans ce fichier. Après cela, nous allons « Commandement ou Contrôle C ». Juste avant de coller cela dans notre éditeur de texte, nous voyons que les informations suivantes sont requises, comme le nom du thème, que nous allons ajouter en haut. Puis aussi un modèle. Cette section de modèle est vraiment importante. Cela indiquera notre thème parent dont nous voulons hériter toutes les informations. Revenez à Visual Studio Code, collez-le en haut. Étape 1, nous allons changer le nom du thème. C' est n'importe quel nom de notre choix. Nous pouvons également ajouter un URI de thème, qui est l'emplacement du site Web du thème, si nous en avions un. On n'en a pas, alors je vais laisser ça vide. Description du thème enfant vitrine. L' auteur, placez à votre nom. Vous pouvez ajouter votre site Web si vous le souhaitez, suivi de ce modèle important juste ici. Cela va hériter de toutes les fonctionnalités du thème vitrine, alors assurez-vous que c'est correct. Nous pouvons également ajouter un numéro de version pour notre thème si nous le voulons, et une licence. Ensuite, en bas, nous voyons quelques exemples de balises. Ces balises incluent toutes les fonctionnalités disponibles avec ce thème, par exemple si vous avez des modes clair et sombre, s'il s'agit d'une mise en page à deux colonnes, si elle inclut des barres latérales, s'il s'agit d'une mise en page réactive, si elle est prêt pour l'accessibilité. Puisque celui-ci n'est qu'une démo, je vais supprimer tous ces exemples de balises. Si vous voulez ajouter vos propres balises dans ce thème, nous pouvons vous diriger vers cette URL juste ici. Nous avons pu voir toutes les balises de thème disponibles. Nous pouvons simplement aller de l'avant et créer les tags que nous voulons. Nous devons utiliser une sélection des tags de cette page. Par exemple, pour le thème, nous pouvons sélectionner un maximum de trois d'entre eux, exemple s'il s'agit d'un magasin de commerce électronique, s'il s'agit d'un magasin d'aliments et de boissons, s'il s'agit d'un portefeuille. Ensuite, en faisant défiler vers le bas, nous avons beaucoup d'autres sections. Si nous avons une certaine disposition, qui est une grille ; si nous avons un certain nombre de colonnes, si vous avez des barres latérales à gauche et à droite. Nous pouvons placer n'importe laquelle de ces balises pour indiquer à l'utilisateur quelles options de mise en page sont incluses avec notre thème. Les caractéristiques. Beaucoup de ces fonctionnalités, vous saurez déjà à partir du personnalisateur, telles que les couleurs personnalisées, les arrière-plans et les en-têtes personnalisés, les menus personnalisés, si elle prend en charge les images en vedette. Nous pouvons ajouter autant de ceux-ci à notre thème que nous le souhaiterions. Si ce thème est juste pour votre usage personnel, les tags n'ont vraiment pas d'importance, mais quand ils ont de l'importance, c'est si vous prévoyez de publier ceci dans le répertoire des thèmes sur les sites Web wordpress.org, dans le section thème. Si nous allons dans le détail de l'un de ces thèmes, c'est l'endroit où toutes les balises seront affichées. C' est là que l'utilisateur peut dire exactement quelles sont les fonctionnalités incluses avec votre thème. Revenons à Visual Studio Code, et la dernière chose à laquelle nous devons nous occuper est ce domaine de texte. Le domaine de texte est une caractéristique importante. C' est un identifiant unique pour notre thème, et il est également utilisé pour traduire notre thème également. Cela doit également correspondre au nom du dossier de notre projet, donc nous devons changer cela pour être storefront-child, puis donner à ce fichier une sauvegarde. Le fichier suivant que nous devons ajouter à l'intérieur de notre barre latérale, cliquez sur le « Nouveau fichier ». C' est le functions.php. Nous n'allons pas ajouter quoi que ce soit à l'intérieur de ce fichier pour le moment. C' est un fichier qui contient toutes les fonctionnalités personnalisées que nous voulons coder dans le thème nous-mêmes. L' extension PHP signifie juste que ce fichier sera écrit dans le langage de programmation PHP. Nous verrons ce que c'est plus tard. La dernière chose que nous devons ajouter à ce thème enfant est une image de thème personnalisée. Fourni avec ce cours est quelques images que nous pouvons utiliser pour ce projet. L' un d'eux est le screenshot.png. Il comprend également une icône de site que nous pouvons utiliser dans le navigateur, ainsi que quelques images différentes que nous utiliserons dans le curseur e-commerce au fur et à mesure de cette section. Pour inclure cela dans notre projet, ce que nous devons faire est de faire glisser sur ces captures d'écran dans la barre latérale. Cela placera cela à côté de nos fonctions et de notre style.css. C' est maintenant le strict minimum dont nous avons besoin pour notre thème enfant, donc la dernière chose à faire est d'activer cela dans le tableau de bord, donc jusqu'à la section Apparence et Thème. Voici notre thème enfant vitrine, juste ici. Nous voyons ce nom d'enfant vitrine, puisque c'est ce que nous avons mis à l'intérieur de notre feuille de style, juste ici. En outre, nous voyons notre image, qui était le screenshot.png. Allons activer ça. Maintenant, sur le frontend de notre site et rafraîchir. Nous allons voir à peu près le même site parce que nous n'avons pas ajouté de personnalisations au thème. Comme vous pouvez le voir, il semble exactement le même qu'avec le thème vitrine car il hérite de tous les styles et fonctionnalités. Juste pour confirmer que nous utilisons le thème enfant plutôt que le parent, nous pouvons passer au style.css. Nous n'avons pas besoin de connaître de CSS pour que cela fonctionne. Je vais juste ajouter quelques lignes de code, juste pour vérifier que tout est activé. abord, nous allons sélectionner la section du corps, qui est le contenu principal de notre page. Ensuite, entre les accolades, comme ça, nous pouvons définir la couleur de fond pour être égale au rouge. Maintenant, si nous enregistrons ce fichier et actualisons le navigateur, cette modification a maintenant été appliquée. Juste pour confirmer que cela n'est appliqué qu'à notre thème enfant, nous pouvons revenir au tableau de bord, et activer le parent eux. Actualiser. Ceci n'est désormais appliqué qu'à ce thème enfant. Puisque nous savons maintenant que cela fonctionne, nous pouvons supprimer cette section du corps, puis réactiver le thème enfant. Nous pouvons maintenant apporter des modifications en toute sécurité à ce thème enfant. Sachez que ça n'affectera pas le parent. Tout cela est maintenant mis en place, et nous pouvons maintenant continuer avec le reste de notre projet, mais juste un côté rapide avant de passer à autre chose. De retour dans la section thème enfant, il y a aussi une étape 3, et ceci est de mettre en file d'attente une feuille de style. A l'intérieur de notre thème enfant, nous avons créé le style.css. Comme il s'agit d'un fichier obligatoire, notre parent vitrine a également un de ces fichiers, donc l'étape 3 est un moyen de charger cette feuille de style à partir du parent. C' est quelque chose que nous devons généralement faire lors de la création d'un thème enfant. Nous avons quelques fonctions ici que nous pouvons coller dans notre functions.php. Cependant, lorsque vous utilisez le thème vitrine, c'est quelque chose qui prendra automatiquement soin pour nous. Vous n'avez pas besoin de vous diriger vers ce lien. Je veux juste vous montrer que cela a déjà été chargé pour nous, afin que nous puissions laisser cela hors de notre thème. Nous pouvons voir ici nous n'avons pas besoin d'ajouter cette fonction de file puisque ce thème de vitrine l'a déjà fait pour nous. Cela laisse maintenant notre thème enfant tout mis en place, sorte que nous pouvons maintenant continuer avec le reste du projet. 40. E-commerce WordPress : catégories de produits, étiquettes et attributs: Nous avons maintenant un thème enfant mis en place à l'intérieur de notre projet. WooCommerce, comme nous l'avons regardé plus tôt, nous donne beaucoup d'options différentes que nous avons à l'intérieur de la barre latérale. Avoir toutes ces options ici et nous avons mis en place certaines des bases lorsque nous avons installé le plugin pour la première fois. Nous allons passer en revue certaines de ces options dans les prochaines vidéos, mais pour celle-ci, nous voulons nous concentrer sur les produits et toutes les informations supplémentaires que vous aurez besoin d'ajouter à nos produits. Si nous cliquons dessus, nous pouvons voir une liste de toutes les données d'échantillon que nous avons apportées, dans une vidéo précédente, besoin de connaître tous les échantillons de produits que nous voyons à l'intérieur de notre boutique. Donc, dans la prochaine vidéo, nous allons travailler sur l'ajout de nos propres produits et comment nous pouvons les éditer. Pour cette vidéo, juste avant de le faire, nous allons jeter un oeil sur la façon dont nous pouvons ajouter toutes les informations supplémentaires dont nous avons besoin pour l'ajouter à nos produits. Cela inclut l'ajout de nouvelles catégories, nouvelles balises et également d'attributs. Cela signifie que toutes ces informations sont prêtes à être sélectionnées lorsque nous ajoutons notre propre produit personnalisé. abord dans la section des catégories, nous pouvons voir sur la droite, nous avons une liste de toutes les catégories qui ont été introduites avec nos échantillons de données. C' est juste une façon de classer nos produits, afin que nous puissions les classer dans certains groupes. Nous pouvons également les utiliser pour filtrer nos produits sur le front-end. Il est vraiment utile d'avoir tous ces éléments mis en place dans les actions en masse. Si nous cochons cette case supérieure ici, utilisant les actions en masse, nous pouvons sélectionner cette case à cocher et supprimer tout le contenu des exemples de données. Alors allez-y et créez le nôtre sur la gauche. D' abord, on donne un nom à cette catégorie et je vais aller chercher des T-shirts. C' est la catégorie principale de notre magasin. Le Slug, qui est une version conviviale URL de notre nom. Ce nom est généralement minuscule et ne contient que des lettres, des chiffres et des tirets. Allons chercher des t-shirts et cela va apparaître à la fin de notre URL. Donc, si nous cliquons sur la catégorie des t-shirts, ce serait notre URL avec des t-shirts slash à la fin. La catégorie Parent. Lorsque nous créons des catégories pour nos produits, nous pouvons les placer dans une catégorie parent ou enfant. Une catégorie Parent est le niveau supérieur, puis nous pouvons avoir diverses sous-catégories imbriquées à l'intérieur. Laissons cela comme un haut niveau. Nous pouvons également ajouter une description facultative si nous le voulons, puis aussi définir le type d'affichage. Par exemple, si nous devions cliquer sur la catégorie T-shirt, nous voulons définir ce que nous pouvons voir à l'intérieur du navigateur et nous voyons une liste de tous les produits qui relèvent de cette catégorie. Nous voyons une liste de toutes ces sous-catégories s'il s'agit d'une catégorie Parent. Ainsi, par exemple, si nous avions deux sous-catégories appelées t-shirts pour enfants et t-shirts pour adultes, verrions-nous les sous-catégories sur cette page, sur lesquelles nous pouvons ensuite cliquer et être acheminés vers les produits appropriés ? Ou au lieu de cela, nous pourrions même montrer les produits et aussi les catégories sur la même page. Je vais laisser ceci comme valeur par défaut, puis ajouter une image miniature, puis aller dans la médiathèque. Nous pourrions choisir n'importe laquelle de ces images que nous aurons ici. Je vais aller dans les images Shirt Store qui sont fournies avec ce cours, et les faire glisser dans la médiathèque. Comme les t-shirts et l'ancien texte, puis utilisez cette image pour notre catégorie, ajoutons ceci. Si vous le vouliez, vous pouvez aller de l'avant et ajouter plusieurs catégories, mais comme il s'agit d'un magasin de t-shirts, je vais juste garder cela comme une seule catégorie principale. Ensuite, jusqu'à l'option Balises. Une étiquette est juste un moyen d'ajouter des informations supplémentaires à notre produit. Donc, nous pourrions l'étiqueter avec certaines informations telles que s'il s'agit d'une gamme d'été, d'une gamme d'hiver, si c'est pour les hommes, les femmes, si c'est unisexe, si c'est une marque, et beaucoup d'informations supplémentaires dont nous pourrions avoir besoin. Le premier, allons-y pour l'été, aussi le Slug. La description facultative, ajoutons ceci. Nous n'avons pas d'autres tags sur la droite, donc ils sont tous les nôtres. Ensuite, l'hiver. Cliquez sur ceci, puis nous irons pour marque. Allons-y pour unisexe. Puis enfin, nous ajoutons mâle et femelle. C' est suffisant pour le moment et toutes ces options seront disponibles lorsque nous créerons nos propres produits personnalisés. Jusqu'aux attributs. Attributs n'est que quelques informations supplémentaires pour décrire notre produit. Sur la droite, nous pouvons voir que nous avons la couleur et la taille déjà configurées. Cela signifie que nous pouvons créer plusieurs versions d' même produit, mais la seule variante pourrait être cet attribut. Nous pouvons avoir un t-shirt, et plutôt que de créer un t-shirt en petit, moyen et grand, nous pourrions simplement créer le même t-shirt unique et créer trois versions différentes en fonction de ces attributs. Voyons un exemple de la façon dont nous pouvons ajouter ceci. Nous avons déjà la couleur et la taille qui sont utiles pour notre magasin. Ajoutons quelque chose d'autre qui est le type de manche. La différence entre notre propre coutume et ces deux qui ont été ajoutés, c'est ces termes sur la droite. La couleur a ces différentes options. Nous avons différentes tailles, mais nous n'avons pas de termes pour notre type de manches. Pour cela, nous cliquons sur configurer les termes et ajoutons nos propres options personnalisées. Pour le type de manche, allons d'abord pour les manches longues, puis Slug, et ajoutez-le à nos attributs et aussi à la manche courte. Ajoutez ceci. Maintenant, si nous revenons à nos attributs, nos termes supplémentaires, et maintenant à côté de nos attributs, allons-y en un de plus. Celle-là, allons-y pour le style, puis dans nos termes. Ce premier, nous dirons « clair ». Eh bien, c'est pour toutes les chemises, imprimées, et enfin, les rayures. De retour dans nos attributs, le style est maintenant là avec nos termes à côté. C' est tout ce que je vais ajouter pour cette vidéo. Vous pouvez ajouter plus si vous préférez. Vous pouvez obtenir les catégories, les balises et les attributs, et tous ces éléments seront disponibles dans la prochaine vidéo lorsque nous créerons nos propres produits personnalisés. 41. E-commerce WordPress : ajouter des produits: Avec tout cela en place, nous avons maintenant toutes les informations dont nous avons besoin pour aller de l'avant et créer nos propres produits pour le magasin. Vers le tableau de bord et dans l'option Produits sur la gauche. Comme nous le savons déjà, nous avons toutes ces options qui ont été créées avec les exemples de données WooCommerce. Pour modifier ou supprimer cela, tout ce que nous avons à faire est de survoler l'un de ces produits comme nous le faisons avec une page ou un billet de blog. Cela révèle ensuite les options juste en dessous. Ces produits ont également une unité de stock qui est un code produit. Nous avons un drapeau en stock juste ici, et cela est créé parce que WooCommerce permet également la gestion des stocks. Nous pouvons mettre en place une quantité pour chacun de nos articles et WooCommerce nous avertira lorsque nous atteindrons un niveau de stock bas. Prix, puis nous voyons aussi les catégories et les tags que nous avons ajoutés dans les vidéos précédentes. Nous pouvons cliquer sur cette étoile et ceci est pour un produit de fonctionnalité. Un produit en vedette apparaîtra dans un endroit spécial sur notre site qui dispose d'un espace dédié sur la première page, et nous allons jeter un coup d'oeil à cela dans un peu. Aussi la date de publication. Nous sommes intéressés à ajouter nos propres produits. Ceci est présenté de la même manière qu'un billet de blog ou une page, nous allons simplement cliquer sur « Ajouter nouveau » et puis nous pouvons ajouter notre premier nouveau produit. Je vais faire coller avec le thème des t-shirts et appeler cela un T-Shirt Ninja, et quelques informations : manches courtes et dans la couleur du gris, à l'intérieur des crochets, nous dirons que c'est la petite version. Nous pouvons ajouter une description, et cela apparaîtra à côté du produit dans la vue complète du produit. Vous pouvez créer n'importe quelle description de votre choix. Je vais dire, « Faites ressortir le ninja en vous avec ce t-shirt ninja génial en gris. Cette chemise à manches courtes est idéale pour l'été, fabriquée dans un matériau frais et léger. » faisant défiler vers le bas, nous avons toutes notre section de données produit juste ici. Tout d'abord, nous avons le type de produit qui est un produit simple. Ceci est juste une version unique d'un produit, donc un petit t-shirt, nous pourrions avoir un t-shirt moyen, et ce sont tous des produits autonomes séparés. Dans la vidéo suivante, nous allons jeter un oeil sur la façon dont nous pouvons créer automatiquement différentes versions d'une même chemise en utilisant un produit variable. s'agit d'un produit physique, il n'est donc pas téléchargeable ou virtuel, donc nous allons les décocher également. Un prix, allons-y pour 19,95$, et WooCommerce nous donne également la possibilité d'ajouter un prix de vente si nous le voulons, et de planifier cette date pour une date ultérieure. Le prochain inventaire, comme nous l'avons mentionné précédemment, nous permettra de mettre à jour nos niveaux de stock et aussi d'être alerté lorsque nous atteignons un niveau de stock bas. Si vous le souhaitez, vous pouvez garder ceci vérifié et nous pouvons définir la quantité de stock actuelle. Nous pouvons autoriser les commandes en souffrance, ce qui est un moyen pour le client commander un produit si nous n'en avons pas actuellement en stock, puis lorsque nous recevons notre stock, nous pouvons l'expédier au client. Ensuite aussi le seuil de stock bas qui est le nombre lorsque WooCommerce nous avertira si elle atteint cette valeur, alors ajoutons 10 produits différents à l'intérieur ici. On n'autorisera pas les reliquats et on gardera ça comme deux. Si vous le souhaitez, vous pouvez également limiter cette opération pour ne vendre qu'une seule quantité à la fois. Quelque chose d'autre qui est requis est un SKU et il s'agit d'un code produit ou d'une unité de conservation de stock. C' est une valeur unique pour ces produits, vous pouvez lui donner un nombre aléatoire ou un code aléatoire. Nous allons avoir un t-shirt dire, gris, et la taille de petit, qui correspond à notre description en haut. On pourrait aussi ajouter une manche courte à l'intérieur. Ensuite, nous avons l'option d'expédition où nous pouvons ajouter le poids et les dimensions et aussi ajouter une classe d'expédition si nous le voulons. Nous n'avons aucune de ces classes d'expédition configurées pour le moment, mais celles-ci sont disponibles dans les options WooCommerce. Si nous avons plusieurs produits, nous pouvons également lier cela à d'autres produits sur notre site. Nous pouvons lier cela aux produits pour les ventes incitatives et aussi aux ventes croisées. Upsells est une façon d'offrir au client un produit de plus grande valeur qui, à son tour, génère plus de revenus. Une vente croisée est lorsque nous prenons le produit actuel et offrons au client quelque chose d'autre qu'il peut également acheter, et ces articles sont tous affichés à l'utilisateur lors du processus de paiement. Les attributs quels qu'ils soient, ce sont ce que w ajouté dans une vidéo précédente. Nous pouvons ajouter la couleur, la taille, le type de manche, et aussi le style. Tout d'abord, ajoutons la couleur. C' est le menu déroulant que nous avons mentionné précédemment, je vais sélectionner la couleur grise. Si nous le voulons, nous pouvons aussi cliquer sur le bouton « Sélectionner tout ». Ensuite, nous avons la taille, c'était une petite version. Le type de manche, c'était une manche courte. Ensuite, la dernière option était le style, plain, puis enregistrez tous les attributs. Dans la section avancée, nous pouvons ajouter une note à l'utilisateur qui est envoyée après avoir acheté cet article. Cela peut être des informations supplémentaires ou des instructions de téléchargement, mais généralement quelque chose de très spécifique à cet élément. Nous pouvons vendre notre produit dans un certain ordre et nous pouvons également activer ou désactiver les avis. En bas, nous aurons une version courte de la description, apparaîtra juste en dessous du titre du produit. Copions donc la version courte de notre description complète, collez-la dans, et c'est tout le détail de notre produit maintenant en place. Sur la droite, nous avons beaucoup d'options similaires à partir des billets de blog sur les pages. Nous pouvons définir l'endroit où nous voulons que cet article soit publié, que ce soit immédiatement ou à une date fixe à l'avenir. Les catégories, c'est bien sûr un t-shirt. Nous pourrions également ajouter quelques balises supplémentaires et également sélectionner parmi les plus utilisés aussi. Dans l'image du produit, vous pouvez télécharger une image personnalisée pour cela ou sélectionner l'une des images existantes à partir d'ici. Ce produit était gris, donc je vais sélectionner le T-shirt gris, le texte alt pour cette image de produit. Nous pouvons également ajouter une galerie d'images différentes si nous le voulons. Je pense que c'est toutes les informations dont nous avons besoin. Cliquez sur publier et vérifier cela sur notre site. Rafraîchissez, assurez-vous que vous êtes sur le lien de la boutique juste ici. Faites défiler vers le bas et voici notre produit personnalisé. Nous pouvons cliquer sur cela pour être pris à travers les informations supplémentaires du titre, le prix. Celui-ci est notre courte description que nous avons ajoutée en bas. Nous avons activé le contrôle des stocks, donc nous voyons le nombre d'articles en stock. Nous pouvons ajouter ceci à notre panier et il y a toutes les informations supplémentaires telles que notre code produit, nos catégories, et la description complète en bas de page. Tout ça a l'air bien. Maintenant, allez dans le tableau de bord et dans le produit puisque c'est une chemise donc je vais enlever tous les échantillons de produits qui ne sont pas un t-shirt donc les chapeaux, casquettes, les lunettes de soleil. Nous pouvons enlever les hoodies et simplement enlever n'importe lequel de ces produits que vous ne voulez pas, votre bonnet, votre ceinture. Nous pouvons supprimer tous ces éléments avec les actions en masse. Juste avant de terminer cette vidéo, ajoutons un autre produit. Nous allons créer une version moyenne de ce même produit. Nous pouvons recommencer à partir du bouton « Ajouter nouveau », ou nous pouvons utiliser toutes ces options comme point de départ en dupliquant ce produit. Je vais supprimer la copie, et pour cela, tout ce que nous avons à faire est d'ajuster ceci pour être la version moyenne. La description est très bien, le prix est très bien. Changons ça pour être huit. L'unité de gestion des stocks doit également être modifiée pour être le support. Supprimez celui car il s'agissait d'un duplicata, puis dans les produits de lien, nous pouvons également vendre croisée ceci. Nous afficherons également la petite version au client. Tout le reste devrait aller bien alors publions ceci sur votre ancien magasin. Il y a aussi notre version moyenne, et il nous reste juste les T-Shirts à l'intérieur de notre boutique. Bien, c'est ainsi que nous pouvons ajouter un seul produit à notre magasin. Ensuite, nous allons jeter un oeil aux produits variables. 42. E-commerce WordPress : produits variables: Auparavant, nous avons ajouté deux nouveaux produits, qui était le même t-shirt dans la taille petite et moyenne. Pour ce faire, nous devions créer deux produits distincts, et cela pourrait être beaucoup de travail. Vous aurez beaucoup de variantes différentes du même article. Pour vous aider à cela, WooCommerce fournit une option de produit précieuse. Cela signifie que nous pouvons ajouter un produit de base. En utilisant cet exemple, ce serait un t-shirt ninja, manches courtes en gris, puis nous utiliserons les attributs, qui est la taille, pour créer deux versions distinctes des mêmes produits. En fait, il créerait également une grande version aussi. Cela permettrait d'économiser beaucoup de travail, mais voir cela en action dans notre tableau de bord. Tout d'abord, ajoutons un nouveau produit. Je vais aller pour le même article mais cette fois dans une couleur différente. Le T-shirt ninja, manches courtes, et cette fois, celui-ci sera en vert. Copions également la description, à partir de la description complète d'ici. Collez ceci est dans. Auparavant, nous venons d'utiliser ce produit simple, mais cette fois nous allons passer au produit variable. Pour les unités de stock, nous supprimerons la taille et les changements pour être verts. Je ne vais pas activer la gestion des stocks pour celui-ci. Nous pouvons laisser l'expédition, les produits liés. Mais cette fois pour les attributs, nous allons descendre à la taille. Dans ce cas, sélectionnez toutes nos valeurs qui sont petites, moyennes et grandes. Mais cette fois, nous voulons utiliser ces quatre variantes. Cela signifie que vous allez créer des versions gratuites du même produit dans les petites, moyennes et grandes. Donnez-nous une sauvegarde. Ensuite, jusqu'à l'option Variations. À partir de là, nous pouvons affiner les détails de chacune de nos variations. Donc notre petit, moyen et grand. Ou si nous le voulions, nous pourrions créer une variation de tous nos attributs. Pour notre plus petit, allez de l'avant et ajoutez une variation. La variation sera la taille. Ensuite, si nous cliquons dessus, nous obtenons une option déroulante. Nous pouvons personnaliser toutes les options pour un seul produit. Nous avons besoin d'un prix pour ça, 19.95. Ce sera, en fait, la même chose pour toutes nos trois versions. Mais vous pourriez rendre ça différent si vous le vouliez. Nous pouvons affiner des choses comme le stock, les dimensions du poids, et aussi l'expédition en classe aussi. Sauvegardez ça. Ensuite, allez à ajouter de la variation. Cette fois, c'est pour le médium. Cliquez sur ceci, la liste déroulante. Cela aura également besoin d'un prix aussi. Sauvegardez nos modifications. Puis enfin pour le grand, c'est juste maintenant fait. Nous pouvons également copier la courte description, coller ceci en bas. Mettez une image. Celui-ci était vert alors sélectionnez la version verte. Puisque nous n'avons pas sélectionné d'image individuelle pour notre variance libre, ce sera l'image par défaut. Sélectionnez la catégorie de t-shirt, puis nous pouvons publier ce produit dans notre magasin ou sur notre site. C' est la version verte que vous venez de créer. Au lieu de l'ajouter directement au panier, comme nous pouvons le voir avec les autres produits, nous avons maintenant la possibilité de sélectionner nos options. Nous pouvons choisir une taille, nous avons petit, moyen et grand. Ensuite, après avoir sélectionné cela, nous pouvons ensuite aller de l'avant et ajouter ceci à notre panier. Si nous avons décidé de modifier les détails de chacune de ces versions, comme un prix différent, toutes ces informations seront mises à jour lorsque nous sélectionnerons une version différente. faisant défiler vers le bas, nous avons également la description générique de toutes ces variantes ainsi que des produits quelque peu apparentés aussi. On y va. C' est ainsi que nous pouvons ajouter des produits variables à notre magasin. Cela peut vraiment nous faire gagner beaucoup de temps, nous aurons beaucoup de différentes versions d'un produit similaire. 43. E-commerce WordPress : mise en page de la page d'accueil et curseur: Bienvenue de retour. Si nous allons à notre page d'accueil en cliquant sur le titre de notre site sur le haut, tout ce lien d'accueil dans le menu. Nous sommes amenés à la page d'accueil, qui par défaut, avec n'importe quel thème WordPress, est juste une page de blog. Le départ du thème par défaut n'est pas différent de cela, donc ce que nous allons faire dans cette page d'accueil est de le transformer, ressembler plus à la boutique e-commerce. Nous allons ajouter beaucoup de nouvelles sections. Nous allons afficher nos produits les mieux notés, nos articles en vedette, nos articles en vente, différentes catégories, et bien plus encore. Pour ce faire, nous avons d'abord besoin d'une maison pour les placer. Retour au tableau de bord, et dans les pages, Ajouter un nouveau. Celui-ci sera pour notre page d'accueil. Si nous le voulions, nous pourrions construire cela avec tous les blogs que nous avons vus dans les vidéos précédentes. Nous pourrions créer toutes ces sections et si nous montons au coin supérieur, dans la section bloc, descendre. Nous avons en fait une section WooCommerce avec tous les différents blocs, qui peuvent placer dans cette page. Nous avons un contrôle total sur la personnalisation de cela. Nous pouvons ajouter des catégories, produits en vedette, nous pouvons placer dans des critiques, nous pouvons les filtrer par catégories, tags et attributs, et aussi à un filtre de prix aussi. C' est vraiment flexible et nous pouvons aller de cette façon si nous le voulons, ou une autre alternative est d'utiliser un modèle pré-construit qui vient avec ce thème. l'onglet de la page dans la barre latérale, baissez les attributs. Nous utilisons actuellement ce modèle par défaut. Mais WooCommerce fournit également un modèle de page d'accueil, que nous pouvons utiliser comme un démarrage rapide. qui est tout ce que nous devons faire, et publier cette page et aller sur notre site, rafraîchir. Nous ne voyons rien de différent pour l'instant, la seule différence est que nous avons maintenant deux liens de page d'accueil. On va arranger ça très bientôt. Comme nous le savons des projets précédents, pour supprimer les billets de blog de la page d'accueil, nous devons passer au tableau de bord, et changer cela à partir des paramètres. A partir de là, dirigez-vous vers l'option de lecture, puis nous pouvons changer cette page d'accueil pour afficher une page statique, qui va être la maison. Les messages, nous pouvons également changer cela en une section de bloc si nous voulons créer une nouvelle page aussi. Mais je vais laisser ça vide pour l'instant. Sauve ça. Maintenant, si nous retournons à notre magasin et rafraîchissons, la page d'accueil a maintenant été transformée, nous avons le titre, nous avons la section catégorie, nous avons le nouveau produit que nous avons récemment créé, recommandé, favoris, et aussi les Best Sellers en bas aussi. C' est à quoi il ressemble hors de la boîte avec WooCommerce. Mais nous voulons parfois apporter des changements à cela, et le rendre plus personnel. Par exemple, puisque nous n'avons que cette catégorie de T-shirts, nous ne voulons pas vraiment que cette section de catégorie s'affiche, et ce serait aussi bien si nous pouvions supprimer ce texte d'accueil aussi. Pour ce faire, nous pouvons ajouter un plugin par WooThemes, qui est appelé contrôle Homepage. Cela signifie que nous pouvons éditer la section, nous pouvons réorganiser les choses, et nous pouvons également supprimer toutes les sections aussi. Allez dans le tableau de bord, il est installé en tant que plugin. Ajoutons un nouveau, et recherchons le contrôle Page d'accueil. C' est le plugin dont nous avons besoin par WooThemes, installer ceci, activer jusqu'à ce que le plugin accède. Nous devons aller dans les plugins, puis dans le customizer. Personnaliseur a maintenant l'option de contrôle de la page d'accueil où nous pouvons vérifier et décocher l'une de ces sections qui veulent ajouter ou supprimer. Mais tout d'abord, le contenu de la page d'accueil, si nous décochons cela, qui va juste supprimer le titre d'accueil. C' est celui qui vient d'arriver. Nous n'avons pas besoin de ça, les catégories. Il supprime également cela jusqu'à ce que nous obtenions d'autres catégories à afficher. Les autres sont assez bien comme ils sont. Nous pouvons également les faire glisser et les réorganiser dans un ordre différent. Nous pouvons personnaliser cela pour afficher les sections dans l'ordre que vous voulez. Vous pouvez également vérifier à quoi il ressemble sur un écran plus petit. Si vous cliquez sur la vue mobile, cela réduit tous les produits à la pleine largeur de l'écran. Publions ceci, et plus sur la page d'accueil lors de l'actualisation. Tout cela est en cours de mise à jour. Une autre caractéristique populaire que nous voyons sur les magasins de commerce électronique est un curseur d'image, et cela est souvent placé juste en dessous de la section d'en-tête. Comme le projet précédent que nous avons créé, ce thème particulier n'inclut pas son propre curseur intégré, mais c'est très bien. WordPress a des centaines de diapositives que nous pouvons utiliser comme plugins. Retour sur le tableau de bord dans la section plugin et Ajouter nouveau. Vous pouvez choisir n'importe quel plugin que vous voulez, mais je vais faire une recherche pour MetaSlider. C' est un que nous avons besoin juste là, installer. Activez ce plugin et nous avons maintenant une option à l'intérieur de la barre de diapositives. En bas. Cliquez dessus. Nous avons une section de démarrage rapide et nous pouvons déposer nos images directement ici. Mais je vais créer un diaporama vide avec ce bouton juste ici. Cela devra alors ajouter plusieurs diapositives qui vont afficher nos images. Fourni avec le téléchargement d'images est deux diapositives différentes, que je vais maintenant ajouter. Mais tout d'abord, les trois pour deux sur des T-shirts simples. Nous pouvons ajouter ceci à notre diaporama. Nous pourrions entrer une légende si vous voulez ajouter du texte à superposer, mais puisque cela a déjà les étiquettes de trois pour deux sur des T-shirts simples. Je vais laisser cette image sans la légende. Nous pouvons également placer dans une URL dédiée. Si vous avez une page qui relie cela aussi. Il y a aussi des options de moteur de recherche où nous pouvons ajouter des choses comme l'ancien texte. Nous pouvons recadrer l'image, nous pouvons le réorganiser en différents endroits. C' est aussi d'autres options si nous ajoutons le pack Pro. Eh bien, c'est une mise à niveau payante. Sur la droite, nous pouvons changer la hauteur et la largeur du diaporama. Nous pouvons ajouter des effets de transition. Nous pouvons montrer les flèches, qui est la flèche sur la gauche et la droite, le commutateur entre ces images. C' est notre deuxième diapositive, qui sera l'impression gratuite sur votre première commande. Encore une fois, nous avons toutes les mêmes options, mais je vais juste laisser ceci comme valeur par défaut et ensuite enregistrer ceci. Vous placez cela dans WooTheme aura plusieurs options. Une des façons les plus simples de le faire, est d'ajouter ceci comme un widget dans la section apparence, widgets. Sur la gauche, nous voyons maintenant un widget MetaSlider, que nous pouvons maintenant remplacer dans tous les emplacements. Passez à cela, juste en dessous de l'en-tête, nous pouvons ajouter cela dans, tous à nos sites et rafraîchir. Comme notre curseur avec nos flèches, et nous avons aussi ces boutons en bas, pour basculer entre ces images, le curseur, puisque c'est la place en dessous de l'en-tête sera visible sur toutes les pages supplémentaires aussi. Mais si nous voulons filtrer cela vers le bas pour ne faire appel que sur certaines pages, comme notre maison, où nous pouvons le faire, c'est en supprimant les widgets. Ensuite, si nous revenons dans notre diaporama, en bas, nous avons une section Comment utiliser. Nous avons la version de codage, qui est de copier cette section PHP complète, et nous pouvons copier et coller ceci dans nos modèles de page. Celui-ci doit entrer dans notre thème, puis trouver le modèle exact qui contrôle la page d'accueil. Ou une autre façon de le faire sans aucun codage est de copier cette section orange au milieu. Ensuite, nous pouvons coller ceci dans n'importe quelle page que nous voulons. Je veux aller sur la page d'accueil. Ensuite, comme nous l'avons regardé dans le passé, nous le collons dans un bloc de volts. WordPress reconnaît qu'il s'agit d'un code court, savoir doit faire est de mettre à jour cette page sur notre site et actualiser sur la page d'accueil, et nous ne voyons pas le curseur apparaissant en haut. En fait, si nous faisons défiler vers le bas, nous ne le voyons nulle part sur cette page. Cela peut sembler assez déroutant, mais c'est parce que si nous allons sur le tableau de bord, puis dans le personnalisateur, plus tôt lorsque nous configurons notre page d'accueil avec son plugin de contrôle de page d'accueil, nous avons désactivé la page d'accueil contenu. C' est le contenu de la page d'accueil était de supprimer le titre de la page, et c'était tout le contenu ou tous les blocs qui se trouve à l'intérieur de notre page. Malheureusement, cela supprime également notre bloc diaporama. Si nous vérifions cela, nous pouvons voir notre curseur, mais nous pouvons également voir notre titre en haut aussi. Alors, comment faire pour avoir un curseur mais pas ce titre ? Eh bien, tout d'abord, publions. Ensuite, revenez à cette section CSS supplémentaire. Cela a quelques options différentes de la façon dont nous pouvons supprimer le titre de notre page. Si nous le voulions, nous pourrions sauter dans le thème, et faire une certaine personnalisation avec le code. Mais au lieu de cela, nous allons le faire avec un peu de CSS. CSS est juste un code que vous pouvez ajouter à la section, ce qui va changer l'apparence de notre site. Mais on fait ça. Nous devons d'abord recadrer le titre de la page, alors allez dans le tableau de bord, dans les pages et cliquez sur la section « Modifier » de notre page d'accueil. Nous devons prendre note de ce numéro de poste en haut, et ceci est l'ID de la page d'accueil. Ce que nous devons faire est un point, tiret d'identification de page, puis votre numéro de page et le mien est 76, puis l'entrée de point, titre de tiret, donc c'est notre numéro de page. Alors c'est la classe qui pointe vers le titre de notre page. Ce que nous allons faire ici, c'est de définir le type d'affichage sur zéro, point-virgule à la fin. Cela supprimera tous les titres sur cette page d'accueil seulement, publiera ceci, et reviendra sur notre site. Retournez à l'avant, et maintenant nous avons un curseur en place pour notre page d'accueil. Le titre de la page a également été supprimé. Maintenant, notre site ressemble plus à un magasin de commerce électronique. venir, nous allons jeter un oeil à autres options de personnalisation en configurant des couleurs différentes que je suis en train de marquer. 44. E-commerce WordPress : personnaliser l'apparence de notre boutique: Notre site ressemble et fonctionne maintenant comme un magasin de commerce électronique. On dirait que lorsque de nombreuses entreprises, nous voulons aussi faire cela plus personnalisé à nos propres couleurs, nos propres mises en page, et aussi généralement le rendre plus marqué à notre propre entreprise ou à notre propre image personnelle. Comme avec beaucoup de personnalisations, nous pouvons aller dans l'apparence puis dans la section personnalisée. Ici, nous allons juste ajouter quelques marques personnalisées et aussi quelques couleurs. Nous aurons beaucoup d'options différentes pour le faire sur différentes pages. Nous pouvons également ajouter un même schéma de couleurs à tous nos liens, tous nos textes et à tous nos arrière-plans pour chacune des pages. Tout d'abord, avant de faire cela dans l'identité du site, dans laquelle vous avez été avant, nous allons tout d'abord, ces changements seront majuscules, donc ce sera Shirt Store, puis le slogan qui sera juste en dessous du sous-titre. Celui-ci dit des t-shirts personnalisés et de marque. Ensuite, nous pouvons ajouter une icône de site, qui va apparaître dans le haut du navigateur. D' ici, c'est comme ce t-shirts, le vieux texte, comme ça, je découpe ça pour être la forme carrée pour tenir à l'intérieur du haut. Si nous sommes satisfaits de cela, allons de l'avant et publions ceci. Nous pouvons voir notre icône en haut, puis revenir en arrière, et nous pouvons commencer à travailler à travers le reste des options. Le suivant est l'en-tête. Nous pouvons définir une image d'en-tête, mais nous n'avons pas besoin de le faire. Je vais juste changer la couleur de fond ainsi que le texte et les liens aussi. Tout d'abord, la couleur de fond, vous pouvez déplacer ce sélecteur de couleur et choisir n'importe quelle couleur que vous souhaitez. Mais je vais aller pour la couleur qui est a4c1c4, et c'est juste cette couleur vert clair que nous voyons ici. La couleur du texte, je vais sélectionner 43454b. Ensuite, la couleur du lien vers le bas, celui-ci sera f2f2f2, qui est une couleur blanche. Publiez ceci. Puis revenez de l'en-tête dans les options principales. Le pied de page vers le bas tout en bas, gardons cela cohérent avec l'en-tête et appliquons les mêmes couleurs. L' arrière-plan, pour correspondre à l'en-tête, était la valeur de a4c1c4. Comme cette couleur de fond juste ici la couleur du texte, c'était 43454b, puis la couleur du lien, qui était f2f2f2. Publiez ceci. Ensuite, nous pouvons également adapter la couleur de ces boutons aussi. Il s'agit du bouton Ajouter au panier et du bouton Sélectionner les options pour les produits variables. Cela aura une option de boutons dédiés juste ici. Aussi, si nous voulions changer l'image d'arrière-plan ou la couleur, nous pourrions le faire avec l'option d'arrière-plan. Nous pouvons également modifier la couleur de la typographie, qui s'appliquera à l'ensemble de notre site, plutôt que seulement les sections d'en-tête et de pied de page. Pour les boutons, je vais utiliser la même couleur que nous avons utilisée en arrière-plan pour le pied de page et aussi l'en-tête. Cette couleur était a4c1c4. En outre, la couleur du texte plus claire, qui était f2f2f2. Publiez si vous êtes satisfait de ces modifications, puis revenez au menu principal. Nous avons déjà parcouru beaucoup d'autres options telles que la mise en page. Nous pouvons changer la position de la barre latérale et nous pouvons aller au contrôle de la page d'accueil, que nous avons déjà examiné. Ceci est de réorganiser ces sections et aussi d'en supprimer l'une aussi. Les menus et widgets que nous avons déjà couverts. Les paramètres de la page d'accueil, ce sont aussi les mêmes paramètres que nous avons à partir de la barre latérale. Si nous allons aux paramètres que je lis, c'est juste une chance de changer la page que nous utilisons pour la première page de notre site et aussi quelle page est utilisée pour nos billets de blog. Mais nous avons déjà défini ces options précédemment, mais nous avons également quelques clients Woo Commerce options vers le bas. Nous pouvons définir un avis de décrochage, que nous pouvons permettre d'afficher à l'écran si nous n'avons pas encore publié notre site. Nous pouvons également l'utiliser pour des messages promotionnels et aussi si nous avons certains événements à venir. Allons activer cela. Nous pouvons voir en bas, cela a été collé au bas de notre site. Ceci est également utile pour les choses qui sont des ventes, mais aussi pour informer l'utilisateur s'il y a une maintenance planifiée à l'avenir. De retour d'ici, votre catalogue de produits, beaucoup de ces options sont exactement les mêmes que nous avons à l'intérieur de la page des produits ou des paramètres Woo Commerce. Nous pouvons configurer nos pages pour afficher des produits ou seulement des catégories ou une combinaison des deux si vous avez des catégories de graphiques. Nous pouvons personnaliser le tri de ces produits, nombre de lignes que nous voulons sur la page et le nombre de produits pour chacune de ces lignes. Mais je vais garder cela par défaut. La page produit, nous avons la possibilité de rendre le bouton Ajouter au panier collant, ce qu'il est actuellement. Cela signifie qu'il va coller au haut de la page. Tu vois ça. Si nous abordons l'un de nos produits, nous ne le voyons pas pour le moment car nous avons actuellement le bouton Ajouter au panier dans notre vue. Mais si nous faisons défiler cela hors de vue, c'est la popup juste en haut ici. Cela nous donne la chance de supprimer ceci si nous ne voulons pas que cela apparaisse. La pagination. Ce sont les boutons à droite et à gauche, il est maintenu entre ces produits. On peut les décocher. Ceux-ci sont maintenant supprimés, donc nous n'avons qu'à nous concentrer sur un seul produit. Ensuite, les images du produit, nous pouvons définir comment nous voulons les images, recadrer ou télécharger de nouvelles images. Également une option pour personnaliser les champs à l'intérieur du formulaire de paiement aussi. Si vous le souhaitez, vous pouvez également créer des pages supplémentaires pour la politique de confidentialité ainsi que les termes et conditions. Mais je veux garder toutes ces options par défaut car la plupart d'entre elles sont assez standard pour un magasin de commerce électronique. Publiez toutes les modifications que vous avez apportées. Fermez ceci, et si nous revenons à notre front-end et rafraîchir. Tous les changements sont maintenant entrés en vigueur. Descendez. Nous avons les boutons et aussi la zone de pied de page aussi. De haut, notre titre latéral et notre slogan ont également été mis à jour. A noter que si la largeur de la diapositive est un problème et que vous préférez l'avoir plus large, nous ne pouvons pas changer cela sur notre page d'accueil. Les paramètres pour cela ne sont pas disponibles dans les options du diaporama car la largeur de celui-ci avait été limitée par notre bloc Gutenberg. Rappelez-vous que lorsque nous avons ajouté ceci avec notre widget, il s'agissait d'une section beaucoup plus large. Si nous allons sur notre page d'accueil et ensuite plutôt que de le coller, je vais montrer un code directement comme ça. Ce que nous pouvons faire est d'ajouter un nouveau bloc et le bloc dont nous avons besoin pour cela, nous cliquons sur l'icône plus, va être ce groupe. Ce groupe a quelques options de largeur où nous pouvons sélectionner la large largeur ou la pleine largeur de l'écran. Allons pour l'option large, puis cliquez sur cette icône plus. Vous pouvez ensuite ajouter un shortcode. Copions tout d'abord ceci, le code court, et collez-le dans, mise à jour. Si je supprime ce diaporama d'origine, haut, site automatique et actualiser. Cela nous donne maintenant un diaporama beaucoup plus large. Ensuite, nous allons examiner comment nous pouvons créer d'autres pages, mais cette fois en utilisant un outil appelé Page Builder pour créer une mise en page vraiment flexible. 45. E-commerce WordPress : mises en page flexibles à l'aide du constructeur de pages: Nous savons déjà comment créer des pages à partir du tableau de bord avec ce lien Ajouter un nouveau juste ici. Nous avons également examiné comment utiliser l'éditeur de texte Gutenberg pour ajouter de nombreux blocs de contenu différents à nos pages. Dans cette vidéo, je vais vous montrer une façon différente de créer des pages. C' est en utilisant un plugin appelé Page Builder. Revenons au tableau de bord et nous pouvons jeter un oeil à la façon dont nous pouvons ajouter cela à notre site. Tout d'abord, c'est un plugin donc Ajouter Nouveau. Ensuite, j'ai besoin de rechercher un Page Builder, qui est filtré vers le bas. C' est celui dont nous avons besoin, qui est Page Builder par SiteOrigin, installez-le, et cela va nous permettre de créer des mises en page flexibles, nous pouvons dire combien de lignes et combien de largeur chacune de ces sections va être. Ensuite, nous pouvons placer dans un autre morceau de contenu tel que des widgets, activer ceci, ainsi que les widgets standard qui viennent avec WordPress. Page Builder nous donne également quelques widgets supplémentaires que nous pouvons également télécharger. Ceci, revenez à Ajouter nouveau, faites une recherche pour l'origine du site bundle widgets. C' est ce dont nous avons besoin ici. Installez ceci. Puisqu' ils sont du même auteur, vous vous attendez à ce que ces widgets soient entièrement compatibles avec ce Page Builder. Activez ceci. On y va. Si nous allons dans l'apparence et aussi dans la zone des widgets, ici, nous avons maintenant accès à quelques nouveaux widgets SiteOrigin. Il comprend des choses comme des boutons, des carousels d'image, Google Maps, des widgets d'image, et aussi un éditeur de texte. Par exemple, nous allons créer une nouvelle page avec des pages et ajouter de nouvelles. Celui-ci est pour une page Contactez-nous. Puisque ce plugin est maintenant installé à côté de l'éditeur visuel et de texte, nous avons également accès à un nouvel onglet appelé Page Builder. Pour commencer, nous pouvons cliquer sur les « Widgets », nous pouvons ajouter de nouvelles lignes, ou utiliser certaines des mises en page pré-construites si nous le voulons. On va les retirer sur la gauche. Ensuite, je vais commencer ça avec une nouvelle rangée. Vous verrez un aperçu de toutes les modifications. Nous avons également ce bouton Live Editor se dirige vers ici. abord, ajoutons notre nouvelle ligne, je vais l'ajouter avec ce bouton juste ici et cela nous donnera la chance de réorganiser la largeur de chacune de nos sections. Nous pouvons faire un côté petit ou plus grand en cliquant sur ce bouton au centre et aussi augmenter ou diminuer le nombre de colonnes aussi. Garde ceci comme deux, qui va être uniformément espacé. Si vous voulez affiner des choses telles que le CSS, nous pouvons également donner à chacune de ces lignes des informations client, comme un ID personnalisé ou une classe personnalisée, ou nous pourrions également ajouter directement des déclarations CSS ici si nous le voulions. Nous pouvons également affiner le rembourrage sur la marge aussi. Si vous n'êtes pas sûr de la marge et du remplissage, la marge est l'espace que nous pouvons ajouter en dehors de cette ligne. Un rembourrage est l'espace qui apparaît à l'intérieur de la ligne. Nous pouvons personnaliser toutes ces valeurs sur chacun des côtés. Si nous le voulions, nous pourrions également personnaliser une valeur différente pour la mise en page mobile et aussi personnaliser la couleur de fond et l'image aussi. Je suis content de ces valeurs par défaut donc je vais insérer ceci. Ensuite, sur le côté gauche, nous pouvons ajouter quelques nouveaux widgets avec ce bouton juste ici. Nous pouvons ajouter n'importe lequel des widgets WordPress existants ou ceux-ci avec les icônes bleues, ceux qui devraient être ajoutés avec le SiteOrigin Widgets Bundle. abord sur la gauche, nous pouvons ajouter un bloc de texte qui est quelques informations sur notre adresse. Modifiez ceci. Le titre est pour notre adresse, alors nous dirons : « Vous pouvez nous trouver à », puis un deux-points. Ensuite, juste quelques exemples de lignes d'adresse à l'intérieur d'ici. Dupliquez ceci. Ligne numéro 2, ligne numéro 3. Vous pouvez également changer ceci pour être une liste si vous voulez vous en mettant en surbrillance et en cliquant sur ce bouton juste ici. Insérez ceci. Nous voyons un aperçu juste ici, et sous un second widgets de texte. Celui-ci va contenir l'e-mail et aussi l'URL de notre site Web. Modifiez ceci un titre de contacts utiles, adresse e-mail, et aussi une URL aussi. Ensuite, sur la droite, nous pouvons ajouter un widget différent, mettre en évidence cette zone dans les widgets. Sur la droite, il peut être utile d'ajouter quelque chose comme une carte Google avec l'emplacement de notre magasin. Nous pouvons aller de l'avant et ajouter ceci si nous le voulons, mais quelque chose dont vous avez maintenant besoin avec Google Maps est l'accès à une clé API. Google Maps est gratuit, mais vous devez ajouter une carte de crédit dans vos dossiers. Je ne vais pas passer par ça pour ce projet. Il peut être juste quelque chose que vous voudrez peut-être ajouter à l'avenir si vous allez vivre avec votre magasin. Vous pouvez utiliser ce lien en haut pour être dirigé vers le tableau de bord Google, vous pouvez créer un code API si vous voulez l'utiliser dans un projet. Je vais juste laisser cela éteindre, mais il peut être utile d'ajouter une carte sur la page de contact si vous avez un site qui va être en ligne. Avoir un jeu avec ces, vous pouvez regarder à travers tous les widgets disponibles. Vous pouvez aller de l'avant et créer beaucoup plus de nouvelles pages. Voyez également si c'est votre option préférée pour créer pages ou si vous préférez l'éditeur Gutenberg original. Enfin, sauvegardons ceci, cliquez sur ce lien permalien, et c'est notre nouvelle page Contactez-nous. Ensuite, nous allons également ajouter cette page Contactez-nous à notre menu. Regardez aussi comment nous pouvons réorganiser les menus aussi. 46. E-commerce WordPress : réorganiser les menus: Pour le moment, notre section d'en-tête, il a juste ce menu unique, il a tous les liens qui ont été fournis par défaut lors de l'ajout du plug-in WooCommerce. Quelques choses à savoir avec ce menu est, dans la vidéo précédente, lorsque nous avons créé notre page Contactez-nous, cela n'a pas été automatiquement ajouté. Nous avons toujours l'exemple de page que nous devons supprimer. Nous pouvons également diviser ce menu en menus plus petits si nous le voulons. Je vais diviser ça en deux menus séparés. L' un sera le menu utilisateur, qui contiendra des liens, tels que les comptes, le panier des utilisateurs, et aussi le Checkout, puis un autre menu qui sera plus une navigation sur le site, et cela contiendra des liens vers différentes pages de notre site, telles que l'Accueil, le Contact, et aussi la Boutique. Tout d'abord, passons en revue l'exemple de page à partir du lien Pages et supprimez simplement cette page unique. Puis dans Apparence et Menus. Le premier, le premier nom de menu va être le menu Navigation. Ce sera l'emplacement principal du menu. Ce sera à la place de ce menu actuel juste ici, par ce menu, et ensuite nous pouvons ajouter les pages que nous voulons afficher. Ceci, je peux tout voir et je vais aller à la page d'accueil. La page Contactez-nous, qui était une nouvelle page que nous venons de créer, ainsi que la page Boutique. Ajoutez ceci. Vous pouvez les réorganiser si vous préférez, mais je suis content de cette commande. Sauvegardez ça. Si nous cliquons sur le « Live Preview » en haut, nous allons accéder à la vue Customizer, qui a les mêmes options, où nous pouvons voir tous ces changements en temps réel. Il y a les trois nouveaux liens de menu à l'emplacement principal. Je vais maintenant créer un nouveau menu qui va être en haut de notre en-tête, et cela contiendra les liens liés à l'utilisateur. Créer un nouveau. Celui-ci sera l'emplacement du menu utilisateur. Ce sera secondaire, donc cela apparaîtra en haut de l'en-tête, et maintenant nous pouvons travailler avec l'ajout de nos liens. Ajouter des articles. Cela va également faire un lien vers certaines pages. Je vais sélectionner Mon compte, la caisse et aussi le panier. Lorsque nous cliquons dessus, ceux-ci sont ajoutés en haut de notre section d'en-tête. Nous pouvons publier ceci, et faire ces changements en direct. A l'intérieur des emplacements de menu, nous avons également ce menu de poche. Il s'agit d'un menu dédié que nous pouvons afficher sur les appareils à écran plus petit. Cliquez sur la vue Mobile juste ici. Ensuite, nous pouvons ajouter un menu de poche dédié. Retourne. Créez un nouveau menu. Voyons, Menu Mobile. C' est dans l'emplacement Handheld. Ensuite, puis nous pouvons ajouter nos articles. Veuillez sélectionner toutes les pages disponibles. Publiez notre menu. Maintenant sur l'aperçu, si vous cliquez dessus, nous pouvons voir tous les liens que nous venons de sélectionner. Vous vouliez, vous pourriez aussi les réorganiser. Il serait logique d'avoir la maison en haut. Enregistrez ces modifications. Cela se reflète maintenant dans notre menu. L' écran de la tablette, cela affiche également le même menu aussi. Ensuite, lorsque nous allons sur les appareils à écran plus grand, nos deux menus distincts s'affichent maintenant. Rafraîchissons notre boutique et vérifions que tous ces changements ont été mis à jour. On y va. Il y a nos deux menus distincts, mais dans la plupart des thèmes, nous n'avons pas besoin de nous en tenir au menu par défaut ou à l'emplacement par défaut. Nous pouvons souvent placer dans plusieurs menus à différents endroits. Ensuite, nous allons passer à l'édition de la zone de pied de page. 47. E-commerce WordPress : la zone de pied de page: Le contenu final, que nous devons ajouter à notre site est en bas à l'intérieur de cette zone de pied de page. Nous pouvons ajouter jusqu'à quatre sections distinctes dans notre pied de page, en plaçant quatre éléments de contenu distincts. La première section sur la gauche et la quatrième section sera sur la droite. Nous pouvons y placer beaucoup de contenu tels que des widgets. Nous pouvons placer des menus, des best-sellers, produits les mieux notés, et tout le reste auquel nous avons accès dans la section widget. Pour ce faire, passez au Tableau de bord et dans l'Apparence, puis Widgets. Le premier emplacement de menu de la colonne de pied de page 1 va être deux menus distincts. Nous avons déjà ces menus créés à partir de la vidéo précédente. Nous pouvons réutiliser cela à l'intérieur d'un widget aussi. Pour ce faire, faites glisser le curseur sur le menu de navigation, puis sélectionnez le menu de navigation que vous souhaitez placer à cet emplacement. abord, Menu Utilisateur, Enregistrer ceci. Nous pouvons également ajouter notre menu de navigation. Nous le faisons exactement de la même manière. Faites glisser cela sur, sélectionnez notre deuxième menu, puis actualisez la page. Voilà notre première section. La deuxième section, ce sera pour les informations d'adresse. Ça ressemblera beaucoup à notre page Contactez-nous. Colonne 2. Il s'agit d'un widget de texte. Faites glisser ceci dans la colonne 2. Tout comme nous l'avons fait avec la page Contactez-nous, le texte, Vous pouvez trouver à, puis ajouter quelques exemples de lignes d'adresse à l'intérieur ici. Copier. Ajoutez le même quelques fois de plus. Si vous le vouliez, vous pourriez aussi changer cela en une liste, mais je vais juste garder ceci comme texte normal. Sauvegardez ça. Ensuite, juste en dessous, configurez un second bloc de texte. Tout comme la page Contactez-nous, contiendra nos contacts utiles, le titre, puis notre texte, qui sera l'e-mail et aussi l'URL. Nous pouvons le récupérer à partir de notre page Contact. Voici nos deux liens en bas. Collez ceci dans et enregistrez ce widget. Nous pouvons vérifier si cela fonctionne bien, revenez à la page d'accueil. Faites défiler jusqu'au pied de page, ce qui est très bien. Maintenant, nous pouvons passer à la colonne 3. Notre zone de pied de page numéro 3, je vais faire glisser sur les produits par évaluation, qui est une liste de tous les produits les mieux notés, et la valeur par défaut de cinq est très bien. Nous chargeons. Ceci est juste une version raccourcie de chacun des produits dans l'ordre des mieux notés. Généralement, ces zones de widget sont souvent suffisantes pour nos besoins car si nous avons un cas d'utilisation beaucoup plus complexe pour chacune de ces sections, vous pouvez également utiliser le générateur de page, tout comme nous l'avons utilisé pour la page Contactez-nous. Le générateur de page a également un widget, et il est contenu à l'intérieur de ce widget Générateur de mise en page. la zone de pied de page 4, nous pouvons le faire glisser. Cette zone de widget peut être disposée exactement de la même manière que l'une de nos pages. Nous pouvons diviser notre contenu en plusieurs lignes et colonnes pour nous donner une mise en page vraiment flexible. Je veux fermer cela et supprimer ce widget, mais c'est un moyen vraiment flexible de contrôler la mise en page de nos sections. Placer une colonne supplémentaire si vous voulez, mais je vais laisser ça ici. C' est maintenant tout le contenu de notre boutique. Dans la prochaine vidéo, nous allons finaliser ce projet en regardant tous les paramètres supplémentaires fournis avec le commerce électronique, tels que l'ajout de coupons, la création de rapports, ajout de différents modes de paiement, ainsi que la flux de commandes intégré à l'intérieur de notre tableau de bord. 48. E-commerce WordPress : paramètres WooCommerce et gestion de votre boutique: Non seulement le plug-in et le thème WooCommerce, mais c'était l'occasion de construire une boutique e-commerce entièrement personnalisable. Il nous fournit également beaucoup d'outils essentiels, dont nous avons besoin pour gérer une entreprise de commerce électronique, et la plupart de ces options sont disponibles dans le tableau de bord sous l'option WooCommerce. Tout d'abord, avant de passer en direct avec n'importe quel magasin, nous devons d'abord vérifier tous ces paramètres, et nous devons également configurer notre fournisseur de paiement. Bien sûr, il est essentiel d'avoir tous les détails de l'adresse, et la plupart de ces informations ont déjà été réglées pour nous dès que nous avons passé par l'assistant d'installation. Pour l'adresse, nous devons également filtrer les sites d'expédition si nous expédions uniquement vers certains pays ou certaines zones. Nous pouvons activer les coupons, et nous allons jeter un oeil sur la façon de les créer en un instant, et aussi, nous assurer que les options de devise sont toutes correctes aussi. En plus de la devise, nous pouvons également ajouter le séparateur et le nombre de décimales afin que nous puissions affiner l'apparence de notre prix sur notre boutique. Les produits, la plupart de ces options sont explicites. Nous pouvons changer les unités de mesure, nous pouvons activer ou désactiver les avis et les évaluations, et aussi, si nous avons notre produit sur une page différente, nous pouvons également changer cela ici aussi. Les options d'expédition ou quelque chose qui est très spécifique à votre pays, ainsi que le pays dans lequel vous souhaitez expédier. Nous pouvons mettre en place différentes zones d'expédition, où nous allons attraper une certaine zone et appliquer diverses méthodes d'expédition ou des prix à cette zone spécifique. Par exemple, s'il s'agissait d'une zone difficile d'accès avec un certain code postal ou postal, nous pourrions ajouter une liste de ces régions à l'intérieur et mettre en place une méthode d'expédition dédiée pour cette zone particulière. Ensuite, en bas, nous ajoutons notre méthode d'expédition, et nous pouvons choisir parmi un tarif forfaitaire, qui est un prix fixe. Nous pouvons ajouter la livraison gratuite à cette zone particulière ou la limiter à être seulement ramassage local. Bien sûr, les paiements sont quelque chose qui est vraiment important dans un magasin de commerce électronique. Malheureusement, WooCommerce nous permet de lier trop de fournisseurs de paiement en utilisant différents plug-ins, ou nous pouvons choisir parmi ces options par défaut. Nous pouvons prendre des paiements par virement bancaire direct, nous pouvons prendre des chèques, l' argent à la livraison, ou aussi, configurer PayPal aussi, ce qui est simple à faire. Tout ce que nous devons faire est d'aller dans la section de configuration, puis configurer notre adresse e-mail PayPal, commencer à prendre nos paiements. Enregistrez ces modifications. Nous avons une zone de comptes où nous pouvons faire des choses comme configurer un paiement invité afin que l'utilisateur n'ait pas besoin de s'inscrire avant de passer une commande. Nous pouvons configurer la façon dont les comptes sont créés et modifier également le libellé de notre politique de confidentialité. E-mails, c'est là que nous configurons les notifications, vous utilisez, je suppose, à chaque étape de la caisse. Donc, s'ils ont passé une nouvelle commande, si la commande a échoué, si elle a été remboursée, nous pouvons configurer le message, qui est ensuite envoyé à l'utilisateur. Par défaut, WooCommerce a déjà des messages simples en place, mais c'est ainsi que nous pouvons changer ces messages si vous le souhaitez. L' onglet d'intégration est un moyen d'ajouter des services de géolocalisation à notre magasin, et vous pouvez les configurer avec ce lien juste ici. Enfin, il y a aussi une section avancée. Nous avons déjà examiné certaines de ces options dans le passé, comme changer nos pages. Nous pouvons les utiliser si nous voulons créer nos propres pages personnalisées et les affecter à certaines fonctions. En plus de tous ces paramètres, WooCommerce nous offre également la possibilité de gérer entièrement une boutique e-commerce. Comme vous vous y attendez, nous avons la chance de regarder à travers les commandes. C' est la page où toutes les commandes entreront lorsque nous aurons effectué une vente sur notre site. Si vous le souhaitez, vous pouvez également ajouter manuellement une commande. Pour cela, nous ajoutons simplement les détails de notre client en haut. Ensuite, nous pouvons placer dans différents articles de notre magasin. Donc produit, nous pouvons faire une recherche, sélectionner l'un de ces, puis les ajouter à notre commande. Nous pouvons créer cette commande et l'envoyer également à l'adresse e-mail du client. Nous pouvons gérer nos clients à partir de ce lien juste ici et nous pouvons voir tous les clients, qui ont été enregistrés sur notre site. Nous avons beaucoup de données sur chacun des clients, telles que leurs valeurs de commande, leurs régions, ainsi que les détails de l'adresse. Des coupons. Nous pouvons créer et gérer des coupons pour offrir à nos utilisateurs une réduction sur certains produits. C' est aussi très flexible. Nous pouvons affiner exactement à quels produits ce coupon s'appliquera. Nous pouvons définir des rabais à prix fixe, un pourcentage de réduction, un rabais sur un produit particulier ou sur le panier d'achat total. Ce coupon peut également être utilisé pour permettre livraison gratuite et nous pouvons également placer une date d'expiration aussi. Dans les restrictions, nous pouvons placer dans un minimum ou un maximum de dépenses, pour que ce coupon s'applique, ou aussi seulement l'appliquer à certains produits ou catégories aussi. En bas, cela peut également être limité à certains e-mails des clients, si nous ne voulions pas que cela s'applique à tous les utilisateurs de notre boutique. Enfin, les limites d'utilisation. Celui-ci est assez simple. Nous pouvons définir combien de fois nous voulons que ce coupon soit utilisé, et aussi limiter le nombre de fois qu'un utilisateur particulier peut utiliser ce coupon aussi. Enfin, lorsque votre magasin est opérationnel, nous voulons également avoir accès à autant d'informations que possible. Nous avons une section de rapport où nous pouvons trouver de nombreuses informations telles que nos ventes totales. Nous pouvons afficher ceci par la dernière semaine, le dernier mois, l'année dernière, ou une date personnalisée aussi. Ces données peuvent être téléchargées dans un format de feuille de calcul. Nous pouvons vérifier nos ventes par produit, les ventes par catégorie. Nous pouvons vérifier comment les coupons sont utilisés. L' onglet « Clients » nous indique le nombre de commandes pour un client enregistré par rapport à un invité. En outre, nous avons un onglet stock où nous pouvons gérer nos faibles niveaux de stock si nous avons activé cela à l'intérieur du produit. Comme vous pouvez le voir, WooCommerce est plus que la simple construction d'un magasin de commerce électronique. Il peut être utilisé pour gérer notre configuration e-commerce complète. Aussi s'il manque certaines fonctionnalités spécifiques, dont vous avez besoin, il y a souvent un plugin disponible aussi. C' est la fin de notre projet de commerce électronique, et je vous verrai maintenant dans la section suivante. 49. Les bases de PHP : introduction: Pour cette prochaine section, nous allons jeter un bref coup d' oeil à quelques bases de PHP et comment nous pouvons écrire code qui va nous aider dans les prochaines sections où nous allons commencer à créer nos propres thèmes WordPress personnalisés. Maintenant, nous n'avons pas besoin d'être un expert PHP, tout ce que nous avons à faire est d'avoir une compréhension de base. Cela nous aidera vraiment à comprendre ce qui se passe dans les coulisses et comment nous pouvons appliquer du code PHP à nos sites WordPress. Rappelez-vous, au début du cours, nous avons mentionné que WordPress est écrit dans le langage de programmation PHP. Comme nous l'avons déjà vu, si nous voulons simplement utiliser des thèmes pré-construits et des plugins pré-construits, nous n'avons pas besoin de connaître de code PHP. Mais nous allons maintenant apprendre quelques-unes des bases qui vont nous aider dans le développement de notre thème. PHP est une langue qui fonctionne sur un serveur web. Donc, juste comme tôt quand nous définissons notre WordPress qui nécessite également un serveur web à cause de cela. Nous avons aussi eu deux vidéos d'options différentes. Nous avions l'option 1, qui utilise local, et local met en place un serveur web et une base de données qui nous permettent de construire nos sites WordPress. Maintenant, local est vraiment génial pour héberger des sites WordPress, mais ce n'est pas si génial pour nous laisser jouer avec des PHP réguliers. Pour cette prochaine section, nous avons quelques options différentes. Au début du cours, comme alternative au local, nous avons également examiné comment nous pourrions mettre en place un site WordPress en utilisant MAMP. Si vous êtes venu avec cette option, vous pouvez aller dans les htdocs où vous aurez également installé vos sites WordPress. Vous pouvez aller de l'avant et créer les fichiers PHP ici, comme nous l'avons fait avec les prochaines vidéos. Ou bien, si vous n'utilisiez pas MAMP, si vous avez continué avec ce cours en utilisant local, vous pouvez utiliser une alternative qui est une aire de jeux en ligne. C' est l'un d'entre eux, qui est T-E-H puis playground.com. C' est un moyen rapide et facile d'écrire notre code PHP et de voir le résultat sur le côté droit. Dans les prochaines vidéos, nous allons écrire notre code PHP, qui commencera comme nous l'avons fait ici. Au lieu de l'écrire dans l'éditeur de texte, comme nous le faisons dans les vidéos, vous pouvez à la place écrire le code ici. On va faire quelque chose comme ça. Nous allons configurer des variables pour stocker notre nom, comme Chris, et nous ferons écho à ce nom. Ne vous inquiétez pas si cela ne semble pas familier, nous allons couvrir exactement ce que cela fait dans les prochaines vidéos. Une fois que nous avons écrit notre code PHP, comme nous le faisons dans les vidéos, cliquez sur « Enregistrer et exécuter ». Ensuite, nous verrons les sorties sur le côté droit au lieu de ce que nous faisons dans les vidéos, qui est d'exécuter cela à l'intérieur du navigateur. Juste pour résumer, pour cette section à venir, nous devons exécuter un serveur web pour exécuter notre code PHP. Si vous avez suivi le long, jusqu'à présent nous avons utilisé local. Les deux options que vous devez continuer est d'installer MAMP ou vous pouvez utiliser un terrain de jeu PHP en ligne comme nous le voyons ici. Alternativement, dès le début du cours, si vous avez choisi l'option MAMP, vous pouvez également continuer à l'utiliser si vous préférez. Jetons dans la prochaine vidéo où nous allons jeter un oeil à notre premier code PHP. 50. Les bases de PHP : Hello world: Ok les gars, donc cette vidéo est tout au sujet de commencer avec PHP. Nous allons jeter un oeil à la syntaxe PHP de base, la façon dont elle est écrite, et faire un exemple de bonjour. Pour commencer, nous allons passer aux ht-docs à l'intérieur de votre hôte local, puis créer un nouveau dossier. Je vais appeler ce dossier les bases de PHP. Faites ensuite glisser ce dossier dans votre éditeur de texte. Je vais utiliser des crochets par Adobe, puis faire glisser cela là-dedans. Pour commencer, je vais créer une page PHP pour commencer à travailler avec. Créez une nouvelle page, avec Commande ou Ctrl N, entre crochets. Tout d'abord, je veux enregistrer cette page comme hello-world, et m'assurer qu'il a l'extension PHP à la fin. Enregistrez cela dans les bases de PHP. Ensuite, nous devons créer un squelette HTML de base pour commencer. J' utilise le plugin Emmet. Si vous ne l'utilisez pas, vous devrez taper ceci manuellement, mais si vous téléchargez Emmet, il vous suffit de taper HTML deux-points 5, puis de cliquer sur l'onglet. Ensuite, cela remplit tout le squelette HTML:5 pour vous. Appelons ça le monde du bonjour. Maintenant, allons travailler dans la section du corps. Pour travailler avec PHP, nous devons fournir une balise d'ouverture et de fermeture. La balise d'ouverture en PHP ressemble à ceci, c'est les crochets d'angle, interrogation, puis php. Cela indique que le code PHP est sur le point de démarrer. Ensuite, à la fin du php, nous devons ajouter une balise de fermeture, qui est le point d'interrogation sur les crochets à angle droit. Tout le code PHP entre ici. La première chose que nous voulons faire, est juste d'imprimer du texte sur le navigateur. Je vais le faire avec un écho. Tapez echo, puis parce que ce sera du texte, nous devons mettre entre guillemets, donc, « Hello World ». Ensuite, à la toute fin, nous fermons une déclaration avec un point-virgule. Sauve ça. C'est ainsi que nous imprimons quelque chose dans le navigateur, en utilisant PHP. Accédez à votre navigateur, puis tapez l'hôte local. Ensuite, allez au fichier que vous avez mis dans les ht-docs. C' est php-basics, et puis bonjour monde. On y va. Affiché dans le navigateur est notre texte qui vient d'être repris de Hello World. Nous pouvons mélanger et faire correspondre PHP parmi le HTML. Au lieu d'avoir le titre tel que tapé là, nous devrions avoir ce qu'on appelle codé en dur. Au lieu de taper dessus, nous pouvons ouvrir le PHP, puis faire l'écho, Hello World. Assurez-vous que le PHP est fermé, avec le point d'interrogation sur les crochets d'angle. Sauve ça. Alors si nous, « Refresh », nous devrions maintenant voir que le titre en haut de Hello World, est maintenant produit avec PHP. Assurez-vous juste que nous allons taper PHP, puis, « Refresh ». Maintenant, nous voyons tous ceci est généré avec PHP. Nous pouvons mélanger et faire correspondre le PHP parmi le HTML car nous avons seulement les balises PHP d'ouverture, et les balises PHP de fermeture correctement définies. Les commentaires en PHP sont similaires à beaucoup d'autres langages. Nous pouvons commenter un code dont nous n'avons plus besoin, ou nous pouvons utiliser un commentaire pour taper quelques notes pour nous, ou des programmeurs que nous voulons que le programme ignore. Par exemple, si nous ne voulions plus afficher cela, et que nous voulions que le programme l'ignore, nous pourrions utiliser deux barres obliques. Vous pouvez voir que l'éditeur de texte rend la ligne grise. On peut dire que c'est bien commenté. Si nous « Sauvegarder » cela, puis « Actualiser », cela devrait disparaître, car il n'est plus en cours de traitement. Supprimons ça. Les commentaires sont également utiles pour créer des notes. Nous pouvons faire une note à nous-mêmes, en disant afficher Bonjour monde au navigateur. C' est ce qu'on appelle un commentaire à une seule ligne. Si nous voulons juste commenter une seule ligne de code, nous utilisons simplement les deux barres obliques avant. Si nous voulons commenter plus d'une ligne, nous pouvons l'utiliser avec un commentaire multi-ligne. C' est une barre oblique et une étoile. Ensuite, nous pouvons commenter plus d'une ligne. Nous allons coller dans Hello World deux ou trois fois, et terminer cela avec une étoile et une barre oblique. C' est ainsi que nous commentons une ligne, et c'est ainsi que nous commentons plus d'une ligne. Dans toute cette section PHP, seul le seul écho de Hello World sera affiché dans le navigateur. Avant avec le titre, nous avons cherché à ajouter PHP dans le HTML. Nous pouvons également ajouter des balises HTML parmi PHP. Ceux-ci seront affichés de la même manière que s'ils étaient HTML. Par exemple, dans l'echo Hello World, si je voulais que ce soit un titre de niveau HTML un, nous pourrions mettre les balises HTML de h1 avant le texte, puis nous pourrions mettre une balise de fermeture h1 après cela. Ensuite, au lieu d'être affiché en tant que texte normal, ce sera maintenant un titre de niveau 1. Si nous « Sauvegarder » cela, puis « Rafraîchir », nous obtenons maintenant Hello World comme un titre dans la plus grande taille de police. Vous pouvez mettre toutes les cibles que vous voulez. Nous pouvons faire la même chose, alors que cela a un h2 et « Enregistrer », et passons au navigateur, et il y a aussi notre titre de niveau deux. C' est la syntaxe PHP de base. C' est ainsi que nous pouvons faire écho ou imprimer des textes sur le navigateur, et aussi comment nous pouvons commenter le code ainsi que combiner PHP avec HTML. 51. Les bases de PHP : chaînes, variables et constantes: Bienvenue de retour. Dans la dernière vidéo, nous avons jeté un oeil à quelques bases de PHP, comme faire écho de textes au navigateur, commentaires, et aussi comment faire PHP et HTML. Dans cette vidéo, nous allons passer à regarder chaînes, les variables et les constantes. Je vais juste supprimer le code entre les balises PHP de la dernière section. Tout d'abord, nous allons jeter un oeil aux cordes. Une chaîne est une séquence de caractères, telle qu'une seule lettre, un mot ou une phrase. Une chaîne est ce que nous avons utilisé dans la dernière vidéo, où nous faisions un écho. Nous avons imprimé une chaîne entre les citations. C' est une chaîne. N' oubliez pas le point-virgule à la fin. La chaîne doit être entourée d'un guillemet simple ou double. Ils fonctionnent tous les deux parfaitement bien. Donc écho et puis cette fois une simple citation. C' est aussi une chaîne. Jetons un coup d'oeil à cela sur le navigateur tout en rafraîchissant. Ceci est une chaîne et c'est aussi une chaîne. La plupart du temps, peu importe si nous utilisons des guillemets simples ou doubles. La seule fois que cela compte vraiment est si vous voulez entourer l'un de ces mots avec les guillemets. Par exemple, si vous voulez que la chaîne de mots affiche les guillemets à l'écran, nous devons nous assurer que les guillemets que nous utilisons autour du mot sont opposés à ce qui entoure la phrase. Donc, si nous sauvegardons cela et puis actualisons, la chaîne de mot a les guillemets doubles. Mais s'il fallait le faire et tous avaient le même style de citations, enregistrez cela. L' éditeur de texte a détecté un problème, il fait donc une couleur différente. Si nous devions actualiser, nous voyons que la page hôte local ne fonctionne pas car nous avons une erreur. Mais si nous changeons cela pour être des guillemets simples , puis ceux qui l'entourent reviennent à doubler, puis rafraîchir. C' est ainsi que nous pouvons ajouter des guillemets simples et doubles dans une chaîne. Il y a beaucoup d'autres façons de travailler avec des chaînes en utilisant des fonctions de chaîne. Par exemple, si nous voulions inverser une chaîne, je vais juste utiliser cet exemple là. Si nous voulions inverser une chaîne, nous pourrions utiliser la fonction inverse de chaîne, qui est strrev (). Ensuite, nous devons entourer la chaîne à l'intérieur des crochets, puis enregistrer cela. Ensuite, examinons le navigateur et voyons ce qui se passe. Cela inverse tous les caractères à l'intérieur de la chaîne. Donc c'est maintenant de retour à la différence. Nous pouvons également faire d'autres choses comme faire tous les mots majuscules ou minuscules. Pour les rendre tous en majuscules, nous pouvons utiliser la chaîne à la fonction supérieure. Donc strtoupper (), puis enregistrez cela et puis actualisez, et maintenant tous les caractères à l'intérieur de la chaîne sont majuscules. Nous pouvons faire de la même façon la chaîne à abaisser. Donc strtolower (), enregistrez et actualisez. Maintenant, il n'y a pas de majuscules du tout dans la chaîne. Bien sûr, il y a beaucoup plus de différentes fonctions de chaîne que vous pouvez trouver avec un Google rapide. Rechercher des fonctions de chaîne PHP. Nous sommes instantanément pris à une liste, et est soit un PHP.net ou W3schools, qui a beaucoup d'exemples. Comme vous pouvez le voir, il y a une liste. Il y a beaucoup de choses différentes que nous pouvons faire avec des chaînes telles que diviser une chaîne en un tableau. Nous pouvons mélanger au hasard tous les caractères dans une chaîne. Nous pouvons vérifier la longueur de la chaîne, ce qui renvoie le nombre de caractères. Avoir un jeu avec ces. Vous n'avez peut-être pas besoin de ces deux fonctions que je viens de vous montrer, et je suis sûr que si vous travaillez régulièrement avec PHP, vous rencontrerez beaucoup de ces différentes fonctions. Ensuite, nous allons passer aux variables. Comme beaucoup d'autres langages de programmation, PHP utilise des variables comme conteneurs pour stocker des informations, et l'information à l'intérieur de ces variables peut changer. Je vais juste supprimer cette chaîne. La façon dont nous déclarons une variable est d'abord en utilisant un signe $, puis en attribuant un nom de variable. Par exemple, numéro un. Je vais définir la valeur pour être égale à une chaîne, un nombre, un booléen ou diverses autres choses. Je vais régler le numéro un pour être égal à dix. Quand nous avons affaire à des nombres, nous n'avons pas besoin de mettre les citations de part et d'autre. Ce que nous faisons est de créer une variable avec le nom du numéro un, et nous avons attribué la valeur de dix à ce nombre. Alors on peut faire la même chose. Nous pouvons créer une seconde variable. Cette fois, je vais l'appeler numéro deux, et cette fois je vais définir la valeur à 20, et maintenant nous pouvons utiliser l'écho que nous avons regardé avant. Au lieu de faire écho à une chaîne, nous pouvons faire écho au nom de la variable, numéro un. Maintenant, il vient d'être imprimé sur le navigateur la valeur de dix. Rafraîchissez et voilà notre numéro dix. Nous pouvons également ajouter des variables ensemble. Nous pouvons faire écho à la valeur du numéro un, plus la valeur du numéro deux. Nous devrions maintenant obtenir 30 dans le navigateur. Nous pouvons également combiner des chaînes avec des variables. Si j'ai une variable, donc le nombre de messages, définissons cela à sept. Ensuite, nous avons un nom de variable. Variable appelée nom attribué à une chaîne. Je vais appeler ça Chris. Si l'utilisateur appelé Chris a créé sept messages, nous pouvons alors imprimer cela dans le navigateur. Echo, et puis parce que c'est de la chaîne, nous devons mettre ceci entre guillemets. Si nous voulions imprimer Chris a sept messages, nous pourrions commencer par le nom de la variable. Placez notre nom, de sorte que ce sera Chris, et puis a, et puis nous voulons la valeur des messages, alors mettez cela là-dedans. Actuellement, il dit, Chris a sept, puis des messages, et puis comme nous l'avons mentionné avant que nous puissions mettre une balise HTML à l'intérieur. Je vais juste ajouter une balise de pause là-dedans. Sauvegardons cela, et j'espère que nous devrions obtenir la valeur de Chris a sept postes que nous faisons, donc ça marche bien. J' ai mentionné que les valeurs d'une variable peuvent être modifiées. Si nous revenons à notre exemple numéro, donc numéro un égal à dix, puis écho numéro un. Maintenant, nous devrions obtenir la valeur de dix, imprimer dans le navigateur. Mais plus loin dans le programme, si vous vouliez changer la valeur du numéro un, nous pouvons réaffecter la valeur. Numéro un, nous pouvons changer cela pour être 20, puis quand nous écho numéro un, nous devrions obtenir la valeur de 20, imprimer dans le navigateur, ce que nous faisons. C' est parce que le programme est lu ligne par ligne. Quand il arrive à la ligne 11, le numéro un est défini sur la valeur de dix, puis descend à la ligne suivante, puis réalise que le numéro un est maintenant défini sur 20. Quand nous faisons écho numéro un, nous avons la valeur de 20. La dernière chose que je veux regarder dans cette vidéo est les constantes. Sur les constantes, tout comme les variables, peut stocker des informations ou stocker une valeur. Cependant, contrairement aux variables, la valeur peut changer une fois qu'elle a été définie. C' est ainsi que vous définissez une constante en PHP. Tout d'abord, nous utilisons la fonction define ou le mot-clé define pour déclarer une constante, puis nous ouvrons les crochets bouclés. Ensuite, nous devons passer deux paramètres. Le premier paramètre entre les guillemets et en majuscules est le nom de la constante. Par exemple, si vous voulez stocker la valeur de votre propre nom, nous pouvons l'appeler nom, puis séparé par une virgule. Nous ajoutons la valeur de la constante. Ce sera mon nom, puis un point-virgule à la fin. Nous avons défini une constante avec le nom de NAME, puis nous avons ajouté la valeur de Chris à cette constante. Nous pouvons imprimer cela sur le navigateur de la même manière qu'avant. Tout ce que nous avons à faire est de faire écho au nom, et ensuite nous devrions obtenir la valeur de Chris dans le navigateur. On y va. C'est ainsi que nous utilisons des chaînes , des variables et des constantes en PHP. 52. Les bases de PHP : types de données et opérateurs: Bienvenue de retour. Jusqu'à présent, dans les deux dernières vidéos, nous avons examiné comment les variables peuvent stocker des données en PHP. Nous avons examiné les nombres ou les entiers, et nous avons examiné comment nous pouvons les stocker dans des variables. Un entier, nous pouvons avoir différents types différents. Vous pouvez voir quelques exemples tels qu'un nombre positif, un nombre négatif ou un nombre hexadécimal. Nous avons également jeté un coup d'oeil aux cordes, qui sont une série de personnages. Je peux respecter les chaînes de différentes manières telles que des guillemets simples ou doubles. Mais il existe aussi de nombreux types de données différents que nous pouvons utiliser en PHP. Par exemple, il y a un booléen. Un booléen est simple vrai ou faux. Ainsi, par exemple, nous pouvons voir si quelque chose retourne vrai, et si c'est le cas, nous pouvons effectuer une certaine action. Il y a aussi des types de données tels que les tableaux, que nous examinerons dans la section. Mais ensuite, nous allons jeter un oeil à quelques opérateurs PHP. Donc, pour commencer, nous allons jeter un oeil à quelques opérateurs arithmétiques. Prenons notre exemple de nombre que nous avons examiné auparavant. Donc numéro un égal à 100. Une deuxième variable de nombre deux égale à 200. Alors on peut faire un écho. Alors écho numéro un plus numéro deux. Nous devrions obtenir une valeur de 300 dans le navigateur. Donc, ce symbole plus est un opérateur arithmétique. Il ajoute la valeur du numéro un au numéro deux. Nous pouvons également enlever ces valeurs avec le symbole à emporter. Maintenant, nous allons obtenir moins ou moins 100. Nous pouvons aussi nous multiplier, et pour le faire en PHP, nous devons utiliser le symbole étoile. On a une valeur de 20 000. Nous pouvons également diviser avec la barre oblique avant. Nous pouvons également trouver le reste. On peut le faire avec le symbole de pourcentage. Le symbole de pourcentage nous donne le reste après la division. Pour ce faire, nous devons changer les valeurs à quelque chose de plus approprié. Le numéro un est égal à 10. Le numéro deux est égal à trois. Puis rafraîchir et nous devrions obtenir la valeur d'un. La raison en est que trois va dans 10 trois fois, puis laisse une valeur de un comme un reste. Jetons donc un coup d'oeil à d'autres exemples sur le site Web des écoles W3. Allez dans les écoles W3, puis les opérateurs PHP. Défilons vers le bas. Nous avons examiné certains des opérateurs arithmétiques, que vous pouvez voir ici. Il y a aussi des opérateurs d'affectation. L' opérateur d'affectation le plus basique est le symbole égal. Nous les avons regardés dans des vidéos précédentes. Nous attribuons la valeur de 10 au nom de la variable numéro un. Il y a aussi d'autres opérateurs d'affectation, tels que addition, la soustraction, la multiplication, la division et le module, qui est le reste. Il y a aussi des opérateurs de comparaison et logiques. Nous pouvons vérifier si deux valeurs sont égales ou inférieures ou supérieures à. Mais nous allons jeter un oeil à ceux-ci plus en détail dans la section de l'instruction if/else. Nous pouvons également incrémenter et décrémenter la valeur. Nous pouvons incrémenter, par exemple, une valeur par une ou nous pouvons décrémenter une valeur par une. Nous allons regarder les opérateurs d'incrémentation et de décrémentation plus dans la vidéo de boucles. Mais pour l'instant, jetons un coup d'oeil à quelques exemples de base de la façon dont nous pouvons les utiliser. Donc, nous avons eu une variable appelée nombre, et nous avons simplement défini ceci à la valeur d'un. Si nous faisons écho à cela au navigateur, nous obtenons juste la valeur d'un imprimé. Mais nous pouvons incrémenter cette valeur d'une à chaque fois, en définissant le nom de la variable de nombre, puis en utilisant plus. Sauve ça. Maintenant, la valeur de un devrait être incrémentée d'un. Ensuite, nous devrions être imprimés sur le navigateur, la valeur de deux. Actualiser. Désolé un point-virgule à la fin de cela, puis actualisez. Alors devrait être celui de ça et sauver. Rafraîchissez le navigateur, puis nous obtenons la valeur de deux. On peut continuer à répéter ça. Si nous voulions incrémenter une fois de plus et prendre la valeur pour être le numéro trois, nous pouvons ajouter cela et encore, puis nous devrions obtenir la valeur prise à trois. Si nous voulions décrémenter, il, nous pourrions utiliser le symbole négatif et si nous l'utilisons deux fois, nous devrions obtenir la valeur de négatif. Actualiser. On y va. La valeur de un est décrémentée à zéro, puis décrémentée à nouveau pour être négative. C' est donc un coup d'oeil rapide sur les types de données et les opérateurs en PHP. Je vous verrai dans la prochaine vidéo, nous allons jeter un oeil aux tableaux PHP. 53. Les bases de PHP : tableaux: Bienvenue les gars. Dans cette vidéo, nous allons jeter un oeil aux tableaux php. Donc, dans les vidéos précédentes, nous avons examiné les variables, qui sont idéales pour stocker des données qui peuvent être modifiées. Cependant, ils ne peuvent contenir qu'une seule valeur, mais si nous voulions stocker plus d'une valeur, nous devons utiliser un tableau. Nous pouvons stocker autant de valeurs à l'intérieur de ce tableau que nous le souhaitons. C' est ainsi que nous créons un tableau en utilisant php. Donc il y a deux méthodes différentes que je vais vous montrer. Le premier, nous pouvons définir le nom du tableau, tout comme un nom de variable. Je vais créer un tableau de formes, puis définir ceci pour être un tableau. Ensuite, nous devons suivre le mot clé du tableau, avec les crochets bouclés, puis un point-virgule. Tout ce que nous avons fait là-bas est de créer un tableau vide avec le nom des formes. Pour ajouter des valeurs à l'intérieur de ce tableau vide, utilisons le nom du tableau, puis suivi d'un ensemble de crochets, puis nous devons mettre le numéro d'index. Nous commençons par zéro, qui est la première position d'un tableau. Je vais définir ça pour être la première forme, donc un carré. Cela ajoute maintenant la valeur de carré à l'intérieur du tableau, et ajoutons un ou deux autres, donc des formes, puis positionnons un. Cela peut être un cercle, puis des formes, position deux, donc un triangle. Ok donc nous avons défini un tableau vide pour avoir le nom des formes, puis nous avons ajouté trois valeurs au tableau de carré, cercle et triangle. Donc, pour vérifier si cela fonctionne, nous pouvons faire un écho, donc c'est faire écho au nom du tableau des formes, puis les éléments du tableau que nous voulons imprimer donc commençons par le numéro deux. Donc, vous devriez imprimer sur le navigateur la valeur du triangle, alors enregistrez cela, puis actualisez, et nous y allons. C' est la position numéro deux du tableau, qui a la valeur de triangle. Changons ça en numéro un, donc on devrait avoir le cercle. C' est une façon assez longue d'écrire un tableau. Il existe un moyen plus simple d'écrire un tableau, c'est en utilisant la méthode littérale. Donc, au lieu de ce que nous faisons ci-dessus, nous pouvons définir le nom du tableau des formes, puis nous pouvons définir cela à un tableau, et ensuite nous pouvons mettre les valeurs directement à l'intérieur du tableau. Tout d'abord, nous pouvons mettre dans le carré, puis séparer par des virgules, le cercle, puis le triangle. Supprimons simplement celui-ci pour l'instant, et ensuite nous pouvons faire l'écho comme nous l'avons fait auparavant. Alors faisons écho au nom, qui est des formes, puis entre crochets à nouveau, nous devons mettre le numéro d'index, donc commençons par zéro, qui est le carré. Enregistrez cela, puis actualisez, et nous obtiendrons la valeur de carré. Donc, l'une ou l'autre de ces deux méthodes a parfaitement fonctionné. Donc, il y a quelques vidéos, nous avons jeté un oeil aux fonctions de chaîne, où nous avons inversé l'ordre de la chaîne et ensuite nous avons changé le texte pour être en majuscules. tableaux ont également des fonctions similaires, et comme une liste des fonctions disponibles sont php.net, mais je vais juste passer par un ou deux exemples, juste pour vous montrer ce que nous pouvons faire avec les fonctions de tableau. Donc, le premier est la fonction count, qui compte le nombre d'éléments à l'intérieur du tableau. Nous utilisons la fonction count, puis nous allons mettre le nom du tableau entre crochets, afin que nous puissions supprimer ce zéro. Vous devez faire écho au navigateur, le nombre d'éléments à l'intérieur du tableau de formes afin d'actualiser. Il y a trois éléments à l'intérieur du tableau. Cela varie également selon des fonctions telles que, le tableau pop, qui supprime et retourne le tout dernier élément à partir de la fin d'un tableau. Pour ce faire, je vais créer une variable de plus. Je vais l'appeler la dernière forme. Donc la dernière forme que je veux attraper est un triangle. Pour saisir la valeur de ceci, je vais définir cette valeur pour être égale à array_ pop. Ensuite, pour supprimer la valeur du triangle, ou le dernier élément, nous avons juste besoin de mettre le nom du tableau, qui est des formes. Donc maintenant, ce que nous avons fait est que nous avons défini le dernier élément sur le tableau, à l'intérieur de ce nom de variable. Maintenant, nous pouvons juste faire écho à ce nom de variable au navigateur, et nous devrions obtenir la valeur de triangle. Alors faire écho au nom de la variable lastshape, puis rafraîchir, et voilà. C' est donc la valeur du triangle. Nous pouvons également trouver la valeur minimale et maximale d'un tableau. Créons un tableau avec des nombres cette fois, donc les nombres sont égaux à un tableau. Nous n'avons pas besoin de mettre de chiffres dans les citations. Mettons juste quelques chiffres à l'intérieur, et ensuite on peut faire écho. Si nous voulions trouver le plus grand nombre, nous pourrions utiliser la fonction max, puis à l'intérieur des parenthèses, le nom du tableau, qui est des nombres. Maintenant, nous devrions nous faire imprimer à l'écran, le nombre maximum, qui est 67, ce que nous faisons. Nous pouvons également remplacer max par min, et nous devrions obtenir une valeur de un. Ok, super. C'est ainsi que vous pouvez créer un tableau en utilisant php, et aussi quelques fonctions de base du tableau php. Alors merci et je vous verrai dans la prochaine vidéo, où nous allons jeter un oeil aux fonctions php. 54. Les bases de PHP : fonctions: Dans cette vidéo, nous allons jeter un oeil sur la façon dont nous pouvons utiliser les fonctions en PHP. Une fonction est fondamentalement un bloc de code. Nous attribuons un nom à ce bloc de code et l'appelons programme Juno, quand nous voulons l'exécuter. C' est vraiment utile lorsque nous avons le même code plus d'une fois dans notre programme et plutôt que de taper tout le code encore et encore. Nous pouvons placer un code à l'intérieur d'une fonction et appeler la fonction quand c'est nécessaire. PHP a aussi beaucoup de fonctions intégrées que je mettrais à disposition. Nous avons regardé une ou deux de ces vidéos dans les dernières vidéos. Nous commençons par créer une fonction, en utilisant le mot-clé fonction, puis après cela, nous donnons ensuite à la fonction un nom, suivi des parenthèses ou des parenthèses, le nom peut être myFunction et puis utilisez les crochets après, puis le contenu de la fonction se trouve dans un ensemble d'accolades. Chaque fois que cette fonction est appelée, le code à l'intérieur de ces accolades sera exécuté. Par exemple, un moyen de base de fonction donnée est juste un écho. Ma première fonction, seule, cette fonction ne fait rien jusqu'à ce que nous l'appelons, et la façon dont nous l'appelons est vous simplement en tapant le nom de la fonction, myFunction, puis la parenthèse suivie d'un point-virgule. Maintenant, quand nous exécutons MyFunction, nous devrions obtenir le texte de ma première fonction l'imprimer dans le navigateur, et à l'intérieur de la fonction, nous pouvons même avoir différentes variables à l'intérieur. Tout comme nous avons regardé il y a quelques vidéos, nous pouvons utiliser un nom d'utilisateur. Nom d'utilisateur égal à Chris et la deuxième variable de messages égale à 5, puis nous pouvons faire écho à l'écran. Chris a cinq messages, écho dans les citations, le nom d'utilisateur a cinq messages, maintenant quand nous appelons cette fonction, nous devrions envoyer le message à l'écran dans l'écho. Enregistrez cela, puis actualisez le navigateur, et nous pouvons prendre les fonctions encore plus loin, en passant des paramètres. Créons une nouvelle fonction, et si vous voulez créer une fonction pour multiplier les nombres. Cette fois, au lieu de laisser les crochets vides, nous pouvons passer deux paramètres ou même plus. Je vais l'utiliser pour multiplier deux variables. Variable Number A puis séparé par des virgules, variable Number B. Chaque fois que cette fonction est appelée, voulez qu'elle multiplie la valeur de A par la valeur de B. Écho variable A, multiplions par la variable B, puis en passant les nombres appellera la fonction par son nom. Multipliez les nombres et les deux nombres que nous voulons multiplier bousculeront à l'intérieur de ces parenthèses. Douze et deux par exemple, maintenant quand nous appelons cette fonction, nous avons maintenant la valeur de 12 multipliée par 2. Nous devrions obtenir la valeur de 24 sur l'écran. Super. Ce que nous venons de faire est que nous avons effectivement créé une variable de A et B, puis avons besoin de prendre les valeurs de 12 et 2, puis les multiplier ensemble et afficher les résultats sur le navigateur. C' est ainsi que nous travaillons avec les fonctions en PHP, et c'est aussi comment nous pouvons passer des paramètres dans les fonctions et je vous verrai dans la prochaine vidéo, nous allons jeter un oeil aux instructions conditionnelles et plus d'opérateurs. 55. Les bases de PHP : déclarations conditionnelles et plus d'opérateurs: Bienvenue de retour. Dans cette vidéo, nous allons jeter un oeil aux instructions conditionnelles et à quelques opérateurs plus utiles. Les instructions conditionnelles sont utilisées lorsque vous voulez vérifier si une certaine condition est vraie. Si c'est le cas, nous pouvons alors dire au programme ce qu'il faut faire ensuite. Par exemple, nous pouvons vérifier si un utilisateur est connecté. Si c'est le cas, nous pouvons afficher les informations de l'utilisateur sur l'écran telles que le nom d'utilisateur. Commençons d'abord par regarder les instructions conditionnelles les plus basiques, l'instruction if. Je vais commencer par créer quelques variables avec lesquelles travailler. Utilisez un signe dollar, et la première variable sera LoggedIn. Je vais définir ceci sur une valeur booléenne. Si vous vous souvenez, cela pourrait être vrai ou faux. Commençons par définir cela sur true. Ensuite, la deuxième variable, ce sera le nom d'utilisateur. C' est une chaîne. Je vais ajouter le nom d'utilisateur là-dedans. Ensuite, nous allons utiliser une instruction if pour vérifier si une condition est vraie. Je vais commencer par utiliser le mot-clé if, puis après cela, un ensemble de crochets. A l'intérieur de ça, c'est la condition que nous devons vérifier. Nous voulons vérifier si l'utilisateur est LoggedIn. Testons si LoggedIn est vrai, juste à l'intérieur du nom de variable de LoggedIn, à l'intérieur. Ensuite, nous ajoutons la paire d'accolades. Si cette condition est vraie, alors nous exécutons le code qui est entre les deux accolades. Par exemple, si notre utilisateur est LoggedIn, nous allons juste faire écho au navigateur un message à vous dire, bienvenue de retour. Ensuite, une virgule, et puis nous pouvons simplement ajouter avec le point ou le point, le nom d'utilisateur, qui est stocké dans la variable appelée utilisateur. N' oubliez pas le point-virgule à la fin des déclarations. Sauvegardez ça. Ensuite, nous allons passer au navigateur et puis rafraîchir ceci. Super. Nous avons le message disant : « Bienvenue, Chris, » parce que notre condition est vraie. Si nous changeons ceci pour être faux, nous ne devrions rien afficher à l'écran, donc notre message n'est pas affiché. Une telle déclaration si basique. Maintenant, nous allons passer à jeter un oeil en utilisant des opérateurs de comparaison. Je vais me rendre sur le site Web de W3Schools. Je suis dans la section des opérateurs de comparaison. Nous pouvons également utiliser ces comparaisons avec les instructions if. Donc, peut vérifier si deux valeurs sont égales. Le double égal est de vérifier si deux valeurs sont égales au volume. C' est aussi un triple égal, qui vérifie si les deux valeurs sont égales et aussi le même type. Par type, nous voulons dire s'ils sont tous les deux une chaîne ou qu'ils sont tous les deux un nombre. Nous pouvons également combiner avec un point d'exclamation pour faire exactement le contraire. Ce ne sera pas égal. Nous pouvons utiliser le symbole inférieur ou supérieur à pour vérifier si la condition est inférieure ou inférieure à. Nous pouvons également utiliser moins ou égal à, ou supérieur à et égal à. Mettons ceux-ci à l'intérieur de nos déclarations if à titre d'exemple. Je vais juste utiliser une nouvelle variable. C' est un nombre. Je vais définir ceci pour être une valeur initiale de 10. Donc maintenant, qui encore une fois, si la variable de nombre est supérieure à cinq, alors nous pourrions faire un écho disant déclaration est vraie. Un tel vérifié. Notre nombre est supérieur à cinq, donc nous devrions obtenir la déclaration est vraie imprimée sur le navigateur. Vérifions ça et rafraîchissons, et bien sûr, nous le faisons. Si nous changeons cela pour être inférieur à, c'est bien sûr faux. En fait, il disparaît. Tout comme sur le site Web de W3Schools, nous pouvons vérifier en utilisant l'un de ces opérateurs. Nous pouvons utiliser moins ou égal à. Nous avons fixé à 10. Ceci est bien sûr égal à 10. Cette déclaration devrait être vraie, ce qui est. Nous regardons avant le double et le triple symbole égal. Commençons par le double égal, et plutôt que le nombre, mettons ceci dans les citations. Transformons en une chaîne, boue ou sauvegardons cela et rafraîchissons et voyons ce qui se passe. Nous avons la déclaration comme étant vraie. Bien que les valeurs supérieures à 10, ceci est classé comme une chaîne parce que dans les guillemets. Mettons juste un troisième symbole égal à l'intérieur et sauvegardons et puis voyons ce qui se passe. Nous allons utiliser la déclaration de taxane est vrai. C' est parce que l'utilisation d'un triple égal vérifie à la fois la valeur. La valeur est égale et aussi le type. Le type n'est pas égal car il s'agit d'une chaîne et c'est un nombre. Utiliser si les déclarations sont vraiment bonnes si nous voulons seulement tester par rapport à un seul résultat. Mais si vous voulez tester par rapport à plus d'un résultat, nous devons utiliser une déclaration if else ou même si. Commençons par utiliser les instructions if else, et cela change juste pour être un nombre. Si le nombre est inférieur à 10, les échanges à être numéro sont inférieurs à 10. Comme vous le savez, cette fois va vérifier si le nombre est inférieur à 10, puis l'imprimer à l'écran. Mais nous pouvons également fournir un deuxième test de résultats par rapport au cas où ce n'est pas vrai. Nous pouvons utiliser le mot-clé else. Ensuite, à l'intérieur des accolades, nous pouvons fournir un second écho. Donc, le nombre n'est pas inférieur à 10, et le point-virgule. Nous allons d'abord vérifier si cette déclaration est vraie. Si ce n'est pas le cas, cela sera imprimé à l'écran. Sauvegardons cela et puis actualisons. Le numéro a n'est pas inférieur à 10. Bien sûr que ce n'est pas parce que c'est le numéro 10. On peut juste mettre un opérateur Nova là-dedans. Tester si le nombre est inférieur ou égal à 10. Donc, sauf cela, et nous devrions maintenant changer pour dire un nombre est inférieur à 10 ou en fait égal à. Mais que se passe-t-il si nous voulions tester contre des conditions libres ou plus ? Eh bien, c'est là où d'autre s'il entre. Je vais juste les mettre sur des lignes séparées juste pour le rendre un peu plus lisible. Entre le if et le reste, nous pouvons changer ceci pour être else , puis utiliser les crochets pour une condition à tester. Tout d'abord, nous vérifions si le nombre est inférieur à 10. Nous pouvons ensuite utiliser le elseif pour tester si le nombre est égal à 10. Encore une fois, la variable de nombre égale à 10. Nous changeons cela pour être le nombre est 10. Ensuite, enfin, si ces options sont toutes les deux false obtiendra la sauvegarde. Quand il a dit la déclaration d'autre aujourd'hui comme un recul. Cette fois, nous pouvons écho nombre n'est pas inférieur ou égal à 10. Essayons ça. Tout d'abord, nous allons définir le nombre à moins de 10. Nous devrions obtenir le numéro est inférieur à 10 et rafraîchir. Donc le nombre est inférieur à 10. Si le nombre a été changé pour être égal à 10, parce que nous devrions obtenir cette déclaration de nombre est 10. Ensuite, enfin, si la valeur est supérieure à 10, donc changer à 14, nous devrions obtenir un nombre n'est pas inférieur ou égal à 10. Alors rafraîchissez. On y va. C' est ainsi que nous pouvons utiliser if else et else if déclarations pour tester par rapport à plusieurs résultats. La dernière chose que nous voulons jeter un oeil dans cette vidéo est les opérateurs logiques. Revenons à l'exemple W3Schools. Jetons un coup d'oeil aux opérateurs logiques, qui est un peu plus bas. En plus des tests que nous utilisons précédemment, le test si les conditions sont inférieures, supérieures ou égales à, par exemple. Nous pouvons également utiliser l'opérateur et pour vérifier si plus d'une condition est remplie et ou. Nous pouvons également vérifier si une valeur ou personne n'est vrai. Aussi le point d'exclamation pour tester si une condition n'est pas vraie. Nous allons commencer par créer deux variables, donc le numéro 1 et ensuite le numéro 2. Cette valeur peut être 10. Ensuite, nous pourrions supprimer tout le reste à part les déclarations if. Si nous voulions tester contre ces deux conditions plutôt qu'une seule, donc si le nombre 1 était égal à cinq, je veux aussi vérifier si le nombre 2 est égal à 10, donc nous pouvons utiliser les esperluettes doubles ou le mot et. Donc je vais les utiliser. Donc le nombre 1 est égal à cinq et aussi le nombre 2 est égal à 10. Donc, la déclaration echo est vraie. Il suffit de le changer pour être le dollar. On y va. Bien sûr, les deux déclarations sont vraies, donc nous devrions mettre cette impression à l'écran. Mais si toutes ces déclarations retournent fausses, nous ne devrions rien obtenir du tout. Changons ça pour être deux. Bien sûr, le numéro 1 n'est pas vrai lorsque les deux de ces pour être vrai pour que cela soit imprimé. Maintenant, si nous l'enregistrons et actualisons, nous devrions faire supprimer le message. Mais nous pourrions changer cela pour être ou, ce qui est les deux tuyaux. Comme nous l'avons vu auparavant, nous pouvons utiliser les deux tuyaux ou l'opérateur ou. Maintenant, nous avons seulement besoin d'une de ces déclarations pour évaluer à vrai. Le nombre 2 est vrai et le nombre 1 est faux. Maintenant, ils devraient faire imprimer le message à nouveau à l'écran. Ce sont vos données de test, puis actualisez, ce que nous faisons. Tels qui suivent cette vidéo. C' est un regard de base sur les instructions conditionnelles et certains opérateurs PHP. Merci, et je te reverrai. 56. Les bases de PHP : changer d'instructions: Dans la dernière vidéo, nous avons regardé déclarations if-else et comment nous pouvons les utiliser pour dire au programme quoi faire, fonction de si une certaine condition est remplie. Maintenant, nous allons passer à regarder une instruction switch, ce qui est une excellente alternative aux if-else si nous avons besoin de vérifier dans de nombreuses conditions. Je vais commencer par créer une variable appelée nourriture préférée, je vais définir ceci pour être une chaîne de pizza. Ensuite, nous allons utiliser une déclaration switch pour vérifier de nombreux types d' aliments différents , puis vérifier s'il y a correspondance avec la variable de nourriture préférée. Pour commencer une instruction switch, nous utilisons le mot-clé switch. Puis à l'intérieur d'un ensemble de seaux, nous passons ensuite dans la variable, je veux vérifier contre. Placez ça à l'intérieur. Ensuite, tout comme l'instruction if que nous avons utilisée auparavant, nous utilisons ensuite un ensemble d'accolades. Ensuite, à l'intérieur de ces accolades, nous pouvons mettre toutes les expressions que nous voulons vérifier et ensuite fournir un résultat si cette expression est respectée. Avec les instructions switch, nous vérifions par rapport à différents cas, donc nous utilisons le mot-clé case. Le premier cas, nous pourrions vérifier si la nourriture préférée est un curry. Essayons si cela est égal au curry. Ensuite, nous devons utiliser un deux-points, puis une fois que nous avons fait le deux-points, nous pouvons alors fournir un résultat si c'est une correspondance. Je vais juste utiliser un écho et ensuite je vais juste dire, « J'adore le curry », avec un point-virgule à la fin. Ensuite, après chacune de ces expressions, nous devons utiliser le mot-clé break avec le point-virgule. Cela éclate de l'instruction switch si cela est vrai, et si ce n'est pas le cas, nous passons simplement au cas suivant. Nous utilisons à nouveau le mot-clé case et cette fois je vais vérifier si l'affaire est chinoise. Encore une fois, le côlon et l'écho de « J'aime le chinois ». Ensuite, comme avant, nous utilisons le mot-clé break, puis un de plus. Cas et cette fois « Pizza ». Echo, « J'adore la pizza. » Si c'est vrai, nous pouvons sortir des instructions switch. C' est ainsi que nous mettons en page une instruction switch. Il y a une autre pièce que nous devons ajouter ici avant de le tester. Nous devons écrire un cas par défaut, juste au cas où l'une de ces expressions ci-dessus ne correspondrait pas. C' est plus une sauvegarde, donc par défaut, puis le deux-points, et puis je veux faire écho, je ne sais pas. Sauvegardons ceci et testez-le. Vous pouvez probablement trouver ce qui va se passer ici. On a notre nourriture préférée, disons que c'est de la pizza, alors on devrait faire correspondre le cas de pizza et ensuite faire l'écho « J'adore la pizza ». Comment on a fait ? Changons ça pour être chinois et ça devrait changer en « J'aime le chinois ». Puis curry, ça marche bien, j'adore le curry. Maintenant, nous allons tester la valeur par défaut, donc nous pouvons changer ceci pour être « Pasta ». Nous n'avons pas de cas pour les pâtes, donc nous devrions obtenir la valeur par défaut de « Je ne sais pas », ce que nous faisons, donc c'est bien. C' est ainsi que nous pouvons utiliser une instruction switch en PHP pour tester plusieurs résultats. 57. Les bases de PHP : loops: En programmation, nous pouvons utiliser des boucles pour rendre les tâches répétitives beaucoup plus faciles. Par exemple, nous pouvons parcourir les noms de tous vos amis dans une base de données, puis les afficher à l'écran. Cela enregistre le type et sur la même ligne de code encore et encore pour chaque ami. Dans cette vidéo, nous allons jeter un oeil aux quatre types de boucles que nous pouvons utiliser en PHP. Nous allons commencer par ce qu'on appelle une boucle while. Alors que les boucles exécutent essentiellement un bloc de code tant qu'une condition est vraie, alors regardons à quoi ressemble la boucle while en PHP. Je vais créer un ensemble de variables pour en être un. Une boucle while est définie un peu similaire à un if déclarations que nous avons regardé il y a quelques vidéos. Mais le mot-clé while, la condition entre parenthèses à tester , puis le résultat à effectuer entre les accolades. Je veux commencer par vérifier si notre variable de nombre est inférieure à 10. Alors que notre nombre est inférieur à 10, nous allons créer un écho de nombre, et vous allez juste vous taper d'abord, puis je vais vous expliquer ce qu'il fait. C' est moins de 10, et nous aurons besoin d'une seconde de tresse là-bas, et vous verrez pourquoi dans un instant. Ensuite, le nombre variable, nous allons incrémenter avec le plus. Vous pouvez regarder cela, vous vous demandez ce qui se passe. Fondamentalement, nous créons une boucle, et nous allons commencer à tester si le nombre est inférieur à 10, ce qui est, donc dans ce cas, nous allons imprimer le numéro, donc ce sera le numéro 1 est inférieur à 10. Ensuite, une fois que cela est imprimé, je vais incrémenter le nombre en utilisant le plus, donc cela changera la valeur du nombre en numéro 2. Ensuite, cette condition est toujours vraie car le numéro 2 est toujours inférieur à 10. Ensuite, la deuxième fois autour de la boucle, nous devrions être imprimés, le numéro 2 est inférieur à 10. Ensuite, il est incrémenté, puis le nombre devient la valeur de 3, ce qui est encore moins de 10, donc nous allons faire imprimer le texte à l'écran. Le numéro 3 est inférieur à 10, et ainsi de suite. Cela continue à se répéter jusqu'à ce que la condition ne soit plus vraie, ou dans notre cas, jusqu'à ce que nous atteignions le numéro 9. Revenons à 1, enregistrez, puis actualisez. Là, nous avons aussi le numéro 1 jusqu'à 9 pour être inférieur à 10, et c'est pourquoi nous avons besoin d'insérer une balise de pause juste pour que chacun d'entre eux soit sur une ligne séparée et qu'il soit plus lisible. La prochaine, nous allons jeter un oeil à une variance de la boucle while, et ceci est appelé une boucle do-while. La boucle while que nous venons de regarder ne fonctionnera que lorsqu'une condition est vraie. Cependant, la boucle do-while s'exécutera toujours une fois avant de vérifier si une condition est vraie, s o le code entre les accolades fonctionnera toujours au moins une fois. Jetons un coup d'oeil à la façon dont nous pouvons faire une boucle do-while en PHP. Nous commençons par le mot-clé do, et ensuite nous pouvons simplement laisser les crochets là parce que cela va courir une fois ce que nous faisons. Nous allons imprimer à l'écran la valeur du nombre variable, puis une balise de rupture, donc c'est sur sa propre ligne. Cette section fonctionnera toujours et va écrire un certain temps, et c'est la condition que nous allons tester, donc alors que le nombre est à nouveau inférieur à 10. Quoi que nous fassions, le numéro sera toujours imprimé à l'écran, puis la boucle continuera alors qu'une condition est vraie. Parce que cette condition est vraie, nous devrions obtenir une boucle tout le long jusqu'à 9, en fait cela doit mettre les incréments à l'intérieur, donc numérer plus et enregistrer, puis rafraîchir. On a les valeurs jusqu'à 9. Voyons ce qui se passe si nous changeons ceci pour être le symbole plus grand que. Bien sûr, 1 n'est pas supérieur à 10, donc c'est faux. En utilisant une boucle while, nous ne ferions rien imprimer du tout. La section do fonctionnera toujours une fois, et alors nous ne devrions rien obtenir après cela. Testons ceci, et nous allons juste obtenir le numéro 1 parce que la boucle ne se répète pas. Il y a deux autres types de boucles que nous pouvons regarder en PHP, la boucle for et la boucle for each. Ensuite, nous allons jeter un oeil à la boucle for. Pour les boucles sont utiles pour quand nous savons combien de fois nous voulons répéter la boucle. Une boucle while fonctionnera jusqu'à ce qu'une condition ne soit plus vraie alors qu'une boucle for, nous devons définir combien de fois la boucle s'exécutera. Jetons un coup d'oeil à la boucle for. Nous utilisons le mot-clé for, puis les crochets, et bien sûr les accolades, tout comme les autres boucles, mais cette fois nous devons passer trois paramètres dans les parenthèses. Le premier volume que nous devons entrer est l'initialiseur, et cela va effectivement être comme l'ancienne variable que nous avons utilisée dans la boucle while. Je vais définir la variable une fois de plus de nombre et ensuite nous allons initialiser cela pour être 0. Ensuite, chacun de ces paramètres doit être séparé par un point-virgule. Le deuxième paramètre est notre condition à tester, donc je vais utiliser la variable de nombre. Nous voulons tester si cela est inférieur ou égal à la valeur de 5. Encore une fois, le point-virgule, et le troisième que je vais utiliser pour incrémenter. Chaque fois que nous traversons la boucle, nous allons incrémenter la variable de nombre d'un sur chaque boucle, donc number plus. Tout comme les autres boucles entre les accolades, nous allons faire écho au nombre, donc le nombre, puis le nombre variable, puis la balise de rupture, et n'oubliez pas le point-virgule à la fin, c'est à quoi ressemble la boucle. Encore une fois, nous commençons par dire une valeur initiale de 0, et chaque fois que nous faisons une boucle autour, nous vérifions si la valeur est inférieure ou égale à 5, si c'est le cas, nous allons faire écho au nombre, et aussi incréments d'un sur chaque boucle. Permet d'enregistrer, puis d'actualiser. Super. Nous avons toutes les valeurs, nous avons la valeur initiale de zéro, puis nous passons jusqu'à ce que nous atteignions la valeur de cinq. Le dernier type de boucle que nous allons regarder dans cette vidéo est le pour chaque boucle, il est conçu pour fonctionner sur des tableaux. Dans la vidéo des tableaux, nous avons regardé comment créer un tableau et comment imprimer une valeur dans le navigateur en le sélectionnant par son numéro d'index juste comme ceci, donc nous avions un nom de tableau formes, et nous avons défini cela égal à un tableau avec les valeurs de carré, cercle, et aussi triangle. Ensuite, si nous voulions afficher l'une de ces valeurs dans le navigateur, nous en avons besoin pour faire écho au tableau de formes, puis à l'intérieur des crochets, nous avons besoin de sélectionner la forme par son numéro d'index, donc 0, 1 et 2, donc triangle sera numéro 2, donc nous obtenons la valeur du triangle. Créer un nouvel écho pour chaque élément de tableau, peut être une longue tâche ennuyeuse, et dans la programmation, nous devrions toujours essayer d'éviter la répétition. Jetons un coup d'oeil à la façon dont nous pouvons créer un pour chaque boucle. Nous n'avons pas besoin de cet écho parce que nous allons le faire à l'intérieur de la boucle. Commencez un pour chaque boucle avec le pour chaque mot clé, et comme les autres boucles ont un ensemble de crochets, puis les accolades. La première chose que nous devons faire est de passer le nom du tableau, donc c'est le nom des formes. Ensuite, chaque fois que nous faisons une boucle à travers le tableau de formes, nous devons stocker les valeurs dans une nouvelle variable, alors faites-le en déclarant comme et puis un nouveau nom de variable, donc je vais appeler cette valeur, puis créons notre écho. Parce que toutes les nouvelles valeurs sont stockées dans notre variable de valeur, nous devons faire écho à la variable de valeur, puis nous allons mettre une balise de rupture à l'intérieur et un point-virgule, donc c'est ainsi qu'une boucle pour chaque boucle est disposée. Chaque fois que nous parcourons le tableau de formes, nous allons installer ces valeurs dans une nouvelle variable, que nous avons appelée valeur, et aussi à chaque passage de la boucle, il passe également à l'élément suivant dans le tableau. Cela signifie que la boucle continuera à vivre à travers toutes les valeurs du tableau jusqu'à ce qu'elle trouve la dernière. Disons ceci et puis actualisons le navigateur. On y va. Nous avons parcouru le premier élément, le deuxième élément et le troisième, et c'est un moyen beaucoup plus pratique d'imprimer toutes les valeurs d'un tableau plutôt que de sélectionner chaque numéro d'index individuel. J' espère que cette vidéo vous laissera avec une meilleure compréhension du fonctionnement des boucles en PHP. 58. Les bases de PHP : le codex: Salut tout le monde. J'espère donc que cette section vous a donné une meilleure compréhension des bases de PHP, et que la connaissance viendra vraiment utile, dans la prochaine section où nous allons construire notre propre thème WordPress personnalisé, et convertir un site web existant en WordPress. Alors que vous passez par la section suivante, nous ferons référence au Codex WordPress, assez régulièrement, que vous pouvez trouver le codex.wordpress.org. Donc, le Codex est le manuel en ligne pour WordPress. C' est un référentiel pour l'information et la documentation WordPress. Il couvre à peu près tout ce que vous devez savoir sur WordPress, y compris les développements de thèmes, les développements de plugin, et comment contribuer à WordPress, et s'impliquer avec vous-même. Nous l'utiliserons beaucoup dans la section suivante pour parcourir les références de fonction. Donc, par exemple, si nous voulons savoir comment travailler avec une fonction particulière, sorte que les balises, nous pouvons taper dans la recherche, puis chercher la référence de la fonction, qui est les balises, puis nous pouvons savoir exactement comment utiliser cette fonction particulière. Nous pouvons trouver une description de la fonction. Nous aurons également un exemple d'utilisation. Ainsi, nous pouvons souvent simplement copier et coller la fonction dans notre propre thème. Donc, celui-ci inclut les balises qui sont associées à un billet de blog, les affiche à l'écran, et vous pouvez souvent trouver de petites informations telles que les paramètres, que la fonction prend en charge. Ainsi, par exemple, celui-ci prend avant, après et un séparateur. Donc, avant et après définit simplement le texte à afficher, avant et après la balise individuelle. Le séparateur est une valeur telle qu' une virgule ou un tiret que vous voulez mettre entre chacune des balises, et si vous ne trouvez pas tout à fait la fonction que vous recherchez, défilant vers le bas, a souvent une liste des balises connexes, que vous pouvez jeter un oeil, et trouver exactement ce que nous voulons. Donc, il vaut la peine de marquer le Codex comme une excellente ressource pour apprendre de nouvelles choses sur WordPress, et aussi pour vérifier l'utilisation de l'exemple pour des choses telles que les fonctions, et nous verrons plus du Codex au fur et à mesure que nous allons pour la section suivante. Alors merci, et maintenant nous allons passer à la section suivante, où nous allons convertir un site web existant en WordPress. 59. Développement de thème : configuration de la base de données et installation de WordPress: Bienvenue les gars. Je suis sûr que vous êtes tous impatients de commencer, nous créons votre propre thème WordPress. Comme d'habitude, comme les précédents projets, nous allons commencer par mettre en place la base de données et télécharger également le dossier WordPress à partir de wordpress.org Commençons par nous assurer que le MAMP est opérationnel. Ensuite, si nous allons à la page de démarrage, nous pouvons alors commencer à configurer notre base de données dans « phpMyAdmin ». Sous « Bases de données », nous voulons créer une nouvelle base de données ; cela s'appellera « pro-casque », qui est le nom de notre site web statique que nous allons convertir, puis appuyez sur create et c'est tout ce que nous devons faire à l'intérieur. Ensuite, nous allons passer à wordpress.org. Comme d'habitude, il suffit de télécharger WordPress, puis de sélectionner la dernière version. Je suis sûr que quelques secondes pour télécharger. Dans les téléchargements, puis décompressez le package. Je vais appeler ça « casque pro » et ensuite enregistrer ça. Puis ouvrez les « htdocs ; » Je vais ouvrir une nouvelle fenêtre, puis aller dans les « Applications », puis « MAMP », les « htdocs », puis la drogue sur notre nouveau site Web à l'intérieur. Je vais les fermer. Ensuite, vous devriez savoir quoi faire maintenant ; nous devons aller dans l'hôte local, puis dans notre nouveau dossier pro casque, puis nous allons commencer par parcourir le pays ; alors sélectionnez le pays de votre choix et ensuite nous pouvons accédez au script d'installation. Alors allons-y, le nom de la base de données était « pro-casque », le nom d'utilisateur était à nouveau « root », mot de passe root : le « localhost » et le préfixe de table que je vais laisser par défaut. Ensuite, exécutez l'installation. Le titre du site est bien sûr, « Pro Headphones », le nom d'utilisateur : « proheadphones-admin » ou le nom d'utilisateur de votre choix. Bien sûr, juste à des fins de démonstration, je vais juste appeler ça « proheadphones ». Confirmez que vous utilisez un mot de passe faible ; c'est bien, juste pour cette démonstration, et définissez un e-mail, puis installez, puis connectez-vous. Je vais cocher « Se souvenir de moi », puis cliquer sur « Se connecter ». On est prêts à y aller. Donc, c'est une base de données et aussi WordPress installé. Bien. Assurez-vous d'arriver à la scène où tout fonctionne avant de passer à autre chose. Je te vois dans la prochaine vidéo. 60. Développement de thème : thème de démarrage Underscores: D' accord. Donc, avant de commencer cette vidéo, nous devrions être tous WordPress vent. Nous devrions tous avoir installé sur notre hôte local et aussi la base de données et tous prêts à partir. Vous devriez avoir déjà téléchargé le modèle statique, le site web pro casque, qui est fourni avec ce cours. Dans cette vidéo, nous allons télécharger un thème de démarrage WordPress appelé underscores. Donc, je vais juste aller sur Google et ensuite chercher le thème de démarrage de soulignements. Ensuite, c'est l'URL dont nous avons besoin, qui est underscores.me. Les soulignements ne sont donc pas comme les thèmes que nous trouverons sur forêt thématique ou les thèmes que nous trouvons sur la page d'accueil WordPress. Ce sont tous des thèmes complets qui sont essentiellement prêts à aller et prêts à commencer à ajouter vos propres couleurs et vous propres touches. Cependant, le thème de départ est exactement à quoi il ressemble. C' est une base sur laquelle commencer à construire. Il comprend tous les fichiers et dossiers requis WordPress et comprend de nombreuses bonnes pratiques WordPress. Donc, nous pouvons le considérer comme un thème étouffant rapide. Beaucoup des principaux thèmes là-bas sur des sites tels que forêt à thème est construit au-dessus du thème de début de soulignement. C' est donc une base solide sur laquelle bâtir. Donc, si vous jetez un oeil sur la page d'accueil, vous pouvez voir toutes les choses qu'elle est incluse, telles que les feuilles de style, différentes mises en page, les éléments tels que les en-têtes personnalisés, les modèles 404. Donc, il nous fait économiser beaucoup de travail se démarquerait. Donc, pour commencer, tout ce que nous avons simplement à faire, c'est de générer notre thème. Donc, je vais appeler cela le pro-headphones-wp , puis cliquez sur « Générer » et puis vous devriez déclencher un téléchargement. Alors ouvrons cela, puis décompressez le paquet et ce sera notre nouveau dossier de thème sur lequel nous commencerons à travailler. Alors ouvrons une nouvelle fenêtre du Finder. Ensuite, je vais me diriger vers notre dossier MAMP et puis nous allons trouver le dossier WordPress à l'intérieur des docs ht. Donc pro casque et ensuite nous devons ajouter cela dans la section thème. Donc, le contenu WordPress, les thèmes et puis simplement glisser cela dans le dossier de thème. Ouvrons et regardons à l'intérieur. Donc, à l'intérieur, il y a tout ce dont nous avons besoin pour commencer à travailler sur notre nouveau thème. Il y a différents modèles de page et des choses telles que la page 404, les fonctions et toutes les pages de base dont nous avons besoin, comme le index.php, le page.php, le dossier de mise en page, le dossier pour ajouter des langues, JavaScript et aussi soigneusement organisé, nous avons les modèles de pièces. Donc nous sommes prêts à y aller. Donc, je vais aller sur le tableau de bord WordPress et ensuite descendre à Apparence, puis Thèmes et puis il y a notre thème pro casque. Donc, activons ceci et bien sûr, vous pouvez changer l'image si vous le souhaitez. Donc il suffit d'activer cela et ensuite nous allons visiter le site. C' est très basique à la minute, mais c'est censé être un thème de départ sur lequel nous pouvons nous appuyer. Nous allons donc commencer dans la vidéo suivante en ajoutant les sections d'en-tête et de pied de page. 61. Développement de thème : comprendre les modèles de WordPress / PHP: Bienvenue à tout le monde. Dans cette vidéo, nous voulons juste prendre quelques instants avant de commencer notre thème WordPress. Juste pour regarder les différences entre les sites Web HTML traditionnels et la façon dont WordPress traite les thèmes. C' est un aspect assez standard dans la page index.html aurait souvent un en-tête et une section de pied de page en haut et en bas de la page. Il est assez courant d'avoir une barre latérale si c'est quelque chose comme une nouvelle ou un site Web de blog, et bien sûr une section de contenu principale au milieu. Habituellement, tout le contenu ou tout le HTML de ces sites sont tous stockés dans le même fichier, mais nous trouvons souvent avec des sites HTML dans certaines zones, particulier l'en-tête et la zone de pied de page. Nous avons le même code sur chaque page. L' en-tête et le pied de page sont souvent les mêmes, et la page d'index, la page À propos de nous et la page de contact. Nous terminons avec beaucoup de code en double du site Web. WordPress traite les choses un peu différemment cependant. Sur le côté gauche, nous avons notre index.html traditionnel, et sur le côté droit, nous pouvons voir comment WordPress ou PHP en général peuvent être utilisés pour diviser les différentes sections du site. Chacune de ces sections peut être placée dans son propre fichier avec l'extension PHP. Comme vous pouvez le voir en haut de la page, l'en-tête, nous codons le code dans la section d'en-tête, et nous le plaçons dans son propre fichier appelé header.php, et cela peut également être fait dans WordPress avec le sidebar.php et aussi la footer.php. La zone de contenu se fait souvent un peu différemment cependant. Il peut y avoir plus d'un fichier modèle qui contrôle la vue pour chaque page, ou même la boucle WordPress, mais nous allons les examiner plus en détail au fur et à mesure que nous allons passer par cette section. Une fois que nous avons tous ces fichiers PHP ou chacun de ces domaines enregistrés dans leurs propres modèles, nous pouvons alors remplir la page WordPress en utilisant diverses fonctions WordPress. Par exemple, le fichier header.php que nous venons d'enregistrer peut ensuite être inclus dans le modèle WordPress en utilisant la fonction get_header, et est également les fonctions get_footer et get_sidebar parmi beaucoup d'autres. Encore une fois, le contenu est traité d'une manière légèrement différente, et vous en apprenez à nouveau à travers le reste de la section. C' est à quoi cela ressemble en fait dans le code. Sur le côté gauche, nous avons un éditeur de code et une mise en page assez commune pour la page WordPress. En haut, vous pouvez voir la fonction get_header, qui extrait tout le contenu de notre en-tête à partir de son propre fichier séparé. Le contenu, et dans le cas de ce fichier particulier, il est tiré dans un jeu sonore pop appelé page, et son varie selon les façons d'inclure le contenu dans les sites WordPress. Nous examinerons une ou deux de ces techniques au fur et à mesure. Plus bas de la page, nous avons la fonction get_sidebar. Ensuite, tout en bas, nous avons la fonction get_photo. faire de cette façon présente de nombreux avantages. Par exemple, si nous voulions modifier une zone de l'en-tête, exemple ajouter un lien de menu plutôt que d'aller dans la page À propos de nous, la page d'index, la page Contactez-nous, et changer le lien sur chaque page. Dans le cas de WordPress aurait juste besoin d'aller dans le fichier header.php, changez-le une fois, et cela changera l'en-tête sur chaque page du site Web. J' espère que cette vue d'ensemble vous donne une idée légèrement meilleure de la façon dont WordPress traite les pages et les modèles de page. Passons maintenant à la vidéo suivante, nous allons créer l'en-tête et les fichiers footer.php, puis nous allons apporter le contenu de notre site web statique et les ajouter aux nouveaux fichiers. 62. Développement de thème : sections d'en-tête et de pied de page: Bienvenue de retour. Donc maintenant, nous savons comment WordPress traite modèles de page pesé. Nous savons comment WordPress divise les choses en différentes sections, telles que l'en-tête et le pied de page. Dans cette vidéo, nous allons travailler en créant l'en-tête et la section pied de page, puis convertir les parties dont nous avons besoin de tout site statique en WordPress, puis inclure les genoux dans notre thème. Sur le bureau, j'ai une copie du site web statique, qui est fourni avec ce cours. Maintenant, je vais ouvrir mon éditeur de texte. Je vais ouvrir les crochets, et la première chose que je veux faire est de la drogue dans le dossier de thème WordPress de l'intérieur du htdocs. Faites glisser le dossier des écouteurs professionnels vers cela. Ensuite, je vais aussi faire glisser sur le site web statique et puis laisse juste sur le dossier quand nous en avons besoin. Je vais revenir au thème WordPress, et puis nous allons commencer dans la section header.PHP. Si nous regardons tous les fichiers et dossiers, nous devrions voir le wp-content. En fait, nous allons rendre cela un peu plus facile pour nous-mêmes. Allez sur les écouteurs pro, le contenu, les thèmes, et nous allons en fait juste droguer le dossier thème. Je devrais rendre ça un peu plus facile. Allez dans le fichier header.PHP. Comme vous pouvez le voir, c'est l'en-tête de notre thème. Cette section inclut toute la zone de la section d'en-tête, jusqu'à la balise de contenu d'ouverture. Beaucoup de cela semblera familier si vous utilisez pour construire dans des sites Web HTML normaux. Nous avons les balises HTML habituelles, la section head, diverses balises meta, la balise viewport. Puis un peu plus loin, nous avons la section la plus proche de la tête, puis la section du corps. Je vais descendre un peu plus loin et trouver la section d'en-tête. Recherchez la section d'en-tête d'ouverture, puis recherchez la fermeture d'une section qui est la zone de tête de mât. Je vais juste supprimer cette section d'en-tête, et ensuite nous pouvons la remplacer par notre propre section d'en-tête. Passez au modèle statique sur la version HTML, puis nous allons dans le index.html. Ensuite, pour remplacer la section de suppression, descendez à notre section d'en-tête. Je vais copier toute l'action de la tête jusqu'au bas. En fait, nous allons continuer à aller à la section fonctionnalité, parce que les images des écouteurs sont toujours en haut du site Web. Je vais également inclure cela dans l'en-tête. Je vais juste copier cette section, puis revenir à notre dossier thématique. Dans la section d'en-tête que nous venons de supprimer, il suffit de coller ce nouveau dans cela. Sauvons ça. Maintenant, si nous allons sur le navigateur Web et puis rafraîchir. On peut voir qu'on a un changement. La nouvelle section d'en-tête, il ne semble pas beaucoup d'autres exploitables, nous avons en fait une partie de l'apparence du contenu. Il y a le lien pour notre logo, nous avons les éléments de menu. Nous avons une barre de recherche, ainsi que l'image du casque. Si vous ouvrez la version HTML, donc index.html, vous pouvez voir que ce sont les zones que nous avons copiées, la navigation, la recherche, et aussi la grande image. Il est installé à la minute, mais l'essentiel est que tout est lié et que tout fonctionne. Maintenant, nous allons travailler avec le remplacement de la section photo. Enregistrez le header.PHP, puis si nous allons dans la barre latérale et recherchez le footer.PHP et faites défiler vers le bas. Nous devons faire la même chose que nous n'avons pas l'en-tête. Supprimez la section de nourriture existante, puis passez à notre modèle sur le bureau dans la page d'index, puis faites défiler vers le bas jusqu'à la variable sur, puis recherchez la section de pied de page. Copiez tout le chemin jusqu'à la balise de pied de page d'ouverture, puis revenez à notre thème. Je m'assure que cela est collé dans la même zone que nous venons de supprimer. Enregistrer, et puis maintenant quand nous actualisons notre site Web, encore une fois est un changement de la zone que nous venons d'ajouter, les entrepreneurs, la section à propos de nous, l'adresse sur aussi le texte du bas apparaît tout. Vous pouvez voir que ce sont les mêmes informations qui sont incluses au bas de notre version HTML. C' est ainsi que nous pouvons ajouter l'en-tête et la section pied de page. Juste une chose de plus avant de passer à autre chose, je veux juste vous montrer la page index.PHP. Vous pouvez voir en haut de la page il y a une fonction appelée get header. Ceci est en tirant dans la section d'en-tête, puis faites défiler plus bas. Nous avons une fonction photo get. C' est tirer le contenu du pied de page. Plutôt que d'avoir toutes ces zones placées dans un seul fichier, nous les avons toutes séparées dans les propres sections, et ensuite nous les tirons simplement avec les différentes fonctions. Il obtient également la barre latérale, qui fonctionnera avec plus tard aussi. Je vais juste laisser cette vidéo là, et nous reviendrons dans la prochaine vidéo et nous allons commencer à travailler avec le CSS pour que le site ressemble davantage à notre version HTML. Je vais également ajouter dans les images telles que les images des écouteurs pour les rendre disponibles pour le nouveau thème WordPress. 63. Développement de thème : ajouter le CSS et les images: Bienvenue, les gars. Nous avons maintenant l'en-tête et la zone de pied de page maintenant dans notre thème WordPress. Ils ne ressemblent pas beaucoup au site fini. C' est parce que nous avons besoin d'apporter le CSS et aussi le dossier images de notre modèle de site Web. Commençons par ouvrir les dossiers. Je vais ouvrir deux pour trouver les fenêtres. Donc, ce premier à gauche est le modèle de site web statique et je vais ouvrir une fenêtre de plus. Je vais ouvrir le thème WordPress à partir des htdocs. Allons vers le bas et cherchons MAMP, htdocs, casque pro, puis à l'intérieur du contenu, les thèmes. Ok, donc la première chose que je veux faire est d'apporter le dossier CSS dans notre dossier thématique. Il suffit de copier et de coller ceci dans notre thème, puis pendant que nous y sommes, nous pouvons également faire la même chose pour le dossier images. Copiez et collez ou faites-les glisser dessus. Il peut se mettre au travail, les inclure dans notre thème. Donc, tout d'abord, je vais aller à Google, et puis je vais faire une recherche pour WordPress, y compris CSS, JavaScript. Ce dont nous avons besoin, c'est le site du développeur WordPress, qui est inclus dans CSS et JavaScript. Jetons un coup d'oeil à cette page. Cette page du site WordPress vous donnera toutes les informations dont vous avez besoin pour inclure CSS et JavaScript dans votre thème. Si nous faisons défiler un peu plus loin. Nous recherchons les fonctions de mise en file d'attente combinant. Cela va nous donner une démonstration de la façon dont nous pouvons ajouter feuilles de style et aussi comment nous pouvons ajouter des fichiers JavaScript dans une seule fonction. Normalement besoin de copier cette section ou de taper, comme nous l'avons fait dans le dernier projet, puis l'ajouter à notre fichier de fonctions. Mais parce que nous utilisons le thème de démarrage de soulignement, cela a déjà été inclus dans le fichier functions.php. C' est déjà là des photos. Vous vous demandez peut-être pourquoi nous avons besoin de mettre en file d'attente des scripts et aussi mettre en file d'attente des feuilles de style, plutôt que de simplement les ajouter dans la tête ou la section photo, comme nous le faisons avec les sites HTML normaux. Eh bien, la raison pour laquelle nous faisons cela, c'est parce que WordPress traite de nombreux thèmes et plug-ins différents. Il s'assure que tous les scripts et styles requis sont chargés au besoin. Donc, il n'y a pas de conflits entre différents plugins, et il charge essentiellement simplement dans un poids que tout fonctionne ensemble, plutôt que différents scripts se battent les uns contre les autres. Passons à notre fichier function.php, qui est juste là, et la fonction dont nous avons besoin est située vers le bas. C' est ce dont nous avons besoin. Nous cherchons la fonction pro_headphones_wp_scripts. C' est la fonction pour mettre en file d'attente les scripts et aussi les styles. Jetons un oeil à ce qui se passe. Tout d'abord, nous avons une fonction wp_enqueue_style. C' est en tirant dans notre feuille de style, qui se trouve juste là. C' est le style.css. Ceci est obtenu en appelant la fonction get_stylesheet_uri. C' est fait en enqueue_script. Le script est en file d'attente, est dans le dossier js, qui est juste underscore fournit quelques fichiers JavaScript pour commencer. Un pour la navigation, puis un second fichier appelé skip-link-focus-fix. C' est le fichier qui aide à l'accessibilité pour les utilisateurs de clavier. Nous allons ensuite travailler avec notre feuille de style. Comme je l'ai mentionné précédemment, nous avons le fichier style.css inclus par défaut. Prenons tous nos CSS personnalisés, que nous avons inclus dans notre dossier CSS, puis allons à notre custom.css. Ce sont tous les styles personnalisés, qui ont été fournis pour le site Web des écouteurs. Je vais juste sélectionner tout, puis copier, puis descendre au style.css, et puis je vais les ajouter tout en bas. Je fais juste défiler vers le bas et ensuite les ajouter dans le bas. En fait, nous allons juste ajouter un commentaire. Il suffit de copier cette section de commentaire et de le coller avant d'autres styles personnalisés. Styles personnalisés, puis enregistrez cela. Comme nous venons de le voir, il y a déjà beaucoup de styles, qui avaient été inclus par défaut avec le thème des soulignements. Beaucoup de ces styles sont utiles pour commencer. Mais bien sûr, s'il y a des styles qui ont été ajoutés, qui sont en conflit avec votre thème, hésitez pas à supprimer l'un de ces styles. Eh bien, je vais juste sauver ça, et ensuite revenir et rafraîchir notre thème. Maintenant, vous pouvez voir qu'il y a eu quelques changements. Nous avons maintenant la zone de pied de page sombre et aussi un peu de style pour les autres zones du site Web. Vous pouvez voir nos styles personnalisés ont été pris en vigueur. Maintenant, les styles personnalisés ont été copiés dans le fichier style.css. Nous pouvons en fait simplement supprimer ce style personnalisé de notre dossier CSS parce que ce n'est plus nécessaire. Nous remarquons que dans le dossier CSS que nous venons de copier dans notre thème. Il y a plus d'un fichier CSS. Maintenant, nous devons travailler avec lier tous les autres feuilles de style. Les feuilles de style pour le framework de fondation, que nous avons inclus avec le site web statique. En outre, des feuilles de style pour les icônes de fondation, que nous avons également utilisées. Ajoutons ces liens maintenant dans le functions.php. Nous les ajoutons en dupliquant la fonction wp_enqueue_style. Je vais dupliquer ceci et le séparer, donc c'est plus clair. Je vais travailler avec la première parce que la dernière, tout comme quand nous travaillons avec HTML, doit être nos feuilles de style personnalisées donc elles doivent être dans le bon ordre. Le top sera pour notre base CSS. Donnons à cela un nom unique « fondation CSS », puis nous devons ajouter le chemin du fichier. Donc, le get_stylesheet_ uri fait référence au répertoire de modèle principal, qui a le style.css mais dans notre cas, nous avons un dossier CSS séparé donc nous avons juste besoin de concaténer ou add-on à la fin, le reste du lien. Donc, le « point » pour ajouter cela, puis ouvrez les guillemets, « /css/foundation.css » et il devrait prendre ceux à l'intérieur du dossier CSS, puis lien vers le fichier foundation.css. Ensuite, nous allons dupliquer ça deux fois de plus, et nous allons juste les séparer. Ensuite, nous devons ajouter le « app.css ». Donc, nous changeons juste le nom en app.css. Encore une fois, c'est dans le dossier CSS, mais nous avons juste besoin de changer cela en « app ». Ensuite, le troisième est pour les icônes de la fondation. Donc, ceux que nous voulons ajouter est le « foundation-icons.css ». Donc, nous changeons le nom pour être « icônes », et le dossier CSS. Cette fois, il y a un sous-dossier appelé « foundation-icons/foundation-icons.css » et enregistrez-le. En fait, juste une chose que nous devons faire en premier est [inaudible] le « stylesheet_uri », nous avons utilisé comme feuille de style principale, qui a besoin de changements pour « obtenir le répertoire de template », donc « template_directory_uri ». Il suffit de copier ça et de remplacer les trois. Collez les dedans. Ce « get_template_directory_uri » nous emmène aux racines principales du thème, puis nous ajoutons simplement sur l'extension. Cela nous amène au bon fichier. Sauvegardons, puis appuyez sur « Actualiser ». Maintenant, ça a l'air un peu mieux. Vous pouvez voir qu'une partie du style personnalisé a été ajoutée dans. Ce sont les liens pour les icônes en bas. Aussi, si nous allons dans les outils de développement, cliquez avec le bouton droit de la souris et « Inspecter » si vous utilisez Chrome. Ouvrons la section « tête » en haut. Nous pouvons également voir que nos feuilles de style que nous venons d'ajouter devraient être listées ici quelque part. Il y a notre foundation.css, c'est vu, bien. Nous avons le app.css, nous venons d'ajouter, les icônes de fondation aussi et puis enfin notre fichier style.css. Ils sont tous liés. Nous pouvons également faire la même chose que nous faisons pour les feuilles de style en ajoutant des fichiers JavaScript supplémentaires, en utilisant la fonction wp_enqueue_script. Tout ce que nous devons faire est juste de faire la même chose que ci-dessus en copiant la fonction mais en changeant le nom de fichier pour lier à nos fichiers JavaScript personnalisés. Sauvons ça. La dernière chose que je veux faire dans cette vidéo est d'inclure l'image du casque afin que l'image du casque que nous avons ajoutée dans le fichier header.php. C' est l'image ici. Nous devons ajouter notre image dans le poids WordPress. A l'intérieur des guillemets pour la source de l'image, nous devons ajouter une fonction PHP afin d'ouvrir les balises PHP, les balises d'ouverture et de fermeture. Puis à l'intérieur, nous devons ajouter « bloginfo ». Ouvrez ensuite les parenthèses, puis les citations. Pour ajouter le chemin du fichier, nous devons le faire de la même manière que les feuilles de style. Utilisons le « template_directory ». Je vais juste rendre ça un peu plus large. Ajouter un point-virgule après les crochets. Ensuite, nous devons nous joindre sur le reste du chemin du fichier. Après le répertoire de modèle, nous avons le dossier images, alors ajoutons simplement ceci à la fin, puis ajoutez une barre oblique avant le dossier de l'image. J' espère que cela a du sens. Nous utilisons une fonction PHP appelée bloginfo, qui est plugin dans le répertoire du modèle et puis nous ajoutons à la fin le dossier de l'image et le reste du chemin du fichier pour nous conduire à l'image du casque, ce que tu viens de faire. Sauvegardons cela, puis passons sur le site Web et actualisons. Il y a un petit problème, voyons ce que c'est. Le répertoire de modèle de fonction, en fait cela doit être sur la même ligne, il doit être continu. Sauvons ça. Essayons juste ça. Voilà, tu y vas. Maintenant, notre section tête ressemble plus à notre version finie. Aussi la zone de pied de page en bas ressemble également au site Web fini. C' est tout notre CSS qui prend effet. Il reste encore beaucoup de travail à faire, mais si vous revenez dans la vidéo suivante, nous continuerons avec la page d'accueil en créant le fichier front-page.php. 64. Développement de thème : convertir la page d'accueil: Jusqu' à présent, dans notre version WordPress du site, nous avons la zone de pied de page et aussi la zone d'en-tête, à peu près terminée. Dans cette vidéo, nous allons continuer à travailler avec la première page en créant un nouveau modèle de page appelé page.php avant. Si nous passons à notre modèle de soulignement, vous pouvez voir qu'il existe différents modèles de page, tels que le page.php. Si vous jetez un oeil à une rubrique et voyez qu'il s'agit du modèle qui affiche toutes les pages par défaut. Ce sera le modèle de page qui est utilisé sauf si un modèle de page plus spécifique est créé. Jetons un peu plus d'un coup d'oeil aux modèles de page WordPress. Rendez-vous à Google et allez juste faire une recherche rapide pour la hiérarchie des modèles de codex. Ce dont nous avons besoin est le Theme Developer Handbook. Une fois que nous sommes dans la section hiérarchie des modèles, nous pouvons voir que cela explique tous les différents modèles de page. Il nous montre quel modèle contrôle quelle page individuelle. Tout d'abord, nous avons la vue d'ensemble, sur laquelle vous pouvez cliquer et voir comment les modèles sont disposés. Si vous faites défiler vers le bas, nous pouvons commencer par l'affichage de la page d'accueil. Nous avons regardé jusqu'à présent et il a causé les messages de blog WordPress par défaut affichés sur la page d'accueil. Ceux-ci sont contrôlés soit par le modèle home.php. Si cela n'existe pas, WordPress recherche ensuite le index.php. Nous allons continuer à utiliser la page d'index, le blog plus loin dans cette section. Dans cette vidéo, nous allons nous concentrer sur le modèle front-page.php. Il s'agit du fichier modèle utilisé pour afficher les sites Web à partir de la page. Vous pouvez voir ci-dessous la priorité des modèles de page. Le principal provient de page.php. Si cela n'existe pas, WordPress recherche le modèle de page d'accueil, puis si cela n'existe pas, il utilise le page.php par défaut, que nous avons examiné auparavant dans un modèle. Ensuite, enfin, si aucune autre page ne peut être trouvée, il utilise le modèle index.php. Bien sûr, n'hésitez pas à faire défiler plus bas et jeter un oeil à plus d'informations sur les pages individuelles, les publications individuelles, et aussi comment nous pouvons créer différents modèles de page pour différentes catégories et tags. Mais je vais aller travailler avec le front page.php, dirigez-vous vers le thème WordPress. Je vais créer un nouveau fichier à l'intérieur de celui-ci va s'appeler fronts-page.php. Pour commencer, je vais copier tout le contenu du fichier page.php, sélectionner tout et copier et coller ceci dans notre page d'accueil. Nous n'avons pas besoin des commentaires en haut car il s'agit du modèle de page par défaut pour afficher la page d'accueil. Va également inclure notre propre html à partir du site statique supprime tout le html de la médulla. Vous pouvez également supprimer la barre latérale et l'enregistrer. C' est parce que notre version finlandaise n'a pas de barre latérale sur la première page. Maintenant, nous devons aller sur le tableau de bord WordPress et nous devons réellement créer une nouvelle page, aller à « Nouveau », puis « Page ». Ce sera une page où nous pouvons lier notre modèle de page d'accueil à. Appelons ça à la maison. Tout ce que nous devons faire est de cliquer sur Publier, puis passer aux paramètres, jusqu'à l'onglet de lecture. Nous devons changer notre page d'accueil pour afficher une page statique. Celui que nous devons afficher est à la maison, puis enregistrez cela, alors visitons le site. Maintenant, c'est la première page et tout ce que nous avons, c'est la section lourde de la section photo. C' est parce que dans notre modèle de page d'accueil, nous n'avons que l'en-tête et la fonction pied de page. Maintenant, nous pouvons supprimer le contenu de la page principale de notre site web statique. Allez sur les écouteurs Pro, puis le index.html. Nous avons déjà inclus toute la section d'en-tête. Nous avons déjà inclus la section des fonctionnalités. J' ai un peu plus bas quand il copie le contenu principal. Tout, de la section avec l'ID de la plage, jusqu'à la zone de pied de page, copiez cela. Ensuite, revenez à notre version WordPress, puis collez-le juste en dessous de l'en-tête, puis enregistrez cela, jetons un coup d'oeil. Maintenant, il y a notre section de contenu entre les deux, la seule chose qui manque vraiment ce sont les images. Maintenant, corrigeons les chemins du fichier image, tout comme nous le faisons dans le header.php. Je vais copier toute la fonction php, saisir tout entre la source de l'image entre les citations, copier tout cela, puis revenir à la première page et ensuite nous devons trouver les images libres. Le premier est dans le dossier images, et il s'appelle 1.jpg. Supprimons simplement cela et puis collez dans la fonction WordPress, puis le dossier images doit être changé pour vous. Numéro 1, 1.jpg afin de changer cela. Ensuite, faites la même chose pour la deuxième image. Supprimez la source de l'image basée sur la fonction WordPress. Ensuite, il suffit de changer le nom pour être le numéro 2.jpg. Faites ensuite défiler vers le bas jusqu'à l'image numéro 3. Conseils à toute modification de l' image numéro 3.jpg, et enregistrez cela. Donnons ça un rafraîchissement. Ça a l'air assez bien, regardons un peu de haut en bas. Il devrait ressembler exactement à notre version finlandaise. Oui, tout a l'air bien sur eux. Nous espérons que cela s'est bien passé pour vous et nous avons terminé pour finir la page de, et ensuite nous allons passer à convertir dans le menu pour être intégré avec WordPress. 65. Développement de thème : convertir notre menu: Bienvenue de retour. Dans cette vidéo, nous allons travailler sur l'accrochage de notre menu dans WordPress. Actuellement, nous avons quelques liens en haut, que vous venez des éléments de la liste HTML de base, et si nous cliquons sur eux, ils lieraient en fait n'importe où, parce que les liens recherchent la page blog.html, ou le about.html à partir de notre site statique. Donc, pour corriger cela, nous devons remplacer nos éléments de liste HTML par des menus WordPress. Donc, si nous allons au Codex WordPress, et si nous recherchons les menus de navigation, et c'est un lien dont nous avons besoin, donc nous pouvons voir que la première chose que nous devons faire, est d'enregistrer le menu à l'intérieur des thèmes functions.php fichier. Si nous faisions cela à partir de zéro, nous devons copier cette fonction, puis coller manuellement. Mais parce que nous utilisons le thème de démarrage de soulignement, si nous allons dans le function.php, et nous allons faire une recherche pour register_nav, et c'est ce dont nous avons besoin, les menus register_nav. Donc, le thème de démarrage que nous utilisons a déjà enregistré un menu principal et nous pouvons l'utiliser comme menu principal dans la section d'en-tête. Revenons au Codex. Si nous faisons défiler un peu plus loin, il y a une section appelée « Menus d'affichage » sur le thème. Nous devons utiliser une fonction PHP appelée wp_nav_menu. Nous devons donc coller cela à l'intérieur de notre thème, exactement où nous voulons que le menu apparaisse. Donc, je vais copier cette section, puis notre menu est dans le header.php, et nous trouvons les éléments de liste pour le blog, sur la page à propos de nous, supprimons simplement ces deux éléments de liste, et je vais coller dans le que nous venons de copier et cette fonction doit être entourée de balises LI. Donc, je vais mettre un ensemble de balises d'élément de liste à l'intérieur, puis coller dans la fonction que nous venons de copier, et puis tout ce que nous avons à faire est de supprimer le menu d'en-tête, et les changements pour être primaire, ce qui est le même que nos fonctions , juste ici. Je vais juste m'assurer que vous avez sauvegardé, puis allons visiter les sites, et rafraîchir. Donc maintenant notre menu est remplacé par une version WordPress. Nous avons la page d'accueil, ainsi que l'exemple de page par défaut. Je vais passer au tableau de bord, puis aux menus. Pour commencer, je veux en faire le menu principal. Alors assurez-vous que c'est sélectionné, et je vais aussi, automatiquement, ajouter de nouvelles pages au menu, une fois que nous les avons créées. Donc je vais sauver ça. Nous pouvons également supprimer l'exemple de page, et en fait, notre site Web fini n'a pas le lien de page d'accueil. Donc, supprimez simplement ces deux liens, puis enregistrez cela. Il est en fait supprimé tout le lien de menu donc nous n'avons pas besoin, mais au moins nous savons que le menu fonctionne. Donc, quand nous reviendrons dans la prochaine vidéo, je vais créer la page du blog. La nouvelle page de blog que nous ajoutons sera automatiquement ajoutée à la navigation supérieure. C' est donc notre menu WordPress maintenant ajouté au thème. Je te vois dans la prochaine vidéo. 66. Développement de thème : configurer la page d'index du blog: Bienvenue les gars. Dans cette vidéo, nous allons configurer notre page d'index pour afficher nos derniers articles de blog. Nous allons convertir notre blog en deux étapes. Cette vidéo se concentrera sur l'introduction des conteneurs de pages, les classes CSS et la mise en page générale de notre site statique, qui est le blog.html. Si nous descendons à la section blog, puis localisons le billet de blog, nous allons essentiellement copier tout ce qui entoure ces billets de blog, tels que les conteneurs et les lignes. Dans la prochaine vidéo, nous nous concentrerons sur les articles de blog individuels. Je les place dans un fichier appelé Content.php. Commençons dans le tableau de bord WordPress. Nous créons une nouvelle page. Ce sera notre page de blog. Appelons cela un Blog, puis publions. Ensuite, nous devons définir cette page pour afficher nos articles de blog. Alors allez dans Paramètres, puis Lecture. Ensuite, la page Articles, sélectionnez le blog. Alors, sauvegardez ça. Maintenant, lorsque nous visitons le site, la page du blog a été automatiquement ajoutée au menu, ce qui est bon. Parce que c'est maintenant un menu WordPress, si nous cliquons sur le lien, nous devrions être amenés à la page qui affiche les billets de blog, ce que nous faisons et il y a notre blog Hello world. Comme nous le savons déjà, le modèle de page, qui contrôle le blog est le index.php. Allez dans le dossier de thème et recherchez le fichier index.php. faisant défiler vers le bas, nous pouvons voir qu'il y a une boucle PHP while. Si vous vous souvenez de la vidéo while boucles, une boucle while s'exécutera toujours alors qu'une condition est vraie. Dans le cas de WordPress, tandis que les billets de blog sont disponibles. Nous pouvons ensuite afficher les billets de blog sur la page web, qui est incluse dans le fichier de contenu. Tout ce que nous allons mettre entre cette boucle tandis que nous allons courir pour chaque billet de blog. Nous allons travailler avec la boucle et les billets de blog individuels dans la prochaine vidéo. Pour l'instant, nous voulons juste définir la page sur les mêmes conteneurs et les mêmes divs que le site statique. Fondamentalement, nous allons copier tout ce qui entoure les articles de blog. Allez sur notre site statique sur le bureau, puis allez dans le blog.html. Tout d'abord, ouvrons cela dans le navigateur et jetons un oeil. Juste en dessous de la section d'en-tête, nous avons une section de légende qui est la bienvenue sur notre blog. Copions cela sur le site principal. Allez dans le fichier blog.html. Copiez cette section de légende et jusqu'à la div avec la classe du milieu huit. Fondamentalement, tout le chemin vers le billet de blog. Copiez ça sur notre thème. Parce que c'est juste en dessous de la section d'en-tête. La légende se trouve juste en dessous de l'image d'en-tête sur le site Web fini. Nous devons coller ceci, juste en dessous de la section d'en-tête. Coller et enregistrer. Je vais juste nettoyer ça un peu. Puis revenez sur le site statique dans le blog. Puis faites défiler vers le bas. Les zones que nous venons de copier sont la ligne et la div avec la classe du milieu huit. Cliquez sur la ligne de classe div, puis faites défiler vers le bas pour localiser la div de fermeture, qui est juste ici. C' est la dernière balise div de fermeture juste après la barre latérale. Je vais copier ça et aller jusqu'au haut, y compris la barre latérale. Copiez ça. Assurez-vous que vous avez la zone complète, y compris toute la barre latérale et la div de fermeture, juste au-dessus de la section libre moyenne. Copiez donc, puis revenez sur le thème, faites défiler vers le bas vers le bas, puis collez-le juste après la section primaire, puis enregistrez cela. Nous avons copié le contenu avant et après les messages de blog pour garder nos conteneurs de page et les classes CSS exactement le même que notre site statique. La seule différence est que nous avons remplacé les messages de blog HTML avec cette boucle WordPress, qui est juste ici. Cela signifie que WordPress peut générer les billets de blog, que nous pouvons créer à l'intérieur du tableau de bord. Enregistrez cette page, puis revenez sur le site, puis cliquez sur le blog. Le billet de blog commencera à travailler avec dans la prochaine vidéo. Nous avons notre barre latérale sur le côté droit, qui est celle que nous venons de copier. Nous avons aussi une deuxième barre latérale, qui est en bas. Il est tiré de notre page d'index. De bas en bas, on aurait la barre latérale. Nous allons ranger les barres latérales dans quelques vidéos, mais pour l'instant passons à la configuration des billets de blog individuels dans le fichier content.php. 67. Développement de thème : configurer les publications du blog: Bienvenue de retour. Maintenant, nous allons nous concentrer sur nos articles de blog individuels et comment les faire travailler dans un WordPress. Tout d'abord, nous allons créer quelques nouveaux billets de blog avec lesquels travailler. Ajouter un nouveau billet de blog, donc nouveau mur de post. Prenons un peu de Lorem Ipsum. Je veux générer cinq photos et je copie tout ça. Ensuite, ajoutez ceci dans notre post. Je vais également prendre une image en vedette. Je récupère notre projet, à l'intérieur du dossier des images. Je vais bien et en fait frappé un ou deux de plus à l'intérieur pour une utilisation ultérieure. Définissez l'image en vedette, puis publiez. Si nous allons sur Visiter les sites, consultez le blog. Vous remarquerez que le billet de blog que nous venons créer est maintenant inclus en haut de notre blog. Cependant, il ne ressemble pas à notre blog à l'intérieur du site de finition, qui est juste comme ça. Changeons ça maintenant. Si nous revenons au index.php et dans la section de boucle, vous pouvez voir que la boucle tire un modèle appelé contenu. C' est le modèle qui contient toutes les informations sur le billet de blog. Allez dans votre répertoire, puis recherchez un dossier appelé pièces de modèle. Puis à l'intérieur, ouvrez le content.php. Nous pouvons voir que c'est la partie du modèle pour afficher les messages. C' est un avec lequel nous devons travailler pour qu'il ressemble davantage à notre site Web de finition. Je vais nettoyer un peu ça. Tout d'abord, je vais supprimer l'en-tête. Supprimez l'ouverture sur la balise de fermeture. Je vais faire défiler vers le bas et supprimer la section de contenu d'entrée complète et aussi la section de pied de page d'entrée. Nous devrions supprimer cela, afin que nous puissions supprimer toutes ces sections et je voudrais simplement ajouter notre propre contenu comme nous en avons besoin. En fait, nous pouvons simplement supprimer cette entrée meta type 2. Supprimez cela. Sauvegardons cela et puis si nous actualisons, nous devrions constater que tout le contenu est supprimé à l'exception du titre. Résoudre cela maintenant en allant sur notre site Web statique à partir du bureau, allez sur le blog, puis descendez à nos articles de blog. Si vous localisez la div avec la classe du billet de blog, puis copiez cette section complète. Je reviens à notre thème WordPress et je colle juste après la déclaration if. Enregistrez cela, puis actualisez la page du blog. La première chose que vous remarquerez est que le billet de blog a deux titres de blog différents. Un que WordPress a généré, et un de notre section blog que nous venons de copier. Allons réparer ça maintenant. Le WordPress généré est ouvert en haut. Il y a un if else déclarations, qui affiche le titre du billet de blog. Tout d'abord, nous vérifions si la page est unique et cela signifie que si le billet de blog a été cliqué et lié à l'article complet et si c'est le cas, il va afficher le titre de la page avec un titre de niveau 1. Toutes les pages auront le titre affiché sous la forme d'un niveau 2. Pour correspondre à notre site Web, ne changera pas le titre de niveau 1 pour être de niveau 2 et fermera également. Pour toutes les pages, je vais changer ce titre pour être niveau 3 qui correspond à notre billet de blog, que vous pouvez voir qu'il est ici. Maintenant, WordPress génère notre titre de blog. Nous pouvons supprimer les nôtres. Supprimez cela de cela, puis visitez le blog et actualisez. Maintenant, on vient d'avoir le titre New Post 1. Comme vous pouvez le voir, nous n'avons pas l'image affichée que nous avons définie comme image en vedette. Nous avons toujours l'image de l'espace réservé, alors passons à content.php. Plus dans le contenu, laissons l'image placehold, puis remplacons ceci par une fonction WordPress. Ouvrez le php et puis la fonction dont nous avons besoin, il s'appelle la vignette de post. Donc theme_ post _ miniature et appuyez sur Enregistrer. Puis maintenant, si nous actualisons le blog, nous allons obtenir affiché l'image en vedette. Maintenant, nous allons travailler sur les fonctions WordPress ajoutées, afficher l'auteur, le nombre de commentaires, et aussi la date à laquelle le post a été créé. Entre les balises p, supprimons simplement tous les textes. Je vais remplacer cela par une fonction WordPress. Ouvrez le php. Nous devons inclure l'extrait. C' est la version montrée du contenu complet, qui va juste être affiché sous l'image. Maintenant, il y a la version raccourcie du texte Lorem Ipsum. Ensuite, remplacons l'auteur, donc supprimez le nom des auteurs, ouvrez les balises php, et celui-ci est simplement the_author () ; puis actualisez les données. Maintenant, après l'auteur, nous avons le proheadphones-admin, qui est le créateur de ce billet de blog, puis ensuite le nombre de commentaires. Encore une fois, ouvrez les balises php, ouvrant et fermant les balises. Celui-ci est appelé par la fonction appelée nombre de commentaires. Comments_number () ; Donc, enregistrez cela, actualisez. On y va. Il n'y a pas de commentaires sur ce post, mais l'exemple Hello World, qui est inclus avec WordPress, a un commentaire. Finalement, rendons la date dynamique. Donc, nous pouvons laisser le posté sur le texte, mais ajoutons juste une fonction php juste après cela. En fait, mettons une nouvelle ligne pour qu'il soit plus clair. Je veux faire écho pour obtenir les dates. Mais cette fois à l'intérieur des parenthèses, nous allons ajouter quelques paramètres pour nous assurer que les données sont affichées dans le bon format, puis à l'intérieur des parenthèses, je vais ajouter un F majuscule, un petit j, puis une virgule et une majuscule Y et vous voyez Y lorsque nous actualisons la page. Maintenant, nous allons copier les dates. Le F majuscule gauche était pour le mois, le petit j est une façon php d'inclure le jour, puis une virgule et puis un Y majuscule était l'année dans le format à quatre chiffres. Si vous êtes intéressé par différents formats de date php, un rapide Google va extraire toutes les différentes lettres que vous pouvez utiliser. Il existe différents formats de date. J' espère que tout fonctionne. J' allais ajouter deux autres articles de blog juste pour vérifier qu'ils fonctionnent tous. Nouveau post 2, nous allons copier sur l'exemple de texte, une image en vedette, puis publier, puis un de plus et puis nous allons visiter le blog. Espérons que lorsque nous faisons défiler vers le bas, il y a notre nouveau post 3, notre nouveau post 2, et l'original que nous avons créé. C' est juste terminé maintenant pour la section exemptée de blog, vous pouvez faire beaucoup plus tels que, en ajoutant des fonctions WordPress pour afficher les catégories ou les balises associées à chaque post. Tout ce qu'il faut est une recherche Google rapide ou consultez les codecs WordPress pour savoir comment le faire. Passons à la vidéo suivante. On va jeter un oeil à cette barre latérale. 68. Développement de thème : barre latérale: Bienvenue les gars. Dans cette vidéo, nous allons nous concentrer sur la barre latérale. Actuellement, si nous passons à notre section blog, affiché sur la page il y a deux barres latérales. Tout d'abord, une barre latérale sur le côté droit, qui est appelée depuis notre page d'index. C' est la section que nous avons tirée de notre site statique. Le second, est appelé à partir de la fonction get sidebar. Ceci est affiché en bas de la page, qui comprend les messages récents, les commentaires, les archives, les catégories. Si nous passons à un fichier appelé sidebar.php, nous pouvons voir que la barre latérale est générée à partir d'une barre latérale appelée sidebar-1. Nous pouvons trouver le contenu de la barre latérale en accédant à la section widgets du tableau de bord. Allez dans le tableau de bord et sélectionnez « Widgets » Ceci est la section de la barre latérale, qui est en bas de notre page de blog. Notre barre latérale du site fini inclut uniquement les catégories, et le bureau. Mettons-nous au travail en supprimant tous les widgets sauf les catégories. Ouvrez, puis cliquez sur « Supprimer » messages récents peuvent aller, commentaires, et les métadonnées peuvent aller trop. Il nous reste les archives et les catégories. Je vais à la page d'index, vous pouvez voir les catégories est la première, puis les archives. Réarrangons simplement ça pour être les mêmes. Maintenant, nous avons rangé la barre latérale. Si nous passons à la page d'index, puis utilisons la fonction get sidebar. Je vais cliquer dessus, puis le placer dans notre conteneur latéral. Placez-le juste en dessous de la div avec la classe de collant. Ouvrez les balises php, collez dans la barre latérale get, puis fermez. Ensuite, enregistrez cela, puis actualisez notre blog. Faites défiler. On a les catégories et les archives. La première section provient des widgets que nous venons d'ajouter, puis la deuxième section est HTML simple, qui est juste de cette section ici. Je vais supprimer cette section dans un instant. Mais d'abord, je veux m'assurer que le style des widgets correspond à notre site Web fini. Pour ce faire, je vais passer à notre fichier functions.php, puis je vais faire une recherche pour la barre latérale de soulignement du registre. Dans mon cas, c'est sur la ligne 88. C' est la barre latérale que nous voulons, qui est sidebar-1, et c'est celle avec laquelle nous travaillons actuellement. Il y a aussi des zones où nous pouvons ajouter du HTML, tels que divs, sections, ID et classes. Nous pouvons placer cela avant ou après les widgets ou même le titre. Nos titres de widget tels que les archives, les catégories au-dessus des en-têtes de niveau 4. Changons le niveau 2 pour être quatre. C' est avant et après le titre. Enregistrez cela, puis actualisez, et cela ressemble plus maintenant. Dans notre cas, tout ce que nous devions changer était le titre de niveau 4. Si vous avez une barre latérale plus complexe, vous devrez peut-être aller dans le widget avant et après, et ajouter différents divs ou différentes classes pour en faire beaucoup le site d'origine. Maintenant, il y a beaucoup [inaudible] que nous pouvons retourner dans la page d'index et supprimer le contenu HTML statique. Supprimez la première section, ainsi que la section archive. Attachez ça un peu, on y va. Cela devrait supprimer les deuxième ensembles et actualiser. Super, maintenant WordPress tire les catégories et aussi les archives. Nous avons maintenant la possibilité de cliquer sur les éléments individuels et d'être redirigé vers une page. Par exemple, celui-ci filtre tous les articles de blog à un certain mois. De même si vous aviez plus d'une catégorie, nous obtiendrons une liste de différentes catégories. Nous pourrions sélectionner une de ces catégories, WordPress appliquera des filtres. C' est notre barre latérale maintenant terminée. Je passe maintenant à la prochaine vidéo. 69. Développement de thème : page de publication unique: Salut tout le monde. Dans cette vidéo, nous allons jeter un oeil à la page de publication unique. Lorsque nous mon point de vue sur notre blog, nous pouvons cliquer sur le titre des messages individuels et nous sommes amenés à une page qui affiche seulement ce billet de blog et rien d'autre et cette vue est contrôlée par un fichier appelé le point unique PHP. Nous n'avons pas encore fait de travail dans le fichier PHP à point unique. Si nous rendons le site un peu plus petit et que nous étirons le contenu, vous pouvez voir que l'en-tête est centré et aussi le pied de page. Mais le contenu PHP à point unique n'est pas aligné à l'intérieur d'un conteneur. Allons réparer ça. Passons au point unique PHP et ajoutons les conteneurs. Nous pouvons les récupérer à partir de notre point d'index PHP. Recadrez la div avec la classe de rangée, et aussi les huit moyens, qui sont les conteneurs. Copiez cela et puis collez-les juste en dessous de l'en-tête get, puis si vous faites défiler vers le bas de la page, juste au-dessus de la balise PHP open end, nous pouvons fermer ces deux divs juste comme ça. Sauvegardons cela et puis actualisons et maintenant quand nous faisons la page pleine largeur, nous pouvons voir que les billets de blog sont tous centrés au milieu de la page. Maintenant, notre contenu semble beaucoup mieux. Maintenant, ajoutons la barre latérale pour être sur le côté droit. Revenons à la page d'index et copions la section de la barre latérale depuis le bas. Copiez le div avec la classe ou le milieu trois. Ensuite, revenez au point unique PHP, parce que nous voulons que la barre latérale soit toujours dans la ligne. Placez ceci entre les deux divs ou les deux tags div de fermeture que nous venons d'ajouter, en vous assurant qu'il est juste au-dessus de la div de fermeture pour la ligne. Enregistrez cela et puis actualisez et nous devrions obtenir la barre latérale, ce qui est génial. Si vous regardez le billet de blog, vous pouvez voir que nous avons encore la version raccourcie ou l'extrait, plutôt que les cinq photographies de Lorem Ipsum, que vous mettez dans le bloc. Je veux que cette page affiche le contenu complet plutôt que seulement la version raccourcie. Tout comme dans la page d'index, le point unique PHP extrait le contenu de l'article de blog d'un fichier appelé content dot PHP. Allons voir notre dossier maintenant. Nous avons déjà dit à ce modèle d'afficher uniquement une version raccourcie avec la fonction Excerpt. Comment pouvons-nous changer cela pour être le contenu complet lorsque vous affichez le post complet ? Eh bien, nous pouvons le faire en utilisant des instructions conditionnelles, comme nous l'avons regardé dans la section PHP. En utilisant une instruction if else, nous pouvons montrer la version abrégée ou complète en fonction de la page que nous affichons. Voyons comment nous pouvons le faire dans WordPress. Je vais aller sur Google et ensuite faire une recherche rapide pour les balises conditionnelles WordPress. Recherchez le codex sous balises conditionnelles. D' accord. Les balises conditionnelles peuvent être utilisées dans vos fichiers de modèle pour modifier le contenu affiché et la façon dont ce contenu est affiché sur une page particulière. C' est exactement ce qu'on veut. Jetons un coup d'oeil plus bas. Nous pouvons afficher le contenu selon si la page est à la maison, si la page est la page d'accueil ou par exemple, si c'est admin, si nous sommes dans une seule page, qui est exactement ce que nous voulons. Si le modèle est une seule page, nous voulons afficher le contenu complet. Si le modèle est à la maison, nous voulons simplement afficher l'extrait, et l'accueil est l'endroit où la page du blog est affichée. Revenons au point de contenu PHP. Ok, alors commençons par créer nos déclarations if-else et faire un peu d'espace. Nous voulons afficher l'extrait si la page est à la maison, ce qui signifie que la page est le blog. Faisons cela en ouvrant les balises PHP, puis commencez une instruction if. Donc, si, puis permet de recadrer cette fonction de maison et de la coller dans les parenthèses. Si la page est la page d'accueil, et ouvrez l'accolade, puis affichez l'extrait, puis nous devons fermer les étalonnages. Ouvrez le PHP. Fermez l'accolade et fermez PHP. Maintenant, nous ne devrions avoir l'extrait que si c'est le blog. Si nous allons sur le site et rafraîchir, nous perdons alors l'extrait, donc ils ne devraient être affichés que lorsque nous allons sur le blog, qui est juste là. Nous allons maintenant créer une section l, pour afficher le contenu complet si vous utilisez le modèle unique. Nous mettons dans le PHP, créons l'instruction else sur l'accolade d'ouverture et en fait, nous pouvons simplement copier cette ligne et la coller dans. Mais au lieu de l'extrait, nous pouvons utiliser le contenu, puis fermer l'instruction else avec l'accolade de fermeture, voilà. Jetons un coup d'oeil au site et voyons cela en action. Espérons que tout cela devrait fonctionner. Actualiser. Dans la section blog, nous allons donc obtenir la version raccourcie et ensuite nous allons cliquer sur le titre du post et nous y allons, donc il y a le contenu complet à l'intérieur du fichier unique, qui est les cinq paragraphes, de Lorem Ipsum. Ça commence à travailler comme on le voulait. Ok, donc c'est comme ça que nous pouvons travailler avec le modèle de page unique, et aussi comment nous pouvons travailler avec des instructions conditionnelles et des balises conditionnelles dans WordPress. 70. Développement de thème : convertir la page À propos: Bienvenue les gars. Dans cette vidéo, nous allons créer la page À propos de nous. Cette page a beaucoup de similitudes avec la page d'accueil, comme la section de navigation en haut, l'image principale, la section qui a les différentes gammes d'écouteurs disponibles, et la zone de pied de page en bas. Mais avec juste un peu de contenu ajouté entre les deux, comme le titre à propos de nous et aussi les paragraphes de texte entre les deux. Mettons-nous au travail en passant à notre thème. Nous allons créer un nouveau modèle de page. Cela va s'appeler page-about.php. Si vous vous souvenez de vidéos antérieures, nous avons regardé le modèle appelé page.php, qui est le modèle de secours générique pour afficher toutes les pages. Mais nous allons créer un modèle plus spécifique en créant un nouveau fichier appelé page-about.php. En raison des similitudes avec la page d'accueil, je vais commencer par copier tout le contenu de la page d'accueil. Sélectionnez tout et copiez, puis collez ceci dans notre page sur. Nous devons garder la zone de pied de page, puis je vais faire défiler vers le haut de la page et ajouter un commentaire. Juste en dessous de la balise php ouverte, ouvrez un commentaire php, puis ajoutez un nom de modèle. Nom du modèle : Il s'agit de nous, et l'étoile, puis la barre oblique de fermeture. Ce nom sera le nom du modèle, que vous pouvez sélectionner lorsque vous créez la page À propos de nous dans le tableau de bord. Allons-y et faisons-le maintenant. Accédez au tableau de bord, puis accédez à une nouvelle page. Je vais appeler cette page À propos, puis le modèle. Je vais sélectionner le modèle à propos de nous que nous venons de créer, puis appuyez sur « Publier ». Ensuite, passons à visiter le site et notre lien a été automatiquement ajouté au menu. Cliquez sur la page « À propos de nous ». Actuellement, nous avons juste la même mise en page que la page d'accueil. Ensuite, nous devons copier sur le titre about us, ainsi que les paragraphes du texte du signe statique. Allez sur les modèles statiques, puis allez dans about.html, faites défiler vers le bas. Nous devons copier la section de colonne, qui est ce dev, et cela contient le titre à propos de nous, copier cela, puis faire défiler vers le bas, copier la ligne qui contient tout le texte et aussi les deux devs de fermeture juste après. Copiez cela et revenez à notre thème dans la page about.php, puis cette section passe juste en dessous de l'en-tête. Collez en dessous de la fonction get header, puis enregistrez. Vérifions cela en appuyant sur « Rafraîchir ». C' est ça. Sur la section d'en-tête, nous avons l'en-tête à propos de nous, nous avons tous les paragraphes de texte, la section avec les différents modèles, puis la zone de pied de page en bas. C' est la page à propos de nous tout terminé, et si vous revenez dans la prochaine vidéo, nous allons ajouter quelques touches de finition à nos sites, ainsi que faire la fonction de boîte de recherche dans WordPress. 71. Développement de thème : barre de recherche et touches finales: Dans cette vidéo, nous allons ajouter quelques touches finales à notre site Web, en plus de faire fonctionner correctement la boîte de recherche dans la section d'en-tête. Donc, actuellement, si nous tapons quelque chose dans la boîte de recherche, rien ne fonctionne. C' est parce que c'est juste du HTML simple. Donc, dans cette vidéo, nous allons remplacer cette recherche par une fonction WordPress. Alors passons à Google et cherchons WordPress, la requête de recherche, et allons au Codex. Défilons vers le bas et jetons un oeil aux exemples. Cet exemple montre donc la requête de recherche dans une zone de recherche. Donc, je vais copier l'exemple, puis passer à l'en-tête, puis une fois dans le header.php, nous devons faire défiler vers le bas et trouver la section avec la boîte de recherche dans. Recherchez la div avec la classe de la barre supérieure à droite, puis dans la liste non ordonnée, en collant la fonction de la recherche WordPress, débarrassons-nous du tampon latéral maintenant pour lui donner plus d'espace. Alors dirigeons-nous vers le site et puis actualisons. Maintenant, nous avons deux boîtes de recherche. L' un est le WordPress généré, et nous avons notre propre boîte de recherche. Maintenant, nous devons nous assurer que la version générée par WordPress est stylée de la même manière que la nôtre. Alors allons-y et faisons-le maintenant. Donc, la première chose que vous remarquez sur les entrées d'ouverture pour la recherche est le type d'entrée est le texte, alors que le nôtre est la recherche. Alors que les changements aussi correspondent. Nous avons également une valeur d'espace réservé, et c'est le texte qui apparaît à l'intérieur de la zone. Donc c'est aussi à l'intérieur. Le WordPress So mips one est une entrée, alors que le nôtre est un bouton. Donc, nous allons changer les entrées pour être bouton comme ajoutons cette balise close and button. Copions le texte de recherche et collez-le là-dedans. Nous avons également le type de bouton plutôt que de soumettre, alors ajoutons cela à l'intérieur aussi. Nous avons également la classe sur le bouton, alors copions cela, puis collez cela aussi et sauvegardez. Voyons voir à quoi ça ressemble jusqu'à présent. Il regarde beaucoup plus comme la version finale. Nous allons maintenant déplacer le bouton de soumission pour être sur le côté droit. Donc, notre version a les entrées et le bouton dans les balises d'élément de liste, alors ajoutons ceux-ci aussi. Donc, la balise d'ouverture et une balise de fermeture, et faites exactement la même chose pour le bouton, copiez cela et collez-le là. Nous en avions besoin maintenant, alors supprimons nos éléments de liste de notre site statique, puis nous devons ajouter la liste non ordonnée avec la classe de menu, qui entourait à l'origine les deux éléments de la liste. Alors mettez cela, et collez-le au-dessus du premier élément de liste. En fait, nous pouvons juste remplacer la div là, et la div de clôture qui est maintenant la liste non ordonnée de clôture. Alors nettoyons tout ça. Assurez-vous que vous avez le formulaire, la balise d'ouverture et la balise de fermeture, puis imbriquez-le à l'intérieur la liste non ordonnée avec la classe de menu et la balise de fermeture, le premier élément de liste, puis le deuxième élément de liste, puis enregistrez-le. Maintenant, quand nous actualisons, nous devrions obtenir la boîte de recherche pour être en ligne, et maintenant il semble exactement comme dans la version statique. Maintenant, faisons une recherche et voyons si cela fonctionne. Cherchez bonjour, et maintenant, allons vers le bas. Dit nos résultats de recherche pour bonjour, et comme notre blog HelloWorld. Cherchons juste plus, post, et puis nous irons, il est dit notre nouveau post 3, nouveau post 2, numéro 1, et bien sûr l'exemple HelloWorld a post mot là-dedans. Maintenant, quand il est dans les conteneurs, comme nous l'avons fait dans la page de blog unique, parce que lorsque nous étirons la page avant la largeur, les résultats ne sont pas centrés au milieu de la page. Donc, quand il est sur les conteneurs à la page search.php, alors passons au index.php, et puis nous allons copier la ligne sur le médium a div. Copiez donc ces deux lignes, puis allez dans le search.php, qui est le modèle de page pour afficher les résultats de la recherche. Ensuite, exactement comme nous l'avons fait dans la seule page, collez-le juste souffler l'en-tête, puis fermez les deux divs juste après la section primaire, la première et ensuite la seconde. Enregistrez cela, puis actualisez. Maintenant, le contenu est déplacé à l'intérieur du conteneur. Encore une fois, tout comme nous l'avons fait avec le single.php, ajoutons la barre latérale sur le côté droit, revenons à la page d'index, puis descendez en bas, puis copiez la barre latérale, qui est un div avec la classe du milieu 3, puis dans la page de recherche et collez-les entre les deux divs que nous venons d'ajouter. Parce que cela a la fonction get sidebar, nous pouvons supprimer la barre latérale get du bas de la page, puis regardons les résultats de la recherche, et tout est fait. Maintenant, il y a une barre latérale sur le côté droit. Je vais blog post ou je vais chercher les résultats tous dans les conteneurs corrects. Ensuite, je vais passer au lien dans le logo à la page d'accueil. Donc, si nous cliquons sur le procès-verbal, nous sommes amenés à une page 404, qui est une page introuvable. Donc maintenant, nous devons ajouter une fonction WordPress pour lier le logo à notre page d'accueil. Ceci est simplement fait dans le header.php. Donc, si recherchez l'élément de liste avec la classe de texte de menu. Pro casque est un nom dans le coin supérieur gauche, donc plutôt que de lier dans le index.html, qui est une page que nous n'avons plus. Supprimons cela et ouvrons ensuite les balises php, balise de fermeture php. Il est mis sur sa propre ligne donc il est plus lisible, php, et puis nous allons faire écho, et la fonction dont nous avons besoin est escape URL, qui est esc_url, puis les crochets, puis à l'intérieur du crochet est la fonction que nous besoin, est home_url. Il s'agit d'un lien vers l'URL d'accueil du site Web et un point-virgule. Vérifions ça, alors rafraîchissez-vous. Maintenant, si nous cliquons sur le logo ou le titre du site, cela ne semble pas fonctionner, et alors voyons ce qui ne va pas. Commençons par le cyber pour obtenir plus d'espace. C' est juste une faute de frappe là-bas, donc le point d'interrogation à l'intérieur, sauvegardons cela, puis actualisons. Donc, si nous cliquons sur le logo ou le titre dans le coin, maintenant nous sommes ramenés à la page d'accueil. Je vais ajouter une fonction PHP de plus. Plutôt que d'avoir le titre de casque pro, nous voulons que WordPress construise la politique et dynamiquement. Alors mettons ceci sur une ligne séparée. Ouvrez une fonction PHP, et la fonction que nous voulons est echo get_bloginfo, et l'info du blog que nous voulons est le nom du blog, et n'oubliez pas le point-virgule, puis enregistrez cela et actualisez la page. Donc, plutôt qu'un titre codé en dur, cela saisit le nom du site que nous avons entré, que nous pouvons voir à l'intérieur du personnalisateur, puis jusqu'à l'identité du site. C' est donc le titre qui a été tiré. Donc, nous allons juste supprimer cela et enregistrer. Cela va changer le titre, alors revenons-le simplement, puis sauvegardez cela. La dernière chose que nous voulons regarder changer est les couleurs des liens, donc à la minute les couleurs des liens ont toutes été changées en violet, ce qui ne correspond pas au reste du thème. Alors allons dans les outils de développement et trouver le sélecteur. Alors allez à Inspecter. Ensuite, sélectionnons l'élément que nous voulons modifier. Faisons-le glisser vers le haut. Donc, nous pouvons voir dans les outils de développement que les liens, qui est un visité, a la couleur de violet. Allons dans nos feuilles de style personnalisées et assurez-vous que cela est changé. Donc style.css, et nous devons descendre directement à la bombe même. Donc, dans notre style personnalisé, nous avons déjà les tags a et aussi les états a hover. Nous allons donc ajouter une visite juste au-dessus de l'état de vol stationnaire. Nous allons simplement copier la couleur des liens du roman, puis rafraîchir. Donc je me débarrasse de la couleur pourpre. Voyons aussi le blog. Bien. Donc, si tous les liens violets ont été supprimés. Super. C'est donc la fin de la section, et c'est ainsi que nous pouvons convertir un site Web normal en thème WordPress. J' espère que vous avez apprécié cette section. Maintenant, passons au reste du cours. 72. Multisite WordPress : introduction: Bienvenue à tout le monde dans cette nouvelle section. Cette section est tout au sujet de vous présenter le réseau WordPress ou la fonctionnalité Multisite. Ceci est vraiment utile si vous souhaitez créer plusieurs sites ou permettre à d'autres personnes de créer un site dans le cadre de votre réseau. Tous ces sites sont contrôlés par la même installation WordPress. Vous pouvez donc administrer tous les sites à partir du même tableau de bord. Une ou deux choses juste pour vous faire prendre conscience avant de continuer. La première chose est d'utiliser une fonctionnalité Multisite, vous avez besoin d'une forme de publication Web en direct, parce que la fonctionnalité WordPress Multisite ne fonctionne pas bien avec l'hôte local. Il y a une solution de contournement disponible, et je veux placer un lien à l'écran vers un guide, si vous voulez essayer de donner un coup de pouce. Cependant, si vous pouvez le faire, je recommande d'utiliser un serveur web en direct. La prochaine chose est, bien sûr, lorsque vous utilisez un serveur web en direct, vous aurez également besoin de votre propre nom de domaine. Nous pouvons prendre un nom de domaine et aussi un hôte dans assez bon marché, si vous voulez juste l'utiliser pour la section. Cependant, ne vous inquiétez pas si vous activez cette section parce que vous n'avez pas l'hébergement. Vous pouvez toujours revenir à cette section à l'avenir si vous souhaitez configurer un Multisite sur un serveur en direct. Pour le reste de cette section, je vais utiliser un fournisseur d'hébergement appelé Bluehost. Ceci est disponible sur bluehost.com. Vous pouvez utiliser n'importe quel fournisseur d'hébergement Web que vous préférez. Je ne suis pas affilié à Bluehost. Je trouve juste qu'ils sont vraiment bons pour WordPress et ils sont même recommandés sur WordPress.org. Alors c'est tout. Si vous avez un hébergement web, continuons avec le reste de la section. Encore une fois, ne vous inquiétez pas si vous ne pouvez pas remplir cette section parce que vous n'avez pas à héberger, cette section sera toujours disponible pour l'avenir. Passons maintenant à la vidéo suivante, nous allons jeter un coup d'œil à ce qu'est un Multisite, quelques bons exemples d'utilisation, et aussi à certains cas où éviter d'utiliser le Multisite. Continuons et jetons un coup d'oeil à cela maintenant. 73. Multisite WordPress : qu'est-ce qu'un multisite ?: Une très grande fonctionnalité de WordPress, qui a été disponible à partir de la version 3.0, est la possibilité de créer un réseau de sites Web en tirant parti de la fonctionnalité multisite. Tout au long de cette section, nous allons créer un réseau de sites Web, qui est essentiellement plus d'un site Web, qui partagent tous la même installation WordPress. Le réseau actuel n'a pas l'air trop différent de ce que nous avons fait jusqu'à présent. Mais une fois que nous avons activé plusieurs sites, nous avons différentes options à notre disposition, telles que l'ajout de nouveaux sites Web que nous voulons contrôler au sein du réseau, l'accès à ces sites en affectant des administrateurs, et aussi décider quels plugins et quels thèmes nous aimerions mettre à disposition pour chaque site web. Je suis actuellement dans le Codex, dans la section Créer un réseau. Comme vous pouvez le voir, un réseau multisite peut être très similaire à votre version de WordPress.com. WordPress.com est un site Web que nous allons jeter un oeil dans un instant, qui permet aux gens de créer leurs propres sites Web ou leur propre blog. Effectivement, tous les sites que vous pouvez créer sur WordPress.com font partie d'un réseau. Si vous souhaitez en savoir plus sur la création d'un réseau, recherchez simplement Créer un réseau dans le Codex et vous serez redirigé vers cette page. Cependant, toutes les étapes qui sont incluses sur ces sites Web, nous allons passer à travers cette section, sorte que nous avons une idée pratique de la façon de faire exactement cela. Ensuite, je vais juste me diriger vers le blog Elegant Themes. Au sein de ce blog, il y a un article qui est appelé 15 Amazing WordPress Multisite Exemples in the Wild. Il suffit de faire une recherche rapide sur Google, je suis sûr que vous serez en mesure de le trouver. Ce site Web passe par quelques-unes des meilleures installations multisites, que vous n'avez pas pu trouver sur le web. Comme prévu, le premier qui me vient à l'esprit est WordPress.com. Il s'agit d'une plateforme multisite qui existe depuis un certain temps. Il a en fait des milliers de sites Web qui sont activés en tant que parties du réseau. WordPress.com permet à quiconque de rejoindre ce réseau et de créer son propre site web ou son propre blog. C' est vraiment simple et facile à utiliser. Si vous venez de vous rendre à WordPress.com, c'est vraiment simple de commencer avec ces différents plans. Pour obtenir un site Web WordPress activé, c'est vraiment simple que de sélectionner votre domaine, votre thème, le prix et le plan que vous souhaitez suivre, et vous pouvez commencer à partir de là. Revenons sur le site Elegant Themes, je vais jeter un coup d'oeil à un ou deux autres. L' un des grands sites Web utilisant le multisite WordPress est le site Web de la BBC America. Ce site web a chaque spectacle sur son propre site web. Chacun de ces sites Web utilise un thème enfant et il peut être administré séparément, si nécessaire, ou nous pouvons affecter différents administrateurs à un groupe de sites. faisant défiler vers le bas, nous avons aussi les pages du blog du New York Times. Il dit qu'il a plus de 60 blogs, ce qui signifie plus de 60 sites Web distincts, tous faisant partie du même réseau WordPress. Comme vous pouvez le voir, il y a quelques entreprises assez grandes qui utilisent la fonctionnalité multisite WordPress. Mais comme avec n'importe quelle fonctionnalité ou tout logiciel, il y a toujours des avantages et des inconvénients et le multi-site n'est pas une différence. Il y aura toujours des occasions où c'est bon à utiliser et où ce n'est pas tout à fait bon pour vous. Jetons un coup d'oeil à certaines utilisations multisites et aussi à certains des inconvénients. Vous pouvez créer votre propre réseau de blogs ou de sites Web à des fins personnelles ou professionnelles. Si vous avez votre propre blog personnel et que vous pouvez avoir différentes niches et que vous voulez garder ces différents intérêts séparés, vous pouvez le faire en utilisant un réseau. Vous pouvez également avoir une entreprise et vous pouvez souhaiter que certains de ces départements ou sections aient leur propre site Web ou leur propre administrateur, et un multisite est idéal pour cela. Ok, donc le site Web de votre entreprise nécessite différentes sections gérées par différentes équipes. C' est un exemple qui est similaire à l'exemple de BBC America que nous venons de regarder, où différentes sections telles qu'un spectacle différent, peuvent être gérées par différentes équipes ou peuvent nécessiter un style différent, un thème différent, ou un ensemble différent de plugins. Un autre bon cas multisite peut être une entreprise avec plusieurs succursales ou des emplacements différents, que vous souhaitez gérer de manière indépendante, ou souhaitez-vous également permettre à quiconque de créer son propre site Web, qu' il s'agisse d'un un site Web gratuit ou un abonnement payant. Ce cas est similaire à WordPress.com que nous venons d'examiner auparavant, où nous pouvons inviter les utilisateurs finaux à rejoindre notre réseau et créer leur propre site Web. Bien sûr, il y en a beaucoup d'autres qui, je suis sûr, vous pouvez penser, mais le dernier que j'ai inclus dans cet exemple est pour l'hébergement de sites Web clients. Après avoir créé un site Web pour un client, vous pouvez inclure son site Web dans votre propre réseau. Ensuite, après l'avoir construit, vous pouvez continuer à s'occuper du site Web ou à l'administrer, ainsi que de tous les autres sites qui font partie de votre entreprise ou agence. Tous les autres prennent juste une partie du contrôle loin de certains utilisateurs finaux. Il offre également de nombreux avantages, tels que vous pouvez mettre à jour tous vos sites Web en même temps, qui inclut le noyau WordPress ou tous les thèmes ou plugins que vous avez installés, de bonnes raisons d'utiliser un multisite WordPress. Maintenant, regardons quelques inconvénients ou quelques raisons quand ne pas utiliser un multisite. La première est assez évidente. Si vous n'avez besoin que d'un seul site Web et que vous n'avez pas de plans pour plus ou pour toute extension, évidemment une installation WordPress standard est plus que bien pour cela. Si vous avez un site Web et que vous voulez être en mesure de gérer vos propres thèmes ou de gérer vos propres plugins, alors un site autonome est certainement le chemin à parcourir. Ou si votre site Web a une bonne raison d'exiger sa propre base de données, que ce soit pour la sécurité ou pour toute autre raison, alors un multisite n'est pas nécessairement un bon choix. Si votre site Web est piraté ou si votre site Web est en panne pour une raison particulière, cela signifie que tous les sites individuels sur le réseau sont en panne car ils partagent tous la même installation WordPress. Certains plugins peuvent ne pas fonctionner correctement sur un réseau multisite, c'est quelque chose à surveiller. Avant de passer en revue les raisons d'ajouter tous les sites Web de vos clients sur le multisite, vous pouvez également constater qu'un client particulier peut avoir son propre hébergement ou peut vouloir avoir plus de contrôle sur le site Web. La dernière raison pour laquelle j'ai répertorié est que vous n'avez peut-être pas accès ou les autorisations nécessaires pour modifier les fichiers qui se trouvent sur votre serveur Web, et cela causera un problème lors de l'activation du multisite. Nous allons jeter un oeil à quels fichiers ils sont exactement dans les prochaines vidéos. Maintenant, passons à entrer dans notre compte d'hébergement et activer le multisite WordPress. 74. Multisite WordPress : activer un réseau WordPress: Bienvenue les gars. Dans cette vidéo, nous allons jeter un oeil sur la façon dont nous pouvons activer notre multisite WordPress. Comme je l'ai mentionné au début de la section, je vais utiliser un compte d'hébergement en direct de Bluehost. Bien sûr, vous pouvez utiliser n'importe quel hôte que vous préférez. Mais je veux parcourir ces vidéos avec un compte Bluehost. Si vous utilisez un autre fournisseur d'hébergement, vous devrez peut-être suivre une ou deux étapes différentes. Mais beaucoup de fournisseurs d'hébergement différents ont une installation WordPress en un clic. Espérons que vous ne devriez pas avoir trop de problème en suivant. Je suis actuellement connecté au compte. À l'intérieur du panneau d'administration Bluehost, il y a une application pratique WordPress outils, sur laquelle nous cliquons en haut. Ensuite, une fois que vous êtes à l'intérieur des outils WordPress, nous devons cliquer sur le « Nouvelle installation », et vous devriez avoir le choix de sélectionner un nom de domaine. J' ai un nom d'administrateur de domaine disponible appelé reactacademycause.com. Je veux installer WordPress sur ce domaine. Le chemin que vous pouvez laisser vide sauf si vous voulez ajouter un sous-dossier pour installer WordPress à l'intérieur. Mais je vais juste le laisser sur le domaine principal. Le titre du site, et toutes les autres options sont assez explicites. Le titre du site, je devrais appeler mon Multisite. Aux fins de la démonstration, je veux ajouter un nom d'utilisateur et un mot de passe simple de multisite et multisite pour le mot de passe aussi. Bien sûr, les sites Web en direct auront besoin d'un mot de passe plus fort. Ensuite, ajoutez dans votre e-mail, puis nous devons cliquer sur « Installer WordPress ». Cela prend juste quelques instants à installer, et c'est juste une installation WordPress standard, comme nous allons chercher le reste du cours. Ce n'est pas différent des trois premiers projets que nous avons créés, mais nous allons le convertir en un multisite très bientôt. Mais pour l'instant, cliquez sur « Actualiser ». Cela devrait être, c' est notre WordPress installé sur notre propre domaine. Pour tester, je vais juste passer à l'URL, et ensuite nous devons aller à la connexion. Je sélectionne multisite, multisite aussi, puis je me connecte. Ça veut dire que nous sommes tous prêts à partir. Nous avons le tableau de bord ou le backend de WordPress, que vous devriez tous connaître maintenant. Je vais juste cliquer sur, je n'ai pas besoin d'aide juste pour l'instant, juste pour me débarrasser de cette page. Je vais chercher le tableau de bord WordPress. Si vous cliquez sur l'icône d'accueil en haut à gauche, vous accéderez à notre page d'accueil. C' est juste une page d'accueil vierge pour l'instant. Maintenant, j'ai une installation WordPress réussie. Maintenant, pour transformer cela en multisite, nous devons trouver certains des fichiers à éditer. Si nous revenons à notre fournisseur d'hébergement, et si nous passons à l'onglet hébergement, puis je vais aller dans le cPanel, qui est juste en dessous. Votre fournisseur d'hébergement à nouveau, pourrait être légèrement différent, donc nous trouvons juste un moyen d'entrer dans le cPanel. Ensuite, je vais faire défiler vers le bas jusqu'à la dernière section, qui est juste ici. Ensuite, je clique sur le « Gestionnaire de fichiers », puis tous les fichiers pour tous WordPress sont dans public_html. Nous devrions voir certains fichiers et dossiers qui sont familiers à partir de nos sections localhost. La première chose que nous devons faire est de trouver le fichier wp-config. Si nous faisons défiler vers le bas et trouvez wp.config.php. Je vais mettre en évidence ce fichier et ensuite aller au sommet où il y a un éditeur de code. Cliquez dessus, puis sélectionnez Modifier. Maintenant, nous allons ouvrir le contenu du fichier de configuration. La première étape que nous devons faire est de faire défiler vers le bas, puis nous devons trouver la ligne qui dit, c'est tout, arrêter l'édition. Juste au-dessus de cette ligne, nous devons taper une ligne de code. Commencez par définir entre parenthèses et les guillemets. Je vais taper WP_ALLOW_MULTISITE, puis une virgule , puis nous allons définir ceci sur true avec point-virgule à la fin, puis cliquez sur le bouton « Enregistrer » en haut pour enregistrer le fichier, puis juste fermer. Ensuite, le dernier, nous allons nous diriger vers notre site Web, puis cliquer sur « Rafraîchir ». Ensuite, une pierre de touche, dirigez-vous vers les outils, vous devriez voir une nouvelle option apparaître, qui est la configuration du réseau. Cliquez dessus, et cela nous amène à la mise en place du réseau. La première chose que nous devons faire est de désactiver les plugins. Il suffit de cliquer sur le lien, qui est là. Je n'ai qu'un plug-in à désactiver, alors il suffit de cliquer dessus. Ensuite, une fois que cela est fait, nous pouvons retourner à notre application réseau à l'intérieur des outils. Maintenant, nous avons un autre écran. Nous sommes maintenant sur le processus d'installation réseau. Nous avons quelques options où nous devons décider de la structure URL de notre site Web. Pour cette démonstration, je vais utiliser des sous-répertoires. Je vais m'assurer que c'est sélectionné là-dessus. Un sous-répertoire est notre propre URL suivie d'une barre oblique, puis le nom de notre site Web. Vous pouvez avoir des sous-domaines, ce qui est tout comme la démonstration ci-dessus, où nous aurons le nom du site suivi de notre URL. Si vous ne souhaitez pas utiliser l'option sous-domaines, vous devrez peut-être activer les sous-domaines génériques. Pour ce faire, vous devrez peut-être consulter votre fournisseur d'hébergement ou la documentation pour obtenir des instructions sur la façon de procéder. Mais pour l'instant, je vais cliquer sur les sous-répertoires. Cependant, sachez que cette option n'est disponible que sur les nouvelles installations WordPress. Si votre installation a un mois plus ancienne, vous seriez obligé d'utiliser l'option sous-domaines. Gardez ça à l'esprit. Faire défiler vers le bas va garder le titre du réseau en tant que sites multisites, puis cliquez sur « Installer ». Maintenant WordPress nous donne quelques lignes de code que vous devez ajouter, tout d' abord au fichier wp-config que nous avons examiné auparavant, puis le fichier htaccess. Commencez à l'intérieur du fichier de configuration, cliquez sur les lignes de code qui ont besoin à, puis copiez-les. Ensuite, revenez dans notre Gestionnaire de fichiers, puis éditez le fichier wp-config.php. Cliquez sur « Modifier », puis faites défiler vers le bas comme avant aussi, c'est tout. Ensuite, collez ceci dans et puis cliquez sur « Enregistrer ». Recherchez le premier bouton, et le suivant nous devons ajouter du code au fichier htaccess. Copiez le code, puis revenez dans le Gestionnaire de fichiers. Ensuite, avec l'intérieur du public_HTML, un problème que vous pouvez trouver est par défaut le fichier htaccess n'est pas visible. Vous devrez peut-être vérifier auprès de votre fournisseur d'hébergement pour savoir comment trouver le fichier htaccess. Si vous utilisez Bluehost, qui masque également le fichier, vous pouvez ajouter une chaîne à la fin de l'URL, qui est le symbole esperluette. Ensuite, affichez masqué égal à un, puis retournez. Ensuite, vous devriez trouver à l'intérieur du fichier public, il y a notre htaccess, cliquez dessus, puis éditer. Ensuite, le code que nous venons de copier, nous devons coller entre le module IF, puis terminer dans les balises du module IF. Supprimer toutes les valeurs par défaut, puis coller dans ce que nous venons de copier, cliquez sur « Enregistrer ». Alors maintenant, si tout se passe bien, nous devrions être en mesure d'aller sur notre domaine, cliquer sur « Rafraîchir », puis de se connecter. Ensuite, une fois que vous serez de retour à l'intérieur du tableau de bord, nous aurons une nouvelle option en haut, qui est mes sites. Félicitations si vous avez mes sites apparaissant en haut de la navigation. Cela signifie que la configuration réseau a été un succès et que vous avez maintenant accès à l'administrateur réseau. Maintenant, vous avez accès à l'administrateur réseau. On laissera cette vidéo là. Nous passons maintenant à la prochaine vidéo, nous allons jeter un oeil sur la façon dont nous pouvons ajouter des sites à notre réseau. 75. Multisite WordPress : ajouter des sites à un réseau: Nous devrions maintenant activer le réseau Multisite, avec votre fournisseur d'hébergement. Si vous n'avez pas l'option Mes sites disponible dans la barre de navigation supérieure, assurez-vous de revenir en arrière et de suivre les étapes avant de continuer avec cette vidéo. Donc, nous savons que celui-ci survolera l'icône Mon site en haut, nous avons l'administrateur réseau, et nous avons également notre site Web WordPress Multisite, et c'est le seul et unique site Web que nous avons disponible sur le réseau. C' est le site principal du réseau. Nous allons travailler sur l'ajout d'un nouveau site à notre réseau. Dans le tableau de bord, cliquez sur « Mes sites », Administrateur réseau, puis sur Sites, puis une fois que cela se charge, cliquez sur « Ajouter nouveau » en haut. Nous avons la possibilité d'ajouter un sous-répertoire, que nous avons activé dans la dernière vidéo. Aux fins de cette démonstration, je vais créer un magasin de téléphone, et aussi un magasin d'ordinateur portable, deux autres sites réseau. Donc, pour le phone-shop, ajoutons l'extension URL de phone-shop. Le titre du site est également Phone Shop, la langue de votre choix, puis ajoutez dans un e-mail. Donc, vous avez peut-être juste remarqué là lors de la saisie de l'e-mail, le WordPress a reconnu que c'est un utilisateur existant, ou un administrateur existant, et donc, le magasin de téléphone que nous avons ajouté au panneau d'administration pour cet utilisateur. Tout comme il est dit coup, si une adresse e-mail est entrée qui n'est pas reconnue, WordPress créera automatiquement un nouvel utilisateur pour cette adresse e-mail admin. Cliquez sur « Ajouter un site ». Maintenant, si nous revenons à Mes sites en haut. Encore une fois, nous avons le Multisite, qui est le site Web que nous avions d'avant. Également juste en dessous, puisque je me suis créé en tant qu' utilisateur en entrant mon e-mail pour la boutique téléphonique, il apparaît également dans ma liste de sites sur lesquels nous avons le contrôle. Allons de l'avant et créons un de plus. Donc, encore une fois dans l'administrateur réseau, ajoutez des sites, allez à Ajouter un nouveau. Ensuite, le troisième site sera appelé l'ordinateur portable shop. Au titre du site, mettez cette fois dans l'e-mail d'administration, je vais ajouter un e-mail différent. Pour l'instant, je vais juste en inventer un. Donc test@test.com, puis cliquez sur « Ajouter le site ». Il y a notre troisième site web créé. Si nous revenons au sommet de Mes Sites, contrairement à ce qui s'est passé auparavant, nous n'avons pas la boutique d'ordinateurs portables apparaissant dans notre administrateur parce que nous avons ajouté un e-mail d'administration différent pour celui-ci. Dans la vidéo suivante, nous allons jeter un oeil aux utilisateurs et nous allons également nous connecter à l'écran d'administration de la boutique d'ordinateurs portables. Mais pour l'instant, passons simplement à notre URL, et vérifiez simplement que les deux sites supplémentaires fonctionnent correctement. On a le cours « React Academy ». Tout d'abord, regardons la boutique téléphonique. Puis enfin, passons à notre boutique d'ordinateur portable, puis appuyez sur « Entrée », et voilà. Il y a donc notre boutique d'ordinateurs portables et nos sites de réseau gratuits sont tous activés. C' est ainsi que nous pouvons ajouter différents sites à notre réseau, et je vous verrai maintenant dans la prochaine vidéo. Nous allons jeter un oeil à différentes autorisations utilisateur et aussi le super administrateur. Donc on se verra là-bas. 76. Multisite WordPress : utilisateurs et super administrateurs: Bienvenue dans cette vidéo intitulée Utilisateurs et le Super Admin. Pour commencer, nous voulons nous diriger vers le tableau de bord. Si nous passons à Mes sites, et dans l'administrateur réseau, cliquez sur le tableau de bord. Ensuite, si nous descendons à l'option Utilisateurs, nous remarquons que, ainsi que notre nom d'utilisateur. Nous avons également l'administrateur de la boutique d'ordinateur portable, qui aurait dû être créé automatiquement par WordPress lorsque nous finissons aujourd'hui. Une adresse e-mail différente pour notre boutique d'ordinateurs portables. Une chose que vous pouvez remarquer est que votre propre utilisateur peut avoir le mot Super Admin juste après, et cela est différent de l'administratoral auquel nous sommes habitués lorsque nous créons un seul site WordPress. Allons à Google. Si nous allons au codex, puis les rôles, puis les capacités, vous devriez être amené à ce lien du codex WordPress. Donc, nous faisons défiler vers le bas, nous pouvons voir un résumé des différents rôles dans WordPress. Jusqu' à présent, dans ce cours, lors de la construction du projet, nous avons eu l'administrateur comme premier rôle. L' administrateur est quelqu'un qui a accès à toutes les fonctionnalités d'administration d'un seul site Web. Cependant, maintenant avoir un nouveau rôle qui est le super admin. Le super administrateur est quelqu'un qui a accès à toutes les fonctionnalités d'administration du réseau du site et aussi à toutes les autres fonctionnalités. Donc efficacement, le super administrateur s'occupe de l'ensemble du réseau de sites. Cela signifie également que le rôle d'administrateur n'a pas exactement les mêmes privilèges, ce qu'il fait dans un seul site Web. Ceci est lié à des choses telles que les thèmes et les plug-ins. Nous les regarderons plus en détail dans la prochaine vidéo. Mais pour l'instant, revenons au tableau de bord. Si nous regardons le deuxième utilisateur qui est pour le magasin d'ordinateur portable, si nous cliquons sur l'utilisateur, nous avons tous les paramètres habituels pour éditer un utilisateur. La première chose que vous remarquez est que si vous faites défiler vers le bas, le nom d'utilisateur a été défini, et il ne peut pas être modifié. Nous avons la possibilité d'accorder à l'utilisateur des autorisations super admin, si nous le voulons, mais la première chose que nous voulons faire est de faire défiler vers le bas, puis de créer un nouveau mot de passe. Pour garder cela simple, je vais juste appeler cet ordinateur portable multisite, puis confirmer l'utilisation du mot de passe faible, puis mettre à jour cela. Ensuite, je vais passer à notre login. Donc déconnectez-vous, donc le super administrateur est maintenant déconnecté. Maintenant, je veux me connecter en tant que boutique d'ordinateurs portables, puis en tant qu'ordinateur portable multisite-. Maintenant, nous sommes connectés à la zone d'administration pour le magasin d'ordinateurs portables autonomes. Si nous allons à Mon site en haut, maintenant nous sommes sur le contrôle d'un seul site par cet utilisateur, qui est le magasin d'ordinateurs portables, aucun des contrôles que nous avions en tant que super administrateur, comme la possibilité d'ajouter des sites supplémentaires. Cependant, nous cliquons sur les utilisateurs, nous voyons que notre utilisateur a le rôle de l'administrateur, de sorte que nous pouvons effectuer la plupart des tâches habituelles d'administration du site que nous avons vues auparavant, telles que l'ajout de pages, modification des paramètres, et aussi la gestion des commentaires. Cependant, il y a quelques choses qui manquent, comme la possibilité d'ajouter de nouveaux thèmes et plug-ins, et c'est quelque chose que nous allons examiner plus en détail dans la prochaine vidéo. 77. Multisite WordPress : plugins et thèmes: Nous allons commencer cette vidéo en regardant ajouter des thèmes à notre réseau. Cela doit être installé par le super administrateur et peut être mis à la disposition de tous les sites du réseau, ou sur une base site par site. Nous allons aussi chercher des plugins dans cette vidéo, mais nous allons commencer par regarder les thèmes. Une chose que vous pourriez trouver utile pour cette vidéo et aussi pour les prochaines vidéos, c'est que je me suis connecté en tant que deux utilisateurs. Sur le côté droit, j'ai ouvert un autre navigateur. Dans mon cas, j'utilise Firefox, et je l'ai utilisé pour me connecter en tant que Laptop Shop ou l'un de nos administrateurs réseau. Il est peut-être beaucoup plus facile d'avoir une seconde navigation ouverte et connectée en tant qu'un des sites du réseau. En utilisant le navigateur Chrome normal, je suis connecté en tant que super administrateur. Donc, nous pouvons basculer entre les deux, nous n'avons pas besoin de nous connecter ou de nous déconnecter tout le temps. d'abord, regardons comment permettre à un thème d'être disponible pour l'ensemble du réseau. En tant que super administrateur, si je vais au Tableau de bord, puis à Mes sites, Administrateur réseau, puis à Thèmes, nous avons la liste des thèmes disponibles ainsi que les options Ajouter Nouveau. Je vais juste y aller et vous pouvez chercher tout ce que j'aime, donc je vais juste chercher le thème Storefront que nous avons utilisé dans ce cours. Il s'agit d'un projet de commerce électronique. Je vais juste passer le curseur sur cela, puis cliquez sur « Installer ». Une fois cela fait, vous saurez que le bouton Installer passe à Activer le réseau. Ce bouton rend un thème disponible pour tous les sites sur le réseau, alors cliquez dessus. Nous revenons à la liste des thèmes disponibles. Il y a notre thème Storefront que nous venons d'activer, et nous avons également la possibilité de désactiver le réseau si nous voulons le faire à l'avenir. Aussi la même chose avec tous les sites qui sont installés par défaut, nous avons également la possibilité d'activer et de désactiver ceux-ci. Si nous voulons simplement ajouter un thème à activer pour certains sites, nous pouvons aussi le faire. Si nous revenons à Ajouter un nouveau, et encore une fois il suffit de choisir un thème supplémentaire, nous allons pour le thème spacieux du premier projet, puis une fois qu'il est trouvé, appuyez sur « Installer », mais cette fois nous ne cliquez pas sur Network Enable, parce que nous voulons simplement que cela soit disponible pour certains sites. Maintenant, il est installé. Si nous revenons à l'administrateur réseau, puis à notre liste de sites, si nous descendons à notre boutique d'ordinateurs portables, puis passez à Modifier, puis sélectionnez l'onglet Thèmes, je vais faire une liste des thèmes disponibles que nous pouvons activer pour le site. C' est au sommet, nous disons que c'est des thèmes activés par le réseau. Ils ne sont pas affichés à l'écran. C' est pour des raisons évidentes parce que le thème a déjà été mis à disposition pour tous les sites du réseau, donc nous n'avons pas besoin de l'activer à partir de cet écran. Pour le Laptop Shop, activons le thème spacieux. Maintenant, c'est fait. Si nous allons à notre deuxième navigateur, passons à Apparence, puis Thèmes, nous avons le thème 2017 par défaut, nous avons le thème Storefront, qui est activé réseau pour tous les sites, et nous avons également activer le thème spacieux. Essayons simplement de désactiver le thème spacieux en tant que super administrateur, puis essayons de rafraîchir et de le faire aller. Maintenant, nous avons seulement disponible le thème par défaut et le thème réseau activé. C' est une façon de contrôler exactement quel thème nous voulons avoir disponible pour un site donné. Jetons maintenant un coup d'oeil à l'ajout de plugins à notre réseau, et tout comme lors de l'utilisation de thèmes, les plugins doivent également être installés par le super administrateur. abord, commençons par activer un plugin pour l'ensemble du réseau, alors revenez à notre administrateur principal. Vous devez accéder à Mes sites, puis à l'administrateur réseau. Il y a aussi une option Plugins, donc nous allons juste là et d'une manière similaire à avant, cliquez sur « Ajouter Nouveau ». Maintenant, pour cette démonstration, je vais aller pour le plugin Jetpack. Je vais chercher Jetpack, et c'est ce que nous voulons par Automattic, puis Installer maintenant. Il suffit de donner un moment pour installer. Ensuite, une fois que cela est fait, nous obtenons le même bouton Network Activate. Je vais cliquer dessus. Ensuite, nous sommes ramenés à notre liste de plugins. Dans chacun des plugins installés, nous avons également la possibilité d'activer le réseau ou de désactiver le réseau. Maintenant, ce plugin particulier est activé par le réseau. Il est disponible pour tous les sites du réseau, mais il ne peut pas être supprimé par les administrateurs de site individuels. Revenons à vous, notre boutique d'ordinateur portable, puis rafraîchissons. Maintenant, dans le tableau de bord, nous avons l'option plugin Jetpack, comme nous le ferons sur tous les sites réseau. C' est idéal si nous voulons que le plugin soit disponible pour tous les sites du réseau. Mais si nous voulons juste un plugin activé sur d'autres sites, nous devons faire les choses légèrement différemment. Retour au super admin, installons un nouveau plugin en allant dans Ajouter Nouveau. Je vais ajouter un plugin appelé Advanced Custom Fields, puis rechercher cela. Je vais juste l'installer, mais cette fois, une fois que tout sera fait, nous ne cliquerons pas sur le bouton Activer le réseau. Nous pouvons activer ce plugin sur une base individuelle site par site, en accédant à Mes Sites. Ensuite, si nous descendons à l'un des sites sous notre contrôle, alors allons à la boutique téléphonique et puis cliquez sur le « Tableau de bord ». Nous pouvons descendre aux Plugins, puis il y a le plugin Advanced Custom Fields que vous avez la possibilité d'activer. Une fois activé, il n'est activé que sur le seul site Web pour lequel nous l'avons activé. Dans notre cas, c'est la boutique téléphonique. Certains d'entre vous peuvent remarquer que si nous accédons à Mes Sites, nous n'avons que le Multisite et la Boutique téléphonique disponibles sous notre contrôle. n'y a pas d'option pour accéder au tableau de bord de la boutique Laptop. C' est parce que nous devons nous ajouter en tant qu'administrateur pour le Laptop Shop. Maintenant, nous pouvons facilement le faire en allant à l'administrateur réseau, et en descendant sur les sites. Si vous allez dans la boutique d'ordinateur portable et cliquez sur « Modifier », nous pouvons aller dans l'onglet Utilisateurs en haut, puis tout ce que nous avons à faire est d'aller à Ajouter un utilisateur existant, et le nom d'utilisateur. Dans mon cas, c'est le multisite, donc je vais juste cliquer dessus et me donner un rôle, donc je passe à Administrateur, Ajouter un utilisateur. Maintenant, si nous allons à Mes sites, en haut, nous avons maintenant le contrôle total de nos trois sites sur notre réseau. Cela nous permettra également d'aller dans le tableau de bord et d'activer les plugins pour chaque site individuel. Cela ne peut être fait qu'en tant que super administrateur. Comme vous pouvez le voir si nous allons à la boutique Laptop, tout comme l'administrateur standard, nous n'avons pas la possibilité dans le tableau de bord de sélectionner les plugins, comme nous le faisons sur le côté gauche. Maintenant, nous sommes également administrateur sur la boutique Laptop. Nous avons la possibilité d'accéder à Mes Sites. Vous voyez que le Laptop Shop est maintenant activé, ce qui nous permettra d'aller dans le tableau de bord et nous pouvons faire des choses comme ajouter les plugins. Allons dans les plugins, et ajoutons les champs personnalisés avancés et activons cela. Ensuite, revenez à la boutique Laptop, puis actualisez. Parce que nous venons de nous connecter en tant qu'administrateur, nous n'avons pas l'option plugins dans le tableau de bord. Cependant, nous avons le Jetpack et maintenant aussi le plugin Custom Fields, car cela a été activé par le super administrateur. C'est à peu près tout. C' est un aperçu de la façon dont nous pouvons ajouter des thèmes et des plugins pour notre réseau. Passons maintenant à la vidéo suivante où je vais vous montrer comment autoriser les utilisateurs enregistrés à ajouter des sites Web à notre réseau. 78. Multisite WordPress : permettre aux utilisateurs d'ajouter des sites Web au réseau : Partie 1: Dans cette vidéo, nous allons examiner comment permettre aux utilisateurs de s'inscrire à d'autres sites sur notre réseau. Si nous allons à l'un de nos sites Web dans notre réseau, et encore une fois, comme dans la dernière vidéo, j'ai deux navigateurs Web ouverts. J' ai Google Chrome sur le côté gauche, et nous sommes connectés en tant que super administrateur multisite. Sur le côté droit, j'ai ouvert Firefox. Je suis connecté à la boutique d'ordinateurs portables en tant qu'administrateur standard. Si nous allons à la boutique d'ordinateur portable réelle et visiter le site, une chose que vous remarquerez si nous faisons défiler vers le bas sur la barre latérale, vers le bas dans la question, nous avons la possibilité de se connecter et de se déconnecter et aller à des choses telles que l'écran d'administration, mais nous n'avons pas la possibilité de nous inscrire en tant que nouvel utilisateur. Ceci est un WordPress paramètres réseaux par défaut et est quelque chose que nous pouvons facilement changer. Donc, revenez dans l'écran super admin, si je vais sur mes sites et dans l'administrateur réseau, puis vers les paramètres, il devrait y avoir une option pour les paramètres d'enregistrement. Si vous faites défiler vers le bas, cela nous donne quatre options différentes. Le premier est l'enregistrement est désactivé. Cela signifie que de nouveaux comptes d'utilisateur ne peuvent pas être créés lorsqu'un utilisateur visite notre site Web. La deuxième option consiste à autoriser l'enregistrement des comptes. Si nous changeons cela et puis descendons pour sauver. Ensuite, si nous passons à Firefox, et, si nous nous déconnectons et puis vous allez simplement sur le site Web et faites défiler vers le bas jusqu'à la barre latérale. Maintenant, nous avons la possibilité de vous inscrire ainsi que de vous connecter. La troisième option consiste à permettre aux utilisateurs connectés de créer un nouveau site sur le réseau. Cette option limite la création de nouveaux sites Web, mais uniquement par les utilisateurs connectés disposant d'un compte. Cela signifie qu'en tant que super administrateur, nous avons la possibilité de ne donner des comptes qu'aux personnes autorisées pour configurer de nouveaux sites sur le réseau. Enfin, nous avons la possibilité de permettre à n'importe qui de s'inscrire en tant qu'utilisateur et de créer un site web sur notre réseau. Cette dernière option est celle que nous allons utiliser pour permettre à n'importe qui de rejoindre notre réseau. Assurez-vous que la dernière option est cliquée, puis descendez pour enregistrer les modifications, puis revenez à Firefox. Maintenant, si vous allez de l'avant et vous inscrivez en tant que nouvel utilisateur. Si vous ajoutez un nom d'utilisateur et aussi une adresse e-mail, que vous avez le contrôle, car vous devrez cliquer sur un lien d'activation pour activer le nouvel utilisateur. Vous aurez également la possibilité de créer un nouveau site réseau. Mais pour l'instant, si vous cliquez simplement sur l'option juste pour créer un nouvel utilisateur, nous allons de l'avant et créer le site une fois que vous revenez. Allez-y et créez un nouvel utilisateur et revenez dans quelques instants. Espérons que vous avez enregistré un nouvel utilisateur et activé l'e-mail. Si vous allez de l'avant et connectez-vous en tant que nouveaux comptes d'utilisateur. Ensuite, vous allez à votre profil en cliquant sur le nom d'utilisateur dans le coin supérieur. Je suis amené au tableau de bord et vous verrez que le tableau de bord n'a pas beaucoup d'options. n'y a aucune option pour ajouter vos propres sites. Si nous voulons ajouter notre propre site, nous devons ajouter wp-signup.php en haut après l' URL et cela nous amène à un écran où nous pouvons ajouter un nouveau site au réseau en ajoutant une extension à l'URL et ajouter également un titre de site et bien sûr peu d'utilisateurs sauront que nous devons l'ajouter à la fin de l'URL. Donc, pour le rendre un peu plus convivial, je vais ajouter un lien dans la navigation supérieure pour enregistrer un nouveau site. Il y a aussi de nombreuses façons de le faire, telles que la création de widgets et l'ajout de liens vers différentes parties de la page, mais je vais juste aller de l'avant et ajouter un lien de menu. En tant qu'administrateur, nous devons le faire dans le site principal de notre réseau. Donc, je vais aller à mes sites, puis multisite, qui est les principaux sites réseau, puis au tableau de bord, puis si nous allons à l'apparence, puis vers les menus, je vais ajouter un nouveau menu appelé navigation. Créez le menu. Nous devons ajouter ce menu à l'emplacement principal de votre thème. Dans le cas du thème que j'utilise, il s'appelle menu supérieur. Alors sélectionnez ça. Ensuite, si nous passons au menu de gauche, aux liens personnalisés, ajoutons un nouveau bouton de menu appelé sites audio. Ensuite, l'URL est disponible juste en haut là. Copiez cela, puis collez-le dans, puis ajoutez-le au menu. Il y a notre bouton qui est apparu sous la structure du menu. Sauvegardons cela et rafraîchissons Firefox et [inaudible] nos options à d'autres sites. Si nous passons simplement sur le site Web principal en tant qu'utilisateur connecté, vous pouvez toujours voir que cette option est là. Donc maintenant, nous pouvons cliquer sur cela et ensuite aller à la page d'inscription. Il s'agit de la page d'inscription par défaut que les utilisateurs enregistrés peuvent voir. Si nous allons à Chrome et que nous visitons notre site en tant que super administrateur et si nous descendons pour ajouter vos sites, vous voyez qu'il semble similaire, mais nous avons une ou deux petites différences, comme il vous avertit du fait que nous autorisons actuellement toutes les inscriptions afin que tout le monde puisse créer un site et il nous donne également une liste de sites dont nous sommes déjà membres et ensuite les mêmes options pour d'autres sites et aussi le titre du site. Donc maintenant notre site Web est tout configuré pour permettre aux utilisateurs enregistrés d'ajouter des sites au réseau. Nous allons laisser cette vidéo là et continuer dans la prochaine vidéo, où nous allons de l'avant et enregistrer un nouveau site sur notre réseau. 79. Multisite WordPress : permettre aux utilisateurs d'ajouter des sites Web au réseau : Partie 2: Bienvenue à la deuxième partie de la façon de permettre aux utilisateurs enregistrés d'ajouter des sites Web à notre réseau. Dans la première partie, nous avons modifié les paramètres en tant que super administrateur pour permettre aux nouveaux utilisateurs de s'inscrire et également de créer un nouveau site Web dans le cadre de notre réseau. Sur le côté droit, je suis connecté à Firefox en tant que nouvel utilisateur enregistré. Si vous ne l'avez pas déjà fait, cliquez sur le bouton Ajouter votre site et vous serez redirigé vers cet écran. La première chose que nous devons faire est d'ajouter le nom de notre site. Ce sera l'extension URL après l'URL principale de notre réseau. Je veux appeler mon WordPress Multisite Guide. Donnons-lui une URL de guide multisite. Le titre du site appelé WordPress Multisite Guide. Ensuite, nous avons la possibilité de permettre aux moteurs de recherche d'indexer. Donc, je vais juste garder comme oui. Cliquez ensuite sur « Créer un site ». C' est aussi simple que ça. Ainsi, nous pouvons voir l'URL complète qui nous mène à notre site. Maintenant, si nous passons à notre profil, puis au tableau de bord, nous avons maintenant un tableau de bord plus familier avec les options d'administration du site. C' est toutes les choses auxquelles nous sommes habitués, telles que la possibilité d'ajouter des messages, pages, et tout laisser une option d'administration générale. Si vous allez en haut sur Visit Site, voici notre nouveau site que nous venons de créer avec le titre de notre site. n'y a pas grand-chose à la minute parce que nous n'avons pas ajouté de personnalisations. Mais maintenant, nous devrions construire voir si nous revenons au super administrateur, si nous passons au tableau de bord et ensuite à Sites, nous devrions maintenant obtenir le guide multisite répertorié comme notre quatrième site Web. Bien sûr, en tant que super administrateur, nous avons également les options pour éditer le site Web. Nous pouvons même l'enlever si nous le voulons. Nous avons toujours un contrôle total sur tous les sites tiers. Ainsi, lorsque nous autorisons de nouvelles utilisations à enregistrer des sites sur notre réseau, nous pouvons également vouloir personnaliser des éléments tels que les e-mails d'inscription et les paramètres. Si nous passons à l'administrateur réseau, puis à Paramètres, ainsi que les paramètres d'enregistrement que nous avons examinés précédemment, nous avons quelques nouvelles options liées au multisite. Nous pouvons personnaliser les nouveaux paramètres du site. Cela inclut des éléments tels que l'e-mail de bienvenue, qui est envoyé aux utilisateurs enregistrés une fois qu'ils ont créé un nouveau site. Même avec l'e-mail de l'utilisateur et diverses autres choses telles que de nouveaux messages ou de nouvelles pages. On peut ajouter des noms à l'intérieur, séparés par un espace. Cela empêchera tout utilisateur enregistré de créer le site Web avec ces noms. Donc, nous pouvons les réserver pour nous-mêmes et bien sûr, des choses telles que l'administrateur est évidemment bloqué parce que nous avons besoin de cela pour nous connecter. C' est ainsi que nous pouvons permettre à un utilisateur enregistré de créer un nouveau site Web dans le cadre de notre réseau. J' espère donc que cette vidéo et cette section ont été utiles pour vous. Si vous n'avez pas déjà un multisite utile, vous pourriez avoir besoin à l'avenir, et il est utile de savoir comment le faire. Alors merci et au revoir pour l'instant. 80. Présentations bonus : télécharger sur un serveur live: Bienvenue à tout le monde. Cette vidéo est tout au sujet de vous montrer comment vous pouvez faire fonctionner votre site WordPress sur un serveur en direct. Nous allons utiliser un plugin pour faire de ce processus un processus vraiment simple et il est possible d'exporter votre site web d'un hôte local vers un serveur en direct en quelques minutes. Donc, la première chose que vous devez faire, si vous voulez mettre votre site Web en direct sur Internet, est d'acheter un hébergement web, et vous aurez également besoin d'un nom de domaine. Donc, pour ce tutoriel, je vais utiliser le cPanel et aussi les installations WordPress One-Click, qui sont disponibles avec les fournisseurs d'hébergement les plus populaires. Vous devez donc vous connecter au compte d'hébergement. Je vais me débrouiller, et on le transmettra au cPanel. Donc, en fonction de ce qui est votre fournisseur d'hébergement, vous pouvez trouver qu'il semble un peu différent de cela, mais tout ce que vous devez faire est de chercher l'installation WordPress One-Click. Donc, sous les applications web, je veux cliquer sur WordPress et cela va mettre WordPress sur mon nom de domaine choisi. Donc, je vais cliquer sur installer cette application. Je vais sauver le mien sur le wordpressacademycourse.com. Vous pouvez également changer différentes versions, et il y a aussi beaucoup d'options différentes, mais je vais les laisser par défaut. Je vais ajouter un administrateur et aussi un mot de passe @ e-mail. D' accord. Donc, le titre du site et le slogan, je vais juste les laisser comme ils sont pour l'instant, parce que nous allons importer toutes les données de notre localhost. Donc, nous n'avons pas besoin de changer cela et puis je vais cliquer sur installer et juste laisser cela faire c'est quelque chose. Alors rappelez-vous que certaines installations en un clic sont un peu différentes de celle-ci, mais je suis sûr que nous pouvons le régler. Alors donnez juste que quelques instants à installer, et je vais chercher l'application WordPress installée. Donc maintenant, je vais passer à un nouvel onglet, et taper mon nom de domaine. Donc wordpressacademycourse.com, et nous y allons. Il y a donc notre installation WordPress, et c'est le thème par défaut. Donc, je vais juste aller dans la section admin, alors ajoutez une barre oblique avant puis admin à la fin, puis connectez-vous avec vos coordonnées. On y va. D'accord. Donc, parce que nous importons toutes les informations dont nous avons besoin pour ce site, je vais juste cliquer sur non merci. Pris directement dans le tableau de bord. D' accord. Rechercher l'installation de WordPress maintenant sur le serveur en direct, et il vient d'obtenir une installation par défaut. Je vais donc travailler avec l'exportation des détails de notre version localhost. Donc, je vais aller dans la version locale, et sélectionner des écouteurs pro, et vous pouvez le faire avec n'importe quel des sites que nous avons construits, puis aller dans admin, et puis nous devons descendre aux plugins, et puis ajoutez un nouveau. Donc, si vous recherchez simplement la migration WP tout-en-un, et c'est ce dont nous avons besoin par ServMask. J' ai donc déjà ce plugin installé. Donc, tout ce que vous devez faire est de cliquer sur installer, puis d'activer de la manière habituelle, puis vous devriez obtenir une option de menu dans le tableau de bord. Donc, si vous allez à la nouvelle option dans le tableau de bord, puis cliquez sur les exportations et cela va exporter notre site comme un paquet, que vous pouvez ensuite importer dans notre site WordPress en direct. D' accord. Donc la première chose que vous savez, c'est qu'il y a une installation de recherche et de remplacement. Donc, nous pouvons trouver n'importe quel mot que nous voulons dans le paquet, et le remplacer par autre chose. Donc, si nous avons des informations sensibles, ou si nous voulons changer le nom d'utilisateur de l'administrateur par exemple à partir de root, nous pouvons le faire ici. Il y a aussi quelques options avancées, où nous pouvons laisser de côté diverses choses telles que le spam, les thèmes et les plugins que vous ne voulez pas exporter, mais je vais juste le laisser par défaut. Cliquez sur exporter vers, et je veux exporter le mien dans un fichier. Donc, je vais juste cliquer sur le fichier et laisser cela faire c'est quelque chose, et puis une fois que c'est fait, nous pouvons cliquer sur le bouton de téléchargement localhost. Maintenant, nous obtenons le fichier, enregistré dans nos téléchargements. Donc je vais juste fermer ça et ensuite on va aller sur mon site web en direct et ensuite faire la même chose. Donc, ce sont des plugins, ajouter de nouveaux. Donc, tout-en-un WP Migration, puis installer et activer, puis cette fois, nous devons aller aux options, puis aller à l' importation et puis trouver le fichier que nous venons de télécharger, puis faites glisser cela dans le glisser et et cela prend généralement une minute à importer. D' accord. Bientôt, nous obtenons un message disant que cela remplacera nos bases de données , plugins et thèmes, mais nous le savons, alors cliquez sur continuer. D' accord. Donc, si tout se passe bien, nous devrions recevoir le message indiquant que vos données ont été importées avec succès. Alors maintenant, nous avons deux étapes à faire. L' un est que nous avons besoin de sauvegarder nos permalinks, alors cliquez sur les paramètres permalinks, et il devrait ouvrir une nouvelle fenêtre, et vous remarquerez si vous essayez de vous connecter avec les détails que nous utilisons lorsque nous mettons en place le WordPress en direct que nous ne serons pas en mesure de nous connecter en utilisant ces mêmes informations. C' est parce que l'importation que nous venons de faire, a également importé notre utilisateur. Nous devons donc utiliser les mêmes détails d'utilisateur que nous avons utilisés pour le localhost. Donc le mien était proheadphones-admin, ajoutez le mot de passe, puis connectez-vous. Donc maintenant, nous devrions être connectés avec les détails de l'utilisateur existant de localhost et maintenant nous avons besoin de confirmer nos paramètres de permalien. Donc, une fois que nous sommes satisfaits de l'un des formats, nous avons juste besoin de cliquer sur enregistrer les modifications, puis une fois que vous avez fait cela, nous pouvons aller visiter site et tout devrait regarder comment il a fait sur le localhost, alors nous allons il suffit de regarder la page d'accueil, et tout semble bien là-bas. Donc, la page de blog dit nos articles de blog. Sélectionnez ces, et comme version complète. La page À propos de nous. Tout a l'air bien. Ajoutons juste un nouveau post et vérifions que tout fonctionne bien. Donc, nouveau post 4, n'a pas vraiment d'importance sur le contenu pour l'instant. Nous avons aussi les images dans la médiathèque. Donc c'est bien. Définissons l'un de ceux-ci et publions. Revenons sur le blog, et comme notre nouveau post 4. Donc, tout semble fonctionner bien. Essaie juste la recherche. Ouais, c'est génial. C' est donc à quel point il peut être rapide et facile d'exporter votre site Web d'un hôte local vers un serveur Web en direct, lors de l'utilisation d'un plugin tel que All-in-One WP Migration. Bien sûr, il y a d'autres façons de le faire, comme exporter une nouvelle base de données à partir de votre localhost, et aussi utiliser le logiciel FTP, mais c'est un moyen vraiment rapide et facile d'exporter votre site, et j'espère que vous le trouverez utile pour lorsque vous êtes prêt à passer d'un hôte local à un serveur Web en direct. 81. Présentations bonus : plugins de thème enfant East: Donc, plus tôt sur le cours lorsque nous créons le magasin de t-shirt. Nous avons créé un thème enfant du thème vitrine. Ainsi, lorsque nous créons un thème enfant, nous l'avons créé manuellement, en créant le nouveau dossier de thème. Nous avons ajouté des choses telles que le fichier de fonctions et aussi la feuille de style personnalisée. Donc, dans cette vidéo, nous voulons juste vous montrer une alternative rapide et facile à créer des thèmes enfants à l'aide d'un plug-in. Si nous allons sur le tableau de bord, puis descendez aux plugins, puis ajoutez de nouveaux. Je vais juste faire une recherche de thèmes enfants. Il y a différents plugins que nous pouvons sélectionner. Mais pour ce cours, je vais juste utiliser le créateur de thème enfant facile et cliquer sur installer maintenant, puis activer. Donc, comme nous avions beaucoup d'autres plugins, nous avons une option dans le tableau de bord. Donc, ce que nous devons faire est d'aller à facile, créateur de thème enfant. Sélectionnez et créez un thème enfant, il suffit de cliquer sur l'onglet Créer un thème enfant. Tout ce que nous avons à faire est, tout d' abord, de sélectionner un thème parent. Le thème parent que nous voulons peut être n'importe lequel des thèmes installés, tels que le thème vitrine. Nous pouvons lui donner un titre, comme l'enfant deux vitrine. Je vais juste laisser les détails du thème tels qu'ils sont et cliquez sur Créer. Donc c'est tout, thème enfant créé avec succès. Si nous passons à l'apparence, puis aux thèmes, je vous laisserai vérifier qu'il est en cours d'installation. Il y a notre magasin avant enfant 2 que nous venons de créer, appuyez sur Activate. Ensuite, visitons le site et voyons à quoi il ressemble. Voilà le thème de notre enfant de la vitrine. Maintenant peut aller sur la personnalisation de la manière habituelle, sans affecter aucune des fonctionnalités du thème parent lorsque nous mettons à jour. Si nous allons dans le personnalisateur, nous pouvons simplement vérifier que nous travaillons avec le bon thème enfant. Si nous regardons la section du thème actif, nous pouvons aller de l'avant et modifier n'importe lequel des détails comme nous l'avons fait précédemment. C' est donc une alternative rapide et facile à créer des thèmes enfants. Merci d'avoir regardé, et je vous verrai dans la prochaine vidéo. 82. Présentations bonus : supprimer un échantillon de données et réinitialiser notre base de données: Une des choses que l'on vous demande beaucoup est une fois que nous avons conclu nos données d'échantillon ou de nos données de test de thème dans un projet, comment pouvons-nous alors aller de l'avant et supprimer cela ? Les données de texte du thème avec toutes les informations que vous avez téléchargées à l'intérieur d'un fichier XML. Cela nous donne un exemple de contenu avec lequel travailler, comme certains exemples de billets de blog et aussi quelques images avec diverses choses telles que différentes offres ainsi. Si nous allons dans un billet de blog, nous pouvons voir ces différents commentaires à ce sujet. Il y a diverses archives, ainsi que différentes catégories et tags aussi. La majorité de ces informations est ajoutée avec le fichier XML, ainsi qu'un ou deux articles de blog et pages qui ont été ajoutés à0. En fait, il y avait même des liens de menu qui étaient également inclus avec les données échantillons. Eh bien, la façon de supprimer les données d'échantillon, en fait, il y a deux façons différentes. La première façon est de parcourir manuellement tous les messages, tous les menus, toutes les pages, et aussi toutes les autres choses telles que les médias, les images qui ont toutes été ajoutées et de les supprimer manuellement une par une. Bien sûr, cela prend du temps et c'est très répétitif. Il y a aussi un plug-in que nous pouvons utiliser pour supprimer toutes ces données. Un mot d'avertissement avant de commencer. Cela supprimera tout le contenu que vous avez ajouté aux sites, pas seulement les données de test de thème qui ont été ajoutées avec le fichier XML. Aussi toutes nos pages et messages seront également perdus. Ceci est fondamentalement une réinitialisation du cycle de thème retour à la façon dont nous avons commencé. Je vais installer un plugin. [ inaudible] plugins, puis ajouter de nouveaux. Sous plugin je vais chercher est, WordPress Reset. Celui que nous allons utiliser est juste ici et c'est celui appelé WordPress Reset par Matt Martz. Allons de l'avant et installons maintenant. Cette réinitialisation WordPress réinitialisera notre base de données WordPress à sa valeur par défaut. Toutes les personnalisations et le contenu comme nous venons de le mentionner, seront disparus. Une fois installé, sélectionnez « Activer » comme d'habitude. Une fois cela fait, nous devrions maintenant voir sous l'option Outils, nous avons maintenant une icône de menu de réinitialisation ajoutée. Sélectionnez ceci, puis pour terminer la réinitialisation, nous devons taper reset à l'intérieur de la boîte de saisie en bas, puis cliquez sur, « Réinitialiser ». Encore une fois, méfiez-vous que cela supprimera tout le contenu de la base de données et rétablira ses valeurs par défaut. Suivez seulement et appuyez sur reset si c'est ce que vous voulez faire. Je vais cliquer sur « Ok. » C' est un moment juste pour effacer toutes les entrées de base de données et maintenant je vais à, Visitez le site. Nous l'avons pris au thème par défaut. Si nous revenons au tableau de bord puis à Thèmes, nous pouvons toujours voir que notre thème spacieux est toujours disponible. On peut activer ça. Tous nos thèmes sont toujours préservés. Visitez le site et voici comment notre site ressemble à une nouvelle installation. Si nous revenons au tableau de bord, comme nous venons de le voir dans les sites, tous les messages et pages qui ont été ajoutés nous avons supprimé. Nous avons juste le monde de bonjour par défaut comme nous l'avons fait lors de la première installation. C' est ainsi que nous pouvons supprimer toutes les données d'échantillon et tout le contenu de notre base de données WordPress pour nous donner un nouveau départ à travailler avec. 83. Présentations bonus : configurer un deuxième projet à l'aide d'un hébergement Siteground: Si vous utilisez l'hébergement Web SiteGround, une fois que vous avez terminé l'un des projets de ce cours, et que vous devez passer au suivant ; une façon facile de le faire, est de créer une nouvelle URL. Pour le moment, si vous allez dans « Mes comptes » vous ne verrez probablement qu'un seul lien vers votre site Web. On peut en ajouter une seconde. Si vous allez à « Ajouter l'installation manuellement », et nous pouvons commencer un nouveau projet. Tout ce que nous devons faire est de cliquer sur le « Script WordPress », puis cliquer sur « Installer ». Plutôt que cela, installer immédiatement, il nous donne une option pour changer l'URL d'installation. Il est par défaut notre URL actuelle. Nous pouvons ajouter un répertoire à la fin. Ici, nous pouvons ajouter le nom de nos nouveaux projets. Si nous voulons des proécouteurs, nous pouvons ajouter ceci ici. Nous pouvons faire défiler vers le bas et nous pouvons créer un nouvel administrateur, ajouter un nom d'utilisateur, et aussi un mot de passe. Tout ce que nous devons faire est de faire défiler vers le bas et de cliquer sur « Installer ». Cela prendra alors quelques instants pour installer les nouveaux sites sur l'URL choisie. Une fois cela terminé, nous obtenons maintenant une nouvelle URL sur laquelle vous pouvez cliquer et aussi le lien admin aussi. Si nous cliquons une fois de plus sur « Mes comptes », nous voyons également le nouveau lien et le lien vers le panneau d'administration ici aussi. On peut cliquer dessus. Je vais ouvrir ça dans un nouvel onglet. Il nous donne maintenant une toile vierge pour commencer notre prochain projet. 84. Merci: Vous avez donc atteint la fin de ce cours. Félicitations de ma part et vous devriez être vraiment fier d'avoir atteint la fin. J' espère que vous avez tellement appris, vous pouvez maintenant emporter et utiliser dans vos projets futurs. Donc, nous avons couvert tellement de terrain d'où nous avons commencé. Nous avons commencé avec le blog de développement web, où nous appelons les bases de WordPress, telles que la recherche et l'installation de thèmes. Nous avons également examiné des questions telles que l'ajout de postes et la façon d'obtenir des postes existants. Nous avons couvert diverses ressources, pour trouver et comment inclure les médias dans notre blog. Nous avons également travaillé avec l'ajout de pages à notre blog, telles que la page À propos de nous, la page Contact et la gestion des utilisateurs et des commentaires. Vous avez appris à ajouter des menus de navigation, puis nous passons à la section suivante et nous avons personnalisé le site en ajoutant des logos, arrière-plan et des images de tête. Nous travaillons avec le personnalisateur et travaillons également avec des widgets de page pour auto la première page et également déplacer le blog à sa propre page personnalisée. Nous avons appris comment ajouter des curseurs et aussi comment ajouter des formulaires de contact. Ensuite, vers la fin de la section, nous avons examiné divers extras, comme comment améliorer l'optimisation des moteurs de recherche et comment faire des sauvegardes de notre site Web, au cas où un pire se produirait. Nous avons ensuite commencé à créer un deuxième projet, qui implique la mise en place d'une base de données WordPress et l'installation de WordPress. Nous avons également commencé avec Woo Commerce, tant pour la fonctionnalité e-commerce que pour le thème des vitrines. Nous avons également examiné l'utilisation des thèmes enfants sur diverses fonctionnalités liées au commerce électronique, telles que les catégories de produits, les étiquettes et les attributs. Nous avons même cherché à créer des mises en page flexibles en utilisant Page Builder, inclura les connaissances de base PHP, dont vous aurez besoin pour convertir un site Web HTML et CSS à un thème WordPress entièrement fonctionnel et magnifique. Cette section a plongé encore plus profondément dans les coulisses de WordPress et comment les pages WordPress sont disposées et comment elle utilise des modèles pour organiser et afficher des pages Web. Alors au revoir pour l'instant et j'espère que je vous reverrai bientôt sur un futur parcours. 85. Suivez-moi sur Skillshare !: Une énorme félicitations de ma part pour avoir atteint la fin de ce cours. J' espère que vous l'avez vraiment apprécié et que vous en avez acquis quelques connaissances. Si vous avez apprécié ce cours, assurez-vous de consulter le reste de mes cours ici sur Skillshare, et aussi de me suivre pour toute mise à jour, et aussi d'être informé de tout nouveau cours à mesure qu'ils deviennent disponibles. Merci encore une fois. Bonne chance, et j'espère que je te reverrai dans un futur cours.