13. Modifier l’en-tête et le pied de page (header / footer)

.elementor-255 .elementor-element.elementor-element-9e6c10b > .elementor-background-overlay{background-image:url("https://creamentor.com/wp-content/uploads/2020/02/fond-webdesign-background.png");background-position:center center;background-size:cover;opacity:0.2;}.elementor-255 .elementor-element.elementor-element-9e6c10b > .elementor-shape-top .elementor-shape-fill{fill:rgba(249, 251, 253, 0.86);}.elementor-255 .elementor-element.elementor-element-9e6c10b > .elementor-shape-top svg{height:74px;}.elementor-255 .elementor-element.elementor-element-9e6c10b{margin-top:0px;margin-bottom:0px;padding:50px 0px 50px 0px;}.elementor-255 .elementor-element.elementor-element-27b7f377 > .elementor-element-populated{padding:0% 5% 0% 5%;}.elementor-255 .elementor-element.elementor-element-2de6b7bd .elementor-heading-title{color:#17AFC3;font-family:"Work Sans", Sans-serif;font-size:2.5em;font-weight:300;}.elementor-255 .elementor-element.elementor-element-2de6b7bd > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-255 .elementor-element.elementor-element-2de6b7bd{width:auto;max-width:auto;}.elementor-255 .elementor-element.elementor-element-5b284d0c .elementor-heading-title{color:#3B3E4D;font-family:"Work Sans", Sans-serif;font-size:5.3em;font-weight:100;}.elementor-255 .elementor-element.elementor-element-5b284d0c > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-255 .elementor-element.elementor-element-5b284d0c{width:auto;max-width:auto;}.elementor-255 .elementor-element.elementor-element-58f90a8f .elementor-widget-container{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;text-align:left;}.elementor-255 .elementor-element.elementor-element-58f90a8f{--ha-card-image-width:142px;}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-card-figure{height:142px;}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-card-figure img{padding:31px 31px 31px 31px;border-style:solid;border-width:4px 4px 4px 4px;border-color:rgba(23, 175, 195, 0.30196078431372547);border-radius:300px 300px 300px 300px;}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-badge{--ha-badge-translate-x:15px;--ha-badge-translate-y:10px;padding:6px 15px 6px 15px;color:#242424;background-color:#ffffff;border-style:solid;border-color:rgba(23, 175, 195, 0.30196078431372547);}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-card-body{padding:100px 60px 100px 50px;}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-card-title{font-family:"Montserrat", Sans-serif;font-size:18px;font-weight:700;line-height:1.5em;}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-card-text{color:#8c8c8c;font-family:"Nunito", Sans-serif;}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-btn{padding:15px 20px 15px 0px;font-family:"Work Sans", Sans-serif;font-size:1em;font-weight:400;border-radius:20px 20px 20px 20px;color:#242424;background-color:rgba(185, 185, 185, 0);}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-btn:hover, .elementor-255 .elementor-element.elementor-element-58f90a8f .ha-btn:focus{color:#e2498a;}.elementor-255 .elementor-element.elementor-element-58f90a8f > .elementor-widget-container{padding:0px 0px 0px 50px;border-radius:10px 10px 10px 10px;}.elementor-255 .elementor-element.elementor-element-58f90a8f.ha-has-bg-overlay > .elementor-widget-container:before{transition:background 0.3s;}.elementor-255 .elementor-element.elementor-element-58f90a8f:hover .elementor-widget-container{box-shadow:2px 4px 10px 0px rgba(0,0,0,0.1);}.elementor-bc-flex-widget .elementor-255 .elementor-element.elementor-element-451d097.elementor-column .elementor-column-wrap{align-items:center;}.elementor-255 .elementor-element.elementor-element-451d097.elementor-column.elementor-element[data-element_type="column"] > .elementor-column-wrap.elementor-element-populated > .elementor-widget-wrap{align-content:center;align-items:center;}.elementor-255 .elementor-element.elementor-element-dc8b0cd .elementor-heading-title{color:#FFFFFF;font-family:"Work Sans", Sans-serif;font-size:2.4em;font-weight:100;}.elementor-255 .elementor-element.elementor-element-dc8b0cd > .elementor-widget-container{margin:0px 0px 0px 0px;padding:3px 10px 3px 10px;background-color:#17AFC3;border-radius:4px 4px 4px 4px;}.elementor-255 .elementor-element.elementor-element-dc8b0cd.ha-has-bg-overlay > .elementor-widget-container:before{transition:background 0.3s;}.elementor-255 .elementor-element.elementor-element-9802d0e .elementor-field-group{margin-bottom:10px;}.elementor-255 .elementor-element.elementor-element-9802d0e .elementor-form-fields-wrapper{margin-bottom:-10px;}.elementor-255 .elementor-element.elementor-element-9802d0e .elementor-field-group > a{color:#17AFC3;}.elementor-255 .elementor-element.elementor-element-9802d0e .elementor-field-group > a:hover{color:#E2498A;}body .elementor-255 .elementor-element.elementor-element-9802d0e .elementor-field-group > label{padding-bottom:0px;}.elementor-255 .elementor-element.elementor-element-9802d0e .elementor-form-fields-wrapper label{color:#000000;font-weight:600;}.elementor-255 .elementor-element.elementor-element-9802d0e .elementor-field-group .elementor-field:not(.elementor-select-wrapper){background-color:#E7F0FE;border-width:0px 0px 0px 0px;}.elementor-255 .elementor-element.elementor-element-9802d0e .elementor-field-group .elementor-select-wrapper select{background-color:#E7F0FE;border-width:0px 0px 0px 0px;}.elementor-255 .elementor-element.elementor-element-9802d0e .elementor-button{background-color:#17AFC3;}@media(min-width:768px){.elementor-255 .elementor-element.elementor-element-fd8e0cb{width:54.294%;}.elementor-255 .elementor-element.elementor-element-451d097{width:45.594%;}}@media(max-width:1024px) and (min-width:768px){.elementor-255 .elementor-element.elementor-element-27b7f377{width:100%;}}@media(min-width:1025px){.elementor-255 .elementor-element.elementor-element-9e6c10b > .elementor-background-overlay{background-attachment:fixed;}}@media(max-width:1024px){.elementor-255 .elementor-element.elementor-element-9e6c10b{margin-top:30px;margin-bottom:30px;padding:20px 20px 20px 20px;}.elementor-255 .elementor-element.elementor-element-58f90a8f .elementor-widget-container{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;text-align:left;}.elementor-255 .elementor-element.elementor-element-58f90a8f{--ha-card-image-width:100%;}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-badge{--ha-badge-translate-x:6px;}}@media(max-width:767px){.elementor-255 .elementor-element.elementor-element-27b7f377 > .elementor-element-populated{margin:50px 0px 0px 0px;}.elementor-255 .elementor-element.elementor-element-2de6b7bd .elementor-heading-title{font-size:30px;}.elementor-255 .elementor-element.elementor-element-5b284d0c .elementor-heading-title{font-size:66px;}.elementor-255 .elementor-element.elementor-element-58f90a8f .elementor-widget-container{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;text-align:left;}.elementor-255 .elementor-element.elementor-element-58f90a8f{--ha-card-image-width:120px;}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-card-figure{height:120px;}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-card-figure img{padding:15px 15px 15px 15px;}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-badge{--ha-badge-translate-x:25px;--ha-badge-translate-y:-27px;}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-card-body{padding:0px 0px 0px 20px;}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-card-title{font-size:16px;}.elementor-255 .elementor-element.elementor-element-58f90a8f > .elementor-widget-container{padding:15px 15px 15px 15px;}.elementor-255 .elementor-element.elementor-element-dc8b0cd .elementor-heading-title{font-size:30px;}}

Contenu

Réservé aux membres

illustration webdesign facile
Exclusif

Formation Elementor + accès illimité à toutes les ressources

20€ /mois
Sans engagement

Accéder à la Formation Elementor

Pour voir les étapes, Connectez-vous

.elementor-255 .elementor-element.elementor-element-9e6c10b > .elementor-background-overlay{background-image:url("https://creamentor.com/wp-content/uploads/2020/02/fond-webdesign-background.png");background-position:center center;background-size:cover;opacity:0.2;}.elementor-255 .elementor-element.elementor-element-9e6c10b > .elementor-shape-top .elementor-shape-fill{fill:rgba(249, 251, 253, 0.86);}.elementor-255 .elementor-element.elementor-element-9e6c10b > .elementor-shape-top svg{height:74px;}.elementor-255 .elementor-element.elementor-element-9e6c10b{margin-top:0px;margin-bottom:0px;padding:50px 0px 50px 0px;}.elementor-255 .elementor-element.elementor-element-27b7f377 > .elementor-element-populated{padding:0% 5% 0% 5%;}.elementor-255 .elementor-element.elementor-element-2de6b7bd .elementor-heading-title{color:#17AFC3;font-family:"Work Sans", Sans-serif;font-size:2.5em;font-weight:300;}.elementor-255 .elementor-element.elementor-element-2de6b7bd > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-255 .elementor-element.elementor-element-2de6b7bd{width:auto;max-width:auto;}.elementor-255 .elementor-element.elementor-element-5b284d0c .elementor-heading-title{color:#3B3E4D;font-family:"Work Sans", Sans-serif;font-size:5.3em;font-weight:100;}.elementor-255 .elementor-element.elementor-element-5b284d0c > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-255 .elementor-element.elementor-element-5b284d0c{width:auto;max-width:auto;}.elementor-255 .elementor-element.elementor-element-58f90a8f .elementor-widget-container{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;text-align:left;}.elementor-255 .elementor-element.elementor-element-58f90a8f{--ha-card-image-width:142px;}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-card-figure{height:142px;}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-card-figure img{padding:31px 31px 31px 31px;border-style:solid;border-width:4px 4px 4px 4px;border-color:rgba(23, 175, 195, 0.30196078431372547);border-radius:300px 300px 300px 300px;}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-badge{--ha-badge-translate-x:15px;--ha-badge-translate-y:10px;padding:6px 15px 6px 15px;color:#242424;background-color:#ffffff;border-style:solid;border-color:rgba(23, 175, 195, 0.30196078431372547);}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-card-body{padding:100px 60px 100px 50px;}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-card-title{font-family:"Montserrat", Sans-serif;font-size:18px;font-weight:700;line-height:1.5em;}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-card-text{color:#8c8c8c;font-family:"Nunito", Sans-serif;}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-btn{padding:15px 20px 15px 0px;font-family:"Work Sans", Sans-serif;font-size:1em;font-weight:400;border-radius:20px 20px 20px 20px;color:#242424;background-color:rgba(185, 185, 185, 0);}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-btn:hover, .elementor-255 .elementor-element.elementor-element-58f90a8f .ha-btn:focus{color:#e2498a;}.elementor-255 .elementor-element.elementor-element-58f90a8f > .elementor-widget-container{padding:0px 0px 0px 50px;border-radius:10px 10px 10px 10px;}.elementor-255 .elementor-element.elementor-element-58f90a8f.ha-has-bg-overlay > .elementor-widget-container:before{transition:background 0.3s;}.elementor-255 .elementor-element.elementor-element-58f90a8f:hover .elementor-widget-container{box-shadow:2px 4px 10px 0px rgba(0,0,0,0.1);}.elementor-bc-flex-widget .elementor-255 .elementor-element.elementor-element-451d097.elementor-column .elementor-column-wrap{align-items:center;}.elementor-255 .elementor-element.elementor-element-451d097.elementor-column.elementor-element[data-element_type="column"] > .elementor-column-wrap.elementor-element-populated > .elementor-widget-wrap{align-content:center;align-items:center;}.elementor-255 .elementor-element.elementor-element-dc8b0cd .elementor-heading-title{color:#FFFFFF;font-family:"Work Sans", Sans-serif;font-size:2.4em;font-weight:100;}.elementor-255 .elementor-element.elementor-element-dc8b0cd > .elementor-widget-container{margin:0px 0px 0px 0px;padding:3px 10px 3px 10px;background-color:#17AFC3;border-radius:4px 4px 4px 4px;}.elementor-255 .elementor-element.elementor-element-dc8b0cd.ha-has-bg-overlay > .elementor-widget-container:before{transition:background 0.3s;}.elementor-255 .elementor-element.elementor-element-9802d0e .elementor-field-group{margin-bottom:10px;}.elementor-255 .elementor-element.elementor-element-9802d0e .elementor-form-fields-wrapper{margin-bottom:-10px;}.elementor-255 .elementor-element.elementor-element-9802d0e .elementor-field-group > a{color:#17AFC3;}.elementor-255 .elementor-element.elementor-element-9802d0e .elementor-field-group > a:hover{color:#E2498A;}body .elementor-255 .elementor-element.elementor-element-9802d0e .elementor-field-group > label{padding-bottom:0px;}.elementor-255 .elementor-element.elementor-element-9802d0e .elementor-form-fields-wrapper label{color:#000000;font-weight:600;}.elementor-255 .elementor-element.elementor-element-9802d0e .elementor-field-group .elementor-field:not(.elementor-select-wrapper){background-color:#E7F0FE;border-width:0px 0px 0px 0px;}.elementor-255 .elementor-element.elementor-element-9802d0e .elementor-field-group .elementor-select-wrapper select{background-color:#E7F0FE;border-width:0px 0px 0px 0px;}.elementor-255 .elementor-element.elementor-element-9802d0e .elementor-button{background-color:#17AFC3;}@media(min-width:768px){.elementor-255 .elementor-element.elementor-element-fd8e0cb{width:54.294%;}.elementor-255 .elementor-element.elementor-element-451d097{width:45.594%;}}@media(max-width:1024px) and (min-width:768px){.elementor-255 .elementor-element.elementor-element-27b7f377{width:100%;}}@media(min-width:1025px){.elementor-255 .elementor-element.elementor-element-9e6c10b > .elementor-background-overlay{background-attachment:fixed;}}@media(max-width:1024px){.elementor-255 .elementor-element.elementor-element-9e6c10b{margin-top:30px;margin-bottom:30px;padding:20px 20px 20px 20px;}.elementor-255 .elementor-element.elementor-element-58f90a8f .elementor-widget-container{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;text-align:left;}.elementor-255 .elementor-element.elementor-element-58f90a8f{--ha-card-image-width:100%;}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-badge{--ha-badge-translate-x:6px;}}@media(max-width:767px){.elementor-255 .elementor-element.elementor-element-27b7f377 > .elementor-element-populated{margin:50px 0px 0px 0px;}.elementor-255 .elementor-element.elementor-element-2de6b7bd .elementor-heading-title{font-size:30px;}.elementor-255 .elementor-element.elementor-element-5b284d0c .elementor-heading-title{font-size:66px;}.elementor-255 .elementor-element.elementor-element-58f90a8f .elementor-widget-container{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;text-align:left;}.elementor-255 .elementor-element.elementor-element-58f90a8f{--ha-card-image-width:120px;}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-card-figure{height:120px;}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-card-figure img{padding:15px 15px 15px 15px;}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-badge{--ha-badge-translate-x:25px;--ha-badge-translate-y:-27px;}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-card-body{padding:0px 0px 0px 20px;}.elementor-255 .elementor-element.elementor-element-58f90a8f .ha-card-title{font-size:16px;}.elementor-255 .elementor-element.elementor-element-58f90a8f > .elementor-widget-container{padding:15px 15px 15px 15px;}.elementor-255 .elementor-element.elementor-element-dc8b0cd .elementor-heading-title{font-size:30px;}}

Contenu

Réservé aux membres

illustration webdesign facile
Exclusif

Formation Elementor + accès illimité à toutes les ressources

20€ /mois
Sans engagement

Accéder à la Formation Elementor

Pour voir les étapes, Connectez-vous

Foire aux questions - Créer le Header et Footer de sites webs

Le header (en-tête) se répète en haut de chaque page du site. On y retrouve généralement à minima:

  • le logo du site, avec un lien vers la page d’accueil
  • le menu de navigation

On peut aussi rajouter certains éléments clés, comme un bouton d’appel à l’action ou des informations importantes: de contact par exemple, des horaires d’ouverture, des avantages particuliers comme la livraison offerte dans le cas de sites de vente qui le proposent… Attention toutefois à ne pas surcharger le header, il faut y mettre le plus important et le strict nécessaire.

Le footer (pied de page) se répète en bas de chaque page du site. Contrairement au header, on peut créer un footer un peu plus volumineux (sans exagérer non plus!).

On peut y placer:

  • une répétition du logo du site
  • une petite description des services/ produits
  • les informations de contact
  • les liens vers les réseaux sociaux
  • un formulaire d’inscription à une newsletter ou un formulaire de contact (de taille réduite pour ne pas surcharger le footer)
  • des liens vers les pages du site les plus importantes (une sorte de répétition du menu de navigation, mais simplifié)
  • les liens vers les pages légales: mentions légales, politique de confidentialité, conditions générales de vente ou d’utilisation