DevDmBootstrap4

Twitter Bootstrap 4 WordPress Starter Theme for Developers

Theme File: functions.php

Name: functions.php

Path: devdmbootstrap4/functions.php

Source: https://github.com/dannymachal/devdmbootstrap4/blob/master/functions.php

The default functions.php file has several functions to setup theme support options, enqueue various scripts and include our regular and enhanced nav walkers. I will break down in order of function execution exactly what you are seeing happen in the functions.php file. All functions are wrapped in function_exists blocks to enable you to override them inside your child-theme.

Function devdmbootstrap_setup()

  1. load_theme_textdomain – The default textdomain for the theme is devdmbootstrap4. You will find the devdmbootstrap4.pot file for creating your own language translations in /languages. The languages directory also contains the default en_US.mo and en_US.po files.
  2. add_theme_support(automatic-feed-links)
  3. add_theme_support(title-tag)
  4. add_theme_support( custom-background )
  5. add_theme_support( customize-selective-refresh-widgets )
  6. add_editor_style – You can load custom CSS into the WordPress editor. I’ve loaded a blank one located at /assets/css/devdmbootstrap/editor-style.css
  7. add_theme_support( custom-header, array()) – The custom header image will act as a background in the header behind the logo, site name and tagline.
  8. add_theme_support(post-thumbnails)
  9. set_post_thumbnail_size(1140, 300, array(center,center))
  10. register_nav_menus – We are registering two nav menu locations with slugs of main_menu and footer_menu these are called with their walkers in /template-parts/nav-header.php and /template-parts/nav-footer.php and included in various other theme files like index.php, single.php and page.php.
  11. add_theme_support(html5, array())
  12. max content width
  13. add_theme_support( custom-logo, array()) – Add support for the logo in the header to be set in the WordPress Customizer.

Function devdmbootstrap4_custom_logo()

A utility function for returning the logo set in customizer. This function is called one time in /template-parts/head.php.

Function devdmbootstrap_widgets_init()

Register our two default sidebar widget areas with ids of dmbs-right-sidebar and dmbs-left-sidebar. These widget areas are instantiated in /template-parts/sidebar-left.php and /template-parts/sidebar-right.php and included in various other theme files like index.php, single.php and page.php.

Function devdmbootstrap_scripts()

Enqueue our CSS for bootstrap 4 and required scripts. Optionally we are including fontawesome here as well. You can toggle this off in the customizer theme options.

CSS Enqueued File Handles

JS Enqueued File Handles

  • devdmbootstrap4-popper-js
  • devdmbootstrap4-js

Function devdmbootstrap_column_size()

This is a utility function for calculating the column size of the various sidebars and main content areas based on the size selections in the customizer theme options. You will see this function called in sidebar template includes as well as the various main template files index.php, single.php and page.php.

Function devdmbootstrap_nav_walker()

I have two nav walkers with this theme. One is the default (/includes/devdmbootstrap_nav_walker.php) bootstrap behavior with required clicks to open drop downs and functions exactly how bootstrap 4 functions on desktop and mobile devices. The enhanced_nav_walker (/includes/devdmbootstrap_enhanced_nav_walker.php) supports both hover on desktop and touch open on mobile at the same time by enqueue of a special JS file (/assets/js/devdmbootstrap4_enhanced_nav.js) to handle this behavior. The enhanced_nav_walker also supports fontawesome icons next to your menu items by adding fa fa-icon to the “description” field when managing your menu items in the wp-admin dashboard. Enhanced is enabled by default but can be toggled off in the customizer theme options.

Default included files in functions.php:

<?php
/**
 * Welcome to DevDmBootstrap4 a simple to use barebones theme for WordPress theme developers wishing to use the Twitter
 * Bootstrap 4.x frontend framework.
 */

/**
 * Setup the theme defaults.
 */

