👉 Création de pages de destination personnalisées dans WordPress avec Impact Plugin

Comment augmenter le trafic et les ventes avec le marketing vidéo

Le plugin Impact Page Builder est l'un des plugins révolutionnaires sorti récemment. Il vous permet de créer des pages de destination personnalisées dans votre thème WordPress à partir de votre panneau d'administration WordPress. Dans ce guide, nous vous montrerons comment commencer à travailler avec Impact Page Builder.

Qu'est-ce que Impact Page Builder?

Comme vous le savez, l'un des composants les plus importants de tout site WordPress est son thème. Les thèmes WordPress offrent une conception et une mise en page cohérentes sur toutes vos pages Web. De nombreux thèmes vous permettent même de réorganiser certaines parties de la mise en page de page en page (telle que Headway), de sorte que vous pouvez avoir une page d'accueil statique de CMS ou des barres latérales spécifiques à la page, etc.

En apparence, votre thème peut vous donner beaucoup de flexibilité et de contrôle de la conception. Si nous regardons un peu plus en profondeur, nous constatons que peu importe la flexibilité de notre thème, toutes nos pages ont la même apparence avec leurs en-têtes, pieds de page, arrière-plans, etc.

Que faire si vous voulez avoir une page de vente totalement dépouillée pour un produit? Que faire si vous voulez que votre site ait des sections différentes, chacune avec son propre look? Que faire si vous voulez avoir plusieurs mini-sites de niche fonctionnant sur le même domaine?

Impact permet aux utilisateurs de créer un nombre illimité de modèles de conception totalement uniques pouvant être appliqués à WordPress Pages & Posts. L'impact n'est pas un thème, ce qui signifie qu'il est exempt des contraintes imposées par un thème. Impact est 100% compatible avec votre thème actif.

Avant d'aller plus loin, nous souhaitons vous faire savoir que Impact Page Builder est un plug-in PAID, et que vous devrez l'acheter avant de pouvoir l'utiliser. Nous n'avons pas été payés pour écrire ce guide d'installation et nous n'avons reçu aucun avantage de l'auteur. Nous avons simplement reçu une copie de test pour tester ce plug-in que nous avons fait et nous en sommes tombés amoureux.

Quelques exemples d'Impact Plugin dans Work

Notez que ceux-ci peuvent ressembler à des conceptions de site personnalisées, mais il ne s'agit que de quelques exemples utilisant Impact Page Builder:

Ce plugin peut vraiment fonctionner comme de la magie. Achetez votre copie maintenant. Une fois que vous avez téléchargé votre copie d'Impact, vous êtes prêt à parcourir le guide ci-dessous.

Installation de l'impact

Dans le fichier .zip que vous avez téléchargé, vous trouverez un autre fichier .zip contenant le logiciel Impact. Ce sera nommé impact.zip.

Une fois que vous avez localisé ce fichier, vous pouvez alors passer à votre tableau de bord WordPress pour le télécharger et l'installer. Connectez-vous à votre tableau de bord WordPress et cliquez sur «Plugins» puis sur «Ajouter un nouveau».

Cliquez sur le bouton "Télécharger" en haut, puis sur le bouton "Parcourir" ci-dessous. Parcourez maintenant votre ordinateur pour trouver le fichier zip Impact Software mentionné ci-dessus et sélectionnez-le pour le téléchargement. Cliquez maintenant sur le bouton «Installer maintenant» à droite.

Une fois le téléchargement terminé, cliquez sur «Activer le plug-in». Si l'installation a réussi, vous devriez maintenant voir une section «Impact» dans la barre latérale gauche de votre tableau de bord WordPress:

Créer votre premier modèle

Cliquez sur «Template Builder» sous l'en-tête «Impact» de la barre latérale gauche. Cliquez maintenant sur le bouton «Afficher les options du modèle» sur la gauche pour afficher la boîte d'options Impact Template Builder.

Remarque: Cette boîte de dialogue peut être déplacée vers n'importe quel emplacement de votre navigateur.

Une fois que la boîte d'options du générateur de modèles est activée, vous pouvez cliquer sur chaque sous-titre pour accéder aux différentes options. Ici vous trouverez…

Structure du modèle:

Vous pouvez ajuster ici vos zones d'en-tête, de pied de page et de barre latérale en fonction de vos besoins.

Largeurs & Hauteurs / Marges & Rembourrage:

Non seulement vous pouvez ajuster les dimensions et l’espacement de votre modèle principal dans cette section, mais vous trouverez votre Largeur totale du site en fonction de votre configuration actuelle. Cela peut être une information très utile lorsque vous commencez à ajouter des images et du CSS personnalisé à votre modèle.

