FEAT: Design final avec menu latéral gauche et menu horizontal - v1.5.0

revert FEAT: Ajout d'un menu secondaire à dgauche vec liens Contact et À propos

functions.php

@@ -1,109 +1,51 @@
 <?php
-// Enregistrement des menus
+// Configuration de base
 function wp_theme_sen2_setup() {
+    // Enregistrement des menus
     register_nav_menus(array(
-        'primary' => 'Menu Principal',
+        'primary' => __('Menu Principal', 'wp-theme-sen2'),   // Menu horizontal en haut
+        'sidebar'  => __('Menu Latéral', 'wp-theme-sen2')     // Menu latéral gauche
     ));
+
+    // Supports du thème
     add_theme_support('post-thumbnails');
     add_theme_support('title-tag');
+    add_theme_support('automatic-feed-links');
+    add_theme_support('html5', array('search-form', 'comment-form', 'comment-list', 'gallery', 'caption'));
 }
 add_action('after_setup_theme', 'wp_theme_sen2_setup');
 
-// Ajout des feuilles de style et scripts
+// Chargement des scripts et styles
 function wp_theme_sen2_scripts() {
     wp_enqueue_style('wp-theme-sen2-style', get_stylesheet_uri());
-    wp_enqueue_style('wp-theme-sen2-google-fonts', 'https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600&display=swap');
+    wp_enqueue_style('wp-theme-sen2-google-fonts', 'https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;600;700&display=swap');
     wp_enqueue_style('wp-theme-sen2-font-awesome', 'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css');
 }
 add_action('wp_enqueue_scripts', 'wp_theme_sen2_scripts');
 
-// Custom Post Type pour Portfolio
+// Personnalisation du slogan
-function wp_theme_sen2_custom_post_type() {
-    register_post_type('portfolio',
-        array(
-            'labels' => array(
-                'name' => 'Portfolio',
-                'singular_name' => 'Projet'
-            ),
-            'public' => true,
-            'has_archive' => true,
-            'supports' => array('title', 'editor', 'thumbnail'),
-        )
-    );
-}
-add_action('init', 'wp_theme_sen2_custom_post_type');
-
-// Ajout d'une section "Slogan" dans le Customizer
 function wp_theme_sen2_customize_register($wp_customize) {
     $wp_customize->add_section('wp_theme_sen2_slogan_section', array(
-        'title'    => __('Slogan du site', 'wp-theme-sen2'),
+        'title' => __('Slogan du site', 'wp-theme-sen2'),
         'priority' => 30,
     ));
 
     $wp_customize->add_setting('wp_theme_sen2_slogan', array(
-        'default'           => 'Photographier l\'humain, révéler l\'essentiel.',
+        'default' => 'Moins de bruit, plus d\'âme.',
         'sanitize_callback' => 'sanitize_text_field',
     ));
 
     $wp_customize->add_control('wp_theme_sen2_slogan_control', array(
-        'label'    => __('Slogan', 'wp-theme-sen2'),
+        'label' => __('Slogan', 'wp-theme-sen2'),
-        'section'  => 'wp_theme_sen2_slogan_section',
+        'section' => 'wp_theme_sen2_slogan_section',
-        'settings' => 'wp_theme_sen2_slogan',
+        'type' => 'text',
-        'type'     => 'text',
-    ));
-
-    $wp_customize->add_setting('wp_theme_sen2_show_slogan', array(
-        'default'           => true,
-        'sanitize_callback' => 'wp_theme_sen2_sanitize_checkbox',
-    ));
-
-    $wp_customize->add_control('wp_theme_sen2_show_slogan_control', array(
-        'label'    => __('Afficher le slogan', 'wp-theme-sen2'),
-        'section'  => 'wp_theme_sen2_slogan_section',
-        'settings' => 'wp_theme_sen2_show_slogan',
-        'type'     => 'checkbox',
     ));
 }
 add_action('customize_register', 'wp_theme_sen2_customize_register');
 
