Comment installer et configurer un nouveau thème WordPress WooCommerce

WooCommerce est la plate-forme de commerce électronique la plus populaire et la plus personnalisable pour développer votre activité en ligne. Vous pouvez télécharger gratuitement WooCommerce, mais vous commencez vraiment à voir sa puissance lorsque vous commencez à utiliser les plugins et les thèmes WordPress WooCommerce.

Mais avez-vous vraiment besoin d'utiliser un thème WooCommerce??

Bien que ce ne soit pas obligatoire, je le recommande vivement..

Les thèmes WooCommerce sont non seulement centrés sur le commerce électronique, mais tout le thème est centré sur les styles WooCommerce. Le thème CSS utilisé par WooCommerce pour définir le mode d'affichage des produits est ensuite utilisé par le thème WordPress WooCommerce afin de tout rassembler pour créer certaines des vitrines les plus joliment conçues du commerce électronique..

Sans oublier le fait que l'installation et la configuration d'un nouveau thème WordPress WooCommerce n'est pas plus difficile que la configuration d'un autre thème WordPress..

Laisse moi te montrer comment faire.

Comment installer et configurer un nouveau thème WordPress WooCommerce

Si vous avez déjà installé WooCommerce, c'est génial! Si ce n'est pas le cas, je recommande fortement le Guide d'utilisation de WooCommerce pour débutants de Rachel McCollin. Ceci vous présentera WooCommerce et vous guidera à travers toutes les étapes nécessaires pour que votre vitrine soit opérationnelle..

Commençons maintenant avec l'installation et la configuration d'un nouveau thème WordPress WooCommerce..

Étape 1: Installer les données factices

Si vous avez déjà ajouté vos produits à WooCommerce, je vous recommande de sauter cette étape et de commencer à l'étape 2..

L'installation de données factices ajoute des produits fictifs à votre vitrine pour vous aider à visualiser votre magasin avec des produits. Après avoir terminé l’installation et configuré votre nouveau thème WordPress WooCommerce, vous voudrez supprimer tout les données factices avant d'ajouter vos produits. Sinon, vous risquez de supprimer accidentellement vos propres données de produit.

Les données factices sont incluses dans votre plugin WooCommerce. Si vous avez installé WooCommerce dans WordPress Admin, téléchargez le plugin à partir du répertoire de plugins WordPress sur votre ordinateur. Ce sera plus facile que de vous connecter à votre FTP, d'aller dans votre répertoire de plugins et de télécharger les données factices à partir de là..

Une fois le téléchargement terminé, décompressez le fichier pour pouvoir importer votre fichier dummy-data.xml..

Aller à votre Outils et cliquez sur Importation:

Ne laissez pas les «taux de taxe WooCommerce (CSV)» vous confondre. Cela peut être fait plus tard si vous le souhaitez. Pour les données factices WooCommerce, vous devrez choisir WordPress.

Plus que probablement, le plugin WordPress Importer ne sera pas installé, alors n'hésitez plus! Installer maintenant.

Une fois installé, allez-y et Activer le plugin et exécuter l'importateur.

Vous souvenez-vous où vous avez téléchargé et décompressé le plugin WooCommerce? Génial! Maintenant vous devez cliquer Choisir le fichier et allez-y.

Vos données factices doivent se trouver dans votre dossier décompressé: (woocommerce.version.number)> woocommerce> dummy-data.

Ouvrez le dossier des données factices, sélectionnez dummy-data.xml, et vous êtes prêt à télécharger le fichier et à l'importer.

C’est la dernière chose à faire avant d’importer toutes les données factices..

