Recherchez-vous une solution de conversion PSD en WordPress? Vous voulez convertir votre PSD de site Web prêt à WordPress, mais vous ne savez pas comment? Ok, je peux t’aider dans cette affaire.

Vous savez déjà que WordPress est l’une des plateformes CMS les plus utilisées et polyvalentes de ces derniers temps. Maintenant, créer un site Web entièrement fonctionnel du PSD au thème WordPress sans codage est beaucoup plus confortable avec un créateur de page comme Elementor.

Dans cet article, je vais vous montrer « Comment convertir un PSD en WordPress en utilisant Elementor & WidgetKit » étape par étape.

Voyons comment.

Sélection d’un design PSD

 Comment convertir PSD en WordPress à l'aide d'Elementor WidgetKit 1

Avant de convertir un thème PSD en thème WordPress, la première chose à faire est de sélectionner un design PSD d’un site Web. En bref, PSD est l’abréviation de PhotoShop Design, l’un des outils de conception les plus populaires avec la plupart des designs de sites Web WordPress.

Vous pouvez choisir l’un de vos designs PSD préférés parmi la vaste collection de PSDHUB.

Ils fournissent des modèles PSD gratuits de qualité supérieure pour votre site Web, à la fois pour un usage personnel et commercial. N’oubliez pas que la conception de votre PSD sélectionnée doit être simple et contemporaine.

Vérifiez les facteurs suivants lorsque vous choisissez une conception PSD,

  • Structure de conception: La première chose à considérer est la structure de conception. La conception n’a pas de limites, mais le codage l’a.
  • Disposition épurée et élégante: La troisième chose est que votre conception PSD préférée doit être propre et élégante. Il aide le développeur à créer un site Web parfait en pixels à partir d’une mise en page propre et élégante.
  • Réalisation du but: La deuxième chose est, si la conception remplit votre objectif ou non. Supposons que vous ayez besoin d’un site Web de voyage, votre conception PSD doit être un site Web de voyage PSD.
  • Complexité: Enfin, essayez d’ignorer la complexité telle qu’elle est pour PSD également dans le choix degn.

Ici, nous utilisons Eventia – Modèle de gestion de conférences et d’événements de PSDHUB.

Installer WordPress

 Comment convertir PSD en WordPress à l'aide d'Elementor WidgetKit 2

WordPress est bien connu pour sa facilité d’installation. Dans la plupart des circonstances, l’installation de WordPress est un processus très simple et prend moins de cinq minutes. Pour convertir un thème PSD en thème WordPress, l’installation de WordPress est la deuxième étape à envisager.
WordPress.org fournit un article détaillé sur « Comment installer WordPress » sur la page d’assistance de leur site. Cependant; Voici les instructions de base de l’installation de WordPress pour vous,

  1. Téléchargez et décompressez d’abord le package WordPress.
  2. Créez une base de données pour WordPress sur votre serveur web, ainsi qu’un MySQL.
  3. Téléchargez les fichiers WordPress à l’emplacement souhaité sur votre serveur web:
  4. Si vous souhaitez intégrer WordPress à la racine de votre domaine, déplacez ou téléchargez tout le contenu du répertoire WordPress décompressé dans le répertoire racine de votre serveur Web.
  5. Si vous souhaitez avoir votre installation WordPress dans son propre sous-répertoire sur votre site Web, créez le répertoire de blog sur votre serveur et téléchargez le contenu du package WordPress décompressé dans le répertoire via FTP.
  6. Exécutez le script d’installation de WordPress en accédant à l’URL dans un navigateur Web.

C’est tout! WordPress devrait maintenant être installé.

Installer Elementor

 Comment convertir PSD en WordPress à l'aide d'Elementor WidgetKit 3

