Construisez votre première page.

Apprendre DXPR BuilderCommencer iciCréer votre première page

Construisez une page avec DXPR Builder : une image à côté d’un titre, un court paragraphe et un bouton. Vous pouvez aussi partir d’un modèle prêt à l’emploi et changer ses mots. Chaque méthode prend quelques minutes, et vous terminez avec une page enregistrée que vous prévisualisez comme les visiteurs la verront. Utilisez cette page après avoir installé DXPR Builder.

La vidéo construit la page de zéro : section, ligne, image, bouton et texte, puis enregistrement et aperçu.

Avant de commencer

  • DXPR Builder est installé avec votre clé produit (Installer DXPR Builder).
  • Un type de contenu affiche le constructeur : son champ de texte utilise le formateur DXPR Builder, comme Drag and drop Page de dxpr_builder_page.
  • Votre rôle dispose de la permission Edit with DXPR Builder.

Créer la page

  1. Allez dans Content > Add content et choisissez un type de contenu qui affiche le constructeur.
  2. Saisissez un Title et cliquez sur Enregistrer.

La page enregistrée s’ouvre avec un constructeur vide. DXPR Builder travaille sur cette page, pas dans le formulaire de modification.

Option A : partir d’un modèle

L’onglet Saved templates liste les mises en page que les gens de votre site ont enregistrées pour réutilisation. DXPR CMS en livre plusieurs, comme Colored icon boxes. Sur d’autres sites, l’onglet peut être vide ; Choose a template sur la page vide propose alors les modèles de pages livrés avec DXPR Builder. Insérer un modèle enregistré montre ces étapes en vidéo.

  1. Cliquez sur Ajouter des éléments pour ouvrir le sélecteur d’éléments.
  2. Passez à l’onglet Saved templates.
  3. Cliquez sur un modèle pour l’insérer. Ses sections, lignes et éléments apparaissent sur la page, prêts pour modification.
  4. Cliquez sur Enregistrer dans la barre d’outils.
  5. Ouvrez le menu d’affichage et choisissez Aperçu pour voir la page comme les visiteurs la verront.

Option B : construire de zéro

La vidéo ci-dessus suit ces étapes.

  1. Cliquez sur Ajouter des éléments et choisissez Section dans l’onglet Mise en page.
  2. Cliquez sur + dans la barre de contrôle de la section et choisissez Row.
  3. Cliquez sur l’icône de grille de la ligne, choisissez un préréglage de colonnes comme 1/3 + 2/3, puis cliquez sur Enregistrer.
  4. Cliquez sur + dans la colonne de gauche, ouvrez l’onglet Contenu et choisissez Image.
  5. Cliquez sur Select Image, cherchez dans la médiathèque avec Apply filters, cochez une photo puis cliquez sur Insert selected.
  6. Ouvrez le panneau SEO, saisissez Alt attribute puis cliquez sur Enregistrer.
  7. Cliquez sur + dans la colonne de droite et choisissez Bouton.
  8. Saisissez Title et Link, choisissez un Type puis cliquez sur Enregistrer.
  9. Cliquez sur + dans la barre de contrôle de la colonne large et choisissez Texte.
  10. Saisissez un titre, réglez-le sur Heading 2, saisissez un paragraphe en dessous puis cliquez sur Enregistrer.
  11. Cliquez sur Enregistrer dans la barre d’outils.
  12. Ouvrez le menu d’affichage et choisissez Aperçu pour voir la page comme les visiteurs la verront. Choisissez Modifier dans le même menu pour continuer.

Modifiez ce que vous avez ajouté

  • Texte : cliquez sur un élément de texte pour le modifier sur place. Une barre d’outils propose le gras, l’italique, les titres, les liens, les listes, la couleur de police et plus. Votre profil d’utilisateur décide des boutons affichés.
  • Paramètres : ouvrez Plus dans la barre de contrôle d’un élément et choisissez Paramètres. Une Image a une largeur, une hauteur, un lien et son texte alternatif ; un Bouton a un Type, une taille et un lien.
  • Ordre : faites glisser un élément par sa barre de contrôle vers un autre endroit.

Cliquez sur Enregistrer dans la barre d’outils quand vous avez fini. Le navigateur vous avertit si vous essayez de quitter la page avec des modifications non enregistrées.

Ce que vous voyez

Dans Aperçu, l’image est à gauche. Le titre, le paragraphe et le bouton sont à droite, sans barres de contrôle. De retour dans Modifier, chaque élément montre sa barre de contrôle à son survol. DXPR Builder stocke la page en HTML dans le champ qu’il modifie, généralement Body. Les visiteurs voient la page une fois le contenu publié.

Si vous ne voyez pas le bouton Ajouter des éléments

  • La page vide montre « Choose a template » et « Or add elements using the + ». Enable page creation assistant est désactivé sur /admin/dxpr_studio/dxpr_builder/ai_settings. Cliquez sur + dans la barre d’outils du constructeur pour ouvrir le sélecteur d’éléments à la place.
  • La page ne montre aucun constructeur. Le type de contenu n’utilise pas le formateur DXPR Builder, ou votre rôle n’a pas Edit with DXPR Builder. Suivez Vérifier l’installation.
  • L’onglet Saved templates ne liste aucun modèle. Personne sur le site n’en a encore enregistré, ou votre profil d’utilisateur les masque. Utilisez Choose a template sur la page vide, ou enregistrez votre propre modèle.
  • Vos modifications ont disparu après un rechargement. La page n’a pas été enregistrée. Cliquez sur Enregistrer dans la barre d’outils du constructeur avant de quitter la page.

Et ensuite ?

  • Les outils de modification : chaque commande, ainsi que les raccourcis clavier.
  • Éléments : les 22 éléments de contenu et 6 éléments de mise en page.
  • Mise en page : des sections, lignes et colonnes qui s’adaptent à chaque écran.