---
title: Adapter une page Divi pour mobile et tablette
description: Une page créée avec Divi doit s’afficher correctement sur tous les types d’écrans. Divi intègre des outils permettant d’adapter facilement le contenu pour le mobile et la tablette. Dans cet article, tu vas apprendre comment ajuster une page Divi pour…
url: "https://academy.drgeek.com/docs/divi/mise-en-page-et-design/adapter-une-page-divi-pour-mobile-et-tablette/"
updated: "2026-03-16"
category: Divi / Mise en page et design
---

# Adapter une page Divi pour mobile et tablette

Une page créée avec Divi doit s’afficher correctement sur tous les types d’écrans.
 Divi intègre des outils permettant d’adapter facilement le contenu pour le mobile et la tablette.

Dans cet article, tu vas apprendre comment ajuster une page Divi pour garantir une bonne lisibilité sur tous les appareils.

## En bref

- Divi permet de personnaliser l’affichage selon l’appareil
- Les réglages responsive sont intégrés aux modules
- Il est important de vérifier le rendu sur mobile et tablette

## Accéder aux modes d’affichage

Divi propose des modes d’aperçu pour tester l’affichage selon l’appareil.

Dans l’éditeur Divi, clique sur l’icône violette en bas de l’écran, puis utilise les icônes Ordinateur, Tablette et Mobile.

La page s’adapte automatiquement à la taille de l’écran sélectionné.

## Utiliser les réglages responsive

La plupart des options de Divi peuvent être ajustées selon l’appareil.

### 1. Ouvrir les réglages d’un module

Survole le module à modifier, puis clique sur l’icône de réglages.

### 2. Activer les options spécifiques par appareil

À côté de certains réglages, clique sur l’icône représentant un appareil.

Tu peux alors définir des valeurs différentes pour:

- ordinateur
- tablette
- mobile

### 3. Ajuster la taille du texte

Sur mobile, les textes trop grands peuvent nuire à la lisibilité.

Utilise les réglages responsive pour réduire la taille de police sur mobile tout en conservant une taille confortable sur ordinateur.

## Gérer l’espacement sur mobile

Les marges et espacements qui fonctionnent sur ordinateur peuvent être excessifs sur mobile.

Dans les réglages de design, ajuste:

- les marges externes
- les espacements internes

Utilise les options responsive pour réduire ces valeurs sur mobile.

## Masquer des éléments selon l’appareil

Dans certains cas, il peut être utile de masquer un élément sur mobile ou tablette.

Dans les réglages avancés d’un module, tu peux choisir de masquer l’élément sur:

- ordinateur
- tablette
- mobile

Cette option est utile pour simplifier l’affichage sur les petits écrans.

## Vérifier le rendu final

Avant d’enregistrer, vérifie chaque mode d’affichage.

Assure-toi que:

- le texte reste lisible
- les boutons sont facilement cliquables
- le contenu n’est pas trop serré

N’oublie pas de cliquer sur Enregistrer une fois les ajustements terminés.

## Points d’attention

- Ne te base pas uniquement sur l’affichage ordinateur
- Des marges trop importantes nuisent à la lecture sur mobile
- Pense toujours à tester avant publication

## Astuce utile

Commence toujours par adapter la version mobile, puis ajuste la tablette et l’ordinateur.

## Pour aller plus loin

Une fois le responsive maîtrisé, tu peux gagner du temps avec les outils Divi.

- [Utiliser la bibliothèque Divi](https://academy.drgeek.com/docs/divi/outils-et-bonnes-pratiques-divi/utiliser-la-bibliotheque-divi/)