if (!function_exists( 'devdmbootstrap_setup' ) ) {
    /**
     * Sets up theme defaults and registers support for various WordPress features.
     */
    function devdmbootstrap_setup()
    {

        // Load up the Text domain.
        load_theme_textdomain('devdmbootstrap4', get_template_directory() . '/languages');

        // Add default posts and comments RSS feed links to head.
        add_theme_support('automatic-feed-links');

        // Let WordPress manage the document title.
        add_theme_support('title-tag');

        // Add Theme Support for Custom Background Images and Colors
        add_theme_support( 'custom-background' );

        // Add Theme Support for Customize Selective Refresh Widgets
        add_theme_support( 'customize-selective-refresh-widgets' );

        // Add Editor stylesheet.
        add_editor_style(get_template_directory_uri() . '/assets/css/devdmbootstrap/editor-style.css');

        // Add Theme Support for Custom Header (background) image
        add_theme_support( 'custom-header', array(
            'default-image'          => '',
            'random-default'         => false,
            'width'                  => 1140,
            'height'                 => 150,
            'flex-height'            => true,
            'flex-width'             => true,
            'default-text-color'     => '',
            'header-text'            => false,
            'uploads'                => true,
            'wp-head-callback'       => '',
            'admin-head-callback'    => '',
            'admin-preview-callback' => '',
        ));

        /**
         * Enable support for Post Thumbnails on posts and pages.
         *
         * @link http://codex.wordpress.org/Function_Reference/add_theme_support#Post_Thumbnails
         */
        add_theme_support('post-thumbnails');
        set_post_thumbnail_size(1140, 300, array('center','center'));

        // This theme uses wp_nav_menu() in two locations.
        register_nav_menus(array(
            'main_menu' => esc_html__('Main Menu', 'devdmbootstrap4'),
            'footer_menu' => esc_html__('Footer Menu', 'devdmbootstrap4'),
        ));

        /*
         * Switch default core markup for search form, comment form, and comments
         * to output valid HTML5.
         */
        add_theme_support('html5', array(
            'search-form',
            'comment-form',
            'comment-list',
            'gallery',
            'caption',
        ));

        // Set the max content width
        if ( ! isset( $content_width ) ) {
            $content_width = 1140;
        }

        /* Add custom-logo theme support */
        add_theme_support( 'custom-logo', array(
            'height'      => 150,
            'width'       => 350,
            'flex-height' => true,
            'flex-width'  => true,
            'header-text' => array( 'site-title', 'site-description' ),
            )
        );

    }

}
add_action( 'after_setup_theme', 'devdmbootstrap_setup' );

/**
 * get the custom logo URL
 */
if (!function_exists('devdmbootstrap4_custom_logo')) {
    function devdmbootstrap4_custom_logo() {

        if ( function_exists( 'the_custom_logo' ) ) {
            $custom_logo_id = get_theme_mod( 'custom_logo' );
            $image          = wp_get_attachment_image_src( $custom_logo_id , 'full' );
            return (!empty($image[0]) ? $image[0] : FALSE);
        }
    }
}

/**
 * Register left and right Sidebar
 */
if (!function_exists( 'devdmbootstrap_widgets_init' ) ) {

    function devdmbootstrap_widgets_init()
    {

        register_sidebar(
            array(
            'name'          => __('Right Sidebar', 'devdmbootstrap4'),
            'id'            => 'dmbs-right-sidebar',
            'description'   => __('Widgets in this area will be shown on all posts and pages.', 'devdmbootstrap4'),
            'before_widget' => '<li id="%1$s" class="widget dmbs-widget dmbs-widget-right %2$s">',
            'after_widget'  => '</li>',
            'before_title'  => '<h3 class="widgettitle dmbs-widget-title dmbs-widget-right-title">',
            'after_title'   => '</h3>',
        ));

        register_sidebar(
            array(
            'name'          => __('Left Sidebar', 'devdmbootstrap4'),
            'id'            => 'dmbs-left-sidebar',
            'description'   => __('Widgets in this area will be shown on all posts and pages.', 'devdmbootstrap4'),
            'before_widget' => '<li id="%1$s" class="widget dmbs-widget dmbs-widget-left %2$s">',
            'after_widget'  => '</li>',
            'before_title'  => '<h3 class="widgettitle dmbs-widget-title dmbs-widget-left-title">',
            'after_title'   => '</h3>',
        ));
    }

}
add_action( 'widgets_init', 'devdmbootstrap_widgets_init' );