Zone de titre:

Ici, vous pouvez choisir le type de titre de votre modèle, télécharger une image de logo et ajuster le positionnement. Pour ce tutoriel particulier, ajoutons un logo d’image à votre modèle d’impact. Cliquez d'abord sur le bouton «Parcourir» pour télécharger et sélectionner une image de logo.

Une fois que la boîte de dialogue Image Uploader apparaît, vous pouvez télécharger votre image de logo en cliquant sur «Télécharger», parcourir votre ordinateur pour localiser l'image que vous souhaitez utiliser pour votre image de logo, puis double-cliquer dessus pour la sélectionner et la télécharger.

Vous voudrez peut-être d'abord créer un sous-dossier pour votre image, en nommant ce sous-dossier exactement comme le modèle de page d'impact que vous créez. Cela vous sera utile si vous souhaitez ultérieurement exporter ce modèle à des fins de sauvegarde ou de transfert.

Pour créer un sous-dossier, cliquez avec le bouton droit de la souris sur le dossier «impact» situé à gauche de la boîte contextuelle du téléchargeur, puis cliquez sur «Nouveau sous-dossier». Ensuite, tapez le nom et appuyez sur Entrée sur votre clavier pour finaliser le processus. De là, vous pouvez double-cliquer sur le sous-dossier pour le saisir et télécharger vos images pour ce modèle particulier.

Une fois l'image téléchargée, vous devrez double-cliquer sur l'image à l'intérieur de Image Uploader pour insérer le lien approprié dans la zone d'option d'arrière-plan Impact. Maintenant, changez l'option “Title:” en “Logo Image”. Vous devriez maintenant voir votre image de logo s'afficher dans la zone d'en-tête de votre modèle.

Arrière-plans: Main / Header / Wrap:

