Aller au contenu principal

Site Web avancé : tablette réactive

Suite à la sortie d'iPadOS sur iPad, l'affichage est identique à celui d'un ordinateur. Cependant, vous pouvez passer à une mise en page réactive pour ordinateur et tablette afin de garantir la visibilité de toutes les personnalisations sur les sites en ligne.

La mise en page réactive affiche l'en-tête de navigation supérieur sur les grands ordinateurs et bascule automatiquement vers l'en-tête du menu hamburger lorsque la taille d'écran est inférieure ou égale à 1024 px. La mise en page pour les petits écrans peut être personnalisée si nécessaire.

Note :

  • La plupart des sites auront automatiquement cette fonctionnalité activée et le bouton bascule indiqué ci-dessous ne sera pas disponible.
  • Pour les sites sur lesquels cette option n'a pas été activée, une fois activée, l'option permettant de la désactiver sera supprimée.

Pour utiliser des mises en page de site réactives :

  1. Dans le panneau latéral de l’éditeur, cliquez sur Conception, puis sur Disposition du site.
  2. Sous Bureau, cliquez sur le bouton bascule Disposition réactive.
    • Sélectionnez une mise en page de site supérieure à 1024 px.
    • Sélectionnez une mise en page de site pour 1024 px et moins.

Après avoir adopté les mises en page réactives, vous pouvez changer d'affichage dans la navigation supérieure pour afficher les formats Grand Bureau (plus de 1024 px), Petit Bureau/Tablette (1024 px et moins) et Mobile. Pour plus d'informations, consultez la section Changer d'affichage.

Le CSS est le même pour les points d'arrêt des grands ordinateurs de bureau et des petits ordinateurs de bureau/tablettes, et vous ne verrez pas de CSS pour tablette.

Les éléments peuvent être masqués par point d'arrêt (Grand Bureau et Petit Bureau/Tablette). Pour plus d'informations, consultez les sections Changer de vue et Afficher les éléments masqués.

Les transitions sont plus fluides et ne sont pas basées sur des agents utilisateur.

Notez que les personnalisations de tablette suivantes affichent automatiquement la disposition du bureau et qu'il n'est pas nécessaire de les personnaliser :

  • Dispositions de galeries de photos
  • Règles de personnalisation des tablettes
  • Animations

Notes importantes

  • Si votre site contient des éléments masqués, assurez-vous qu'ils sont visibles avant d'activer la mise en page adaptative. Pour résoudre ce problème, désactivez la mise en page adaptative et affichez tous les éléments masqués. Vous pourrez ensuite l'activer et masquer à nouveau les éléments masqués. Pour plus d'informations, consultez la section « Afficher les éléments masqués ».

  • La personnalisation n'affiche plus de tablette. Sélectionner un ordinateur affecte également l'affichage sur tablette.

Cet article vous a-t-il été utile ?
Utilisateurs qui ont trouvé cela utile : 0 sur 0