diff --git a/contact.twig b/contact.twig
new file mode 100644
index 0000000..18e2362
--- /dev/null
+++ b/contact.twig
@@ -0,0 +1,10 @@
+{#!
+ # SeaCMS 1.0.0-alpha.2 (https://git.defis.info/SeaCMS/seacms)
+ # Licensed under EUPL (https://git.defis.info/SeaCMS/seacms/src/branch/master/LICENCE)
+ #}
+
+{% extends "index.twig" %}
+
+{% block content %}
+  {% include "includes/_contact_content.twig" %}
+{% endblock content %}
diff --git a/includes/_contact_content.twig b/includes/_contact_content.twig
new file mode 100644
index 0000000..1fcbf1d
--- /dev/null
+++ b/includes/_contact_content.twig
@@ -0,0 +1,192 @@
+{# SPDX-License-Identifier: EUPL-1.2 #}
+
+		<section id="contact">
+			<div class="layout-contact layout-maxed">
+				<div class="md:flex p-36">
+
+					<article class="contact-card border-rounded flex flex-col justify-between flex-grow bg-blue bg-section bg-overlay bg-glazient color-white sm:p-24 md:m-24">
+						<div class="card-content-top">
+                            <h3 id="title-card" class="color-white mt-8">{{ meta.titlecard }}</h3>
+							<?php h3('title-card', 'color-white mt-8')?>
+							<?php txt('intro-card', 'text-bold md:mt-24')?>
+						</div>
+						<div class="card-content-bottom">
+							<ul class="card-info is-unstyled text-smaller text-bold mt-24 md:mb-24">
+								<li><?php txt('item-1', 'ml-8')?></li>
+								<li><?php txt('item-2', 'ml-8')?></li>
+								<li><?php txt('item-3', 'ml-8')?></li>
+							</ul>
+						</div>
+					</article>
+
+					<article class="contact-form sm:p-24 md:m-24">
+
+						<form id="form-contact">
+
+							<?php h2('title-form', 'color-blue')?>
+							<?php txt('intro-form', 'mb-16')?>
+
+							<div class="editable-hidden">
+
+								<label for="email-to"><?php _e("Email to")?> (your@domain.com)<span class="color-red">*</span></label><br>
+								<?input("email-to", array('name' => 'email-to', 'placeholder' => __("Email to"), 'class' => 'w100'));?>
+								<?input("email-hash", array('name' => 'email-hash', 'type' => 'hidden', 'class' => 'hidden'));?>
+
+							</div>
+
+							<div class="grid grid-cols-2 gap-36 mt-24">
+								<div>
+									<input type="text" name="name" id="name" placeholder="<?php _e("Name / Forname")?> *" class="w100" required>
+								</div>
+								<div>
+									<input type="email" name="email-from" id="email-from" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+.[a-z]{2,3}$" autocomplete="email" placeholder="<?php _e("Email")?> *" class="w100" required>
+								</div>
+								<div class="col-span-full">
+									<input type="text" name="subject" id="subject" placeholder="<?php _e("Subject")?> *" class="w100" required>
+								</div>
+								<div class="col-span-full">
+									<textarea name="message" id="message" placeholder="<?php _e("Message")?> *" rows="5" cols="150" class="mb-8" required></textarea>
+								</div>
+							</div>
+
+
+							<div class="">
+
+								<!-- Captcha -->
+								<?
+								$chiffre = array('zero', 'one', 'two', 'three', 'four', 'five', 'six', 'seven', 'eight', 'nine', 'ten');
+								$operators = array("+", "-");
+								$operator = $operators[array_rand($operators)];
+								$nb1 = rand(1, 5);//10
+								$nb2 = ($operator === '-') ? mt_rand(1, $nb1) : mt_rand(1, 5);// on évite les résultats négatifs en cas de soustraction
+								eval('$captcha = strval('.$nb1.$operator.$nb2.');');
+								$captcha_hash = hash('sha256', $captcha.$GLOBALS['pub_hash']);
+								// On change le signe "-" moins de calcul en "−" lisible en accessibilité
+								?>
+								<div>
+									<label for="captcha">
+										<?php _e("For security reasons please solve the following calculation")?><span class="color-red">*</span> :
+										<?=(__($chiffre[$nb1])." ".($operator=='-'?'−':$operator)." ".__($chiffre[$nb2]));?> =
+									</label>
+									<input type="text" name="captcha" id="captcha" placeholder="?" class="text-center" autocomplete="off" required>
+
+									<input type="hidden" name="captcha_hash" value="<?=$captcha_hash;?>">
+								</div>
+
+								<!-- RGPD -->
+								<div class="mt-24">
+									<label for="rgpdcheckbox" class="inline"><?php _e("Please verify your entry and check the box to accept the storage and processing of this information.")?><span class="color-red">*</span></label>
+									<input type="checkbox" name="rgpdcheckbox" id="rgpdcheckbox" required>
+								</div>
+
+							</div>
+
+
+							<!-- Bouton envoyer -->
+							<div class="foat-right mt-36">
+								<button type="submit" id="send" class="btn btn--line border-rounded text-bold">
+									<?php _e("Send")?>
+									<i class="icon moon-arrow-right ml-24" aria-hidden="true"></i>
+								</button>
+							</div>
+
+							<?php txt('texte-rgpd', 'mt-36')?>
+
+							<input type="hidden" name="rgpd_text" value="<?=htmlspecialchars(@$GLOBALS['content']['rgpd']);?>">
+
+							<input type="hidden" name="nonce_contact" value="<?=nonce("nonce_contact");?>">
+
+							<input type="hidden" name="referer" value="<?=htmlspecialchars((isset($_SERVER['HTTP_REFERER'])?$_SERVER['HTTP_REFERER']:""));?>">
+
+						</form>
+
+					</article>
+
+				</div>
+			</div>
+		</section>
+
+
+		<script>
+			// Titre de la page en cours
+			// title = document.title;
+
+			// Pour rétablir le fonctionnement du formulaire
+			function activation_form(){
+				desactive = false;
+
+				$("#form-contact #send .moon-settings").removeClass("icon-spin moon-settings").addClass("moon-arrow-right");
+
+				// Activation des champs du formulaire
+				$("#form-contact input, #form-contact textarea, #form-contact button").attr("readonly", false).removeClass("disabled");
+
+				// On peut soumettre le formulaire avec la touche entrée
+				//$("#form-contact").on("submit", function(event) { send_mail(event) });
+				$("#form-contact button").attr("disabled", false);
+			}
+
+			desactive = false;
+			function send_mail(event)
+			{
+				event.preventDefault();
+
+				if($("#captcha").val()=="" || $("#name").val()=="" || $("#subject").val()=="" || $("#message").val()=="" || $("#email-from").val()=="" || $("#rgpdcheckbox").prop("checked") == false)
+				error(__("Thank you for completing all the required fields!"));
+				else if(!desactive)
+				{
+					desactive = true;
+
+					// Icone envoi en cours
+					$("#form-contact #send .moon-settings").removeClass("moon-settings").addClass("icon-spin moon-settings");
+
+					// Désactive le formulaire
+					$("#form-contact input, #form-contact textarea, #form-contact button").attr("readonly", true).addClass("disabled");
+
+					// Désactive le bouton submit (pour les soumissions avec la touche entrée)
+					//$("#form-contact").off("submit");
+					//$("#form-contact button").attr("disabled", true);// => ne permet pas le focus sur le btn une fois envoyer
+
+					$.ajax(
+						{
+							type: "POST",
+							url: path+"theme/"+theme+(theme?"/":"")+"tpl/contact.php?mode=send-mail",
+							data: $("#form-contact").serializeArray(),
+							success: function(html){ $("body").append(html); }
+						});
+				}
+			}
+
+			$(function()
+			{
+				// Message d'erreur en cas de mauvaise saisie du mail. Pour l'accessibilité
+				var email_from = document.getElementById("email-from");
+				email_from.addEventListener("invalid", function() {
+					email_from.setCustomValidity("<?_e("Invalid email")?>. <?_e("Expected format")?> : name@example.com")
+				}, false);
+				email_from.addEventListener("input", function() {
+					email_from.setCustomValidity("");
+				}, false);
+
+				// Soumettre le formulaire
+				$("#form-contact").submit(function(event)
+				{
+					send_mail(event)
+				});
+				// Avant la sauvegarde
+					before_save.push(function() {
+						// Encode
+						if(data["content"]["email-to"] != undefined)
+							data["content"]["email-to"] = btoa(data["content"]["email-to"]);
+					});
+
+					// Edit
+					edit.push(function()
+					{
+						// Décode
+						$("#email-to").val(function(index, value) {
+							if(value) return atob(value);
+						});
+					});
+
+				});
+			</script>
diff --git a/includes/_header.twig b/includes/_header.twig
index 359c93d..9a44513 100644
--- a/includes/_header.twig
+++ b/includes/_header.twig
@@ -7,13 +7,11 @@
     <div class="navbar sticky shadow inside flex lg:pl-36">
 
       <!-- Masthead Logo-->
-      {% if pages["_meta"].meta.logo %}
           <div class="site-logo flex align-items-center py-24 mx-36">
               <a href="{{ "index"|link }}">
-                  <img height="50" width="200" src="{{ pages["_meta"].meta.logo|url }}" alt="" />
+                  <img height="50" width="200" src="{{ pages["header"].meta.logo|url }}" alt="" />
               </a>
           </div>
-      {% endif %}
 
       <!-- Nav bar-->
       <nav role="navigation" class="menu flex" aria-label="{{ index.header.Browsing_menu }}">
@@ -33,9 +31,7 @@
 
         <!-- Github Repo-->
         <div class="holder-panel tablet-hidden">
-        {% if pages["_meta"].meta.icon0 %}
-          <div class="holder-contact bg-glaz text-bold"><a class="btn" href="">{{ pages["_meta"].meta.icon0_txt }}</a><i class="icon icon-{{ pages["_meta"].meta.icon0 }} color-white"></i></div>
-        {% endif %}
+          <div class="holder-contact bg-glaz text-bold"><a class="btn" href="">{{ pages["header"].meta.iconGit_txt }}</a><i class="icon icon-{{ pages["header"].meta.iconGit }} color-white"></i></div>
         </div>
       </nav>
     </div>
diff --git a/includes/_home_content.twig b/includes/_home_content.twig
index 1b92816..6f2d441 100644
--- a/includes/_home_content.twig
+++ b/includes/_home_content.twig
@@ -8,11 +8,11 @@
           <h1 id="hero-title" class="hero-title color-light">{{ site_title }}</h1>
           <div id="hero-desc" class="editable hero-desc color-light py-20 mb-16">
           <hr>
-          <em class="color-2">Editable text with icon <i class="icon icon-{{ pages["_meta"].meta.icon2 }}" aria-hidden="true"></i></em>
+          <em class="color-2">Editable text with icon <i class="icon icon-{{ meta.icon1 }}" aria-hidden="true"></i></em>
           </div>
 
 					<div class="hero-action grid lg:grid-cols-2">
-          {% for button in pages["_meta"].meta.button %}
+          {% for button in meta.button %}
 						<a class="first-editable-button" href="{{ "index"|link }}">Editable button with icon<i class="icon icon-{{ button.icon }} ml-8"></i></a>
           {% endfor %}
 					</div>
@@ -21,10 +21,10 @@
 			<div class="flex flex-col flex-grow justify-center mx-24 py-12">
         <div class="hero-card bg-white border-rounded shadow text-center animation slide-right fire">
             <span id="hero-card-icon" class="editable-media" data-width="80" data-height="80" style="max-width:80px; max-height:80px">
-            <img class="" src="{{ pages["_meta"].meta.image1.url|url }}" style="max-width: 80px; max-height: 80px;" alt="{{ pages["_meta"].meta.image1.alt }}">
+            <img class="" src="{{ meta.image1.url|url }}" style="max-width: 80px; max-height: 80px;" alt="{{ meta.image1.alt }}">
             </span>
-            <h3 id="hero-card-title" class="editable hero-card-title color-blue my-16">{{ pages["_meta"].meta.image1.title }}</h3>
-            <div id="hero-card-desc" class="editable hero-card-desc mb-0">{{ pages["_meta"].meta.image1.txt }}</div>
+            <h3 id="hero-card-title" class="editable hero-card-title color-blue my-16">{{ meta.image1.title }}</h3>
+            <div id="hero-card-desc" class="editable hero-card-desc mb-0">{{ meta.image1.txt }}</div>
           </div>
       </div>
 		</div>
@@ -44,7 +44,7 @@
 
 	<!-- module pour bien identifier que ce sont les elements à dupliquer et a sauvegardé-->
 	<div id="features-card" class="module sm:grid md:grid-cols-2 lg:grid-cols-4 gap-36 sm:mx-20 mx-8 py-36 animation delay-1 fade-in">
-  {% for module in pages["_meta"].meta.module %}
+  {% for module in meta.module %}
     <div class="features-card bg-white shadow border-rounded flex flex-col my-16 md:my-24">
       <div class="features-card-icon">
         <span id="features-card-icon-{{ module.id }}" data-class="ml-0" data-width="70" data-height="70" style="max-width: 70px; max-height: 70px;">
@@ -75,9 +75,7 @@
       <h2 class="page-section-heading text-center text-uppercase color-blue mb-0">{{ current_page.title }}</h2>
       <h2 class="page-section-heading text-center text-uppercase text-secondary mb-0">{{ meta.title ? meta.title : current_page.id }}</h2>
       <!-- Icon Divider-->
-      {% if pages["_meta"].meta.icon1 %}
-        <a class="btn hero-btn bg-glaz border-rounded no-decoration" href="{{ "index"|link }}">Editable button with icon<i class="icon icon-{{ pages["_meta"].meta.icon1 }} ml-8"></i></a>
-      {% endif %}
+        <a class="btn hero-btn bg-glaz border-rounded no-decoration" href="{{ "index"|link }}">Editable button with icon<i class="icon icon-{{ meta.icon1 }} ml-8"></i></a>
     </div>
         <div class="layout-maxed py-36">
             {# {% if meta.video %}
diff --git a/index.twig b/index.twig
index d498dd5..c855caa 100644
--- a/index.twig
+++ b/index.twig
@@ -5,7 +5,7 @@
 
 <!DOCTYPE html>
 {# TODO manage lang #}
-<html lang="en">
+<html lang="fr">
   {% block head %}
     {% include "includes/_head.twig" %}
   {% endblock head %}
diff --git a/page2.twig b/page2.twig
new file mode 100644
index 0000000..e70fa01
--- /dev/null
+++ b/page2.twig
@@ -0,0 +1,10 @@
+{#!
+ # SeaCMS 1.0.0-alpha.2 (https://git.defis.info/SeaCMS/seacms)
+ # Licensed under EUPL (https://git.defis.info/SeaCMS/seacms/src/branch/master/LICENCE)
+ #}
+
+{% extends "index.twig" %}
+
+{% block content %}
+            {{ content }}
+{% endblock content %}