Ici, vous pouvez personnaliser vos principales zones d'arrière-plan en sélectionnant un type d'arrière-plan, une couleur (à l'aide des sélecteurs de couleurs intégrés) et une image.Vous constaterez que l'ajout d'une image est identique à l'ajout d'une «image de logo», comme nous venons de le voir ci-dessus.

Vous remarquerez avec l'une de ces options de conception que les modifications prennent effet à la volée, en affichant en temps réel sur votre aperçu de votre modèle. Pour tester cela, changeons votre couleur “Main Background”. Pour ce faire, cliquez sur le sélecteur de couleur et faites glisser les sélections de couleur jusqu'à ce que vous trouviez la couleur souhaitée.

Arrière-plans: contenu / barre latérale / pied de page:

Cette section est la même que ci-dessus, mais avec des zones d'arrière-plan différentes à personnaliser.

Options de bordure:

De là, vous pouvez personnaliser votre bordure de mise en page principale.

Zones actives du widget:

Dans cette section, vous trouverez différents emplacements dans lesquels vous pouvez activer les zones Widget. Pour ce tutoriel, cochez la case à côté de “Après en-tête” pour activer la zone Après le Header Widget.

Remarque: Vous n'avez pas besoin d'ajuster l'alignement ou la largeur de la zone Widget.

Modèle CSS personnalisé:

Dans cette section, vous trouverez un contenu CSS pré-rempli qui vous donnera une longueur d'avance pour devenir plus spécifique avec votre personnalisation de modèle. Vous pouvez ajouter n'importe quel CSS à cette zone et il remplacera tous les autres styles pour ce modèle particulier.

Pour ce tutoriel, ajoutons une bordure autour de la zone de la barre latérale. Faites défiler la liste jusqu'à ce que vous trouviez ce CSS:

# impact-sidebar-wrap {}

Ajoutez ensuite le code CSS suivant pour ajouter une bordure grise solide de 3 pixels autour de votre zone de barre latérale:

bordure: 3px solide # 666;

Vous devriez voir la bordure apparaître dans la fenêtre d'aperçu de votre modèle lorsque vous ajoutez le code CSS.

Remarque: Si vous collez du code CSS (comme indiqué ci-dessus), vous devrez peut-être appuyer sur la barre d'espace pour que les modifications prennent effet dans la fenêtre d'aperçu du modèle.

Enregistrement de votre modèle

Maintenant que nous avons personnalisé notre modèle, il est temps de le sauvegarder.

Accédez à la section «Enregistrer le modèle sous», saisissez le premier modèle dans le champ de texte «ID du modèle», puis cliquez sur le bouton «Enregistrer le modèle»:

Crochets D'impact

Maintenant que nous avons créé le cadre de base de notre modèle de page personnalisé, nous pouvons cliquer sur la page d'administration «Impact Hooks» dans la barre latérale de WordPress où vous trouverez encore plus de moyens d'ajouter du contenu à votre modèle.

Pour ce tutoriel, nous allons ajouter un Copyright à la zone de bas de page de notre modèle en utilisant un crochet d'impact. Dans la grande boîte intitulée «Entrez le code HTML, JavaScript et texte personnalisé ici», ajoutez le texte suivant:

Copyright © 2010 Impact Page Builder

Dans la boîte ci-dessus intitulée «Save Hook Box», sélectionnez «first-template» dans le premier menu déroulant et in_footer dans le deuxième menu déroulant. Cliquez maintenant sur «Enregistrer la boîte à crochets» pour enregistrer votre contenu et votre emplacement.

Menu de navigation personnalisé

WordPress fournit une fonctionnalité de menu de navigation personnalisée puissante. C'est cette fonctionnalité que vous utiliserez pour ajouter des menus de navigation à vos modèles de pages d'impact. Alors, créons un menu maintenant pour pouvoir l’ajouter à votre modèle.

Sous la section «Apparence» dans la barre latérale gauche, cliquez sur «Menus».

Dans le champ «Nom du menu» où il est écrit «Entrez le nom du menu ici», tapez «Première navigation», puis cliquez sur le bouton «Créer un menu».

Sur la gauche, vous verrez que vous pouvez ajouter différents types de pages à votre menu de navigation personnalisé. Dans la section «Pages», cliquez sur «Afficher tout», puis sélectionnez «Accueil» et «À propos de». Cliquez maintenant sur le bouton «Ajouter au menu» pour ajouter ces pages à votre menu personnalisé.

Ensuite, sous «Liens personnalisés», tapez //impactpagebuilder.com dans le champ URL et «Impact» dans le champ «Label». Cliquez maintenant sur le bouton «Ajouter au menu».

Une fois que vous avez ajouté des pages au menu personnalisé, cliquez sur le bouton «Enregistrer le menu» sur la droite.

Ajouter un widget de menu personnalisé:

Maintenant que nous avons créé un menu personnalisé, nous devons l'ajouter à notre modèle.

Cliquez sur «Widgets» sous la section «Apparence» dans la barre latérale gauche.

Dans la section Apparence », allez-y et ajoutez un widget à la zone Widget de la barre latérale de votre modèle. Localisez la zone Widget «first-template Sidebar». Maintenant, localisez le widget «Calendrier» sous «Widgets disponibles» et faites-le glisser dans la zone Widget de la barre latérale, puis cliquez sur le bouton «Enregistrer».

Affectation d'un modèle d'impact à une page ou à un message

Vous pouvez appliquer des modèles d'impact aux messages et aux pages.

Pour ce tutoriel, nous l'ajouterons à une page. Donc, sous la section "Pages" dans la barre latérale gauche, cliquez sur "Ajouter un nouveau". Ajoutez le titre et le contenu de votre page comme vous le feriez pour toute autre page WordPress, puis faites défiler la page jusqu'à ce que vous atteigniez les «Options de la page d'impact».

Définissez l'option «Utiliser l'impact pour cette page?» Sur «Oui» et sélectionnez votre modèle d'impact (c.-à-d. Premier modèle) dans le menu déroulant à droite. Ajoutez ensuite votre titre de page, méta description et mots-clés méta dans les champs ci-dessous.

Remarque: Vous pouvez même ajouter des scripts d'en-tête et de pied de page si nécessaire.

Cliquez maintenant sur le bouton «Publier» pour publier votre page WordPress / Impact.

En haut, vous devriez maintenant voir une bannière jaune indiquant «Page publiée. Voir page". Cliquez sur le lien "Afficher la page" pour afficher votre page Impact en direct. Ça devrait ressembler a quelque chose comme ca:

Toutes nos félicitations!

Vous venez de créer votre tout premier modèle de page Impact personnalisé et l'a publié sur votre site WordPress. Ceci n'est qu'un exemple.Le ciel est votre limite car vous pouvez créer autant de pages d'atterrissage que vous le souhaitez avec ce plugin. Ainsi, votre thème principal pourrait être une chose et 15 pages de destination différentes pour promouvoir 15 produits différents. Ceci est un excellent plugin pour tous ceux qui sont dans le marketing d'affiliation. Obtenez Impact Builder dès maintenant.

Impact vient de nous informer qu'il existe un rabais de 20% si vous utilisez le coupon «wpbeginner».

Voir la vidéo: Dropshipping. 5 conseils pour augmenter ses ventes (Stratégie eCommerce)

Like this post? Please share to your friends:
Laisser un commentaire

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!: