Transcription
1. Introduction au cours: dans cette classe particulière, je vais vous emmener à travers tout le processus de création d'un thème en utilisant des pros élémentaires . Constructeur de thème. Nous allons jeter un oeil à toutes les compétences fondamentales que vous devez savoir, y compris certaines des mises à jour
récentes de choses comme les styles de thème sur la possibilité de modifier en ligne toutes ces choses pour faire tout le processus de création des choses personnalisées avec élémentaire pro. Beaucoup plus simple, beaucoup plus rationalisé, beaucoup plus rapide. Donc si ça vous intéresse, rejoignez-moi dans ce cours et je vous emmène à travers chaque étape de la fin. Vous allez avoir une connaissance complète exactement comment construire vos propres thèmes en utilisant élémentaire pro.
2. Quels outils avez-vous besoin ?: Donc, la première chose que nous allons faire est de télécharger Installer le thème hello. La raison pour laquelle nous utilisons le thème Hello est que même si nous construisons notre propre thème, WordPress lui-même a juste besoin d'avoir un thème installé. Nous n'avons pas forcément besoin de l'utiliser. Et nous allons utiliser le thème Hello parce que c'est fondamentalement juste un thème os nu par les développeurs hors élémentaire lui-même. Cela fait en sorte que nous avons Wordpress heureux et nous n'avons pas besoin de nous soucier des
bits supplémentaires et des pièces entrainant la manière et causant des problèmes lorsque nous mettons en place les choses dans le cadre de notre thème. Maintenant, en plus du thème hello, nous devons également nous assurer que nous avons un pro élémentaire installé. Maintenant, vous devez utiliser élémentaire pro. La version gratuite ne vient pas avec la possibilité de créer des fichiers de thème. Nous pouvons enregistrer certains modèles de base comme les modèles de page et de section, mais pas construire un thème. Donc gardez à l'esprit si vous n'avez pas la version pro, vous ne pouvez pas vraiment suivre ce que je vais couvrir dans cette vidéo particulière. Donc, à condition que vous ayez le thème hello installé. Vous avez un élément sur élément ou pro installé. On est prêts à aller de l'avant. Donc, nous allons juste sauter dans le tableau de bord de Wordpress maintenant et commencer à jeter un oeil à toutes
les choses que nous avons pour commencer à construire leurs propres thèmes personnalisés avec élémentaire pro.
3. Créer un en-tête mondial: depuis que j'ai fait ma vidéo initiale sur la façon d'utiliser le générateur de thème Enemy Elemental 2.0, les choses ont quelque peu bougé. Les fondamentaux fondamentaux sont à peu près les mêmes, mais nous avons maintenant quelques fonctionnalités de gain de temps réel qui rendent l'ensemble du processus encore plus simple sur le mal, plus complet. Mais nous devons mettre quelques choses qui, tout d'
abord, donc ce qu'ils font, c'est que je vais venir dans Elemental. Nous allons entrer dans la section de réglage à partir de là. On va prendre deux options. Nous allons désactiver les couleurs par défaut désactivées sur les polices par défaut pour aller vérifier les deux frapper enregistrer les modifications. Pourquoi on fait ça ? Parce que Elemental a récemment publié la possibilité de créer des styles de thème. Et cela signifie que nous pouvons définir des polices, affaiblir la taille des polices, les couleurs, les couleurs des
boutons, toute une gamme de choses différentes. Tout cela signifie maintenant que lorsque nous créons nos propres thèmes, nous pouvons également vous donner toutes ces informations. Tous ces éléments de conception que nous avons pour désactiver les couleurs par défaut et les polices par défaut. Sinon, cela fonctionnera. La prochaine chose à faire est de sauter sur l'apparence et les personnalisateurs afin que nous puissions jeter un oeil aux options disponibles dans le cadre du thème Hello juste pour que vous puissiez voir quelques-unes
des choses que vous pouvez faire dedans, mais surtout pour voir que ce n'est à peu près rien. Il va à l'apparence et dans la personnalisation. Une fois que nous sommes arrivés là-bas, vous pouvez voir qu'on a quatre onglets sur le côté gauche. Les menus d'identité du site, les paramètres de la page d'
accueil sur CSS supplémentaire. Si nous voulions appliquer un CSS global au site, non. En utilisant quelque chose comme le thème Hello, nous pouvons bénéficier de certaines des options qui sont disponibles. Si nous arrivons à l'identité du site, par
exemple, nous avons quatre options différentes. Affaiblir mis en place
le logo, le titre du slogan sur une icône, qui est fondamentalement que donner tissu sur qui apparaîtra dans les onglets du navigateur. Ce que je veux faire est de définir le logo, donc nous allons définir ceci pour utiliser le logo sombre sur dira select. On va sauter le recadrage. Ce que cela nous permet essentiellement de faire, c'est quand nous mettons notre tête et que nous y mettons notre logo . Nous pouvons utiliser le widget logo par opposition à simplement utiliser dans le graphique ordinaire. Et puis s'il voulait changer ce global tout au long du site qui utilise ce
widget particulier , nous devons simplement entrer dans le personnalisateur. Nous en revenons maintenant, nous pourrions mettre en place des menus à l'intérieur de vous si vous le vouliez. Tout ce que nous pouvons juste faire cela de la manière normale dans le cadre du tableau de bord de WordPress. Je vais le laisser comme ça pour l'instant. Ça va revenir. Nous allons laisser tout le reste tel qu'il est et nous allons frapper. Publier. Juste pour que nous ayons notre logo en haut. Juste une belle petite avance sur ce qu'on va faire. Alors maintenant que nous avons tout mis en place, jetons un coup d'oeil à la construction du thème lui-même. Si nous sortons de la section du modèle sur le côté gauche, nous avons le générateur de thème. Je vais cliquer dessus, et ça va nous emmener dans la section de base du constructeur de thème. Maintenant tu regardes ça et tu penses, eh bien, il ne se passe pas grand-chose. Comment travaillons-nous avec ? Eh bien, laissez-moi juste expliquer cette section, et vous verrez ce que nous commençons à construire les choses, comment cela va remplir avec différents types de fichiers de construction de thème que nous avons mis en place. Donc, tout d'abord, nous avons le constructeur de vapeur, qui montrera tous les différents fichiers de thème que nous créons. Actuellement, il n'y en a pas, mais au fur et à mesure que nous commençons à les créer, ils seront répertoriés ici. Nous avons ensuite quatre onglets différents, un pour chacun des différents types de fichiers de thème que nous pouvons créer. L' en-tête et un pied de page là assez explicatif. Ce qu'ils font, le single est fondamentalement, si vous regardez un post blawg, c'est un seul modèle. En d'autres termes, il montre le poste où l'archive affichera à nouveau une liste de messages. Tu verras ça comme nous le faisons maintenant. Si vous aviez vraiment rentrer chez
vous, vous verrez quelques onglets supplémentaires à l'intérieur de votre pour la guerre. Commerce pour célibataire Ah, un pour mur commerce archives travaille de la même manière. Il montre juste le produit par opposition aux messages. C' est la seule différence entre eux. Donc, commençons cela en jetant un coup d'oeil à la tête de la configuration pour cliquer pour aller dans l'en-tête une fois que nous le faisons maintenant, parce que nous n'avons pas de fichiers de thème mis en place dans cette section particulière ont été présentés avec ce premier type de créer votre premier en-tête. Donc nous allons faire est que nous allons dire à un nouvel en-tête parce que nous avons choisi la tête qu'une tablette sait
déjà qui est en avance sur nous allons créer. Mais nous cliquons pour développer que vous pouvez voir que nous pouvons choisir parmi l'une de ces autres options plus certains fichiers de modèle, qui sont des choses comme des sections et ainsi de suite. Laissons ça comme chef de ça, c'est parfaitement bien. La prochaine chose à faire est de donner un nom à ce fichier modèle. Maintenant, ce que j'ai tendance à faire, c'est que j'ai une convention de dénomination que j'ai tendance à utiliser pour presque tous mes projets. Donc, si je vais créer un fichier de modèle, un fichier de thème qui va être utilisé globalement est toujours appelé quelque chose par défaut, donc dans cet exemple va être en-tête par défaut. Maintenant, si je voulais créer une tête haute pour une section spécifique qui sera différente de l'en-tête
par défaut,
je le nommerais quelque chose de différent, mais encore une fois, y compris l'en-tête. Donc ce que je suggère, c'est juste d'avoir l'habitude de créer une convention de dénomination à laquelle
vous vous tenez parce que cela vous facilitera la vie quand vous revenez à un projet, peut-être six ou douze mois plus tard sur la ligne de votre pensée. Quel nom ai-je donné à ce fichier de modèle particulier ? Utilisez une convention de dénomination logique. Ça vous rend la vie beaucoup plus facile. Ok, donc on a fait les deux choses dont on a besoin. À ce stade, nous allons cliquer sur créer un modèle qui va ensuite passer par ouvrir, élémentaire sur. Si nous avons des modèles, nous pouvons extraire des formulaires faisant partie de pro élémentaire ou élémentaire. On pourrait les utiliser comme point de départ. Ou si nous le voulions, nous pourrions commencer complètement et complètement à partir de zéro. Maintenant, laissez-moi vous faire passer par cette section avant de commencer à jeter un oeil à la construction ou
à la modification des choses. Si on jette un coup d'oeil, on a trois onglets en haut. Nous avons des pages de blocs sur mes modèles. Les blocs, comme ce nom l'a suggéré sont différents éléments de bloc d'une page. Donc des choses comme les en-têtes, les pieds de page, services de
héros, ce
genre de choses. Ceux-ci sont tous divisés en différentes sections, que vous pouvez filtrer à partir du côté gauche, en utilisant cette section particulière parce que nous créons un en-tête, il nous montrera automatiquement les fichiers de modèle d'en-tête. Cette installation fait partie de elemental pro. Si nous le voulions, nous pourrions changer ça en autre chose. Donc, par
exemple, héros et ils vont nous montrer tous les blocs de héros que je vois. Nous voulons rester à la tête de la section parce que c'est ce que nous travaillons actuellement , des
pages
dont nous n'avons pas besoin de nous inquiéter, parce que cela va nous montrer des modèles de pages complètes. Ce n'est pas ce que vous voulez utiliser lorsque nous créons Header sur mes modèles. Comme nous créons des modèles, ils seront tous répertoriés là afin que nous puissions les utiliser comme et quand nous le voyons bon, revenons sur la section de bloc pour que je le fasse maintenant c'est que nous allons trouver un de ces modèles
pré-conçus et les utiliser comme un point de départ pour notre conception particulière. Donc, je ne prends pas cet en-tête particulier. Maintenant, vous verrez que je vais Logo est déjà inséré parce que nous avons mis en place qui faisait partie du Hello. Il semble que vous voyez ci-dessous nous avons l'endroit tenir un widget, prêt à mettre dans notre menu. Mais parce que nous n'avons pas configuré de menu, rien n'apparaît dans le Donc nous avons maintenant est un type de page normal
avec lequel nous allons travailler dans le cadre d'Elemental. Donc, nous pouvons cliquer sur n'importe lequel de ces. Nous pourrions apporter des changements à tout ce que nous voulons. Nous pouvons configurer tout ce que nous voulons. Donc on ne voulait pas de ce vert en haut. Nous pourrions simplement cliquer sur la section style Commodore, ou nous pouvons choisir la couleur que nous voulons à partir de là. Tel utilisé ce bleu clair Nous n'avons aucun changement que nous avons notre premier modèle mis en place. La prochaine chose à faire est de cliquer sur Publier. Donc, une fois que nous cliquons sur publier, vous pouvez voir qu'il nous prend le dessus et dit, nous devons ajouter une condition. Et c'est le genre de fondamentaux de base hors. Utilisation des modèles dans le cadre d'élémentaire pro Pour créer un thème, il
suffit de créer des conditions pour dire quand un fichier de thème particulier sera utilisé. Donc, nous pouvons faire est que nous pouvons cliquer sur, ajouter une condition et ensuite Nous avons deux paramètres différents que nous avons inclus et exclure, sorte que vous pouvez utiliser la logique que vous voulez. Donc, vous dites Inclure, et vous voyez qu'il dit actuellement site entier. Nous cliquons pour développer cela dans la liste déroulante. Nous avons trois options maintenant. Il s'agit d'un menu contextuel. Tous les moyens d'acteur est que le menu va changer en fonction du fichier de thème qui ont été édités. Pour l'instant, cependant, nous allons dire que tout le site est parfaitement bien. S' il voulait affaiblir, ajouter des conditions supplémentaires, dire de
Suker à une autre condition, et vous pourriez choisir exclure. Donc, nous pourrions dire que nous allons exclure cela des archives et je ne dirais pas toutes les archives et vous pouvez voir que nous avons des options supplémentaires à l'intérieur, donc nous pourrions dire maintenant que nous avons mis à différentes conditions que cet en-tête montrerait l'ensemble du site en excluant n'importe laquelle des pages d'archives. Supprimons simplement la deuxième condition. Nous ne l'avons pas juste mis en place pour dire inclure le site entier. Nous allons frapper sauver fermer et c'est notre premier fichier de thème créé. Donc, nous avons maintenant une tête globale un peu appliquer à chaque page de notre site
4. Créer un pied de page mondial: Maintenant, si nous regardons notre page de test, c'est la page d'accueil avant la tête comme étant appliquée à elle. C' est donc le thème Hello, page
basique des os nus. Donc, actualisons simplement cette page sur. Il y a notre nouvel en-tête pour que vous puissiez voir qu'il y a une barre bleue en haut. On a un logo. Évidemment, il
nous manque toujours ce système de menu, alors nous allons le mettre dans un instant. C' est comme ça que c'est facile. Non, chaque page que nous pouvons jeter un oeil à l'un de ces messages va sauter par-dessus et vous pouvez voir à nouveau. Le modèle de poste unique réel semble toujours absolument terrible. Ce que nous avons, c'est que nous avons un en-tête appliqué à notre page. Donc partout maintenant, cette tête va être évidente. Avant de passer à autre chose,
il y a une autre chose que je veux vous montrer. Avant de passer à autre chose, Et c'est l'une des plus grandes choses qui ont été ajoutées au pro élémentaire au cours des
deux derniers mois et l'une des raisons pour lesquelles je vous montre ce processus de création d'un thème à partir de zéro. Alors passons sur le côté gauche. Broil widgets sont bien venus dans le petit menu hamburger dans le coin supérieur gauche ont été cliqués pour ouvrir. Les différentes options, les préférences, les paramètres et tout ce genre de choses. Ce que nous examinons est la troisième option appelée styles de thème, afin qu'ils puissent ouvrir les styles de thème. Vous pouvez voir qu'il n'y a pas de pops sur et ouvre un ensemble différent d'options. Nous avons une gamme de sections différentes à l'intérieur de vous. L' arrière-plan, dont la couleur d'arrière-plan globale pour la typographie du site entier, boutons et ainsi de suite. Maintenant, je ne vais pas y aller en tonnes de détails parce que j'ai déjà couvert comment utiliser cela beaucoup plus en détail, sa propre vidéo dédiée et aussi comment je l'utiliserais personnellement. Donc, je vais lier ces deux vidéos vers le bas dans la description ci-dessous. Donc, si vous voulez en savoir plus sur les thèmes, les styles et la meilleure façon de les utiliser, vérifiez maintenant. Un autre définir l'arrière-plan pour cela et laisser l'arrière-plan tel qu'il est, cependant, ont été engagés la typographie, et là, nous pouvons maintenant configurer toutes les options de typographie pour notre site entier. Alors faisons ça. Présentons certains d'entre eux pour commencer. Donc on va faire est d'aller à la couleur du texte. Je ne l'ai pas fait. Ils allaient mettre ça en gris foncé. Une fois que vous aurez fait ça, nous allons entrer dans les options de typographie, et à partir de là, nous allons juste choisir la famille de polices que nous voulons utiliser. Donc pour ça, on va utiliser Poppins. Nous avons fixé une valeur d'environ 14 et vous pouvez voir si nous regardons sur le côté droit. Vous pouvez voir que cela change les choses et nous pouvons voir quelques exemples de base de ce que nous faisons . On pourrait changer le poids si on veut entrer ici à ce qu'on veut. On va mettre l'estomac 400 pour qu'il soit un peu plus épais. Je dirai que nous sommes satisfaits de ce bassin Paragraphes. Eh bien, c'est à nous de décider. Nous pourrions définir les valeurs en pixels, EMS ou VH. Donc, disons bien, définissez ceci comme quelque chose comme 16 pixels. Nous avons donc un bel espace entre les paragraphes. Donc avec cela en place, si nous le voulons, nous pouvons changer la couleur de notre lien. Donc nous pourrions dire que ce que nous allons faire est si dur mais nous allons juste mettre ça pour soulignements viendront dans la typographie définir une décoration à souligner et ensuite, sur la normale , nous allons définir la couleur pour être différente. Donc nous sommes prêts à cette couleur bleu clair pour que nous sachions globalement les couleurs
du lien pour le port à l'état normal vont le voir pour nos titres. Donc, ce qui va se passer est que nous pouvons utiliser ce genre de hiérarchies si nous définissons la police pour être un style
particulier. Dans ce cas, Poppins, vous pouvez voir que l'en-tête a également stylé Poppins afin que nous puissions laisser cela tel quel,
et il va en quelque sorte en cascade à travers. Cependant, si nous le voulions, nous pourrions changer n'importe quoi à voir avec les différents titres aussi. On peut donc changer la couleur sur la topographie. Disons que pour la typographie que nous ne voulions pas utiliser Poppins que nous voulions utiliser dans un monstre de
lac, nous pourrions choisir cela à partir de là. Vous voyez, la police se met à jour maintenant et nous voulons que nous puissions changer le poids de la police là-bas. Et si vous le vouliez, nous pourrions aussi dire qu'ils vont en majuscules pour que vous puissiez voir qu'on pourrait facilement entrer. Et les choses justes sont juste le dimensionnement, toutes ces sortes d'options. Et puis on y va. Nous pourrions simplement le faire à travers toutes les différentes rubriques un à six pour assurer que toutes les couleurs,
la taille, les styles, les polices, tous ces types de choses ont été mis en place. Les boutons sont exactement les mêmes. Nous pouvons entrer pour contrôler la typographie du bouton, ombre du
texte, la normale, l'état du port, les couleurs d'arrière-plan, tout rayon de bordure et ainsi de suite. Pour les images de champs, nous avons également CSS personnalisé À la fin de celui-ci, le CSS personnalisé s'appliquerait au style global de votre site pas spécifiquement à un payant. Alors gardez ça à l'esprit. Une fois que nous avons fait cela, nous pouvons cliquer sur la mise à jour qui saura apporter des modifications sur l'ensemble du site. Je suis allé de l'avant, ajouté dans la structure du menu juste pour que je puisse vous montrer à quel point c'est facile avant de passer à autre chose. Jetez un oeil au pied de page pour apporter des modifications et personnaliser cela de la façon que nous voulons afin que nous puissions faire si vous le souhaitez est que nous puissions facilement entrer dans l'un de ces changements et faire les ajustements
que nous voulons cliquer sur. L' image va entrer dans ça. Vous pouvez voir qu'on a une marge à la bouteille supérieure. Nous allons juste les suivre pour être un peu plus petit pour faire 10 du top 10 en bas. On resserre juste un peu ça. Et si nous venons à notre jus de widget de menu, y
a-t-il un autre widget de menu ? Nous avons une couleur verte à l'intérieur qui n'a évidemment pas de sens parce que ne pas utiliser le schéma de couleurs que nous avons mis en place alors nous allons faire est que nous allons entrer dans cette
section de style et à l'intérieur nous pouvons ajuster la typographie que nous pourrions juste laisser tomber sur le bouton tobel tout ce genre de choses. Alors on va à la section portuaire. Vous pouvez voir qu'il y a les 0,2 couleurs étant des années, ce genre de couleur verte va changer que pour notre bleu ont finalement été le plus fini. Maintenant, nous avons le bleu avec le menu déroulant. S' il le voulait, on pourrait ajuster les choses à l'intérieur. Il va frapper la mise à jour Qu'est-ce qu'il a fait qui va sauter de retour sur notre page de test ? Actualisez que vous pouvez voir qu'il n'y a pas de choses serrées que les bonnes couleurs sont utilisées et ainsi de suite
5. Comment créer des modèles d'archives et d'un seul post: Ensuite, jetons un coup d'oeil Maintenant, créez un pied de page pour le générateur de thème. Nous allons parler au pied de section,
je dirais, je dirais pied de page
Agnew, vous pourriez voir sans pied pré-sélectionné sur un jeu avec la même chose. Donc pied de page par défaut, cliquez sur créer un modèle Une fois que vous faites
cela, cela va nous prendre le dessus Et nous pourrions maintenant jeter un oeil aux blocs. Donc ce que je fais est que je vais trouver quelque chose que je pense est en quelque sorte en conformité avec ce que nous avons
fait va insérer cela dans notre modèle, sorte que maintenant met notre design dans la page. Évidemment, il y a une ou deux choses que nous devons régler. Les couleurs sont toutes fausses à ce point dans le temps, donc nous devons corriger cela. C' est très facile. Seulement à faire est de cliquer sur l'un des éléments que nous appelons l'onglet style. Et tu pourrais changer cette couleur à ce que tu veux. Vous pouvez littéralement le prendre là-bas ou vous pouvez définir la couleur. Nous allons juste clarifier cela et puis cela va ramasser toutes les couleurs par défaut que vous avez dit qu'il faisait partie des thèmes vers le bas. Si vous voulez remplacer que vous pouvez simplement entrer et choisir la couleur que vous voulez
mettre spécial à ce bleu pâle, par
exemple sous le même sans bouton et laisser qui viennent dans un bouton Venez à notre section de
style Je vais descendre à votre bouton Changer cet ensemble qui sont de couleur bleue Et nous allons maintenant obtenir les choses à la façon dont ils devraient être Même va pour la petite ligne haut Vous
la ville venez à une section de style Pourrait ou la bordure réinitialiser ce pour être un bleu pâle Et enfin nous avons navigation Vous dites que orteil bleu aussi bien Ok, donc c'est notre dissection du pied Tous mis en place hit, publier et nous obtenons la même chose à nouveau. Nous pouvons maintenant ajouter une autre condition. Ils vont cliquer sur notre état. On laissera ce jeu à tout le site. Il sauve de près. C' est maintenant notre dissection des pieds. Donc, il est de retour sur votre site Web rafraîchir notre page de test école vers le bas de la page. Une fois que vous obtenez le bas, ce notre nouveau pour la section tous mis en place et là chaque page pour aller à l'un des messages. Vous pouvez voir comment pour cette action est tout à l'intérieur là-bas. Donc sûrement archiver onglet à nouveau. Nous sommes présentés avec la même option qui dit de créer votre premier quel que soit l'utilisation. Donc je dis de créer une nouvelle archive. On va appeler ce post par défaut. D' accord ? Qui a créé un modèle ? Une fois que vous avez créé un modèle avec être amené dans la zone de blocs que nous allons faire va
fermer ça . Cela va nous emmener dans notre zone de gabarit. Maintenant, Comme vous pouvez le voir, notre en-tête est en place et je vais pied de page est en place. Créons nos archives. Donc, lorsque nous ouvrons sur le modèle archivé, vous pouvez voir sur le thème d'archive un modèle que vous pouvez voir sur le côté gauche. Nous avons trois icônes pour commencer par un widget R, le titre de l'archive, le post de la boîte auteur. Parce que nous avons choisi une arcade pour ce fichier de thème particulier, il sait que ça va probablement faire des choses que nous allons vouloir faire. Jouons dans le titre de l'archive va simplement glisser et déposer ce widget dans. Vous pouvez voir que tire juste dans certaines informations de modèle de pré-tenue. Donc on va faire, c'est qu'on va ajouter un peu d'espace à ça. Donc va simplement venir à ce bloc particulier. Maintenant, vous voyez, nous avons un peu de problème ici parce que c'est si proche de la navigation réelle. Quand nous essayons d'arriver au petit bloc, cela rend les choses très difficiles. Affaiblir, traiter sans assez facilement affaiblir. Il suffit de venir et d'utiliser le navigateur. Option cliquée. Ouvrez le navigateur à vous pouvez voir Maintenant sur le côté droit, nous avons obtenu une nouvelle entrée, à ce moment cela nous montrera toutes les sections clés, sa naissance en gardant à l'esprit. À ce stade, l'en-tête et le pied ne sont pas considérés comme une section à l'intérieur du modèle d'archive que nous créons. C' est pour ça que tu ne les vois pas. Ils ne nous montrent que la section réelle. On vient de tomber. Mais ce que nous pouvons faire, c'est que nous pouvons cliquer sur ce qui va activer la section. Et maintenant, nous arrivons sur le côté gauche et nous pouvons utiliser les options de sauge ici. Disons qu'on va décocher ces valeurs en haut. On va ajouter 50 pixels d'espacement. Maintenant, nous avons donné comme un peu d'espace de respiration en haut ce comeback widgets Goto sur le côté
gauche, et il est juste glisser dans les messages d'archive et déposer cela sous le titre. Vous pouviez voir qu'aucun tils dans la page d'archive étrangère fondamentalement. Ils sont juste ferme navigué vers le bas maintenant sur le côté droit à nouveau donc vous pouvez voir cela nous a donné le titre du haut sur trois messages de notre archive. Si nous le faisons de cette façon, nous avons maintenant beaucoup de contrôle sur la façon dont les choses affaiblissent le style, comment nous pouvons disposer les choses. Maintenant. Vous avez toujours le même niveau de contrôle. Si vous utilisiez l'un des blocs prédéfinis, cependant, vous avez un point de départ que vous pourriez avoir à apporter des modifications à tout. Cela commence juste avec seulement les éléments que vous voulez glisser sans être dit. Nous pouvons simplement choisir ceci, que nous pouvons choisir une peau différente si nous ne le faisons pas. Une peau est juste fondamentalement, le design qui va être utilisé actuellement utilise le classique. Changons cela sur les cartes qui semble déjà beaucoup plus propre et un peu plus que nous avons également 1/3 option, qui est plein contenu sur ce pas le plus beau look. Mais c'est un peu ce que vous attendez fait partie de la façon par défaut que la plupart des thèmes fonctionnent dans WordPress. On va reprendre ça et aller dans les voitures. Je pense que c'est l'option la plus belle que nous ayons maintenant. Tous ces différents morceaux de composants à l'intérieur de cette couche particulière pourraient être contrôlés afin que nous puissions dire le nombre de colonnes que nous pourrions dire. On ne veut que mettre deux colonnes. Vous pouvez voir que les mises à jour immédiatement. Voulez-vous montrer l'image que nous pouvons dire oui ou non afin que nous puissions nous débarrasser
complètement de l'image si nous le voulions. Nous remettrons ça à oui, taille de
l'image. Vous pouvez voir qu'il semble un peu pixelisé, bien qu'il ne soit pas le meilleur, donc nous pouvons choisir une image différente. La science. Nous pouvons aller au médium, et vous pouvez voir que maintenant semble beaucoup mieux, beaucoup plus clair. Le rapport d'image est fondamentalement comment nous Condell avec la hauteur de la taille de cette image. Donc, si nous réduisons juste un peu cela, vous pouvez voir que nous pouvons positionner cela pour obtenir une mise en page beaucoup plus agréable, donc nous ajustons juste un peu cela. Je pense que 56 va fonctionner parfaitement pour le ratio que j'ai mis en place pour toutes mes vignettes. Nous avons aussi catégorisé, qui est juste fondamentalement les méta-données disant à quelle taxonomie cela est associé afin que nous
puissions nous débarrasser de n'importe quel genre de choses, y compris des choses comme des titres et des extraits et ainsi de suite. Donc, vous voyez, on pourrait retirer le titre si vous vouliez le remettre. On va bouger le sauf qu'on peut changer combien de four. Sauf qu'ils sont en fait, oui, nous pouvons dire que nous voulons 30 mots là-dedans pour nous donner un peu plus afin que vous puissiez voir que nous pouvons affiner et configurer cela exactement comme nous le voulons. Quel genre de fond ? On pourrait dire. On veut mettre un peu de pagination là-dedans, donc on va dire que les chiffres sont des chiffres sur le précédent et le suivant. Donc, quand nous obtenons mawr entrées réelles dans un blog, les pages d'archive auront une bonne pagination en bas. Maintenant que nous sommes satisfaits de la façon dont notre nouvelle page d'archivage n'est pas configurée, nous allons cliquer sur Publier. Et encore une fois, nous avons ramené à ces conditions. Si vous cliquez sur ajouter la condition cette fois, vous pouvez voir que nous avons toutes les archives est mis en place est la condition d'inclusion. Si nous cliquons pour développer cela, nous commençons maintenant à voir quelques mawr. Ces options dont j'ai parlé à partir de ce menu contextuel. Donc, parce que nous avons affaire à une archive, il existe plusieurs types d'archives différents à travers un site WordPress typique. Mais vous pouvez voir que nous avons tout notre cas, qui appliquera ce modèle peu importe quoi, il le fera à l'échelle du site. Pour chaque archive, il va être utilisé pour beaucoup de cas qui pourraient être parfaitement corrects. Cependant, si vous voulez un contrôle plus granulaire, vous pouvez choisir notre cas différent pour différentes mises en page. Ainsi, les archives de l'auteur pourraient être différentes pour la date RK de la page des résultats de recherche et en effet, les arcades de poste. Vous pouvez voir que nous avons le poste de nos catégories grottes, les enfants
directs ou les catégories d'enfants directeur hors. Donc, si nous avons choisi quelque chose comme ça, vous pouvez voir que non ouvre une autre option, à ce moment nous pouvons ensuite entrer sur. On peut filtrer encore plus bas. Mais nous allons définir ça pour être gentil et simple et dire que toutes les archives vont frapper Sauvegarde de près. Nous avons maintenant créé la couche d'archive pour notre site WordPress. Donc, revenons juste maintenant dans une page de test. Revenez chez nous et je ne devrais pas voir maintenant que c'est ramassé la couche d'archives que nous
venons de choisir. Donc tout n'est pas mis en place comme nous le voulons. Si nous cliquons sur eux pour aller dans l'un de ceux-ci, vous pouvez voir que nous avons toujours le modèle unique que nous devons mettre à jour pour nous assurer que cela
semble aussi bon que possible. Je vais venir dans la société de constructeur de thème, option
unique. Ajouter un nouveau single. Eh bien, je sais que vous voyez leur single Sélectionnez le type de poste avec un clic dessus. Maintenant, c'est là que les choses peuvent devenir un peu confuses. Lorsque vous travaillez avec WordPress, vous pouvez considérer le fait que nous avons choisi un single et que ce sera pour un seul post. Pourquoi est-ce lié aux deux messages sur les pages sur les quatre ou quatre pages sûrement opposées à la page est différent. Eh bien, la façon dont le WordPress fonctionne est qu'il considère à peu près tout pour être un poste sur quand vous regroupez ces post ensemble. Il considère qu'il s'agit d'une archive. En d'autres termes, un groupe de messages. Donc, une fois que vous avez eu ce concept dans votre tête, vous arrêtez de penser qu'ils sont différents. Ils ont juste des options légèrement différentes. Ainsi, nous pouvons mettre en place un seul modèle pour les deux publications sur les pages sur les quatre ou quatre pages. Ils pourraient tous être différents pour cet exemple. Nous commençons par le Post. Cliquez sur Poster. Nous allons juste appeler ce single par défaut, poster il créer un modèle qui nous emmènera dans. Maintenant, nous pouvons choisir n'importe lequel des blocs pré-définis. Si nous voulons utiliser l'un de ceux-ci comme point de départ. Choisissons juste un design qui, je pense, est assez bien rangé et en gardant ce que nous faisons. Donc, il suffit d'insérer ce particulier qui va télécharger tous les fichiers pertinents maintenant et déposer le design dans notre page pour nous. Vous voyez, il y a toute la mise en page dans notre design. Maintenant, nous pouvons à nouveau, comme je l'ai dit, apporter des modifications complètes à cette lettre. Vous pouvez voir que l'image en haut ne semble pas tout à fait correcte. Nous pourrions venir à cette image là et vous pouvez voir que nous pouvons ajuster la hauteur de cette Donc nous pourrions dire que nous voulons définir que pour être 600 par exemple appliquera cela et vous verrez que cela ajuster les choses en conséquence. Donc, nous pourrions passer par maintenant configuré ceci, apporter des modifications à partir de ce modèle de base que nous avons mis en place. Est-ce que nous avons choisi sur elle pourrait facilement entrer et faire des changements va frapper. Publiez dessus. Vous pouvez voir à nouveau. Nous avons maintenant mis en place des conditions et, encore une fois, nous avons une gamme d'options différentes. Nous ouvrons la section post, vous pouvez voir qu'il y a même des options mawr à l'intérieur de vous pour obtenir un niveau de
contrôle vraiment granulaire . Maintenant, tu aurais pu vouloir marcher. C' est une valeur globale pour tous les singuliers. Évidemment, cela n'a peut-être pas toujours de sens. Cela peut dépendre du genre de mise en place de citations, donc je ne laisse pas cet ensemble pour être des messages. Vous pouvez voir qu'il est dit ensuite. C' est tout. Cependant, si nous le voulions, nous pourrions cliquer dessus. Nous pourrions filtrer qui ne font pas un message spécifique, ou en fonction de si nous choisissons quelque chose de différent à l'intérieur de l'année, nous pouvons dire dans les catégories d'enfants , par
exemple, et puis nous pouvons cliquer et nous pouvons choisir différents enfants voiture degrés et filtrent ceux. Donc, il est un poste dirait, sauver près. Et c'est ainsi qu'un seul modèle créé Revenez dans votre page actualisera ceci maintenant. Et voilà notre nouveau design. Toute la mise en place l'a sorti de ce modèle. Donc, un thème de base est maintenant mis en place. Revenez à notre page d'accueil. Vous pouvez voir que nous avons nos archives. On a un en-tête. On a notre pied. Si nous abordons l'un de ces éléments, nous avons également la possibilité de voir exactement ce que nous avons mis en place dans le cadre de ce
post de bloc . C' est donc les bases de ces quatre fichiers de thème clés que nous devons configurer
6. Techniques de montage de modèles en ligne: auparavant, lorsque nous travaillions avec des dessins et modèles et ainsi de suite, chaque fois que vous avez créé sur notre grotte ou un seul et ces types de modèles, votre tête sur votre zone de pied. Si vous vouliez apporter des modifications à ces modifications, vous devrez littéralement sortir de la page sur laquelle vous modifiez. Allez dans l'en-tête ou le pied de page et commencez à l'ajouter. Tu n'as plus besoin de faire ça. Vous pouvez venir sur n'importe lequel d'entre eux et vous verrez qu'il nous montre maintenant en jaune. Est opposé au bleu normal pour la tête dehors s'il grondait le pied avec le fond, fait la même chose Ils nous pouvons maintenant qui veulent simplement cliquer sur cette façon, dit Modifier l'en-tête ou le pied de page Cliquez qui ne nous prendra pas directement dans le pied de page dans ce par exemple, nous pourrions y apporter des modifications. Oui, vous pouvez voir qu'on est toujours en ligne. Nous avons toujours tout le type de modèle qui travaillait avec en place afin que vous puissiez venir au travail. Quel que soit le changement qu'il veut. Disons que tu veux ce logo. Nous voulons que ça soit la gauche. Nous pouvons maintenant cliquer sur la mise à jour Ce n'est pas mis à jour le pied au modèle. Lorsque nous sommes prêts à revenir à un modèle de page normal, Nous pourrions simplement revenir sur que vous pouvez voir que maintenant est en jaune Nous cliquons sur éditer unique et vous découvrez que nous sommes de retour dans l'édition Le modèle unique pourrait être le modèle archivé Peut-être n'importe quel autre modèle, mais vous pouvez voir que c'est rapide et facile et la même chose se passe pour dire que pour l'en-tête, nous pouvons cliquer sur Modifier l'en-tête Nous savons sauter à la tête de la section sur Nous pourrions savoir faire des changements dans l'état que vous afin que nous puissions cliquer sur ce Nous pourrions dire, Eh bien, cette partie du fond me dérange un peu alors on va passer sous ça mettre du rembourrage en bas, par
exemple. Disons juste que nous allons mettre 20 pixels de séparation dans le Donc, nous avons apporté quelques modifications à cette mise à
jour sur alors notre titre n'a pas été mis à jour. Nous cliquons simplement sur éditer unique et nous continuons à éditer le modèle de publication unique. Cela le rend beaucoup plus rapide et plus facile, pas moins de montage rond en cours. Nous pouvons en quelque sorte faire dans l'édition en ligne tellement plus rapide et plus facile plus ces petites mises à jour que je veux attirer votre attention parce que cela vous rend la vie considérablement plus facile .
7. Comment et pourquoi utiliser les modèles mondiaux: Il y a une dernière chose que je veux te montrer avant de terminer ça. Et c'est des widgets globaux. Nous avons couvert cela dès le début. Je viens de dire qu'on va y jeter un coup d'oeil. Alors laissez-moi simplement vous montrer ce qu'est un widget global et pourquoi je pense qu'ils sont utiles, surtout lorsque vous travaillez avec l'aspect de construction du thème entier. Disons simplement que vous aviez une section de témoignage et que vous vouliez l'utiliser sur la même zone dans toutes vos pages d'archives. Mais vous aviez plusieurs modèles différents. Pour ce sont des grottes, comme nous venons de le voir, vous pouvez mettre en place plusieurs températures différentes de différentes parties de votre site, même en utilisant le même type d'archivage, le single et ainsi de suite. La façon la plus simple de le faire serait de mettre en place un widget global. Et puis, si vous apportez une modification à l'un de ces modèles, vous pourriez avoir cette réflexion sur tous vos modèles. Laisse-moi te montrer comment on fait ça. On a une nouvelle page. Peu importe comment tu fais ça. Je vais juste utiliser une page comme exemple pour vous montrer la différence entre les pages et modèles. Donc on va juste appeler ce widget global ? Eh bien, vient de publier cette page Nous allons éditer avec Elemental une fois que les éditeurs élémentaires ouvriront que nous allons faire une petite recherche de témoignages, prendre un témoignage, qu'il déposera dans la page que nous allons faire maintenant va apporter rapidement quelques changements à cela. Donc, nous allons juste ajouter une image, par
exemple, va ajuster le style de police et ainsi de suite. Juste pour que nous ayons un peu plus unique que la valeur par défaut afin que nous puissions voir les changements que nous faisons. Donc on va mettre ça en italique fois le rouleau, donc on va dire qu'on est heureux avec ça. Donc maintenant, ce que nous devons faire est de sauvegarder cela en tant que widget global. Maintenant, c'est là que vous devez comprendre comment les widgets globaux fonctionnent. C' est un widget, pas une section ou quoi que ce soit d'autre. Ainsi, par
exemple, si nous entrons dans la section qui contient le widget sur nous clic droit, nous pouvons dire modèle d'épargnants. Chaque clic enregistre le modèle, affaiblir. Enregistrez-le comme un modèle que nous ne pouvons pas enregistrer. C' est un widget global. Alors comment on peut contourner ça ? Ce que vous ne faites pas Vous devez venir au widget sur lequel vous voulez enregistrer globalement. Alors, c'est ça ? Cliquez dessus. Et les chaussures Savers mondiale. Alors maintenant, nous disons que les épargnants mondiaux, nous allons appeler ce widget de témoignage global. Maintenant, vous verrez à nouveau que mon nom et la convention me rend juste la vie plus facile Si je dis un début
global, je sais que c'est un widget global et je sais widget de témoignage global. Je sais ce que c'est. Il dit que c'est sur le coup 10 sauver. Une fois que nous faisons cela, vous verrez maintenant où nous avons normalement juste l'élément que nous allons Un widget normal à l'intérieur si nous arrivons à la section globale aura maintenant une liste de tous les widgets globaux que nous avons sur vous. Vous voyez, ils ont aussi ce petit dossier orange jaune orteil dans le coin supérieur gauche que Justin note que nous avons un widget global. Donc maintenant mettre à jour cette page afin que vous puissiez voir tout est mis en place là est sorti de cela. Maintenant, revenez à notre tableau de bord et nous allons entrer dans une section de modèle dans un
générateur de thème . On va aller dans notre single par défaut. On va éditer ça avec élémentaire. On va mettre ça au bas de chacun de nos modèles de poste. Donc vous venez dans ce, nous allons juste avoir ce widget global dans si vite à sortir de la nouvelle section. On pourrait commencer cette section de toute façon. Nous voulons, comme je l'ai dit, c'est indépendant du widget global réel. Donc, cliquez sur ce qui va juste mettre un peu d'espacement au-dessus et au-dessous. Juste nous pourrions faire un peu de place sur ce qui est 50 en haut sur 50 en bas. Donc on a un peu d'espace. Maintenant, nous revenons dans un code widgets de global. Il y a notre widget de témoignage global, affaiblir, glisser et déposer cela sur notre page et vous pouvez voir que cela tombe dedans mais nous donne également quelques options
supplémentaires. Nous pouvons éditer le widget global ou l'affaiblir dissocié de global. Si nous modifions le widget global, toutes les modifications que vous apporterez seront reflétées sur l'ensemble du site lié à ce widget global. Si nous voulons le dissocier et apporter un changement à celui-ci qui ne reflète pas tous ces autres widgets globaux, nous pouvons le faire. Nous avons fondamentalement dissocié sa connexion globale. Espérons que cela a du sens dira mise à jour sur eux. Nous avons donc maintenant ce widget global configuré. Maintenant, revenons juste de ça. On pourrait voir que nous avons reçu le texte de la médecine de Laura de John Doe. Donc, vous dites que nous sommes heureux sans tout est tout mis en place avec la porte de sortie Dashboard
reviendra à notre page initiale Cela a eu que là viendra dans un widget global
qui édite que avec élémentaire nous allons faire est que nous allons changer la taxe un petit peu. Donc on va cliquer dessus. On va cliquer, éditer et ils vont le faire, c'est prendre ça et on va juste le dupliquer. Donc nous allons mettre à beaucoup de la même chose que nous savons. J' ai plus d'impôt là-dedans, va frapper la mise à jour. C' est la mise à jour de cette instance. Mais aussi, si nous revenons et jetons un coup d'oeil à l'une de nos pages, il suffit de rafraîchir ce défilement vers le bas et vous pourriez voir Non, cela a également été reflété dans cette section particulière également. Donc, ce lien signifie est un lien bidirectionnel. Nous pouvons le mettre à jour sur un et puis cela reflètera juste là tout au long de leurs sites. C' est une excellente façon de faire des choses que vous pouvez avoir un formulaire d'inscription pour votre liste de diffusion que si vous vouliez rapidement changer de fournisseur de la lumière de tomate de chimpanzé mâle, vous pourriez faire un changement et puis cela sera reflété sur l'ensemble du site qui utilise ce widget global. Super simple, un gain de temps réel.
8. En conclusion: Donc c'est la classe volée. Espérons que ce que cela est démontré est que la création de thèmes en utilisant élémentaire pro sur les outils qui sont disponibles pas compliqué mais ne vous donne un télescope pour créer beaux sites WordPress à la recherche. Si vous avez apprécié les contrôles de la police de classe de mes autres classes de partage de compétences pour vous aider à développer vos compétences et connaissances dans WordPress et beaucoup d'autres compétences de conception Web connexes, eh bien, je vois pull, See Hope vous avez apprécié le et j'espère que je vous reverrai bientôt.