Comment concevoir des thèmes WordPress?

À concevoir des thèmes pour WordPress
Ce guide vous apprend à personnaliser et à concevoir des thèmes pour WordPress.

Ce guide vous apprend à personnaliser et à concevoir des thèmes pour WordPress. La conception de thèmes WordPress à partir de zéro peut être un processus long qui implique beaucoup de codage, mais il existe des applications qui peuvent simplifier le processus. Une application est un plugin WordPress appelé Elementor qui peut être installé à partir du tableau de bord WordPress.

Partie 1 sur 11: Installation d'Elementor

  1. 1
    Connectez-vous à wordpress. Après avoir installé WordPress sur votre serveur, vous pouvez vous connecter au tableau de bord WordPress en tapant l'URL de votre site Web dans un navigateur Web suivi de / wp-admin (par exemple www.mywebsite.com/wp-admin,. Tapez ensuite votre nom d'utilisateur et votre mot de passe pour vous connecter.
  2. 2
    Cliquez sur Plugins. C'est dans la barre latérale à gauche. C'est à côté d'une icône qui ressemble à une prise électrique.
  3. 3
    Cliquez sur Ajouter nouveau. C'est dans le coin supérieur gauche de la page Plugins.
  4. 4
    Tapez elementor dans la barre de recherche et appuyez sur enter. Cela affichera une liste de plugins correspondant à votre recherche.
  5. 5
    Cliquez sur Installer maintenant dans la boîte qui dit " générateur de page élément ou ". C'est le plugin qui a une icône violette et rose avec quatre barres blanches en forme d'un «E» majuscule. Cela installera Elementor Page Builder en tant que plugin pour votre site Web WordPress.
  6. 6
    Cliquez sur Activer. Une fois Elementor installé, ce bouton apparaîtra à côté de l'en-tête dans la zone Plugins Elementor.

Partie 2 sur 11: Créer une nouvelle page avec elementor

  1. 1
    Cliquez sur Tableau de bord. C'est en haut de la barre latérale à gauche de WordPress.
  2. 2
    Cliquez sur + créer une nouvelle page. C'est en face de l'Elementor sous l'en-tête qui dit "Aperçu d'Elementor". C'est dans la première colonne. Cela ouvrira un éditeur de page visuelle.
  3. 3
    Cliquez sur. C'est l'icône qui ressemble à un engrenage dans le coin inférieur gauche de la barre latérale. Cela ouvrira le menu des paramètres.
  4. 4
    Tapez un titre. Utilisez la zone de texte sous "Titre" pour saisir le titre de votre page. Le titre ira en haut de la page.
    • Si vous ne souhaitez pas avoir de titre, cliquez sur le commutateur en face de "Masquer le titre".
  5. 5
    Sélectionnez une mise en page. Utilisez le menu déroulant sous «Mise en page» pour sélectionner un modèle pour votre page.
Utilisez le menu déroulant pour sélectionner une icône à côté du texte du bouton
Utilisez le menu déroulant pour sélectionner une icône à côté du texte du bouton.

Partie 3 sur 11: sélection des couleurs par défaut

  1. 1
    Cliquez sur . C'est dans le coin supérieur gauche de la barre latérale Elementor à gauche.
  2. 2
    Cliquez sur Couleurs par défaut. C'est la première option dans le menu de la barre latérale sous l'en-tête "Style".
  3. 3
    Sélectionnez une palette de couleurs. Vous pouvez sélectionner une palette dans la liste sous l'en-tête qui dit "Plus de palettes" ou cliquer sur les cases en haut de la barre latérale pour sélectionner une couleur pour les couleurs primaires, secondaires, de texte et d'accentuation. Utilisez la zone de couleur pour sélectionner une couleur ou entrez le code hexadécimal de couleur dans la barre en haut.
  4. 4
    Cliquez sur Appliquer. C'est dans le coin supérieur droit du menu de la barre latérale.

