feat: add new WordPress theme for Duck Behavior Journal

- Set up a new WordPress theme with custom logo, header image, and menus
- Implement the WP Bootstrap Navwalker for improved navigation
- Add Bootstrap and jQuery for styling and functionality
- Customize hero section via the Customizer API
- Include footer with customizable text and social media links
- Integrate featured articles and page templates
- Enhance styles with a dedicated CSS file

References: #123, #124

This addition provides a modern, responsive design tailored to the Duck Behavior Journal, enhancing user engagement and site navigation.

LICENSE

@@ -0,0 +1,19 @@
+Copyright (c) 2024 Kumi Mitterer <duckbehaviorjournal@kumi.email>
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

class-wp-bootstrap-navwalker.php

@@ -0,0 +1,66 @@
+<?php
+
+/**
+ * WP_Bootstrap_Navwalker class.
+ *
+ * @extends Walker_Nav_Menu
+ */
+class WP_Bootstrap_Navwalker extends Walker_Nav_Menu
+{
+
+    // Add classes to ul sub-menus
+    function start_lvl(&$output, $depth = 0, $args = array())
+    {
+        $indent = str_repeat("\t", $depth);
+        $output .= "\n$indent<ul class=\"dropdown-menu\">\n";
+    }
+
+    // Add main/sub classes to li's and links
+    function start_el(&$output, $item, $depth = 0, $args = array(), $id = 0)
+    {
+        $indent = ($depth) ? str_repeat("\t", $depth) : '';
+
+        $li_attributes = '';
+        $class_names = $value = '';
+
+        $classes = empty($item->classes) ? array() : (array) $item->classes;
+        $classes[] = ($args->walker->has_children) ? 'dropdown' : '';
+        $classes[] = 'nav-item';
+        $classes[] = 'nav-item-' . $item->ID;
+        if ($depth && $args->walker->has_children) {
+            $classes[] = 'dropdown-submenu';
+        }
+
+        $class_names = join(' ', apply_filters('nav_menu_css_class', array_filter($classes), $item, $args));
+        $class_names = ' class="' . esc_attr($class_names) . '"';
+
+        $id = apply_filters('nav_menu_item_id', 'nav-menu-item-' . $item->ID, $item, $args);
+        $id = $id ? ' id="' . esc_attr($id) . '"' : '';
+
+        $output .= $indent . '<li' . $id . $value . $class_names . $li_attributes . '>';
+
+        $attributes = !empty($item->attr_title) ? ' title="'  . esc_attr($item->attr_title) . '"' : '';
+        $attributes .= !empty($item->target)     ? ' target="' . esc_attr($item->target) . '"' : '';
+        $attributes .= !empty($item->xfn)        ? ' rel="'    . esc_attr($item->xfn) . '"' : '';
+        $attributes .= !empty($item->url)        ? ' href="'   . esc_attr($item->url) . '"' : '';
+
+        $attributes .= ($args->walker->has_children) ? ' class="nav-link dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"' : ' class="nav-link"';
+
+        $item_output = $args->before;
+        $item_output .= '<a' . $attributes . '>';
+        $item_output .= $args->link_before . apply_filters('the_title', $item->title, $item->ID) . $args->link_after;
+        $item_output .= '</a>';
+        $item_output .= $args->after;
+
+        $output .= apply_filters('walker_nav_menu_start_el', $item_output, $item, $depth, $args);
+    }
+}
+
+/**
+ * Register Custom Navigation Walker
+ */
+function register_navwalker()
+{
+    require_once get_template_directory() . '/class-wp-bootstrap-navwalker.php';
+}
+add_action('after_setup_theme', 'register_navwalker');

footer.php

@@ -0,0 +1,26 @@
+<!-- Footer -->
+<footer class="bg-light py-4">
+    <div class="container text-center">
+        <p><?php echo get_theme_mod('footer_text', '&copy; ' . date('Y') . ' Duck Behavior Journal. All rights reserved.'); ?></p>
+        <div>
+            <?php
+            wp_nav_menu(array(
+                'theme_location' => 'footer',
+                'menu_class'     => 'nav justify-content-center',
+                'container'      => false,
+                'depth'          => 1,
+            ));
+            ?>
+        </div>
+        <div class="social-media mt-3">
+            <a href="<?php echo get_theme_mod('footer_facebook_link', '#'); ?>" class="mx-2"><img src="<?php echo get_template_directory_uri(); ?>/facebook-icon.png" alt="Facebook"></a>
+            <a href="<?php echo get_theme_mod('footer_twitter_link', '#'); ?>" class="mx-2"><img src="<?php echo get_template_directory_uri(); ?>/twitter-icon.png" alt="Twitter"></a>
+            <a href="<?php echo get_theme_mod('footer_linkedin_link', '#'); ?>" class="mx-2"><img src="<?php echo get_template_directory_uri(); ?>/linkedin-icon.png" alt="LinkedIn"></a>
+        </div>
+    </div>
+</footer>
+
+<?php wp_footer(); ?>
+</body>
+
+</html>

