Atualização do banner

2025-09-14 16:13:19 -03:00
parent cf44b83ad0
commit baea5c69fc
4 changed files with 121 additions and 7 deletions
--- a/customizer.js
+++ b/customizer.js
@@ -0,0 +1,23 @@
+/**
+ * Live-previews para o Customizer do WordPress.
+ */
+(function ($) {
+    "use strict";
+
+    // Título do Hero
+    wp.customize('hero_title', function (value) {
+        value.bind(function (to) {
+            $('.hero-content h1').text(to);
+        });
+    });
+
+    // Descrição do Hero
+    wp.customize('hero_description', function (value) {
+        value.bind(function (to) {
+            $('.hero-content p').text(to);
+        });
+    });
+
+    // Você pode adicionar os botões aqui também, se desejar.
+
+})(jQuery);
--- a/front-page.php
+++ b/front-page.php
@@ -9,17 +9,27 @@ get_header();
 ?>

 <main id="primary" class="site-main">
-    <section class="hero-section">
+    <?php
+    $hero_bg_image = get_theme_mod('hero_background_image');
+    $hero_style = '';
+    if ($hero_bg_image) {
+        $hero_style = 'style="background-image: url(' . esc_url($hero_bg_image) . '); background-size: cover; background-position: center;"';
+    }
+    ?>
+    <section class="hero-section" <?php echo $hero_style; ?>>
+        <?php if ($hero_bg_image) : ?><div class="hero-overlay"></div><?php endif; ?>
        <div class="container">
            <div class="hero-content">
-                <h1><?php esc_html_e('Notícias Corporativas', 'newstc'); ?></h1>
-                <p><?php esc_html_e('Mantenha-se atualizado com as últimas notícias e informações da empresa', 'newstc'); ?></p>
+                <h1><?php echo esc_html(get_theme_mod('hero_title', __('Notícias Corporativas', 'newstc'))); ?></h1>
+                <p><?php echo wp_kses_post(get_theme_mod('hero_description', __('Mantenha-se atualizado com as últimas notícias e informações da empresa', 'newstc'))); ?></p>
                <div class="hero-cta">
-                    <a href="<?php echo esc_url(get_permalink(get_option('page_for_posts'))); ?>" class="btn btn-white">
-                        <i class="fas fa-newspaper"></i> <?php esc_html_e('Ver Notícias', 'newstc'); ?>
+                    <a href="<?php echo esc_url(get_theme_mod('hero_button_primary_link', get_permalink(get_option('page_for_posts')))); ?>" class="btn btn-white">
+                        <i class="fas fa-newspaper"></i>
+                        <?php echo esc_html(get_theme_mod('hero_button_primary_text', __('Ver Notícias', 'newstc'))); ?>
                    </a>
-                    <a href="#" class="btn btn-secondary">
-                        <i class="fas fa-info-circle"></i> <?php esc_html_e('Saiba Mais', 'newstc'); ?>
+                    <a href="<?php echo esc_url(get_theme_mod('hero_button_secondary_link', '#')); ?>" class="btn btn-secondary">
+                        <i class="fas fa-info-circle"></i>
+                        <?php echo esc_html(get_theme_mod('hero_button_secondary_text', __('Saiba Mais', 'newstc'))); ?>
                    </a>
                </div>
            </div>
--- a/functions.php
+++ b/functions.php
@@ -96,6 +96,76 @@ function newstc_scripts() {
 }
 add_action('wp_enqueue_scripts', 'newstc_scripts');