Partie 4 sur 11: sélection des polices par défaut

  1. 1
    Cliquez sur . C'est dans le coin supérieur gauche de la barre latérale Elementor à gauche.
  2. 2
    Cliquez sur Polices par défaut. C'est la deuxième option sous l'en-tête "Style" dans la barre latérale.
  3. 3
    Cliquez sur Titre principal. C'est la première option du menu Polices par défaut.
  4. 4
    Sélectionnez une famille de polices. Utilisez le menu déroulant pour sélectionner une famille de polices.
  5. 5
    Sélectionnez un poids. Utilisez le menu déroulant pour sélectionner l'épaisseur de la police. Vous pouvez également sélectionner "Gras" dans le menu déroulant.
  6. 6
    Cliquez sur Titre secondaire. C'est la première option du menu Polices par défaut.
  7. 7
    Sélectionnez une famille de polices. Utilisez le menu déroulant pour sélectionner une famille de polices.
  8. 8
    Sélectionnez un poids. Utilisez le menu déroulant pour sélectionner l'épaisseur de la police.
  9. 9
    Cliquez sur Corps du texte. C'est la première option du menu Polices par défaut.
  10. 10
    Sélectionnez une famille de polices. Utilisez le menu déroulant pour sélectionner une famille de polices.
  11. 11
    Sélectionnez un poids. Utilisez le menu déroulant pour sélectionner l'épaisseur de la police.
  12. 12
    Cliquez sur Texte accentué. C'est la première option du menu Polices par défaut.
  13. 13
    Sélectionnez une famille de polices. Utilisez le menu déroulant pour sélectionner une famille de polices.
  14. 14
    Sélectionnez un poids. Utilisez le menu déroulant pour sélectionner l'épaisseur de la police.
  15. 15
    Cliquez sur Appliquer. C'est dans le coin supérieur droit de la barre latérale.

Partie 5 sur 11: Ajout d'un en-tête

  1. 1
    Cliquez en dehors de la barre latérale. Cela ramènera la barre latérale au menu par défaut.
  2. 2
    Faites glisser le carré d'en-tête vers la section. La case En-tête est la case qui a un grand «T» majuscule. C'est en haut à droite du menu de la barre latérale. La section est le carré avec le contour en pointillé sur la page principale. Cela transformera la section en texte d'en-tête. Une nouvelle section vide apparaîtra sous l'en-tête.
  3. 3
    Tapez le titre. Vous pouvez soit cliquer sur le titre de la page principale et saisir le titre, soit utiliser la zone de texte de la barre latérale pour saisir le titre.
  4. 4
    Sélectionnez la taille du titre. Utilisez le menu déroulant à côté de "Taille" pour sélectionner la taille de l'en-tête.
    • Vous pouvez également utiliser la zone de balise HTML pour sélectionner la taille de la police.
  5. 5
    Sélectionnez l'alignement. Cliquez sur l'un des quatre carrés en bas du menu de la barre latérale pour sélectionner l'alignement. Vous pouvez aligner le texte à gauche, au centre, à droite ou justifié sur toute la section.
    • Si vous souhaitez utiliser une police ou une couleur différente de celle par défaut, vous pouvez cliquer sur "Style" en haut du menu de la barre latérale et sélectionner une couleur et une police différentes pour le texte.
Utilisez la zone de couleur pour sélectionner une couleur ou entrez le code hexadécimal de couleur
Utilisez la zone de couleur pour sélectionner une couleur ou entrez le code hexadécimal de couleur dans la barre en haut.

Partie 6 sur 11: Ajout de corps de texte

  1. 1
    Cliquez sur Nouvelle section. Cela vous donnera la possibilité de créer des sections dans une section. Vous verrez une liste de façons de diviser la section.
  2. 2
    Cliquez sur une structure de section. Il existe plusieurs façons de diviser la section. Vous pouvez ajouter plusieurs colonnes, ou une barre latérale à gauche ou à droite, ou les deux. Cliquez sur le bouton avec l'image qui ressemble le plus à la façon dont vous voulez la mise en page de votre corps de texte.
  3. 3
    Faites glisser la zone de l'éditeur de texte vers la ou les sections dans lesquelles vous souhaitez ajouter du texte. L'éditeur de texte est la deuxième zone de la barre latérale. Il comporte plusieurs lignes qui ressemblent à des lignes de texte. Vous pouvez le faire glisser vers n'importe quelle section de la page principale.
  4. 4
    Tapez le texte du corps. Utilisez la zone de texte de la barre latérale pour saisir votre corps de texte. La barre d'outils en haut de la zone de texte vous permet d'ajouter du gras, de l'italique, du soulignement, des listes numérotées et à puces et des hyperliens. Le dernier bouton, qui ressemble à deux rectangles avec des cases à l'intérieur, élargit la barre d'outils pour plus d'options de mise en forme.
    • Si vous souhaitez utiliser une police ou une couleur différente de celle par défaut, vous pouvez cliquer sur "Style" en haut du menu de la barre latérale et sélectionner une couleur et une police différentes pour le texte.

