Points d'arrêt personnalisés Elementor : ajoutez plus de tailles d'appareil (plugin gratuit)
Custom Breakpoints for Elementor est un plugin gratuit de l'équipe Master Addons qui ajoute vos propres tailles d'appareil au mode réactif d'Elementor Elementor s'arrête à sept vues d'appareil Ce plugin ajoute des points d'arrêt en plus de ceux-ci, comme un petit téléphone 600 px ou un bureau 1440 px, chacun avec son propre nom et sa largeur de pixel La version gratuite comprend 3 points d'arrêt personnalisés, et Master Addons Pro les rend illimités Il fonctionne avec ou sans Master Addons installé.
Comment ajouter un point d'arrêt personnalisé dans Elementor
Vérifiez d'abord les vues supplémentaires d'Elementor dans Paramètres du site > Mise en page > Points d'arrêt. Si aucun d'entre eux ne convient, ajoutez le vôtre :
- Installer Points d'arrêt personnalisés pour Elementor à partir de plugins > Ajouter un nouveau et l'activer.
- Ouvrez les points d'arrêt dans le menu de votre tableau de bord. Si Master Addons est actif, il se trouve sous le menu Master Addons.
- Ajouter un appareil, lui donner un nom et entrer sa largeur max en pixels, par example 600 pour les petits téléphones.
- Enregistrer. Le plugin trie la liste et ajuste les plages voisines.
- Modifiez une page avec Elementor, choisissez la nouvelle vue en mode réactif et stylisez vos éléments pour cela.
Voyez-le fonctionner dans le démo des points d'arrêt en directou lisez notre guide points d'arrêt personnalisés pour Elementor pour plus d'exemples.
Tailles d'appareils personnalisées avec vos propres noms
Nommez l'appareil et entrez sa largeur maximale en pixels Le plugin trie chaque point d'arrêt par largeur et définit les plages pour vous, donc une vue Small Mobile de 600 px couvre les écrans jusqu'à 600 px et la vue suivante commence à 601 px. Les points d'arrêt enregistrés apparaissent dans la barre d'outils réactive d'Elementor à côté des vues intégrées.
- 3 points d'arrêt personnalisés gratuits, illimités avec Master Addons Pro.
- Les points d'arrêt trient automatiquement par largeur, de sorte que les plages ne se chevauchent jamais.
- Un bouton de réinitialisation pour revenir aux valeurs par défaut d'Elementor, plus importation et exportation avec Pro.
Fonctionne dans le mode réactif d'Elementor
Les points d'arrêt personnalisés se comportent comme ceux d'Elementor. Choisissez la nouvelle vue dans la barre d'outils réactive, puis définissez les tailles de police, le remplissage, les largeurs de colonne et d'autres valeurs réactives qui s'appliquent uniquement à l'intérieur de cette plage. Le plugin s'accroche au système de points d'arrêt d'Elementor, de sorte que les vues supplémentaires apparaissent sur les commandes réactives dans les widgets Elementor et Master Addons.
- Choisissez des vues personnalisées dans la même barre d'outils que Mobile et Tablet.
- Définissez des valeurs de typographie, d'espacement et de disposition pour chaque vue.
- Corrigez les dispositions qui se séparent de deux des largeurs intégrées d'Elementor.
Points d'arrêt intégrés à l'élémenteur par rapport aux points d'arrêt personnalisés
Elementor free et Pro partagent les sept mêmes vues d'appareil : Mobile Portrait (767 px), Mobile Landscape (880 px), Tablet Portrait (1024 px), Tablet Landscape (1200 px), Ordinateur portable (1366 px), Bureau et écran large (2400 px et plus).Toute largeur est modifiable, mais vous ne pouvez pas ajouter une huitième vue.
| Points d'arrêt des éléments | Plugin Breakpoints personnalisé | |
|---|---|---|
| Prix | Gratuit | Gratuit, illimité avec Master Addons Pro |
| Vues de périphériques | Jusqu'à 7 | Elementor's 7 plus 3 sur mesure (gratuit) ou illimité (Pro) |
| Noms | Fixé | Votre propre |
| Largeurs | Modifiable | Modifiable |
| Importation et exportation | Non | Avec Pro |
Pour savoir comment styliser chaque appareil une fois vos points d'arrêt définis, lisez notre guide design réactif avec les points d'arrêt Elementor. Pour afficher ou masquer des sections entières par appareil, utilisez Conditions d'affichage (Pro).
Questions fréquemment posées pour les points d'arrêt personnalisés
Quel est un exemple concret de besoin d’un point d’arrêt personnalisé ?
Le texte et les boutons qui semblent bien à 767 px peuvent sembler exigus sur un téléphone 360 px Ajouter un point d'arrêt Small Mobile à 400 px, puis augmenter la taille de la police et le remplissage des boutons juste pour ces écrans Tout plus large garde les styles Mobile réguliers.
L'ajout de nombreux points d'arrêt rendra-t-il l'éditeur Elementor plus lent ?
Quelques points d'arrêt supplémentaires ne feront pas une différence notable Chacun ajoute une autre valeur réactive à chaque contrôle, donc dix ou plus peuvent faire en sorte que l'éditeur se sente plus lourd Ajoutez seulement les vues que vous allez réellement styliser Cinq ou six au total, valeurs par défaut incluses, est suffisant pour la plupart des sites.
Ces points d'arrêt personnalisés affectent-ils le CSS et les performances de mon site en direct ?
Chaque point d'arrêt ajoute des requêtes multimédias CSS à la feuille de style générée par Elementor. Il s'agit d'une petite quantité de CSS, les visiteurs ne remarqueront donc pas de différence dans le temps de chargement.
Puis-je définir un point d'arrêt pour « Paysage mobile » contre « Portrait mobile » ?
Vous n'en avez peut-être pas besoin d'une personnalisée Elementor dispose déjà de vues Mobile Landscape (880 px) et Tablet Landscape (1200 px) que vous pouvez activer dans Paramètres du site > Mise en page > Points d'arrêt Ajoutez un point d'arrêt personnalisé lorsque vous avez besoin d'une largeur que ces vues ne couvrent pas.
Widgets et extensions d'éléments tendance
Construisez des sites Web sophistiqués en moins de temps.
Glassmorphisme
Extras de conteneurs
Modèles
Duplicateur de messages/pages
