---
title: Habillage personnalisé des pages
description: Centre d'aide Yapla.
---
[Contenu à ignorer](https://support.yapla.com/fr-ca/articles/360025554973-habillage-personnalisé-des-pages#main-content)
- [Français - Canada](https://support.yapla.com/fr-ca/articles/360025554973-habillage-personnalis%C3%A9-des-pages)
- [English - Canada](https://support.yapla.com/en-ca/articles/360025554973-customized-page-design)
- [Français - France](https://support.yapla.com/fr-fr/articles/360025554973-habillage-personnalisé-des-pages)
- [Italiano - Italia](https://support.yapla.com/it-it/articles/360025554973-pagina-con-design-personalizzato)
Français - Canada
Afficher le sous-menu pour les traductions
[Plus d'assistance](https://support.yapla.com/fr-ca/kb-tickets/new?hsLang=fr-ca) [Portail client](https://support.yapla.com/tickets-view?hsLang=fr-ca)
[](https://support.yapla.com/fr-ca/?hsLang=fr-ca)
- [Rendez-vous](https://www.yapla.com/fr-ca/rv-support?utm_term=plateforme)
- [Académie Yapla](https://academie.yapla.com/)
Ouvrir la navigation principale
Fermer la navigation principale
- [Rendez-vous](https://www.yapla.com/fr-ca/rv-support?utm_term=plateforme)
- [Académie Yapla](https://academie.yapla.com/)
- - [Français - Canada](https://support.yapla.com/fr-ca/articles/360025554973-habillage-personnalis%C3%A9-des-pages)
- [English - Canada](https://support.yapla.com/en-ca/articles/360025554973-customized-page-design)
- [Français - France](https://support.yapla.com/fr-fr/articles/360025554973-habillage-personnalisé-des-pages)
- [Italiano - Italia](https://support.yapla.com/it-it/articles/360025554973-pagina-con-design-personalizzato)
Français - Canada
Afficher le sous-menu pour les traductions
- [Plus d'assistance](https://support.yapla.com/fr-ca/kb-tickets/new)
- [Portail client](https://support.yapla.com/tickets-view)
- [Nous contacter](https://support.yapla.com/fr-ca/kb-tickets/new)
[Nous contacter](https://support.yapla.com/fr-ca/kb-tickets/new?hsLang=fr-ca)
Comment pouvons-nous vous aider?
- Aucune suggestion, car le champ de recherche est vide.
1. [Centre d'aide Yapla](https://support.yapla.com/fr-ca?hsLang=fr-ca)
2. [Créer mon site web](https://support.yapla.com/fr-ca/cr%C3%A9er-mon-site-web?hsLang=fr-ca)
3. [Personnalisation du site Web](https://support.yapla.com/fr-ca/cr%C3%A9er-mon-site-web?hsLang=fr-ca#personnalisation-du-site-web)
# Habillage personnalisé des pages
Bien que Yapla offre une template de base pour votre site, il est également possible, avec un minimum de connaissances techniques, de le personnaliser complètement à votre image.
Avant de commencer l'habillage, il est conseillé de choisir un template qui se rapproche le plus du style désiré, ou le gabarit vierge qui est épuré, et de placer vos différents éléments.
Vous pouvez modifier l'habillage de votre site, d'une page maîtresse ou d'une page unique selon vos goûts et vos besoins.
## Habillage de la page maîtresse
Les pages maîtresses servent de gabarit pour le contenu qui est commun à toutes vos pages. La majorité du temps, l’entête et le pied de page se retrouveront dans une page maîtresse avec des lignes vides pour le contenu personnalisé des différentes pages.
Les lignes sans contenu ou vides ne seront pas générées sur le site, peu importe si elles proviennent d’une page maîtresse ou d’une page régulière. Vous pouvez donc prévoir plusieurs sections à personnaliser selon vos besoins.
Il est possible de [créer plusieurs pages maîtresses](https://support.yapla.com/hc/fr-ca/articles/360033383894?hsLang=fr-ca), afin de créer différentes mises en page.
### Classe CSS d'une page maîtresse
Pour faciliter l'habillage de votre site, vous pouvez ajouter des classes (séparées par un espace) sur la page maîtresse. Celles-ci apparaîtront sur le de chaque page créée à partir de la page maîtresse.
Le champ Classe CSS se trouve dans le sous-menu **Configuration** de votre page maîtresse, dans la section Présentation Graphique.
Ce champ est également disponible sur les pages individuelles, afin de créer un style unique pour une page précise.
### Organiser les lignes de sa page maîtresse
Pour un ciblage efficace des lignes de votre page maîtresse, pensez à rajouter une classe qui définit chaque ligne. Par défaut, chaque ligne contient déjà la classe **line**. Dans l’exemple suivant, nous avons défini chaque classe de ligne avec le préfixe “ **line-**”. Ceci permet de cibler une ligne sans entrer en conflit avec des classes qui peuvent potentiellement exister ailleur dans le code, tels que : **logo**, **content** et **footer**.
Pour ajouter une classe, dans l’interface de votre page maîtresse, survolez une ligne et cliquez sur **Éditer le style de la ligne** situé au coin supérieur droit de la ligne. Le champ **Class CSS** sera à votre disposition.
Si vous remarquez qu’un bouton de votre menu n’affiche pas le texte prévu, cela peut être dû au fait que la couleur du bouton et celle du bandeau de menu sont identiques.
Pour y remédier :
- Accédez à *Éditer le style de la ligne* du menu.
- Dans *Couleur de fond*, sélectionnez la couleur principale de votre site web.
- Vérifiez que la classe *line-main* est correctement appliquée.
## Personnalisation du site web
Pour habiller les éléments de base de vos pages, commencez tout d’abord par ajouter vos styles dans la section *Personnalisation* de l'application site Web.
Le sous-menu **Guidé** permet de choisir facilement les couleurs et les polices de votre site.
Dans l'interface du sous-menu **Basique**, vous avez accès au balises suivantes: body, h1, h2, h3, h4, lien en survol et actif et le boutons.
Après l’habillage de base, vous avez aussi accès à la personnalisation **Avancée.**
Cette zone de texte vous permet d’ajouter le CSS dans sa forme pure. Celle-ci sera générée en front à l’intérieur de balises . À noter que ce css sera appelé en dernier sur la page, ce qui vous permettra de remplacer les styles par défaut avec les vôtres.
## Habillage d'une page web unique
Finalement, il est possible de modifier l'habillage d'une page spécifique de votre site web, sans modifier l'habillage de l'ensemble du site.
Choisissez la page que vous désirez modifier dans la liste des pages de votre site web
Choisissez ensuite le sous-menu *Personnalisation* et cocher la case *Personnaliser ma page web*.
Vous verrez ensuite s'afficher le même menu qui permet de modifier la couleur et les polices de cette page particulière. Modifiez votre sélection et cliquez sur Enregistrer!
En tout temps, cliquez sur  pour voir les modifications apportées à l'habillage de votre site web.
- [Débuter sur Yapla](https://support.yapla.com/fr-ca/d%C3%A9buter-sur-yapla?hsLang=fr-ca#main-content)
- [Collection de ressources utiles pour découvrir Yapla](https://support.yapla.com/fr-ca/d%C3%A9buter-sur-yapla?hsLang=fr-ca#collection-de-ressources-utiles-pour-d%C3%A9couvrir-yapla)
- [Pour se lancer](https://support.yapla.com/fr-ca/d%C3%A9buter-sur-yapla?hsLang=fr-ca#pour-se-lancer)
- [Optimiser votre utilisation de Yapla](https://support.yapla.com/fr-ca/d%C3%A9buter-sur-yapla?hsLang=fr-ca#optimiser-votre-utilisation-de-yapla)
- [À propos de Yapla](https://support.yapla.com/fr-ca/d%C3%A9buter-sur-yapla?hsLang=fr-ca#%C3%A0-propos-de-yapla)
- [Configurer mon compte](https://support.yapla.com/fr-ca/configurer-mon-compte?hsLang=fr-ca#main-content)
- [Premiers pas](https://support.yapla.com/fr-ca/configurer-mon-compte?hsLang=fr-ca#premiers-pas)
- [Compte](https://support.yapla.com/fr-ca/configurer-mon-compte?hsLang=fr-ca#compte)
- [Facturation](https://support.yapla.com/fr-ca/configurer-mon-compte?hsLang=fr-ca#facturation)
- [Licences et utilisateurs](https://support.yapla.com/fr-ca/configurer-mon-compte?hsLang=fr-ca#licences-et-utilisateurs)
- [Questions fréquentes](https://support.yapla.com/fr-ca/configurer-mon-compte?hsLang=fr-ca#questions-fr%C3%A9quentes)
- [Comprendre les fonctions communes](https://support.yapla.com/fr-ca/comprendre-les-fonctions-communes?hsLang=fr-ca#main-content)
- [Communications](https://support.yapla.com/fr-ca/comprendre-les-fonctions-communes?hsLang=fr-ca#communications)
- [Formulaires](https://support.yapla.com/fr-ca/comprendre-les-fonctions-communes?hsLang=fr-ca#formulaires)
- [Images et médias](https://support.yapla.com/fr-ca/comprendre-les-fonctions-communes?hsLang=fr-ca#images-et-m%C3%A9dias)
- [Questions fréquentes](https://support.yapla.com/fr-ca/comprendre-les-fonctions-communes?hsLang=fr-ca#questions-fr%C3%A9quentes)
- [Gérer mes paiements et mon authentification](https://support.yapla.com/fr-ca/g%C3%A9rer-mes-paiements-et-mon-authentification?hsLang=fr-ca#main-content)
- [Authentification](https://support.yapla.com/fr-ca/g%C3%A9rer-mes-paiements-et-mon-authentification?hsLang=fr-ca#authentification)
- [Modes de paiement](https://support.yapla.com/fr-ca/g%C3%A9rer-mes-paiements-et-mon-authentification?hsLang=fr-ca#modes-de-paiement)
- [Contribution volontaire et commission](https://support.yapla.com/fr-ca/g%C3%A9rer-mes-paiements-et-mon-authentification?hsLang=fr-ca#contribution-volontaire-et-commission)
- [Questions fréquentes](https://support.yapla.com/fr-ca/g%C3%A9rer-mes-paiements-et-mon-authentification?hsLang=fr-ca#questions-fr%C3%A9quentes)
- [Gérer mes membres](https://support.yapla.com/fr-ca/g%C3%A9rer-mes-membres?hsLang=fr-ca#main-content)
- [Premiers pas](https://support.yapla.com/fr-ca/g%C3%A9rer-mes-membres?hsLang=fr-ca#premiers-pas)
- [Importer les membres](https://support.yapla.com/fr-ca/g%C3%A9rer-mes-membres?hsLang=fr-ca#importer-les-membres)
- [Campagnes d'adhésions simplifiées](https://support.yapla.com/fr-ca/g%C3%A9rer-mes-membres?hsLang=fr-ca#campagnes-dadh%C3%A9sions-simplifi%C3%A9es)
- [Gestion des membres](https://support.yapla.com/fr-ca/g%C3%A9rer-mes-membres?hsLang=fr-ca#gestion-des-membres)
- [Fiche du membre](https://support.yapla.com/fr-ca/g%C3%A9rer-mes-membres?hsLang=fr-ca#fiche-du-membre)
- [Formulaire](https://support.yapla.com/fr-ca/g%C3%A9rer-mes-membres?hsLang=fr-ca#formulaire)
- [Communications](https://support.yapla.com/fr-ca/g%C3%A9rer-mes-membres?hsLang=fr-ca#communications)
- [Gestion des organisations ou familles](https://support.yapla.com/fr-ca/g%C3%A9rer-mes-membres?hsLang=fr-ca#gestion-des-organisations-ou-familles)
- [Gestion des adhésions](https://support.yapla.com/fr-ca/g%C3%A9rer-mes-membres?hsLang=fr-ca#gestion-des-adh%C3%A9sions)
- [Tarifs](https://support.yapla.com/fr-ca/g%C3%A9rer-mes-membres?hsLang=fr-ca#tarifs)
- [Organisation ou famille](https://support.yapla.com/fr-ca/g%C3%A9rer-mes-membres?hsLang=fr-ca#organisation-ou-famille)
- [Fonctions avancées](https://support.yapla.com/fr-ca/g%C3%A9rer-mes-membres?hsLang=fr-ca#fonctions-avanc%C3%A9es)
- [Formations continues](https://support.yapla.com/fr-ca/g%C3%A9rer-mes-membres?hsLang=fr-ca#formations-continues)
- [Questions fréquentes](https://support.yapla.com/fr-ca/g%C3%A9rer-mes-membres?hsLang=fr-ca#questions-fr%C3%A9quentes)
- [Organiser mes événements](https://support.yapla.com/fr-ca/organiser-mes-%C3%A9v%C3%A9nements?hsLang=fr-ca#main-content)
- [Premiers pas](https://support.yapla.com/fr-ca/organiser-mes-%C3%A9v%C3%A9nements?hsLang=fr-ca#premiers-pas)
- [Configuration](https://support.yapla.com/fr-ca/organiser-mes-%C3%A9v%C3%A9nements?hsLang=fr-ca#configuration)
- [Formulaires](https://support.yapla.com/fr-ca/organiser-mes-%C3%A9v%C3%A9nements?hsLang=fr-ca#formulaires)
- [Billets électroniques](https://support.yapla.com/fr-ca/organiser-mes-%C3%A9v%C3%A9nements?hsLang=fr-ca#billets-%C3%A9lectroniques)
- [Paramètres avancés](https://support.yapla.com/fr-ca/organiser-mes-%C3%A9v%C3%A9nements?hsLang=fr-ca#param%C3%A8tres-avanc%C3%A9s)
- [Communications](https://support.yapla.com/fr-ca/organiser-mes-%C3%A9v%C3%A9nements?hsLang=fr-ca#communications)
- [Gestion des tarifs](https://support.yapla.com/fr-ca/organiser-mes-%C3%A9v%C3%A9nements?hsLang=fr-ca#gestion-des-tarifs)
- [Gestion des inscriptions](https://support.yapla.com/fr-ca/organiser-mes-%C3%A9v%C3%A9nements?hsLang=fr-ca#gestion-des-inscriptions)
- [Gestion des activités avec sessions](https://support.yapla.com/fr-ca/organiser-mes-%C3%A9v%C3%A9nements?hsLang=fr-ca#gestion-des-activit%C3%A9s-avec-sessions)
- [Congrès](https://support.yapla.com/fr-ca/organiser-mes-%C3%A9v%C3%A9nements?hsLang=fr-ca#congr%C3%A8s)
- [Questions fréquentes](https://support.yapla.com/fr-ca/organiser-mes-%C3%A9v%C3%A9nements?hsLang=fr-ca#questions-fr%C3%A9quentes)
- [Recueillir des dons](https://support.yapla.com/fr-ca/recueillir-des-dons?hsLang=fr-ca#main-content)
- [Premiers pas](https://support.yapla.com/fr-ca/recueillir-des-dons?hsLang=fr-ca#premiers-pas)
- [Gestion des dons](https://support.yapla.com/fr-ca/recueillir-des-dons?hsLang=fr-ca#gestion-des-dons)
- [Reçus fiscaux](https://support.yapla.com/fr-ca/recueillir-des-dons?hsLang=fr-ca#re%C3%A7us-fiscaux)
- [Dons récurrents](https://support.yapla.com/fr-ca/recueillir-des-dons?hsLang=fr-ca#dons-r%C3%A9currents)
- [Gestion des campagnes](https://support.yapla.com/fr-ca/recueillir-des-dons?hsLang=fr-ca#gestion-des-campagnes)
- [Gestion des campagnes participatives](https://support.yapla.com/fr-ca/recueillir-des-dons?hsLang=fr-ca#gestion-des-campagnes-participatives)
- [Gestion des donateurs](https://support.yapla.com/fr-ca/recueillir-des-dons?hsLang=fr-ca#gestion-des-donateurs)
- [Questions fréquentes](https://support.yapla.com/fr-ca/recueillir-des-dons?hsLang=fr-ca#questions-fr%C3%A9quentes)
- [Créer mon site web](https://support.yapla.com/fr-ca/cr%C3%A9er-mon-site-web?hsLang=fr-ca#main-content)
- [Premiers pas](https://support.yapla.com/fr-ca/cr%C3%A9er-mon-site-web?hsLang=fr-ca#premiers-pas)
- [Personnalisation du site Web](https://support.yapla.com/fr-ca/cr%C3%A9er-mon-site-web?hsLang=fr-ca#personnalisation-du-site-web)
- [Pages](https://support.yapla.com/fr-ca/cr%C3%A9er-mon-site-web?hsLang=fr-ca#pages)
- [Modules](https://support.yapla.com/fr-ca/cr%C3%A9er-mon-site-web?hsLang=fr-ca#modules)
- [Gestion du contenus et des articles](https://support.yapla.com/fr-ca/cr%C3%A9er-mon-site-web?hsLang=fr-ca#gestion-du-contenus-et-des-articles)
- [SEO et outils de performance](https://support.yapla.com/fr-ca/cr%C3%A9er-mon-site-web?hsLang=fr-ca#seo-et-outils-de-performance)
- [Questions fréquentes](https://support.yapla.com/fr-ca/cr%C3%A9er-mon-site-web?hsLang=fr-ca#questions-fr%C3%A9quentes)
- [Gérer ma comptabilité](https://support.yapla.com/fr-ca/g%C3%A9rer-ma-comptabilit%C3%A9?hsLang=fr-ca#main-content)
- [Premiers pas](https://support.yapla.com/fr-ca/g%C3%A9rer-ma-comptabilit%C3%A9?hsLang=fr-ca#premiers-pas)
- [Gestion des ventes et factures](https://support.yapla.com/fr-ca/g%C3%A9rer-ma-comptabilit%C3%A9?hsLang=fr-ca#gestion-des-ventes-et-factures)
- [Gestion des dépenses](https://support.yapla.com/fr-ca/g%C3%A9rer-ma-comptabilit%C3%A9?hsLang=fr-ca#gestion-des-d%C3%A9penses)
- [Journal général](https://support.yapla.com/fr-ca/g%C3%A9rer-ma-comptabilit%C3%A9?hsLang=fr-ca#journal-g%C3%A9n%C3%A9ral)
- [Consolidation](https://support.yapla.com/fr-ca/g%C3%A9rer-ma-comptabilit%C3%A9?hsLang=fr-ca#consolidation)
- [Rapports](https://support.yapla.com/fr-ca/g%C3%A9rer-ma-comptabilit%C3%A9?hsLang=fr-ca#rapports)
- [Paramètres](https://support.yapla.com/fr-ca/g%C3%A9rer-ma-comptabilit%C3%A9?hsLang=fr-ca#param%C3%A8tres)
- [Projets](https://support.yapla.com/fr-ca/g%C3%A9rer-ma-comptabilit%C3%A9?hsLang=fr-ca#projets)
- [Taxes](https://support.yapla.com/fr-ca/g%C3%A9rer-ma-comptabilit%C3%A9?hsLang=fr-ca#taxes)
- [Questions fréquentes](https://support.yapla.com/fr-ca/g%C3%A9rer-ma-comptabilit%C3%A9?hsLang=fr-ca#questions-fr%C3%A9quentes)
- [Gérer mes contacts](https://support.yapla.com/fr-ca/g%C3%A9rer-mes-contacts?hsLang=fr-ca#main-content)
- [Gestion des contacts](https://support.yapla.com/fr-ca/g%C3%A9rer-mes-contacts?hsLang=fr-ca#gestion-des-contacts)
- [Déployer mes infolettres](https://support.yapla.com/fr-ca/d%C3%A9ployer-mes-infolettres?hsLang=fr-ca#main-content)
- [Introduction à Yapla Infolettres](https://support.yapla.com/fr-ca/d%C3%A9ployer-mes-infolettres?hsLang=fr-ca#introduction-%C3%A0-yapla-infolettres)
- [Configurer vos infolettres](https://support.yapla.com/fr-ca/d%C3%A9ployer-mes-infolettres?hsLang=fr-ca#configurer-vos-infolettres)
- [Gestion des contacts](https://support.yapla.com/fr-ca/d%C3%A9ployer-mes-infolettres?hsLang=fr-ca#gestion-des-contacts)
- [Suivi des performances](https://support.yapla.com/fr-ca/d%C3%A9ployer-mes-infolettres?hsLang=fr-ca#suivi-des-performances)
- [Webinaires](https://support.yapla.com/fr-ca/d%C3%A9ployer-mes-infolettres?hsLang=fr-ca#webinaires)
- [Gérer mes données](https://support.yapla.com/fr-ca/g%C3%A9rer-mes-donn%C3%A9es?hsLang=fr-ca#main-content)
- [Premiers pas](https://support.yapla.com/fr-ca/g%C3%A9rer-mes-donn%C3%A9es?hsLang=fr-ca#premiers-pas)
- [Configuration](https://support.yapla.com/fr-ca/g%C3%A9rer-mes-donn%C3%A9es?hsLang=fr-ca#configuration)
- [Gestion des objets](https://support.yapla.com/fr-ca/g%C3%A9rer-mes-donn%C3%A9es?hsLang=fr-ca#gestion-des-objets)
- [Rapports](https://support.yapla.com/fr-ca/g%C3%A9rer-mes-donn%C3%A9es?hsLang=fr-ca#rapports)
- [Documentation pour les développeurs](https://support.yapla.com/fr-ca/documentation-pour-les-d%C3%A9veloppeurs?hsLang=fr-ca#main-content)
- [Fonctions avancées](https://support.yapla.com/fr-ca/documentation-pour-les-d%C3%A9veloppeurs?hsLang=fr-ca#fonctions-avanc%C3%A9es)
- [Gérer ma fédération](https://support.yapla.com/fr-ca/g%C3%A9rer-ma-f%C3%A9d%C3%A9ration?hsLang=fr-ca#main-content)
- [Démarrage](https://support.yapla.com/fr-ca/g%C3%A9rer-ma-f%C3%A9d%C3%A9ration?hsLang=fr-ca#d%C3%A9marrage)
- Nos offres
- [Tarifs](https://www.yapla.com/fr-ca/offres)
- [Services professionnels](https://www.yapla.com/fr-ca/services-professionnels)
- [Banque d'heures de formation](https://info.yapla.ca/fr/services)
- Ressources
- [Centre d'aide](https://support.yapla.com/)
- [Académie Yapla](https://academie.yapla.com/?utm_campaign=website&utm_medium=footer&utm_source=academie)
- [Blogue](https://www.yapla.com/fr-ca/blogue)
- [Témoignages](https://www.yapla.com/fr-ca/temoignages)
- [Infolettre Yapla](https://www.yapla.com/fr-ca/infolettre-yapla)
- Découvrir Yapla
- [Démo et webinaires](https://www.yapla.com/fr-ca/webinaires)
- [Conférence Yapla Impact](https://impact.yapla.com/fr/)
- À propos
- [Qui sommes-nous ?](https://www.yapla.com/fr-ca/a-propos)
- [Yapla recrute](https://info.yapla.ca/fr/travailler-chez-yapla)
- Contactez-nous
- [Devenir partenaire](https://www.yapla.com/fr-ca/partenaire-integrateur)
[](https://www.yapla.com)
Copyright © 2013-2026, Yapla
[Conditions générales d'utilisation](https://www.yapla.com/fr-ca/cgu) | [Données personnelles](https://www.yapla.com/fr-ca/donnees-personnelles)