Partie 7 sur 11: Ajouter une image

  1. 1
    Faites glisser la zone d'image vers une section. La zone Image a une icône qui ressemble à une image de montagnes et d'un soleil.
  2. 2
    Cliquez sur Choisissez votre image. C'est la grande boîte grise dans la barre latérale. Cela affichera une fenêtre contextuelle.
  3. 3
    Cliquez sur Sélectionner les fichiers. C'est le gros bouton au milieu de la fenêtre contextuelle. Cela ouvrira un navigateur de fichiers que vous pourrez utiliser pour sélectionner des fichiers image.
  4. 4
    Cliquez sur un fichier image. À l'aide du navigateur de fichiers, accédez et cliquez pour sélectionner une image que vous souhaitez télécharger. La taille maximale du fichier est de 2 mégaoctets.
  5. 5
    Cliquez sur Ouvrir. C'est dans le coin inférieur droit du navigateur de fichiers. Cela téléchargera le fichier image et l'affichera dans la section.
  6. 6
    Sélectionnez la taille de l'image. Utilisez le menu déroulant sous l'image pour sélectionner la taille de l'image. Il existe une variété de tailles et de dimensions au choix.
  7. 7
    Sélectionnez l'alignement. Utilisez les trois cases sous le menu déroulant de la taille de l'image pour choisir l'alignement de l'image. Vous pouvez aligner l'image à gauche, au centre ou à droite de la section.
  8. 8
    Ajoutez une légende (facultatif). Si vous souhaitez ajouter une légende à l'image, utilisez la zone de texte en face de "Légende" pour saisir une légende.
  9. 9
    Ajoutez un lien (facultatif). Si vous souhaitez ajouter un lien, utilisez le menu déroulant en bas de la barre latérale pour ajouter un lien vers une URL ou un fichier multimédia.

Partie 8 sur 11: Ajouter une vidéo

  1. 1
    Faites glisser la boîte vidéo vers la section. La boîte vidéo a une icône qui ressemble au logo YouTube.
  2. 2
    Sélectionnez le type de vidéo. Utilisez le menu déroulant en face de "Type de vidéo" pour sélectionner YouTube ou Vimeo.
  3. 3
    Ajouter un lien vidéo. Utilisez la case sous le lien pour copier et coller le lien vidéo depuis YouTube ou Vimeo.
  4. 4
    Ajustez les options vidéo. Utilisez les commutateurs pour activer ou désactiver les options suivantes.
    • La lecture automatique lira automatiquement la vidéo lors du chargement de la page.
    • Les vidéos suggérées afficheront des suggestions de vidéos une fois la lecture de la vidéo terminée.
    • Le contrôle du lecteur donne au spectateur la possibilité d'arrêter ou de lire la vidéo, ainsi que de passer à certaines parties de la vidéo.
    • Le titre et les actions du lecteur affichent le titre de la vidéo et les options dans le coin supérieur droit.
    • Le mode de confidentialité ne stockera pas les données des visiteurs lorsqu'il est activé.
  5. 5
    Ajoutez une superposition d'image (facultatif). Si vous souhaitez ajouter une superposition d'image, cliquez sur "Superposition d'image" en bas de la barre latérale. Cliquez sur le commutateur à côté de "Superposition d'image", puis cliquez sur la grande zone grise pour télécharger une image à utiliser comme superposition.