L’article traite de la conversion d’un PSD en thème WordPress à l’aide d’Elementor. Nous avons donc besoin d’Elementor pour personnaliser et éditer le fichier PSD. Voyons alors comment installer Elementor.
Elementor est l’une des meilleures plates-formes de conception complètes pour créer un design parfait en pixels dans WordPress. Il est préférable pour son approche de conception extensible et conviviale. Le processus d’installation d’Elementor est également une tâche simple. Suivez simplement quelques étapes simples et vous êtes prêt à concevoir votre PSD dans Elementor page builder.

Il existe deux façons d’installer le plugin Elementor. Le processus d’installation est décrit ci-dessous,

Via le site Elementor

  • Allez d’abord sur elementor.com et cliquez sur télécharger.
  • Dans le tableau de bord WordPress, Cliquez sur Plugins > Ajouter un nouveau.
  • Cliquez sur Upload Plugin et choisissez le fichier que vous avez téléchargé pour Elementor.

Via le tableau de bord WordPress

  • Dans le Tableau de bord, cliquez sur Plugins > Ajouter un nouveau.
  • Dans le champ de recherche, entrez Elementor et choisissez Elementor page builder à installer.
  • Après l’installation, cliquez sur Activer.

C’est tout ce que vous avez à faire pour installer Elementor page builder. Vous pouvez également suivre la vidéo ci-dessous pour en savoir plus sur le processus d’installation.

Installer WidgetKit

 Comment convertir PSD en WordPress à l'aide d'Elementor WidgetKit 4

WidgetKit pour Elementor – Le kit d’addons Elementor le plus avancé & qui améliore les capacités de création de votre site Web en ajoutant plus d’éléments et de mises en page. Ici, nous utilisons les widgets et les éléments de its pour la conversion PSD en WordPress.
Vous pouvez créer presque n’importe quel type de pages à partir d’un PSD en utilisant WordPress et WidgetKit. L’installation de Widgetkit est aussi simple que de concevoir un thème PSD à WordPress avec celui-ci. À partir du tableau de bord WordPress, vous pouvez facilement ajouter WidgetKit en suivant quelques étapes faciles. Voyons voir,

Installez WidgetKit via le tableau de bord WordPress

  • Dans le tableau de bord, cliquez sur Plugins > Ajouter un nouveau.
  • Entrez WidgetKit dans le champ de recherche et choisissez WidgetKit pour Elementor à installer.
  • Une fois l’installation réussie, cliquez sur Activer.

WidgetKit est maintenant prêt à être utilisé avec Elementor. Si vous avez encore une confusion, suivez simplement la vidéo. Cela vous aidera également à utiliser WidgetKit.

Convertissez votre PSD en WordPress

 Comment convertir un PSD en WordPress à l'aide d'Elementor WidgetKit 5

La partie d’installation est terminée. Il est maintenant temps de convertir le PSD en WordPress Elementor et WidgetKit. Il y a beaucoup de fournisseurs de services PSD à WordPress qui donnent PSD à WordPress ainsi que la conversion PSD à Joomla actuellement. Cependant; vous pouvez concevoir votre propre manière préférée. Ici, nous montrons simplement un moyen de base de convertir un PSD en WordPress.

En outre, Vous pouvez également choisir l’un de nos Thèmes et modèles prêts à l’emploi dans la vaste collection de notre répertoire de plugins de thèmes WordPress &.

Essayez de suivre la séquence lors de la conception d’une mise en page à partir de PSD. Cela vous aidera beaucoup,

Créer une nouvelle page

La première chose à faire est de créer une nouvelle page à partir du tableau de bord WordPress. En haut à gauche du tableau de bord WordPress, cliquez sur Pages > Ajouter Nouveau.

  •  Comment convertir PSD en WordPress à l'aide d'Elementor WidgetKit 6

Cliquez ensuite sur Modifier avec Elementor pour accéder au Générateur de page Elementor. Vous verrez un panneau Elementor comme indiqué ci-dessous.

  •  Comment convertir PSD en WordPress à l'aide d'Elementor WidgetKit 7

Créez votre page à partir du fichier PSD

