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

FEAT: Menu latéral gauche aligné avec galerie - v1.4.0
revert 8b7a042189
2025-10-08 20:26:51 +00:00 · 2025-10-08 20:07:38 +00:00 · 2025-10-08 17:48:49 +02:00 · 2025-10-08 17:48:06 +02:00 · 2025-10-08 17:28:36 +02:00 · 2025-10-08 15:24:30 +00:00
4 changed files with 224 additions and 227 deletions
@@ -1,101 +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
-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
+// Personnalisation du slogan
 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'),
-        'section'  => 'wp_theme_sen2_slogan_section',
-        'settings' => 'wp_theme_sen2_slogan',
-        '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',
+        'label' => __('Slogan', 'wp-theme-sen2'),
+        'section' => 'wp_theme_sen2_slogan_section',
+        'type' => 'text',
    ));
 }
 add_action('customize_register', 'wp_theme_sen2_customize_register');

-function wp_theme_sen2_sanitize_checkbox($checked) {
-    return (isset($checked) && $checked === true) ? true : false;
+// Supprimer le footer TurnKey Linux
+function remove_turnkey_footer() {
+    remove_action('wp_footer', 'turnkey_footer_credit');
 }
-
-// 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;
-}
-?>
+add_action('init', 'remove_turnkey_footer');
+?>
@@ -3,21 +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-branding">
-            <h1 class="site-title">
-                <a href="<?php echo home_url(); ?>"><?php bloginfo('name'); ?></a>
-                <?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>
-                <?php endif; ?>
-            </h1>
-        </div>
+    <div class="site-wrapper">
+        <!-- Menu horizontal en haut -->
        <nav class="main-navigation">
-            <?php wp_nav_menu(array('theme_location' => 'primary')); ?>
+            <?php
+            wp_nav_menu(array(
+                'theme_location' => 'primary',
+                'container' => false,
+                'fallback_cb' => false,
+                'depth' => 1
+            ));
+            ?>
        </nav>
-    </header>
+
+        <div class="site-container">
+            <!-- Menu latéral gauche -->
+            <aside class="sidebar">
+                <div class="sidebar-header">
+                    <h2 class="site-author"><?php bloginfo('name'); ?></h2>
+                    <?php if (get_theme_mod('wp_theme_sen2_show_slogan', true)) : ?>
+                        <p class="site-slogan"><?php echo esc_html(get_theme_mod('wp_theme_sen2_slogan', 'Moins de bruit, plus d\'âme.')); ?></p>
+                    <?php endif; ?>
+                </div>
+
+                <nav class="sidebar-navigation">
+                    <?php
+                    wp_nav_menu(array(
+                        'theme_location' => 'sidebar',
+                        'container' => false,
+                        '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">
@@ -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);
+});
@@ -1,197 +1,196 @@
 /*
 Theme Name: WP Theme SEN2
-Theme URI: https://ton-site.com/wp-theme-sen2
-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.0.0
-License: GNU General Public License v2 or later
-Text Domain: wp-theme-sen2
+Version: 1.5.0
 */

-/* 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;
-    color: #333333;
+    background-color: var(--light-gray);
+    color: var(--text-color);
    line-height: 1.6;
    margin: 0;
    padding: 0;
-    font-size: 16px;
 }

-a {
-    color: #555555;
-    text-decoration: none;
-    transition: color 0.3s ease;
+/* Structure globale */
+.site-wrapper {
+    min-height: 100vh;
+    display: flex;
+    flex-direction: column;
 }