+/**
+ * Adiciona opções ao Personalizador do WordPress.
+ */
+function newstc_customize_register( $wp_customize ) {
+    // Seção Hero
+    $wp_customize->add_section('newstc_hero_section', array(
+        'title' => __('Seção Hero', 'newstc'),
+        'description' => __('Opções para a seção Hero na página inicial.', 'newstc'),
+        'priority' => 30,
+    ));
+
+    // Título
+    $wp_customize->add_setting('hero_title', ['default' => __('Notícias Corporativas', 'newstc'), 'sanitize_callback' => 'sanitize_text_field', 'transport' => 'postMessage']);
+    $wp_customize->add_control('hero_title', ['label' => __('Título', 'newstc'), 'section' => 'newstc_hero_section', 'type' => 'text']);
+
+    // Descrição
+    $wp_customize->add_setting('hero_description', ['default' => __('Mantenha-se atualizado com as últimas notícias e informações da empresa', 'newstc'), 'sanitize_callback' => 'wp_kses_post', 'transport' => 'postMessage']);
+    $wp_customize->add_control('hero_description', ['label' => __('Descrição', 'newstc'), 'section' => 'newstc_hero_section', 'type' => 'textarea']);
+
+    // Imagem de Fundo
+    $wp_customize->add_setting('hero_background_image', ['default' => '', 'sanitize_callback' => 'esc_url_raw']);
+    $wp_customize->add_control(new WP_Customize_Image_Control($wp_customize, 'hero_background_image', ['label' => __('Imagem de Fundo', 'newstc'), 'section' => 'newstc_hero_section']));
+
+    // Texto do Botão Primário
+    $wp_customize->add_setting('hero_button_primary_text', ['default' => __('Ver Notícias', 'newstc'), 'sanitize_callback' => 'sanitize_text_field', 'transport' => 'postMessage']);
+    $wp_customize->add_control('hero_button_primary_text', ['label' => __('Texto do Botão Primário', 'newstc'), 'section' => 'newstc_hero_section', 'type' => 'text']);
+
+    // Link do Botão Primário
+    $wp_customize->add_setting('hero_button_primary_link', ['default' => '#', 'sanitize_callback' => 'esc_url_raw']);
+    $wp_customize->add_control('hero_button_primary_link', ['label' => __('Link do Botão Primário', 'newstc'), 'section' => 'newstc_hero_section', 'type' => 'url']);
+
+    // Texto do Botão Secundário
+    $wp_customize->add_setting('hero_button_secondary_text', ['default' => __('Saiba Mais', 'newstc'), 'sanitize_callback' => 'sanitize_text_field', 'transport' => 'postMessage']);
+    $wp_customize->add_control('hero_button_secondary_text', ['label' => __('Texto do Botão Secundário', 'newstc'), 'section' => 'newstc_hero_section', 'type' => 'text']);
+
+    // Link do Botão Secundário
+    $wp_customize->add_setting('hero_button_secondary_link', ['default' => '#', 'sanitize_callback' => 'esc_url_raw']);
+    $wp_customize->add_control('hero_button_secondary_link', ['label' => __('Link do Botão Secundário', 'newstc'), 'section' => 'newstc_hero_section', 'type' => 'url']);
+
+    // Habilitar Live Preview
+    $wp_customize->get_setting('hero_title')->transport = 'postMessage';
+    $wp_customize->get_setting('hero_description')->transport = 'postMessage';
+    $wp_customize->get_setting('hero_button_primary_text')->transport = 'postMessage';
+    $wp_customize->get_setting('hero_button_secondary_text')->transport = 'postMessage';
+
+    $wp_customize->selective_refresh->add_partial('hero_title', [
+        'selector' => '.hero-content h1',
+        'render_callback' => function() { return get_theme_mod('hero_title'); },
+    ]);
+    $wp_customize->selective_refresh->add_partial('hero_description', [
+        'selector' => '.hero-content p',
+        'render_callback' => function() { return get_theme_mod('hero_description'); },
+    ]);
+}
+add_action('customize_register', 'newstc_customize_register');
+
+/**
+ * Enfileira script para o live preview do Customizer.
+ */
+function newstc_customizer_live_preview() {
+    wp_enqueue_script(
+        'newstc-customizer',
+        get_template_directory_uri() . '/assets/js/customizer.js',
+        array('jquery', 'customize-preview'),
+        NEWSTC_VERSION,
+        true
+    );
+}
+add_action('customize_preview_init', 'newstc_customizer_live_preview');
+
 // Registrar áreas de widgets
 function newstc_widgets_init() {
    register_sidebar(array(
--- a/style.css
+++ b/style.css
@@ -407,6 +407,17 @@ p {
    opacity: 0.9;
 }

+.hero-overlay {
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background-color: rgba(0, 53, 84, 0.7); /* Overlay escuro sobre a imagem */
+    z-index: 1;
+}
+
+
 .hero-cta {
    display: flex;
    gap: var(--spacing-md);