functions.php

@@ -0,0 +1,168 @@
+<?php
+function duck_behavior_journal_setup()
+{
+    add_theme_support('post-thumbnails');
+    add_theme_support('title-tag');
+    register_nav_menus(array(
+        'primary' => __('Primary Menu', 'duck-behavior-journal'),
+        'footer'  => __('Footer Menu', 'duck-behavior-journal'),
+    ));
+
+    add_theme_support('custom-logo');
+
+    add_theme_support('custom-header', array(
+        'default-image' => get_template_directory_uri() . '/assets/img/hero.png',
+        'width'         => 1920,
+        'height'        => 1080,
+        'flex-height'   => true,
+        'flex-width'    => true,
+    ));
+}
+add_action('after_setup_theme', 'duck_behavior_journal_setup');
+
+function duck_behavior_journal_scripts()
+{
+    wp_enqueue_style('bootstrap-css', get_template_directory_uri() . '/assets/dist/css/bootstrap.min.css');
+    wp_enqueue_style('theme-style', get_stylesheet_uri());
+    wp_enqueue_script('jquery', get_template_directory_uri() . '/assets/dist/js/jquery-3.5.1.min.js', array(), null, true);
+    wp_enqueue_script('bootstrap-js', get_template_directory_uri() . '/assets/dist/js/bootstrap.min.js', array(), null, true);
+}
+add_action('wp_enqueue_scripts', 'duck_behavior_journal_scripts');
+
+require_once get_template_directory() . '/class-wp-bootstrap-navwalker.php';
+
+function duck_behavior_journal_customizer($wp_customize)
+{
+    // Hero Image Section
+    $wp_customize->add_section('hero_image_section', array(
+        'title'    => __('Hero Section', 'duck-behavior-journal'),
+        'priority' => 30,
+    ));
+
+    // Hero Image Setting
+    $wp_customize->add_setting('hero_image', array(
+        'default'   => get_template_directory_uri() . '/assets/hero.jpg',
+        'transport' => 'refresh',
+    ));
+
+    $wp_customize->add_control(new WP_Customize_Image_Control($wp_customize, 'hero_image_control', array(
+        'label'    => __('Hero Image', 'duck-behavior-journal'),
+        'section'  => 'hero_image_section',
+        'settings' => 'hero_image',
+    )));
+
+    // Hero Title Setting
+    $wp_customize->add_setting('hero_title', array(
+        'default'   => 'Advancing the Understanding of Duck Behavior',
+        'transport' => 'refresh',
+    ));
+
+    $wp_customize->add_control('hero_title_control', array(
+        'label'    => __('Hero Title', 'duck-behavior-journal'),
+        'section'  => 'hero_image_section',
+        'settings' => 'hero_title',
+        'type'     => 'text',
+    ));
+
+    // Hero Subtitle Setting
+    $wp_customize->add_setting('hero_subtitle', array(
+        'default'   => 'Through Rigorous Scientific Research',
+        'transport' => 'refresh',
+    ));
+
+    $wp_customize->add_control('hero_subtitle_control', array(
+        'label'    => __('Hero Subtitle', 'duck-behavior-journal'),
+        'section'  => 'hero_image_section',
+        'settings' => 'hero_subtitle',
+        'type'     => 'text',
+    ));
+
+    // Hero Primary Button Text Setting
+    $wp_customize->add_setting('hero_primary_button_text', array(
+        'default'   => 'Submit Your Research',
+        'transport' => 'refresh',
+    ));
+
+    $wp_customize->add_control('hero_primary_button_text_control', array(
+        'label'    => __('Hero Primary Button Text', 'duck-behavior-journal'),
+        'section'  => 'hero_image_section',
+        'settings' => 'hero_primary_button_text',
+        'type'     => 'text',
+    ));
+
+    // Hero Primary Button URL Setting
+    $wp_customize->add_setting('hero_primary_button_url', array(
+        'default'   => '#',
+        'transport' => 'refresh',
+    ));
+
+    $wp_customize->add_control('hero_primary_button_url_control', array(
+        'label'    => __('Hero Primary Button URL', 'duck-behavior-journal'),
+        'section'  => 'hero_image_section',
+        'settings' => 'hero_primary_button_url',
+        'type'     => 'url',
+    ));
+
+    // Hero Secondary Button Text Setting
+    $wp_customize->add_setting('hero_secondary_button_text', array(
+        'default'   => 'Subscribe to the Journal',
+        'transport' => 'refresh',
+    ));
+
+    $wp_customize->add_control('hero_secondary_button_text_control', array(
+        'label'    => __('Hero Secondary Button Text', 'duck-behavior-journal'),
+        'section'  => 'hero_image_section',
+        'settings' => 'hero_secondary_button_text',
+        'type'     => 'text',
+    ));
+
+    // Hero Secondary Button URL Setting
+    $wp_customize->add_setting('hero_secondary_button_url', array(
+        'default'   => '#',
+        'transport' => 'refresh',
+    ));
+
+    $wp_customize->add_control('hero_secondary_button_url_control', array(
+        'label'    => __('Hero Secondary Button URL', 'duck-behavior-journal'),
+        'section'  => 'hero_image_section',
+        'settings' => 'hero_secondary_button_url',
+        'type'     => 'url',
+    ));
+
+    // Footer Section
+    $wp_customize->add_section('footer_section', array(
+        'title'    => __('Footer', 'duck-behavior-journal'),
+        'priority' => 40,
+    ));
+
+    // Footer Text Setting
+    $wp_customize->add_setting('footer_text', array(
+        'default'   => '&copy; ' . date('Y') . ' Duck Behavior Journal. All rights reserved.',
+        'transport' => 'refresh',
+    ));
+
+    $wp_customize->add_control('footer_text_control', array(
+        'label'    => __('Footer Text', 'duck-behavior-journal'),
+        'section'  => 'footer_section',
+        'settings' => 'footer_text',
+        'type'     => 'textarea',
+    ));
+
+    // Footer Social Media Links
+    $social_media = array('facebook', 'twitter', 'linkedin');
+
+    foreach ($social_media as $platform) {
+        $wp_customize->add_setting("footer_{$platform}_link", array(
+            'default'   => '#',
+            'transport' => 'refresh',
+        ));
+
+        $wp_customize->add_control("footer_{$platform}_link_control", array(
+            'label'    => __(ucfirst($platform) . ' URL', 'duck-behavior-journal'),
+            'section'  => 'footer_section',
+            'settings' => "footer_{$platform}_link",
+            'type'     => 'url',
+        ));
+    }
+}
+add_action('customize_register', 'duck_behavior_journal_customizer');

