我建议您
header.php 很简单,把你所有的逻辑都放进去
functions.php同时使用wp_enqueue_style 排队stylesheets 和wp_enqueue_script 排队JavaScript. 这样,您就不会破坏与其他插件的兼容性,并确保最佳实践。
参见关于使用的技术辩论WordPress Coding Standards: How to add crossorigin and integrity to wp_register_style? (Font Awesome 5) 和functions.php not adding css to website?
您需要使用after_setup_theme 和wp_enqueue_scripts 挂钩。这些示例是使用Bootstrap 4制作的
示例标题。php
<?php
/**
* The header for our theme
*
* This is the template that displays all of the <head> section and everything up until <div id="content">
*
* @link https://developer.wordpress.org/themes/basics/template-files/#template-partials
*
* @package Advanza-Direct
*/
?>
<!doctype html>
<html <?php language_attributes(); ?>>
<head>
<!-- Required meta tags -->
<meta charset="<?php bloginfo( \'charset\' ); ?>">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="profile" href="https://gmpg.org/xfn/11">
<!-- End required meta tags -->
<!-- wp_head -->
<?php wp_head(); ?>
<!-- End wp_head -->
</head>
<body <?php body_class(); ?>>
<div id="page" class="site">
<header id="masthead" class="site-header">
<div id="navigation" class="main-navigation">
<nav class="navbar navbar-expand-md navbar-dark container">
<div class="site-branding">
<?php
// the_custom_logo();
wp_theme_name_prefix_custom_logo();
?>
</div><!-- .site-branding -->
<button class="navbar-toggler collapsed" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<?php
wp_nav_menu( array(
\'theme_location\' => \'primary-menu\',
\'depth\' => 2, // 1 = no dropdowns, 2 = with dropdowns.
\'container\' => \'div\',
\'container_class\' => \'navbar-collapse collapse\',
\'container_id\' => \'navbarCollapse\',
\'menu_class\' => \'navbar-nav ml-auto\', // mr-auto = menu left, ml-auto = menu right.
\'fallback_cb\' => \'WP_Bootstrap_Navwalker::fallback\',
\'walker\' => new WP_Bootstrap_Navwalker(),
) );
?>
</nav>
</div><!-- #site-navigation -->
</header><!-- #masthead -->
<div id="content" class="site-content">
函数示例。php
// Register Custom Navigation Walker
if ( ! file_exists( get_template_directory() . \'/inc/class-wp-bootstrap-navwalker.php\' ) ) {
// file does not exist... return an error.
return new WP_Error( \'class-wp-bootstrap-navwalker-missing\', __( \'It appears the class-wp-bootstrap-navwalker.php file may be missing.\', \'wp-bootstrap-navwalker\' ) );
} else {
// file exists... require it.
require_once get_template_directory() . \'/inc/class-wp-bootstrap-navwalker.php\';
}
if ( ! function_exists( \'wp_theme_name_prefix_setup\' ) ) {
/**
* Sets up theme defaults and registers support for various WordPress features.
*
* Note that this function is hooked into the after_setup_theme hook, which
* runs before the init hook. The init hook is too late for some features, such
* as indicating support for post thumbnails.
*/
function wp_theme_name_prefix_setup() {
/*
* Make theme available for translation.
* Translations can be filed in the /languages/ directory.
* If you\'re building a theme based on Advanza-Direct, use a find and replace
* to change \'advanza-direct\' to the name of your theme in all the template files.
*/
load_theme_textdomain( \'wp-theme-name-prefix\', 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.
* By adding theme support, we declare that this theme does not use a
* hard-coded <title> tag in the document head, and expect WordPress to
* provide it for us.
*/
add_theme_support( \'title-tag\' );
/*
* Enable support for Post Thumbnails on posts and pages.
*
* @link https://developer.wordpress.org/themes/functionality/featured-images-post-thumbnails/
*/
add_theme_support( \'post-thumbnails\' );
// This theme uses wp_nav_menu() in one location.
register_nav_menus( array(
\'primary-menu\' => esc_html__( \'Primary menu\', \'wp-theme-name-prefix\' ),
) );
/*
* 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 up the WordPress core custom background feature.
add_theme_support( \'custom-background\', apply_filters( \'wp_theme_name_prefix_custom_background_args\', array(
\'default-color\' => \'ffffff\',
\'default-image\' => \'\',
) ) );
// Add theme support for selective refresh for widgets.
add_theme_support( \'customize-selective-refresh-widgets\' );
/**
* Add support for core custom logo.
*
* @link https://codex.wordpress.org/Theme_Logo
*/
add_theme_support( \'custom-logo\', array(
\'height\' => 50,
\'width\' => 350,
\'flex-width\' => true,
\'flex-height\' => true,
) );
function wp_theme_name_prefix_custom_logo() {
if ( function_exists( \'the_custom_logo\' ) ) {
the_custom_logo();
}
}
function change_logo_class($html) {
$html = str_replace( \'custom-logo-link\', \'custom-logo-link navbar-brand\', $html );
return $html;
}
add_filter( \'get_custom_logo\', \'change_logo_class\' );
}
}
add_action( \'after_setup_theme\', \'wp_theme_name_prefix_setup\' );
/**
* Enqueue scripts and styles.
*/
function wp_theme_name_prefix_scripts() {
// Add Bootstrap and Font Awesome CSS
wp_enqueue_style( \'bootstrap\', get_theme_file_uri( \'/assets/css/bootstrap.min.css\' ), array(), null );
// wp_enqueue_style( \'fontawesome-style\', get_theme_file_uri( \'/assets/css/all.css\' ), array(), null );
// Theme stylesheet
wp_enqueue_style( \'wp-theme-name-prefix\', get_stylesheet_uri(), array(\'bootstrap\'), null );
// Example add Google Fonts
wp_enqueue_style(\'google_fonts\', \'https://fonts.googleapis.com/css?family=Poppins:300,500,700\', array(), null );
// bootstrap bundle js (Popper.js included)
wp_enqueue_script( \'bootstrap-bundle-js\', get_theme_file_uri( \'/assets/js/bootstrap.bundle.min.js\' ), array( \'jquery\' ), null, true );
// explanation: https://wordpress.stackexchange.com/questions/211701/what-does-wp-embed-min-js-do-in-wordpress-4-4
// https://kinsta.com/knowledgebase/disable-embeds-wordpress/
wp_deregister_script( \'wp-embed\' );
wp_dequeue_script( \'wp-embed\' );
if ( is_singular() && comments_open() && get_option( \'thread_comments\' ) ) {
wp_enqueue_script( \'comment-reply\' );
}
}
add_action( \'wp_enqueue_scripts\', \'wp_theme_name_prefix_scripts\' );