Ajout de la page complète. JS à elementor (pas de plug – in)

Dans ce tutoriel, nous ajouterons une page complète. JS a element, une bibliothèque JavaScript unique, vous permet de défiler automatiquement en plein écran entre les différentes parties de la page. Cela ajoute un look professionnel à votre site elementor et est l’une des bibliothèques JavaScript les plus populaires. Nous avons créé ce guide pour vous montrer un moyen simple d’intégrer une page complète. JS n’utilise que des éléments HTML bloqués dans votre site Web. N’oubliez pas qu’il existe un plugin wordpress Premium pour 39,00 $qui vous permet d’intégrer la page complète. Publier JS directement sur le site Web de l’élément.
En gros, il utilise une bibliothèque de pages entières. JS et les paramètres automatiques vous offrent une belle interface utilisateur graphique. Notre effet final, aperçu par l’éditeur d’éléments. Pas de plugins chers! Nous discuterons ici de la méthode manuelle la moins chère. Ce tutoriel a été créé pour quelqu’un qui n’est pas familier avec JS, mais si cela dépasse votre compréhension, envisagez de voir le plug – in. Prenez l’exemple d’un fichier modèle d’élément pour voir le Code exact et comment nous l’intégrons dans le constructeur de page. [acheter _ Link Text = \
Installez la page complète. Comme son nom l’indique, cette bibliothèque JavaScript vous permet de faire défiler des parties de la page de l’élément en plein écran. Lorsque vous faites défiler vers le bas, l’écran passe à la section suivante. Voici un exemple pratique: dans ce cas, cela semble simple, mais dans la mise en œuvre pratique, les concepteurs de site Web utiliseront probablement des animations et des transitions complexes pour afficher le contenu pendant que toute la Bibliothèque de page. JS accroche la section au viewport. Si vous cherchez de l’inspiration, voici une collection de sites Web qui utilisent cette bibliothèque javascript:
Remarque: Si vous prévoyez utiliser cette annonce, vous aurez besoin d’une licence commerciale. Questions
Là – Bas. Lorsque vous Intégrez une bibliothèque JavaScript dans l’élément, il y a deux options. La façon la plus durable est d’ajouter des étiquettes Accédez au titre du site WordPress via PHP. Si vous voulez apprendre à le faire, suivez cet article.
https:\/\/isotropic.co\/add-code-to-wordpress-head\/ Dans notre exemple, nous avons intégré les deux fichiers dans notre site Web en les servant sur CDN et en les ajoutant à nos pages en utilisant des blocs HTML. Si vous n’utilisez cette bibliothèque que sur une seule page ou sur plusieurs pages, cette méthode peut être meilleure, car vous n’avez pas besoin d’appeler CDN pour chaque page, ce qui se produit si vous l’ajoutez au titre du site WordPress (ce qui rend elementor plus rapide). Obtient un bloc HTML et l’insère dans la page de l’élément. Ensuite, ajoutez deux fichiers de page complets. Min.css et pleine page. Min.js à votre site.
Les codes doivent être les suivants: Utilisez ce service comme fichier CDN. Vous pouvez copier et coller des liens directement à partir de ce site pour vous assurer que vous avez la dernière version du fichier. À ce stade, lorsque vous chargez la page à l’avant, les feuilles de style css et les fichiers JavaScript sont chargés pendant la page, et il est temps d’initialiser JavaScript et de l’appliquer à chaque section individuelle pour obtenir l’effet de défilement rapide livré avec la page complète. JS.
Initialiser la page complète. Pour ce faire, il suffit d’ajouter une autre collection de code à un élément HTML existant sur la page. Var myfullpage = nouvelle page complète (\
Vitesse de défilement: 700, vitesse de défilement: 700, vitesse de défilement: 700, vitesse de défilement automatique: True, fittossection: True, fittossectiondelay: 1000, barre de défilement: false, relaxe: \
Cette classe contient toutes les sections et le contenu, c’est pourquoi elle est utilisée. C’est aussi la norme pour les sites Web d’elementor, ce qui rend ce code fonctionnel
Toute installation. La deuxième partie du Code contrôle de nombreux aspects différents de la bibliothèque. Vous pouvez consulter la documentation pour savoir exactement quelles sections vous souhaitez utiliser pour personnaliser cet effet pour votre site elementor. Les aspects importants sont: \/ \/ personnaliser le sélecteur de section: ‘. Section des éléments», Sélecteur de diapositives: ‘. Diapositive \
Aperçu en plein écran. Après avoir modifié les options en javascript dans elementor pour s’adapter à votre site, sauvegardez la page et prévisualisez – la à l’avant. La page doit être chargée avec Javascript initialisé et vous devriez être en mesure de faire défiler chaque section avec un effet similaire à celui de la vidéo ci – dessus. Si vous rechargez l’éditeur d’arrière – plan, javascript y est également initialisé, ce qui signifie que vous pouvez également prévisualiser les effets de défilement à partir de l’éditeur d’éléments d’arrière – plan. C’est tout. Si vous trouvez ce tutoriel utile, partagez – le gratuitement sur les médias sociaux. Si c’est bien au – delà de votre imagination, envisagez de payer 39,00 $et d’acheter le plugin element pour toute la page. JS, conçu pour faciliter ce processus. Fondamentalement, il prend tout ce que nous venons de faire, automatise et vous fournit une interface visuelle pour contrôler toutes les options JavaScript visibles dans la deuxième partie du Code ajouté à notre site. Si vous êtes intéressé à prévisualiser la page de présentation que nous avons créée pour ce tutoriel, n’hésitez pas à la télécharger. Vous pouvez l’importer comme modèle dans le site de l’élément et accéder à toutes les parties, codes et structures qui composent le site. Beaucoup de nos lecteurs trouvent cela utile parce qu’ils peuvent voir avec précision la création et le focus de la page
À propos des divertissements sur votre site. Vous pouvez également utiliser ce modèle comme base pour créer un site Web complet. JS element External.