-function wp_theme_sen2_sanitize_checkbox($checked) {
+// Supprimer le footer TurnKey Linux
-    return (isset($checked) && $checked === true) ? true : false;
+function remove_turnkey_footer() {
+    remove_action('wp_footer', 'turnkey_footer_credit');
 }
-
+add_action('init', 'remove_turnkey_footer');
-// Mise à jour automatique via Gitea
+?>
-add_filter('site_transient_update_themes', 'wp_theme_sen2_check_for_updates');
-function wp_theme_sen2_check_for_updates($transient) {
-    if (empty($transient->checked)) return $transient;
-
-    $theme_data = wp_get_theme('wp-theme-sen2');
-    $current_version = $theme_data->get('Version');
-
-    $remote_style_css = 'http://gitea.sen2.lab/admnh/wp-theme-sen2/raw/branch/main/style.css';
-    $remote_data = wp_remote_get($remote_style_css, array(
-        'sslverify' => false,
-    ));
-
-    if (!is_wp_error($remote_data) && $remote_data['response']['code'] === 200) {
-        preg_match('/Version:\s*(.*)/i', $remote_data['body'], $matches);
-        $remote_version = $matches[1] ?? null;
-
-        if ($remote_version && version_compare($current_version, $remote_version, '<')) {
-            $transient->response['wp-theme-sen2'] = array(
-                'theme'       => 'wp-theme-sen2',
-                'new_version' => $remote_version,
-                'url'         => 'http://gitea.sen2.lab/admnh/wp-theme-sen2',
-                'package'     => 'http://gitea.sen2.lab/admnh/wp-theme-sen2/archive/main.zip',
-            );
-        }
-    }
-    return $transient;
-}
-function wp_theme_sen2_setup() {
-    register_nav_menus(array(
-        'primary' => 'Menu Principal',
-        'secondary' => 'Menu Secondaire'  // Nouveau menu
-    ));
-    add_theme_support('post-thumbnails');
-    add_theme_support('title-tag');
-}
-?>

header.php

@@ -3,37 +3,51 @@
 <head>
     <meta charset="<?php bloginfo('charset'); ?>">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600&display=swap" rel="stylesheet">
+    <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;600;700&display=swap" rel="stylesheet">
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
     <?php wp_head(); ?>
 </head>
 <body <?php body_class(); ?>>
-    <header class="container">
+    <div class="site-wrapper">
-        <div class="site-header">
+        <!-- Menu horizontal en haut -->
-            <!-- Menu secondaire à gauche -->
+        <nav class="main-navigation">
-            <nav class="secondary-navigation">
+            <?php
-                <?php
+            wp_nav_menu(array(
-                wp_nav_menu(array(
+                'theme_location' => 'primary',
-                    'theme_location' => 'secondary',
+                'container' => false,
-                    'fallback_cb' => false,
+                'fallback_cb' => false,
-                    'depth' => 1
+                'depth' => 1
-                ));
+            ));
-                ?>
+            ?>
-            </nav>
+        </nav>
 
-            <!-- Logo au centre -->
+        <div class="site-container">
-            <div class="site-branding">
+            <!-- Menu latéral gauche -->
-                <h1 class="site-title">
+            <aside class="sidebar">
-                    <a href="<?php echo home_url(); ?>"><?php bloginfo('name'); ?></a>
+                <div class="sidebar-header">
+                    <h2 class="site-author"><?php bloginfo('name'); ?></h2>
                     <?php if (get_theme_mod('wp_theme_sen2_show_slogan', true)) : ?>
-                        <span class="site-slogan"><?php echo esc_html(get_theme_mod('wp_theme_sen2_slogan', 'Photographier l\'humain, révéler l\'essentiel.')); ?></span>
+                        <p class="site-slogan"><?php echo esc_html(get_theme_mod('wp_theme_sen2_slogan', 'Moins de bruit, plus d\'âme.')); ?></p>
                     <?php endif; ?>
-                </h1>
+                </div>
-            </div>
 
-            <!-- Menu principal à droite -->
+                <nav class="sidebar-navigation">
-            <nav class="main-navigation">
+                    <?php
-                <?php wp_nav_menu(array('theme_location' => 'primary')); ?>
+                    wp_nav_menu(array(
-            </nav>
+                        'theme_location' => 'sidebar',
-        </div>
+                        'container' => false,
-    </header>
+                        'fallback_cb' => false,
+                        'depth' => 1
+                    ));
+                    ?>
+                </nav>
+
+                <div class="sidebar-footer">
+                    <a href="#" class="instagram-icon"><i class="fab fa-instagram"></i></a>
+                    <p class="copyright">&copy; <?php echo date('Y'); ?> <?php bloginfo('name'); ?></p>
+                </div>
+            </aside>
+
+            <!-- Contenu principal -->
+            <div class="main-content">
+                <main class="site-main">

js/script.js

@@ -0,0 +1,18 @@
+document.addEventListener('DOMContentLoaded', function() {
+    // Gestion du menu latéral en mobile si nécessaire
+    const sidebar = document.querySelector('.sidebar');
+    const mainContent = document.querySelector('.main-content');
+
+    // Ajoute une classe pour le mode mobile
+    function checkScreenSize() {
+        if (window.innerWidth <= 768) {
+            document.body.classList.add('mobile-view');
+        } else {
+            document.body.classList.remove('mobile-view');
+        }
+    }
+
+    // Exécute au chargement et au redimensionnement
+    checkScreenSize();
+    window.addEventListener('resize', checkScreenSize);
+});

style.css

@@ -1,284 +1,196 @@
 /*
 Theme Name: WP Theme SEN2
-Theme URI: https://ton-site.com/wp-theme-sen2
+Version: 1.5.0
-Author: Nicolas Houzeau
-Author URI: https://ton-site.com
-Description: Un thème sobre et moderne pour portfolio photo, en blanc cassé. Compatible avec Envira Gallery et personnalisable via le Customizer.
-Version: 1.1.0 <!-- Ajout d'un menu à doite -->
-License: GNU General Public License v2 or later
-Text Domain: wp-theme-sen2
 */
 
-/* Réinitialisation et base */
+:root {
+    --primary-color: #2C3E50;
+    --secondary-color: #3498DB;
+    --text-color: #333333;
+    --light-gray: #F9F9F9;
+    --medium-gray: #E0E0E0;
+    --dark-gray: #7F8C8D;
+}
+
 body {
     font-family: 'Montserrat', sans-serif;
-    background-color: #F9F9F9;
+    background-color: var(--light-gray);
-    color: #333333;
+    color: var(--text-color);
     line-height: 1.6;
     margin: 0;
     padding: 0;
-    font-size: 16px;
 }
 
-a {
+/* Structure globale */
-    color: #555555;
+.site-wrapper {
-    text-decoration: none;
+    min-height: 100vh;
-    transition: color 0.3s ease;
-}
-
-a:hover {
-    color: #E1306C;
-}
-
-.container {
-    max-width: 1200px;
-    margin: 0 auto;
-    padding: 0 20px;
-}
-
-/* Header et slogan */
-header {
-    background-color: #F9F9F9;
-    padding: 30px 0;
-    border-bottom: 1px solid #EEEEEE;
-}
-
-.site-branding {
-    margin-bottom: 20px;
-}
-
-.site-title {
-    margin: 0;
-    font-size: 24px;
-    font-weight: 600;
-    color: #333333;
-    line-height: 1.2;
-}
-
-.site-title a {
-    text-decoration: none;
-    color: inherit;
-}
-
-.site-slogan {
-    display: block;
-    font-family: 'Montserrat', sans-serif;
-    font-weight: 300;
-    font-size: 16px;
-    color: #555555;
-    letter-spacing: 0.5px;
-    margin-top: 5px;
-}
-
-.main-navigation ul {
-    list-style: none;
-    padding: 0;
-    margin: 0;
     display: flex;
-    gap: 20px;
+    flex-direction: column;
 }
 
-.main-navigation a {
+.site-container {
-    font-weight: 500;
-    color: #333333;
-    text-decoration: none;
-}
-
-.main-navigation a:hover {
-    color: #E1306C;
-}
-/* Header et navigation */
-.site-header {
     display: flex;
-    justify-content: space-between;
+    flex: 1;
-    align-items: center;
-    width: 100%;
-    position: relative;
 }
 
-.site-branding {
+.sidebar {
-    position: absolute;
+    width: 250px;
-    left: 50%;
+    background-color: white;
-    transform: translateX(-50%);
+    padding: 30px 20px;
-    text-align: center;
+    position: fixed;
-    margin: 0 auto;
+    left: 0;
+    top: 60px; /* Espace pour le menu horizontal */
+    bottom: 0;
+    overflow-y: auto;
+    border-right: 1px solid var(--medium-gray);
+    z-index: 10;
+}
+
+.main-content {
+    margin-left: 250px; /* Même largeur que le sidebar */
+    flex: 1;
+    padding: 30px;
 }
 
 .main-navigation {
-    margin-left: auto; /* Pousse le menu principal à droite */
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    background-color: white;
+    padding: 15px 0;
+    border-bottom: 1px solid var(--medium-gray);
+    z-index: 20;
 }
 
-.secondary-navigation {
-    margin-right: auto; /* Pousse le menu secondaire à gauche */
-}
-
-/* Style des menus */
-.secondary-navigation ul,
 .main-navigation ul {
     list-style: none;
     margin: 0;
     padding: 0;
     display: flex;
-    gap: 20px;
+    justify-content: center;
+    gap: 30px;
+    flex-wrap: wrap;
 }
 
-.secondary-navigation a,
 .main-navigation a {
-    font-family: 'Montserrat', sans-serif;
+    color: var(--primary-color);
-    font-weight: 400;
-    color: #555555;
     text-decoration: none;
+    font-weight: 600;
+    font-size: 16px;
+    text-transform: uppercase;
+    letter-spacing: 0.5px;
     transition: color 0.3s ease;
 }
 
-.secondary-navigation a:hover,
 .main-navigation a:hover {
-    color: #E1306C;
+    color: var(--secondary-color);
 }
 
-/* Responsive */
+.sidebar-header {
-@media (max-width: 768px) {
+    margin-bottom: 30px;
-    .site-header {
-        flex-direction: column;
-        gap: 15px;
-        position: relative;
-    }
-
-    .site-branding {
-        position: static;
-        transform: none;
-        order: 1;
-    }
-
-    .secondary-navigation {
-        order: 2;
-        margin-right: 0;
-    }
-
-    .main-navigation {
-        order: 3;
-        margin-left: 0;
-    }
-}
-
-/* Footer */
-footer {
-    background-color: #F9F9F9;
-    padding: 20px 0;
     text-align: center;
-    border-top: 1px solid #EEEEEE;
-    margin-top: 40px;
 }
 
-.social-icons {
+.site-author {
-    margin: 20px 0;
+    margin: 0;
+    font-size: 24px;
+    font-weight: 700;
+    color: var(--primary-color);
+}
+
+.site-slogan {
+    margin: 10px 0 0;
+    font-size: 14px;
+    font-weight: 300;
+    color: var(--dark-gray);
+    font-style: italic;
+}
+
+/* Menu latéral */
+.sidebar-navigation {
+    margin-bottom: 30px;
+}
+
+.sidebar-navigation ul {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+}
+
+.sidebar-navigation li {
+    margin-bottom: 15px;
+}
+
+.sidebar-navigation a {
+    color: var(--text-color);
+    text-decoration: none;
+    font-weight: 500;
+    font-size: 16px;
+    display: block;
+    padding: 5px 0;
+    border-bottom: 1px solid var(--medium-gray);
+    transition: color 0.3s ease;
+}
+
+.sidebar-navigation a:hover {
+    color: var(--secondary-color);
+}
+
+/* Footer dans le sidebar */
+.sidebar-footer {
+    margin-top: auto;
+    text-align: center;
+    padding-top: 20px;
+    border-top: 1px solid var(--medium-gray);
 }
 
 .instagram-icon {
-    color: #333333;
+    color: var(--primary-color);
-    font-size: 24px;
+    font-size: 20px;
-    transition: color 0.3s ease;
+    margin-bottom: 10px;
+    display: block;
 }
 
-.instagram-icon:hover {
+.copyright {
-    color: #E1306C;
+    margin: 0;
+    font-size: 12px;
+    color: var(--dark-gray);
 }
 
-/* Galeries Envira */
+/* Contenu principal */
-.envira-gallery-wrap {
+.site-main {
-    background-color: #F9F9F9;
+    padding: 20px 0;
-    padding: 20px;
-    border-radius: 4px;
-    margin: 2em 0;
-}
-
-.envira-gallery-item {
-    transition: transform 0.3s ease, opacity 0.3s ease;
-}
-
-.envira-gallery-item:hover {
-    transform: scale(1.03);
-    opacity: 0.9;
-}
-
-/* Formulaire de contact */
-.wpforms-container {
-    max-width: 600px;
-    margin: 0 auto;
-    padding: 20px;
-    background-color: #FFFFFF;
-    border-radius: 8px;
-    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
-}
-
-.wpforms-submit {
-    background-color: #333333;
-    color: #FFFFFF;
-    border: none;
-    padding: 12px 24px;
-    border-radius: 4px;
-    font-weight: 600;
-    cursor: pointer;
-}
-
-.wpforms-submit:hover {
-    background-color: #E1306C;
 }
 
 /* Responsive */
 @media (max-width: 768px) {
-    .site-header {
+    .site-container {
+        flex-direction: column;
+    }
+
+    .sidebar {
+        position: relative;
+        width: 100%;
+        top: 60px;
+        border-right: none;
+        border-bottom: 1px solid var(--medium-gray);
+    }
+
+    .main-content {
+        margin-left: 0;
+        padding: 20px;
+    }
+
+    .main-navigation ul {
         flex-direction: column;
         gap: 15px;
-    }
+        text-align: center;
-
-    .secondary-navigation {
-        order: 3;
-        width: 100%;
-        justify-content: center;
     }
 }
 
-/* Page À propos */
+/* Galerie */
-.about-banner {
+.envira-gallery-wrap {
-    text-align: center;
+    margin: 0;
-    padding: 60px 20px;
+    padding: 0;
-    background-color: #F5F5F5;
-    margin-bottom: 40px;
-}
-
-.about-banner h1 {
-    font-size: 36px;
-    margin-bottom: 20px;
-}
-
-.about-content {
-    display: flex;
-    align-items: center;
-    gap: 40px;
-    margin-bottom: 40px;
-}
-
-.about-text {
-    flex: 1;
-}
-
-.about-image {
-    flex: 1;
-}
-
-.about-image img {
-    width: 100%;
-    border-radius: 8px;
-    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
-}
-
-/* Responsive */
-@media (max-width: 768px) {
-    .about-content {
-        flex-direction: column;
-    }
-    .about-banner h1 {
-        font-size: 28px;
-    }
 }