header.php

@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title><?php bloginfo('name'); ?> - <?php bloginfo('description'); ?></title>
+    <link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>">
+    <?php wp_head(); ?>
+</head>
+
+<body>
+    <!-- Header -->
+    <header class="bg-light py-3">
+        <div class="container d-flex justify-content-between align-items-center">
+            <?php if (has_custom_logo()) : ?>
+                <?php the_custom_logo(); ?>
+            <?php else : ?>
+                <a href="<?php echo home_url(); ?>"><?php bloginfo('name'); ?></a>
+            <?php endif; ?>
+            <nav>
+                <?php
+                wp_nav_menu(array(
+                    'theme_location' => 'primary',
+                    'menu_class'     => 'nav',
+                    'container'      => false,
+                    'walker'         => new WP_Bootstrap_Navwalker(),
+                ));
+                ?>
+            </nav>
+        </div>
+    </header>

index.php

@@ -0,0 +1,39 @@
+<?php get_header(); ?>
+
+<!-- Hero Section -->
+<section class="hero text-center text-white d-flex align-items-center" style="background-image: url('<?php echo get_theme_mod('hero_image', get_template_directory_uri() . '/assets/img/hero.png'); ?>');">
+    <div class="container">
+        <h1 class="display-4"><?php echo get_theme_mod('hero_title', 'Advancing the Understanding of Duck Behavior'); ?></h1>
+        <p class="lead"><?php echo get_theme_mod('hero_subtitle', 'Through Rigorous Scientific Research'); ?></p>
+        <a href="<?php echo get_theme_mod('hero_primary_button_url', '#'); ?>" class="btn btn-primary"><?php echo get_theme_mod('hero_primary_button_text', 'Submit Your Research'); ?></a>
+        <a href="<?php echo get_theme_mod('hero_secondary_button_url', '#'); ?>" class="btn btn-secondary"><?php echo get_theme_mod('hero_secondary_button_text', 'Subscribe to the Journal'); ?></a>
+    </div>
+</section>
+
+<!-- Featured Articles -->
+<section class="container my-5">
+    <h2 class="text-center mb-4">Featured Articles</h2>
+    <div class="row">
+        <?php
+        $args = array('post_type' => 'post', 'posts_per_page' => 3);
+        $loop = new WP_Query($args);
+        while ($loop->have_posts()) : $loop->the_post();
+        ?>
+            <div class="col-md-4">
+                <div class="card mb-4 shadow-sm">
+                    <?php if (has_post_thumbnail()) : ?>
+                        <img src="<?php the_post_thumbnail_url(); ?>" class="card-img-top" alt="<?php the_title(); ?>">
+                    <?php endif; ?>
+                    <div class="card-body">
+                        <h5 class="card-title"><?php the_title(); ?></h5>
+                        <p class="card-text"><?php the_author(); ?> | <?php the_date(); ?></p>
+                        <a href="<?php the_permalink(); ?>" class="btn btn-outline-primary">Read More</a>
+                    </div>
+                </div>
+            </div>
+        <?php endwhile;
+        wp_reset_query(); ?>
+    </div>
+</section>
+
+<?php get_footer(); ?>