/**
 * Include the Bootstrap 4.x Stylesheet and JS
 */
if (!function_exists( 'devdmbootstrap_scripts' ) ) {

    function devdmbootstrap_scripts()
    {
        $wpTheme = wp_get_theme();

        // Enqueue the default Bootstrap 4.x CSS with the name devdmbootstrap4-css
        wp_enqueue_style('devdmbootstrap4-css', get_template_directory_uri() . '/assets/css/devdmbootstrap/devdmbootstrap4.css');

        // Enqueue the default style.css with the name devdmbootstrap4-stylesheet
        wp_enqueue_style('devdmbootstrap4-stylesheet', get_stylesheet_uri());

        // Enqueue Font Awesome Icon Set with the name devdmbootstrap4-fontawesome.
        if (get_theme_mod('devdmbootstrap4_fontawesome_setting', 1)) {
            wp_enqueue_style('devdmbootstrap4-fontawesome', get_template_directory_uri() . '/assets/fontawesome-free-5.0.2/web-fonts-with-css/css/fontawesome-all.min.css');
        }

        // Enqueue popper.min.js with the name devdmbootstrap4-popper-js
        wp_enqueue_script('devdmbootstrap4-popper-js', get_template_directory_uri() . '/assets/js/bootstrap4x/popper.min.js', array('jquery'), $wpTheme->get( 'Version' ), true);

        // Enqueue the default Bootstrap 4.x JS with the name devdmbootstrap4-js.
        wp_enqueue_script('devdmbootstrap4-js', get_template_directory_uri() . '/assets/js/bootstrap4x/bootstrap.js', array('jquery'), $wpTheme->get( 'Version' ), true);
    }
}
add_action( 'wp_enqueue_scripts', 'devdmbootstrap_scripts' );

/**
 * Customizer
 */
require_once( __DIR__ . '/includes/customizer.php');

/**
 * Calculate Column Sizes and return the value when called
 */
if (!function_exists( 'devdmbootstrap_column_size' ) ) {
    function devdmbootstrap_column_size($column = null) {

        $columnSizes = array(
            'left'  => '',
            'right' => '',
            'main'  => '',
        );

        if ($column != null && array_key_exists($column,$columnSizes)) {

            $columnSizes = array(
                'left' => get_theme_mod('devdmbootstrap4_leftsidebar',0),
                'right' => get_theme_mod('devdmbootstrap4_rightsidebar',3),
            );

            $columnSizes['main'] = 12 - ($columnSizes['right'] + $columnSizes['left']);

            return $columnSizes[$column];

        }

        return;
    }
}

/**
 * Nav Walker
 */
if (!function_exists( 'devdmbootstrap_nav_walker' ) ) {
    function devdmbootstrap_nav_walker()
    {
        $loadEnhancedMenu = get_theme_mod('devdmbootstrap4_enhanced_menu_setting', 1);

        if ($loadEnhancedMenu == 1) {
            $wpTheme = wp_get_theme();

            // Enqueue the Enhanced Menu System JS with the handle devdmbootstrap4-enhanced-menu-js
            wp_enqueue_script('devdmbootstrap4-enhanced-nav-js', get_template_directory_uri() . '/assets/js/devdmbootstrap4_enhanced_nav.js', array('jquery'), $wpTheme->get('Version'), true);

            require get_template_directory() . '/includes/devdmbootstrap_enhanced_nav_walker.php';
        } else {
            wp_dequeue_script('devdmbootstrap4-enhanced-nav');
            require get_template_directory() . '/includes/devdmbootstrap_nav_walker.php';
        }
    }
}
add_action('wp_enqueue_scripts','devdmbootstrap_nav_walker');

/**
 * Custom Comment Walker
 */
require_once( __DIR__ . '/includes/bootstrap-comment-walker.php');

/**
 * Utilities
 */
require_once( __DIR__ . '/includes/utilities.php');