Pour créer une page ou convertir un thème PSD en thème WordPress, il y a trois éléments principaux à prendre en compte: Sections, Colonnes et Widgets. Ici, les sections sont les plus grands blocs de construction et capturent les colonnes. Vous pouvez placer des widgets à l’intérieur des colonnes. En cliquant sur l’option Modifier, vous pouvez contrôler la Section, la Colonne et les widgets avec leur poignée.

  •  Comment convertir PSD en WordPress à l'aide d'Elementor WidgetKit 8

Ajouter une section d’en-tête

Pour la section d’en-tête, nous utilisons ici un thème existant Eventia de Themexpert. Dans WordPress, vous avez utilisé un thème existant comme cadre pour la conception d’un modèle, sinon WordPress lui-même en ajoute un pour vous. Ensuite, vous pouvez ajouter un logo et plusieurs pages en utilisant la conception ou la mise en page du thème existant.

  •  Comment convertir PSD en WordPress à l'aide d'Elementor WidgetKit 9

Ajouter une section de héros

Maintenant, nous convertissons la section de héros. Nous ajoutons d’abord une image d’arrière-plan comme le PSD, puis ajoutons une colonne dans une colonne pour ajouter plusieurs contenus et icônes.

  •  Comment convertir PSD en WordPress à l'aide d'Elementor WidgetKit 10

Pour l’option compteur ici, nous utilisons l’élément Compte à rebours WidgetKit. La sortie et l’option d’édition sont ci-dessous.

  •  Comment convertir PSD en WordPress à l'aide d'Elementor WidgetKit 11

Ajoutez la section intérieure

Il est maintenant temps de concevoir la section intérieure. Ici, nous utilisons des éléments Elementor pour ajouter un arrière-plan et du texte entre deux colonnes.

  •  Comment convertir PSD en WordPress à l'aide d'Elementor WidgetKit 12

Il s’agit de la section À propos de Cet événement modifier avec l’élément Elementor. Ici, nous ajoutons du texte et une image de bannière dans la colonne de section. La vue regarde ci-dessous.

  •  Comment convertir PSD en WordPress à l'aide d'Elementor WidgetKit 13

Avec l’icône verticale de l’équipe WidgetKit, nous concevons la section haut-parleur du fichier PSD. Là, nous ajoutons des images et une icône de site social dans différentes colonnes avec nom et désignation.

  •  Comment convertir PSD en WordPress à l'aide d'Elementor WidgetKit 14

Dans cette section, nous ajoutons simplement une icône aléatoire du PSD et donnons un titre.

  •  Comment convertir PSD en WordPress à l'aide d'Elementor WidgetKit 15

Nous ne pouvons pas tout faire avec Elementor. Dans ce cas, que faisons-nous? Nous utilisons un addon de thème différent ou faisons un addon pour le nôtre. C’est chose courante lors de la conception d’un thème PSD à WordPress. Ici, nous utilisons l’Addon de planification du thème Eventia.

  •  Comment convertir PSD en WordPress à l'aide d'Elementor WidgetKit 16

Pour la section Blog, nous utilisons l’élément de carrousel de blog de WidgetKit. Avec un contenu visuel différent, vous pouvez également ajouter un arrière-plan, même un bouton lire plus.

  •  Comment convertir PSD en WordPress à l'aide d'Elementor WidgetKit 17

Pour la section pied de page ici, nous utilisons un thème existant Eventia par Themexpert comme nous le faisons avant la section d’en-tête. Ici, nous obtenons plusieurs icônes de site social et un bouton d’abonnement.

  •  Comment convertir PSD en WordPress à l'aide d'Elementor WidgetKit 18

Preview & Publiez votre page

Une fois que vous avez terminé de concevoir votre page à partir du PSD, vous pouvez Prévisualiser votre travail et le publier. Vous pouvez également modifier une page publiée et enregistrer votre travail en tant que brouillon. Cela signifie que vous ne ruinerez pas votre page publiée tout en enregistrant votre travail en tant que brouillon. Voici l’aperçu visuel de Eventia PSD.

Dernier mot

Articles

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée.