From dc1efa2912ce047c021ab752396cfb1acbeb2fe1 Mon Sep 17 00:00:00 2001 From: gcch Date: Tue, 6 Aug 2024 17:41:29 +0200 Subject: [PATCH] =?UTF-8?q?fonc(pied=20de=20page)=20cr=C3=A9=C3=A9=20le=20?= =?UTF-8?q?pied=20de=20page=20avec=20des=20liens=20personnalisables=20de?= =?UTF-8?q?=20r=C3=A9seaux=20sociaux?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../themes/haiku-atelier-2024/functions.php | 44 +++++++++++++++++++ .../haiku-atelier-2024/src/StarterSite.php | 17 +++++++ .../src/sass/layouts/_pied-de-page.scss | 35 +++++++++++++++ .../haiku-atelier-2024/src/sass/main.scss | 1 + .../themes/haiku-atelier-2024/views/base.twig | 1 + .../views/parts/pied-de-page.twig | 23 ++++++++++ 6 files changed, 121 insertions(+) create mode 100644 web/app/themes/haiku-atelier-2024/src/sass/layouts/_pied-de-page.scss create mode 100644 web/app/themes/haiku-atelier-2024/views/parts/pied-de-page.twig diff --git a/web/app/themes/haiku-atelier-2024/functions.php b/web/app/themes/haiku-atelier-2024/functions.php index 7aba6dae..80b60637 100644 --- a/web/app/themes/haiku-atelier-2024/functions.php +++ b/web/app/themes/haiku-atelier-2024/functions.php @@ -30,3 +30,47 @@ add_action("wp_enqueue_scripts", "charge_styles_haiku_atelier_2024"); // Initialise les fonctionnalités du thème new StarterSite(); + + +// Personnalisation du thème +function enregistre_personnalisation_theme($wp_customize) { + // Section « Réseaux sociaux » + $wp_customize->add_section("liens_reseaux_sociaux", [ + "title" => __("Liens des réseaux sociaux"), + "description" => __("Liens des réseaux sociaux s'affichant dans le pied de page."), + ]); + + // Instagram + $wp_customize->add_setting("lien_instagram", [ + "type" => "theme_mod", + "capability" => "edit_theme_options", + ]); + $wp_customize->add_control("lien_instagram", [ + "type" => "url", + "section" => "liens_reseaux_sociaux", + "label" => __("Profil Instagram"), + ]); + + // Facebook + $wp_customize->add_setting("lien_facebook", [ + "type" => "theme_mod", + "capability" => "edit_theme_options", + ]); + $wp_customize->add_control("lien_facebook", [ + "type" => "url", + "section" => "liens_reseaux_sociaux", + "label" => __("Profil Facebook"), + ]); + + // Pinterest + $wp_customize->add_setting("lien_pinterest", [ + "type" => "theme_mod", + "capability" => "edit_theme_options", + ]); + $wp_customize->add_control("lien_pinterest", [ + "type" => "url", + "section" => "liens_reseaux_sociaux", + "label" => __("Profil Pinterest"), + ]); +} +add_action("customize_register", "enregistre_personnalisation_theme"); diff --git a/web/app/themes/haiku-atelier-2024/src/StarterSite.php b/web/app/themes/haiku-atelier-2024/src/StarterSite.php index 9945a712..f9ca8300 100644 --- a/web/app/themes/haiku-atelier-2024/src/StarterSite.php +++ b/web/app/themes/haiku-atelier-2024/src/StarterSite.php @@ -22,6 +22,23 @@ class StarterSite extends Site { public function ajoute_au_contexte_twig(array $context): array { $context["site"] = $this; + // Récupère les liens des réseaux sociaux définis dans la personnalisation du thème + $personnalisations_theme = get_theme_mods(); + $liens_reseaux_sociaux = []; + $liens_reseaux_sociaux["facebook"] = [ + "nom" => "Facebook", + "url" => $personnalisations_theme["lien_facebook"] ?? "", + ]; + $liens_reseaux_sociaux["instagram"] = [ + "nom" => "Instagram", + "url" => $personnalisations_theme["lien_instagram"] ?? "", + ]; + $liens_reseaux_sociaux["pinterest"] = [ + "nom" => "Pinterest", + "url" => $personnalisations_theme["lien_pinterest"] ?? "", + ]; + $context["liens_reseaux_sociaux"] = $liens_reseaux_sociaux; + // Logo personnalisée $logo_personnalisee_id = get_theme_mod("custom_logo"); $logo_personnalisee = wp_get_attachment_image_src($logo_personnalisee_id, "full"); diff --git a/web/app/themes/haiku-atelier-2024/src/sass/layouts/_pied-de-page.scss b/web/app/themes/haiku-atelier-2024/src/sass/layouts/_pied-de-page.scss new file mode 100644 index 00000000..3b8750e8 --- /dev/null +++ b/web/app/themes/haiku-atelier-2024/src/sass/layouts/_pied-de-page.scss @@ -0,0 +1,35 @@ +// Styles pour le pied de page du site + +#pied-de-page { + display: grid; + grid-template-columns: 1fr 1fr; + place-items: center; + align-self: end; + min-width: 100vw; + padding: 1rem 2rem; + line-height: 1.5; + background: var(--couleur-jaune); + border: 1px solid var(--couleur-noir); + + .zone-menu-navigation-secondaire { + justify-self: start; + width: 100%; + height: 100%; + text-transform: lowercase; + } + + .zone-liens-reseaux-sociaux { + justify-items: end; + width: 100%; + height: 100%; + text-align: right; + } + + a { + @media (hover: hover) { + &:hover { + text-decoration-color: var(--couleur-noir); + } + } + } +} diff --git a/web/app/themes/haiku-atelier-2024/src/sass/main.scss b/web/app/themes/haiku-atelier-2024/src/sass/main.scss index 67d5d9bb..e54e7849 100644 --- a/web/app/themes/haiku-atelier-2024/src/sass/main.scss +++ b/web/app/themes/haiku-atelier-2024/src/sass/main.scss @@ -14,3 +14,4 @@ // 3. Régions @use "layouts/en-tete" as en-tete; @use "layouts/menu-categories-produits" as menu-categories-produits; +@use "layouts/pied-de-page" as pied-de-page; diff --git a/web/app/themes/haiku-atelier-2024/views/base.twig b/web/app/themes/haiku-atelier-2024/views/base.twig index f1e5ef59..3e7db21b 100644 --- a/web/app/themes/haiku-atelier-2024/views/base.twig +++ b/web/app/themes/haiku-atelier-2024/views/base.twig @@ -19,4 +19,5 @@ {# Pied de page #} {% block pied_de_page %} {% endblock %} + {% include "parts/pied-de-page.twig" %} diff --git a/web/app/themes/haiku-atelier-2024/views/parts/pied-de-page.twig b/web/app/themes/haiku-atelier-2024/views/parts/pied-de-page.twig new file mode 100644 index 00000000..f2178614 --- /dev/null +++ b/web/app/themes/haiku-atelier-2024/views/parts/pied-de-page.twig @@ -0,0 +1,23 @@ +