Comment utiliser le plug – in elementor page Builder
Et si vous n’aviez pas besoin d’écrire du Code pour contrôler chaque pixel de la conception du site? C’est ce que fait elementor, tu sais? Ils l’ont fait! Elementor est un outil de création de page très puissant qui vous permet de créer des pages personnalisées ou même des sites Web entiers. Vous n’avez même pas besoin de regarder une ligne de code, et encore moins d’écrire votre propre code. Dans ce tutoriel d’élément, vous apprendrez à utiliser page Builder pour créer une conception de page entièrement personnalisée. Masquer le résumé comment utiliser elementor install elementor comment utiliser elementor Edit Page comment utiliser elementor Widget pour créer une mise en page personnalisée pour corriger l’espace de mise en page ajouter des blocs prédéfinis ajouter des blocs prédéfinis page réutiliser des blocs et des pages commencer à utiliser elementor si vous préférez voir la vidéo, comment utiliser elementor, Ce tutoriel étape par étape couvre tout:
La première étape pour commencer à vous abonner au sujet competite sur YouTube est d’installer le plug – in element. L’élément d’élément d’installation est un plug – in gratuit qui peut être installé comme tout autre plug – in que vous ajoutez au site. Accédez au menu plug – in > ajouter du nouveau contenu et utilisez la barre de recherche en haut à droite pour rechercher l’élément. Cliquez sur le bouton Installer maintenant, puis cliquez sur activer une fois l’installation terminée. Après l’installation de l’élément, vous verrez deux nouveaux menus ajoutés sur le site. Le menu principal de l’élément a quelques paramètres globaux, mais honnêtement, vous ne les utilisez pas souvent. En outre, il s’agit principalement de liens vers des ressources et des fonctionnalités qui soutiennent elementor pro.
Le menu modèles est très utile et nous le couvrirons plus loin dans ce tutoriel. Comment utiliser la page d’édition de l’élément la plupart du travail effectué avec l’élément se fait dans l’éditeur de l’élément. Pour accéder à l’éditeur, vous pouvez accéder au menu post ou pages, puis à f
Cliquez sur la page que vous souhaitez éditer. Dans l’éditeur, vous verrez un nouveau bouton utiliser l’éditeur d’éléments qui vous mènera à l’éditeur d’éléments. Bien que vous puissiez utiliser l’éditeur d’éléments avec du contenu de page normal, il a tendance à devenir confus et confus. Par conséquent, je vous recommande d’inclure tout le contenu dans n’importe quelle page qui utilise l’élément.
Lorsque vous cliquez sur le bouton Édition bleue, vous êtes dirigé vers l’éditeur. Comme vous pouvez le voir, il est défini comme un programme personnalisé en temps réel. Il y a un aperçu à droite et vous pouvez voir le Widget à gauche. Les widgets sont les éléments de base d’une page d’élément, il est donc essentiel d’apprendre à les utiliser. Comment utiliser le Widget element dans le menu Widget, vous verrez plusieurs sections différentes. La Section de base en haut comprend des éléments utilitaires tels qu’un éditeur de texte, un titre et un widget d’icônes. Si vous continuez à défiler, vous trouverez plusieurs autres sections:
Avantages: widgets plus avancés tels que post Grids (elementor pro seulement) vue d’ensemble: widgets les plus courants (gratuits) site: construire l’ensemble du site en utilisant elementor (elementor pro seulement) woocommerce: créer un magasin de toilettes WordPress en utilisant elementor (elementor pro seulement): tous les widgets WP réguliers WordPress sont propres car Ils vous permettent d’utiliser les 17 widgets par défaut Inclus dans WordPress en plus de tous les widgets ajoutés par le plugin. Pour ajouter un widget à une page, faites – le glisser et déposez – le dans les cases énumérées dans l’aperçu. Lorsque vous ajoutez un widget, vous trouverez une variété d’options personnalisées disponibles dans la barre latérale.
Chaque Widget a un contenu, un style et une section avancée. Voici quelques options de style disponibles pour les titres: Bien que vous puissiez modifier le contenu de n’importe quel Widget à partir de l’onglet Contenu de la barre latérale, vous pouvez également le modifier directement
Au milieu de la page. C’est parce que le contenu de l’élément occupe le même espace dans le sujet du contenu du billet. Voici l’apparence des pages normales dans le thème sélectionné: Pour les messages et les pages standard, ça a l’air super, mais l’utilisation d’elementor rend la conception maladroite. La solution est d’utiliser un modèle de page. Pour modifier un modèle de page, accédez à l’éditeur, ouvrez la section propriétés de la page et utilisez le menu déroulant du modèle:
Bien que de nombreux sujets, tels que sélectionnés, contiennent leurs propres modèles de page, Elementor ajoutera toujours deux modèles à votre site: elementor Canvas: Full Width no header or footer elementor Full Width: Full Width with Header and footer you can also Edit a page Template from the elementor Editor by clicking on the page configuration icon in the bottom and using this page layout option: C’est – à – dire, revenons au sujet de l’utilisation de l’élément pour créer des pages merveilleuses. Ajouter des blocs par défaut jusqu’à présent, ce que vous avez vu à elementor est impressionnant. Vous pouvez utiliser les outils que vous voyez pour créer tout ce que vous pouvez imaginer.
Néanmoins, les défis sont redoutables. Êtes – vous sûr de vouloir créer toute la page à partir de zéro? Si vous n’avez pas d’expérience dans la conception de pages Web, vous créerez probablement une page Web qui semble très amateur. Créer de belles pages est un travail difficile! Heureusement, elementor est également prêt pour cette situation. Auparavant, vous avez appris que vous pouvez cliquer sur le bouton plus pour ajouter une structure de page, mais si vous cliquez sur l’icône dossier, vous pouvez ajouter un nouveau bloc. Vous verrez ce pop – up qui contient des centaines de sections de page pré – conçues: Il suffit de cliquer sur l’un de ces blocs pour les insérer dans la page. C’est là que l’élément commence vraiment à briller. Il n’est pas nécessaire de construire toute la page à partir de zéro, il suffit d’insérer des blocs préfabriqués jusqu’à ce que vous obteniez la conception
Et la bonne disposition. Cela sera plus facile avec les options de tri. Le menu déroulant catégorie vous permet de filtrer les blocs en fonction de leur utilisation spécifique. Voici l’apparence de l’un des blocs après qu’il a été inséré dans ma page: Comme vous pouvez le voir, il se compose de widgets afin que vous puissiez changer chaque aspect du bloc de la structure de colonne au texte. Les blocs sont étonnants, ils facilitent la création de pages Web, mais la prochaine fonctionnalité les balayera. Ajoutez la page par défaut dans la fenêtre contextuelle, ainsi qu’un onglet page. Cliquez dessus et vous verrez cet écran: Vous voyez maintenant des centaines de pages pré – conçues créées avec elementor. Vous pouvez cliquer sur l’un des boutons pour l’insérer immédiatement dans la page. Quel miracle? Bien sûr, vous pouvez créer votre propre projet à partir de zéro, mais honnêtement, pourquoi faites – vous cela? La façon la plus rapide et la plus simple est de trouver le modèle existant que vous aimez et de l’insérer simplement dans la page. Ce processus rend la création de pages Web avec elementor très rapide, simple et amusant. Bien que la version gratuite d’elementor ne contienne que quelques modèles, vous pouvez déverrouiller plus de 200 modèles en utilisant elementor pro. Themeforest a récemment lancé la boîte à outils elementor Templates sur son site Web, où vous trouverez d’autres modèles et blocs pré – conçus. J’ai également rassemblé les meilleures suites de modèles d’éléments que vous pourriez aimer. Maintenant que vous connaissez la plupart des fonctionnalités de l’élément, il y a une autre fonctionnalité à couvrir. Vous pouvez utiliser ce que vous avez appris jusqu’à présent pour créer des pages personnalisées. Cependant, si vous voulez utiliser elementor pour créer un site Web entier ou l’utiliser pour le site du client, vous avez besoin d’un meilleur flux de travail. C’est là que le menu Template fonctionne. Au bas de l’éditeur, vous verrez le bouton de mise à jour vert