page.php

@@ -0,0 +1,16 @@
+<?php get_header(); ?>
+
+<!-- Page Content -->
+<section class="container my-5">
+    <div class="row">
+        <div class="col-lg-8 mx-auto">
+            <?php if (have_posts()) : while (have_posts()) : the_post(); ?>
+                    <h1 class="display-4"><?php the_title(); ?></h1>
+                    <?php the_content(); ?>
+            <?php endwhile;
+            endif; ?>
+        </div>
+    </div>
+</section>
+
+<?php get_footer(); ?>

single.php

@@ -0,0 +1,20 @@
+<?php get_header(); ?>
+
+<!-- Paper Content -->
+<section class="container my-5">
+    <div class="row">
+        <div class="col-lg-8 mx-auto">
+            <?php if (have_posts()) : while (have_posts()) : the_post(); ?>
+                    <h1 class="display-4"><?php the_title(); ?></h1>
+                    <p class="text-muted"><?php the_author(); ?> | <?php the_date(); ?></p>
+                    <?php if (has_post_thumbnail()) : ?>
+                        <img src="<?php the_post_thumbnail_url(); ?>" class="img-fluid mb-4" alt="<?php the_title(); ?>">
+                    <?php endif; ?>
+                    <?php the_content(); ?>
+            <?php endwhile;
+            endif; ?>
+        </div>
+    </div>
+</section>
+
+<?php get_footer(); ?>

style.css

@@ -0,0 +1,81 @@
+/*
+Theme Name: Duck Behavior Journal
+Theme URI: https://duckbehaviorjournal.com
+Author: Kumi
+Author URI: https://kumi.website
+Description: A WordPress theme for the Duck Behavior Journal.
+Version: 1.0
+License: MIT
+License URI: https://opensource.org/licenses/MIT
+Text Domain: duck-behavior-journal
+*/
+
+body {
+    font-family: 'Helvetica Neue', Arial, sans-serif;
+    color: #333;
+}
+
+.logo {
+    height: 50px;
+}
+
+.nav-link {
+    color: #333;
+    font-weight: bold;
+}
+
+.nav-link:hover {
+    color: #007bff;
+}
+
+.hero {
+    height: 60vh;
+    background-size: cover;
+    background-position: center;
+    position: relative;
+}
+
+.hero::before {
+    content: "";
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: rgba(0, 0, 0, 0.5);
+}
+
+.hero .container {
+    position: relative;
+    z-index: 1;
+}
+
+.hero h1,
+.hero p {
+    color: white;
+}
+
+.card {
+    border: none;
+}
+
+.card-title {
+    font-size: 1.25rem;
+    font-weight: bold;
+}
+
+.card-text {
+    color: #777;
+}
+
+footer {
+    border-top: 1px solid #eee;
+}
+
+footer p {
+    margin: 0;
+}
+
+footer .social-media img {
+    height: 24px;
+}