Les iPad fonctionnant sous iPadOS affichent la même vue qu'un ordinateur de bureau. Activez la mise en page adaptative pour ordinateur et tablette afin que toutes les personnalisations restent visibles sur les sites en ligne.
La mise en page adaptative affiche l'en-tête de navigation supérieur sur les ordinateurs de bureau plus grands et bascule automatiquement vers l'en-tête de menu hamburger lorsque la taille de l'écran est de 1024px ou moins.
Avant de commencer
- Guesty active automatiquement cette fonctionnalité pour la plupart des sites. Si le bouton est absent, la fonctionnalité est déjà activée. Une fois activée, cette fonctionnalité ne peut plus être désactivée.
- CSS et points de rupture : Le CSS reste identique pour les écrans d’ordinateur de bureau (grand format) et les écrans d’ordinateur de bureau/tablette (petit format). Il n’y a pas de CSS spécifique pour les tablettes.
- Visibilité des éléments : Vous pouvez masquer des éléments pour des points de rupture spécifiques.
- Transitions : Les transitions de mise en page sont basées sur la taille de l'écran afin de garantir une expérience fluide.
-
Agencements automatiques : Les personnalisations suivantes utilisent automatiquement l’agencement du bureau et ne nécessitent aucun réglage manuel :
- Mises en page des galeries photos
- Règles de personnalisation des tablettes
- Animations
- Si votre site contient des éléments masqués, rendez-les visibles avant d'activer la mise en page adaptative. Si des éléments sont déformés, désactivez la mise en page adaptative, affichez tous les éléments, puis réactivez-la avant de masquer à nouveau les éléments nécessaires. Découvrez comment afficher les éléments masqués.
- Les règles de personnalisation ne s'appliquent pas aux tablettes. Les paramètres sélectionnés pour l'ordinateur de bureau s'appliquent également à l'affichage sur tablette.
Utilisez des mises en page de site adaptatives
Suivez les étapes ci-dessous pour activer les mises en page réactives et gérer les points de rupture d'écran.
- Dans le panneau latéral de l'éditeur, cliquez sur Thème.
- Cliquez sur Mise en page du site.
- Sous « Bureau », activez la mise en page réactive.
- Sélectionnez une mise en page pour les écrans de plus de 1024px.
- Sélectionnez une mise en page pour les écrans de 1024 px et moins.
- Activez ou désactivez le masque du bouton de retour en haut sur mobile.
Après avoir activé la mise en page adaptative, utilisez le sélecteur de vue dans la barre de navigation supérieure pour basculer entre Grand écran (plus de 1024 px), Petit écran (1024 px et moins) et Mobile. Apprenez comment changer de vue.