Certaines de ces préférences personnelles, mais voici ce que je fais (capture d'écran ci-dessous):

Importez l'auteur par défaut «wooteam» au lieu de créer un nouvel auteur ou d'utiliser un auteur préexistant. De cette façon, vous savez quel contenu a été importé / créé dans ce processus en fonction du nom de l'auteur (je vous recommande de supprimer l'auteur lorsque vous supprimez les données factices une fois que vous avez terminé l'installation et la configuration de votre nouveau thème WordPress WooCommerce)..

Je vous recommande également Télécharger et importer des pièces jointes afin que vous ayez des images associées à chaque produit (encore une fois, vous voudrez vous assurer que le support est supprimé lorsque vous avez terminé avec les données factices).

Une fois ces sélections effectuées, soumettez:

Visitez yourwebsite.com/shop/ et vous devriez voir un magasin de test entièrement importé:

Ouais! Tu l'as fait!

Ce n'est pas très bien conçu, n'est-ce pas? Heureusement que nous allons installer un superbe thème WordPress WooCommerce comme Savoy.

(REMARQUE: Une fois que vous avez terminé l'installation et la configuration de votre thème, n'oubliez pas de supprimer les produits et les images de l'importation des données factices. avant vous commencez à ajouter vos propres produits.)

Étape 2: Installez un thème WordPress WooCommerce

Voyons maintenant comment installer le thème WooCommerce. Si vous n'avez pas déjà téléchargé votre thème WordPress Commerce, allez-y et téléchargez-le sur votre ordinateur (assurez-vous de savoir où vous le téléchargez pour pouvoir y accéder)..

Vous pouvez installer votre thème de deux manières différentes:

  1. Accédez à votre site Web via FTP
  2. De l'administrateur WordPress

FTP votre thème

Si vous êtes à l'aise avec FTP, connectez-vous à votre serveur et dirigez-vous vers le wp-content> thèmes annuaire. C'est là que vous voudrez envoyer votre thème. Avant d’envoyer votre dossier décompressé à votre serveur, assurez-vous d’envoyer votre thème. Regardons de plus près en utilisant notre exemple de thème WordPress de ThemeForest.

Après avoir décompressé votre téléchargement, vous verrez qu'il existe un certain nombre de dossiers différents:


Ce ne sont pas tous les thèmes que vous téléchargez qui seront emballés. Parfois, le dossier compressé que vous téléchargez est le dossier du thème actuel. C'est toujours une bonne idée de vérifier, car cela varie d'un endroit à l'autre..

La thématique Savoy - Minimaliste AJAX WooCommerce comprend des éléments supplémentaires tels que la documentation, les ressources, etc. Si vous recherchez la savane dans le dossier des fichiers de thèmes, vous y trouverez votre thème (savoy.zip)..

Si vous installez via FTP, chargez votre dossier de thèmes non compressé (par exemple, «savoy») dans le répertoire themes. Si vous n'êtes pas sûr d'utiliser FTP ou préférez installer à partir de l'administrateur WordPress, c'est très bien. Je préfère aussi utiliser l'administrateur WordPress.

De l'administrateur WordPress

L'installation d'un thème WordPress à partir de l'administrateur nécessite que le dossier du thème soit compressé (themefolder.zip). Comme nous en avons discuté précédemment, assurez-vous de travailler avec le réel dossier de thème et non le dossier dans lequel votre thème peut être emballé.

À partir de l’administrateur WordPress, sous Apparence, Cliquez sur Des thèmes:

Ajouter un nouveau thème:

Télécharger un thème:

Vous rappelez-vous où se trouve votre fichier zip de thème?

(Notre exemple de thème est intitulé: savoy.zip)

Cliquez sur Choisir le fichier et allez-y:

Une fois installé, vous pouvez visiter Apparence> Thèmes dans votre administrateur WordPress pour voir s’il est installé ou cliquez dessus pour l’activer immédiatement.

Comme vous pouvez le voir (ci-dessous), le thème Savoy a été installé avec succès. Activer:

Maintenant que votre thème WordPress WooCommerce est correctement installé et activé, configurons-le..

Étape 3: Configurer un thème WordPress WooCommerce

Tous les thèmes ne sont pas personnalisés exactement de la même manière. La manière dont un thème est conçu et développé est un facteur important. Il peut donc y avoir des différences entre ce tutoriel et ce à quoi vous pouvez être confronté. De manière générale, toutefois, cela devrait vous aider à configurer votre thème WordPress WooCommerce, quel que soit le thème WooCommerce que vous utilisez dans ThemeForest ou ailleurs..

Plugins recommandés / requis

Après avoir installé et activé le thème Savoy, vous serez averti des plugins recommandés:

Parfois, votre thème vous informe des plugins recommandés, tandis que d'autres incluent des recommandations dans leur documentation. Il peut exister des fonctions de conception de thème, telles que des curseurs facultatifs, qui ne sont pas codées dans le thème, mais sont adaptées aux besoins..

Cliquer sur Commencer l'installation des plugins dans le thème Savoy pour voir la liste des plugins recommandés:

Encore une fois, cela varie d’un thème à l’autre, mais dans ce cas, vous voudrez peut-être ou non installer tous ces logiciels..

Par exemple, bien que Savoy recommande le formulaire de contact 7 et inclut un style pour celui-ci, il est possible que vous ne souhaitiez pas utiliser ce plugin pour votre formulaire de contact. Vous voudrez peut-être utiliser quelque chose comme Gravity Forms ou Ninja Forms.

Un plugin tel que Regenerate Thumbnails est un excellent plug-in à utiliser pour ceux qui ont un magasin existant configuré et dont les images sont configurées pour un thème précédent. Ce plugin passera par votre médiathèque WordPress et redimensionnera toutes vos images pour fonctionner avec votre nouveau thème. Vous pouvez ou ne pas vouloir faire cela avec les données factices, et vous pouvez aussi vouloir ignorer ce plugin (mais je vous recommande de le faire quand même, pour que tous les médias soient correctement dimensionnés à des fins de test).

Un plugin comme Envato Toolkit est toutefois très important pour les thèmes achetés via ThemeForest, car vous êtes informé de ses mises à jour..

Je recommanderais d'installer tous les plugins recommandés lorsque vous avez commencé. Vous pouvez toujours supprimer un plugin plus tard si vous n'en avez pas besoin, alors que si vous n'installez pas le plugin nécessaire, vous risquez d'être frustré car le thème ne fonctionne pas ou ne fait pas quelque chose que vous avez aimé dans la démo..

Une fois que vous avez installé tous, certains ou aucun des plugins recommandés et / ou requis, n'oubliez pas de les activer:

Si vous utilisez un thème acheté auprès de ThemeForest, tel que notre exemple de thème Savoy, n'oubliez pas de saisir votre nom d'utilisateur Marketplace et votre clé API secrète dans la boîte à outils Envato WordPress pour garantir des mises à jour correctes des thèmes..

Personnaliser

C’est la partie de l’installation et de la configuration de votre thème WordPress WooCommerce quand cela devient vraiment amusant et que vous commencez à voir votre site prendre vie..

Vous pouvez accéder au personnalisateur WordPress à partir du menu dans WordPress: Apparence> Personnaliser. Ou allez à la page Thèmes sous Apparence> Thèmes puis cliquez sur le Personnaliser bouton:

Bienvenue sur le personnalisateur WordPress:

Voici où nous allons faire quelques ajustements avant d'entrer dans une configuration plus profonde.

La première chose que vous verrez est Identité du site. C'est ici que vous pouvez changer le titre et le slogan de votre site..

Parfois, vous pouvez également ajouter une image d'en-tête personnalisée et / ou une icône de site (cela varie d'un thème à l'autre)..

Ensuite, configurez vos menus:

S'il s'agit d'une nouvelle configuration WooCommerce ou si vous n'avez pas créé de page, il se peut que vous n'ayez pas encore beaucoup à personnaliser. Avec WooCommerce installé, cependant, il a automatiquement ajouté certaines pages que vous voudrez sûrement ajouter immédiatement à votre menu..

Vous pouvez facilement ajouter et créer un nouveau menu:

Une fois que vous avez ajouté un menu (ou plusieurs), vous pouvez sélectionner l’emplacement où vous souhaitez afficher le menu, ainsi que les différents éléments de menu (liens personnalisés, publications, pages, produits, etc.)..

Cela vous donne une grande flexibilité quant à la manière dont vous souhaitez que votre site WooCommerce fonctionne. N'ayez pas peur de jouer avec ou de le changer plus tard.

Avant de quitter WordPress Customizer, vous devrez indiquer à WordPress de faire de la page d'accueil votre magasin:

marque Affichages page de garde comme Une page statique et sélectionnez le Page de garde être votre Boutique page. La page Boutique a été créée automatiquement lorsque vous avez installé le plug-in WooCommerce..

En ce qui concerne la Des postes page, cela dépend où vous voulez ou non un blog sur votre site WooCommerce. Si tel est le cas, vous devez créer une page de blog et sélectionner celle-ci sur cette page de WordPress Customizer ou dans le menu contextuel. Paramètres d'administrateur WordPress> Lecture.

Les resultats

Avec une configuration de base, vous pouvez voir à quel point votre boutique en ligne peut être belle avec un thème WordPress WooCommerce:

Les pages de produits individuels ont l’air incroyable:

Il comprend même des produits connexes:

Le thème AJAX WooCommerce de Savoy - Minimalist vous permet d’ajuster facilement de nombreux éléments de votre site et peut loin derrière tout ce que j'ai couvert dans ce tutoriel (assurez-vous de lire la documentation de votre thème pour en savoir plus sur votre thème en particulier). Je vous ai seulement montré les modifications qui pourraient être apportées à WordPress Customizer et peuvent généralement être effectuées sur n'importe quel thème que vous utilisez éventuellement..

Conclusion

Vous pouvez clairement voir à quel point ces premières étapes de configuration de votre nouveau thème WordPress WooCommerce peuvent être simples et efficaces, simplement en utilisant un thème WordPress spécialement conçu pour WooCommerce..

Il existe de nombreux plugins WordPress WooCommerce utiles disponibles sur CodeCanyon et quelques thèmes WordPress WooCommerce admirablement conçus et efficaces sur ThemeForest..

Regarder quelques-uns des thèmes les plus vendus de ThemeForest WooCommerce pourrait être un bon point de départ (Savoy est toujours mon préféré). Je suis sûr que vous trouverez quelque chose qui correspond parfaitement à votre magasin de commerce électronique. Ou parcourez notre vitrine afin de trouver celle qui convient à votre magasin: 

Qu'est-ce que vous utilisez WooCommerce pour vendre?