-a:hover {
-    color: #E1306C;
+.site-container {
+    display: flex;
+    flex: 1;
 }

-.container {
-    max-width: 1200px;
-    margin: 0 auto;
-    padding: 0 20px;
+.sidebar {
+    width: 250px;
+    background-color: white;
+    padding: 30px 20px;
+    position: fixed;
+    left: 0;
+    top: 60px; /* Espace pour le menu horizontal */
+    bottom: 0;
+    overflow-y: auto;
+    border-right: 1px solid var(--medium-gray);
+    z-index: 10;
 }

-/* Header et slogan */
-header {
-    background-color: #F9F9F9;
-    padding: 30px 0;
-    border-bottom: 1px solid #EEEEEE;
+.main-content {
+    margin-left: 250px; /* Même largeur que le sidebar */
+    flex: 1;
+    padding: 30px;
 }

-.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 {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    background-color: white;
+    padding: 15px 0;
+    border-bottom: 1px solid var(--medium-gray);
+    z-index: 20;
 }

 .main-navigation ul {
    list-style: none;
-    padding: 0;
    margin: 0;
+    padding: 0;
    display: flex;
-    gap: 20px;
+    justify-content: center;
+    gap: 30px;
+    flex-wrap: wrap;
 }

 .main-navigation a {
-    font-weight: 500;
-    color: #333333;
+    color: var(--primary-color);
    text-decoration: none;
-}
-
-.main-navigation a:hover {
-    color: #E1306C;
-}
-
-/* Footer */
-footer {
-    background-color: #F9F9F9;
-    padding: 20px 0;
-    text-align: center;
-    border-top: 1px solid #EEEEEE;
-    margin-top: 40px;
-}
-
-.social-icons {
-    margin: 20px 0;
-}
-
-.instagram-icon {
-    color: #333333;
-    font-size: 24px;
+    font-weight: 600;
+    font-size: 16px;
+    text-transform: uppercase;
+    letter-spacing: 0.5px;
    transition: color 0.3s ease;
 }

-.instagram-icon:hover {
-    color: #E1306C;
+.main-navigation a:hover {
+    color: var(--secondary-color);
 }

-/* Galeries Envira */
-.envira-gallery-wrap {
-    background-color: #F9F9F9;
-    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;
-}
-
-/* Page À propos */
-.about-banner {
+.sidebar-header {
+    margin-bottom: 30px;
    text-align: center;
-    padding: 60px 20px;
-    background-color: #F5F5F5;
-    margin-bottom: 40px;
 }

-.about-banner h1 {
-    font-size: 36px;
-    margin-bottom: 20px;
+.site-author {
+    margin: 0;
+    font-size: 24px;
+    font-weight: 700;
+    color: var(--primary-color);
 }

-.about-content {
-    display: flex;
-    align-items: center;
-    gap: 40px;
-    margin-bottom: 40px;
+.site-slogan {
+    margin: 10px 0 0;
+    font-size: 14px;
+    font-weight: 300;
+    color: var(--dark-gray);
+    font-style: italic;
 }

-.about-text {
-    flex: 1;
+/* Menu latéral */
+.sidebar-navigation {
+    margin-bottom: 30px;
 }

-.about-image {
-    flex: 1;
+.sidebar-navigation ul {
+    list-style: none;
+    margin: 0;
+    padding: 0;
 }

-.about-image img {
-    width: 100%;
-    border-radius: 8px;
-    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+.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: var(--primary-color);
+    font-size: 20px;
+    margin-bottom: 10px;
+    display: block;
+}
+
+.copyright {
+    margin: 0;
+    font-size: 12px;
+    color: var(--dark-gray);
+}
+
+/* Contenu principal */
+.site-main {
+    padding: 20px 0;
 }

 /* Responsive */
@media (max-width: 768px) {
-    .about-content {
+    .site-container {
        flex-direction: column;
    }
-    .about-banner h1 {
-        font-size: 28px;
+
+    .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;
    }
 }
+
+/* Galerie */
+.envira-gallery-wrap {
+    margin: 0;
+    padding: 0;
+}
Author	SHA1	Message	Date
Nico	e0e11a5c0c	FEAT: Design final avec menu latéral gauche et menu horizontal - v1.5.0	2025-10-08 20:26:51 +00:00
Nico	d5b8237b72	FEAT: Menu latéral gauche aligné avec galerie - v1.4.0	2025-10-08 20:07:38 +00:00
admnh	038d0f2743	revert `8b7a042189` revert FEAT: Ajout d'un menu secondaire à dgauche vec liens Contact et À propos	2025-10-08 17:48:49 +02:00
admnh	12a449f64c	revert `8b7a042189` revert FEAT: Ajout d'un menu secondaire à dgauche vec liens Contact et À propos	2025-10-08 17:48:06 +02:00
admnh	87ebec0e5f	Merge pull request 'FEAT: Ajout d'un menu secondaire à dgauche vec liens Contact et À propos' (#1 ) from feature/add-right-menu into main Reviewed-on: https://gitea.sen2.lab/admnh/wp-theme-sen2/pulls/1	2025-10-08 17:28:36 +02:00
Nico	8b7a042189	FEAT: Ajout d'un menu secondaire à dgauche vec liens Contact et À propos	2025-10-08 15:24:30 +00:00