Cliquez sur l'un des quatre carrés en bas du menu de la barre latérale pour sélectionner l'alignement
Cliquez sur l'un des quatre carrés en bas du menu de la barre latérale pour sélectionner l'alignement.

Partie 9 sur 11: Ajout de boutons

  1. 1
    Cliquez sur Nouvelle section. Cela vous donnera la possibilité de créer des sections dans une section. Vous verrez une liste de façons de diviser la section.
  2. 2
    Cliquez sur une structure de section. Il existe plusieurs façons de diviser la section. Vous pouvez ajouter plusieurs colonnes, ou une barre latérale à gauche ou à droite, ou les deux. Cliquez sur le bouton avec l'image qui ressemble le plus à la façon dont vous voulez la disposition de vos boutons.
  3. 3
    Faites glisser la zone de boutons vers une section. La zone Bouton a une icône qui ressemble à un curseur de souris cliquant sur un bouton.
  4. 4
    Tapez le texte du bouton. Tapez ce que vous voulez que le bouton dise dans la zone de texte en face de "Texte".
  5. 5
    Ajoutez un lien de bouton. Utilisez la case à côté de "Lien" pour ajouter l'URL de la page vers laquelle vous souhaitez que le bouton renvoie.
  6. 6
    Sélectionnez l'alignement des boutons. Utilisez les quatre cases sous «Alignement» pour aligner le bouton à gauche, à droite, au centre ou justifié sur toute la section.
  7. 7
    Sélectionnez la taille du bouton. Utilisez le menu déroulant en face de "Taille" pour sélectionner la taille du bouton. Vous pouvez sélectionner très petit, petit, moyen, grand ou très grand.
  8. 8
    Sélectionnez l'icône du bouton. Utilisez le menu déroulant pour sélectionner une icône à côté du texte du bouton.
  9. 9
    Sélectionnez la position de l'icône. Utilisez le menu déroulant suivant pour sélectionner si vous souhaitez que l'icône soit placée avant ou après le texte.
  10. 10
    Sélectionnez le style de bouton (facultatif). Si vous souhaitez plus d'options pour styliser le bouton, vous pouvez cliquer sur "Style" en haut de la barre latérale. Ici, vous pouvez changer la couleur du bouton, la couleur du texte et la police, ainsi que de sélectionner une bordure pour le bouton.

Partie 10 sur 11: Ajout d'un diviseur

  1. 1
    Faites glisser la zone de séparation vers une section. Les diviseurs sont des lignes pleines qui vont entre les sections d'une page Web.
  2. 2
    Sélectionnez le style de séparation. Utilisez le menu déroulant à côté de "Style" pour sélectionner le style de ligne. Vous pouvez sélectionner solide, double, pointillé ou pointillé.
  3. 3
    Sélectionnez le poids. Utilisez la barre de défilement sous "Epaisseur" pour régler l'épaisseur de la ligne.
  4. 4
    Sélectionnez la couleur. Cliquez sur la case en face de la couleur pour sélectionner la couleur de la ligne.
  5. 5
    Sélectionnez la largeur de la ligne. Utilisez la barre de défilement sous "largeur" pour ajuster la partie de la section occupée par la ligne.
  6. 6
    Sélectionnez l'alignement. Cliquez sur l'une des trois cases sous «alignement» pour sélectionner l'alignement de ligne. Vous pouvez l'aligner à gauche, à droite ou au centre de la section.

Partie 11 sur 11: Ajouter des widgets et publier

  1. 1
    Faites glisser n'importe quel widget vers une section souhaitée. Il y a beaucoup de widgets dans la barre latérale qui vous permettent d'ajouter des onglets, des galeries d'images, des icônes de médias sociaux, des barres latérales, etc. Il y a beaucoup de choses à jouer et à expérimenter.
  2. 2
    Cliquez sur Publier. C'est le bouton vert dans le coin inférieur gauche de la barre latérale. Cliquez ici lorsque vous avez terminé de concevoir votre thème et ses pages.
FacebookTwitterInstagramPinterestLinkedInGoogle+YoutubeRedditDribbbleBehanceGithubCodePenWhatsappEmail