修改子主题的标题

我是个傻瓜。

我已经复制了标题。php从父主题开始，我添加了一些代码片段和有用的东西。然而，我希望能够使用插件或通过函数添加这些相同的代码片段。因此，当/如果主题更新，我不需要重做任何事情。我试过很多东西，但都不管用。我想知道问题是使用插件将代码片段放在哪里，还是我试图修改的HTML元素应该以不同的方式编写。。。我完全迷路了。

我在head元素中添加了以下内容：

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script src="wp-content/themes/block-lite_child/js/jquery.backstretch.js"></script>

然后运行脚本：

    <script>$(".wp-custom-header").backstretch([  // Target your HTML element
                    \'/wp-content/themes/block-lite_child/images/01.jpg\',  // Add in your images
                    \'/wp-content/themes/block-lite_child/images/02.jpg\',
                    \'/wp-content/themes/block-lite_child/images/03.jpg\',
                    \'/wp-content/themes/block-lite_child/images/04.jpg\',
                    \'/wp-content/themes/block-lite_child/images/05.jpg\',
                ],{
                duration:4000, // Time between transitions
                fade:1000, // Transition effect
                });</script>

最后，这里是完整的标题。php

<?php
/**
 * The Header for our theme.
 * Displays all of the <head> section and everything up till <div id="wrap">
 *
 * @package Block Lite
 * @since Block Lite 1.0
 */

?><!DOCTYPE html>

<html class="no-js" <?php language_attributes(); ?>>

<head>

    <meta charset="<?php bloginfo( \'charset\' ); ?>">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="profile" href="http://gmpg.org/xfn/11">
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script src="wp-content/themes/block-lite_child/js/jquery.backstretch.js"></script>

    <?php wp_head(); ?>

</head>

<body <?php body_class(); ?>>

<!-- BEGIN #wrapper -->
<div id="wrapper">

    <!-- BEGIN #header -->
    <header id="header">

        <!-- BEGIN #nav-bar -->
        <div id="nav-bar">

        <?php if ( is_front_page() ) { ?>
            <h1 class="site-title">
                <a href="<?php echo esc_url( home_url( \'/\' ) ); ?>" rel="home"><?php echo wp_kses_post( get_bloginfo( \'name\' ) ); ?></a>
            </h1>
        <?php } else { ?>
            <p class="site-title">
                <a href="<?php echo esc_url( home_url( \'/\' ) ); ?>" rel="home"><?php echo wp_kses_post( get_bloginfo( \'name\' ) ); ?></a>
            </p>
        <?php } ?>

        <?php if ( has_nav_menu( \'main-menu\' ) ) { ?>

            <!-- BEGIN #navigation -->
            <nav id="navigation" class="navigation-main" role="navigation" aria-label="<?php esc_html_e( \'Primary Navigation\', \'block-lite\' ); ?>">

                <?php
                wp_nav_menu( array(
                    \'theme_location\' => \'main-menu\',
                    \'title_li\'       => \'\',
                    \'depth\'          => 4,
                    \'fallback_cb\'    => \'wp_page_menu\',
                    \'container\'      => false,
                    \'menu_class\'     => \'menu\',
                    \'walker\'         => new Aria_Walker_Nav_Menu(),
                    \'items_wrap\'     => \'<ul id="%1$s" class="%2$s" role="menubar">%3$s</ul>\',
                    \'link_before\'    => \'<span>\',
                    \'link_after\'     => \'</span>\',
                ) );
                ?>

            <!-- END #navigation -->
            </nav>

            <button type="button" id="menu-toggle" class="menu-toggle" href="#sidr">
                <svg class="icon-menu-open" version="1.1" id="icon-open" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
                    width="24px" height="24px" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">
                    <rect y="2" width="24" height="2"/>
                    <rect y="11" width="24" height="2"/>
                    <rect y="20" width="24" height="2"/>
                </svg>
                <svg class="icon-menu-close" version="1.1" id="icon-close" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="24px" height="24px" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">
                    <rect x="0" y="11" transform="matrix(-0.7071 -0.7071 0.7071 -0.7071 12 28.9706)" width="24" height="2"/>
                    <rect x="0" y="11" transform="matrix(-0.7071 0.7071 -0.7071 -0.7071 28.9706 12)" width="24" height="2"/>
                </svg>
            </button>

        <?php } ?>

        <!-- END #nav-bar -->
        </div>

        <?php if ( has_custom_header() || has_custom_logo() ) { ?>

            <?php if ( is_home() || is_archive() || is_search() || is_attachment() ) { ?>

            <!-- BEGIN #custom-header -->
            <div id="custom-header">

                <!-- BEGIN #masthead-->
                <div id="masthead">

                    <div class="header-content">

                        <?php the_custom_logo(); ?>

                        <?php if ( is_front_page() && is_home() ) { ?>
                            <h2 class="site-description"><?php echo html_entity_decode( get_bloginfo( \'description\' ) ); ?></h2>
                        <?php } else { ?>
                            <p class="site-description"><?php echo html_entity_decode( get_bloginfo( \'description\' ) ); ?></p>
                        <?php } ?>

                        <?php if ( have_posts() && is_category() ) { ?>
                            <h1 class="text-center"><?php the_archive_title(); ?></h1>
                            <?php the_archive_description( \'<p class="archive-description">\', \'</p>\' ); ?>
                        <?php } ?>

                    </div>

                <!-- END #masthead-->
                </div>

                <?php if ( is_front_page() && is_home() ) { ?>
                    <a href="#blog-posts" class="scroll-down scroll"><i class="fa fa-angle-down" aria-hidden="true"></i></a>
                <?php } ?>

                <?php the_custom_header_markup(); ?>

                <script>$(".wp-custom-header").backstretch([  // Target your HTML element
                    \'/wp-content/themes/block-lite_child/images/01.jpg\',  // Add in your images
                    \'/wp-content/themes/block-lite_child/images/02.jpg\',
                    \'/wp-content/themes/block-lite_child/images/03.jpg\',
                    \'/wp-content/themes/block-lite_child/images/04.jpg\',
                    \'/wp-content/themes/block-lite_child/images/05.jpg\',
                ],{
                duration:4000, // Time between transitions
                fade:1000, // Transition effect
                });</script>                

            <!-- END #custom-header -->
            </div>

            <?php } ?>

        <?php } ?>

    <!-- END #header -->
    </header>

    <!-- BEGIN .container -->
    <main class="container" role="main">

/** * Create a function to load your scripts. */ function wpse_344148_custom_scripts() { /** * Enqueue your script. */ wp_enqueue_script( \'jquery-backstretch\', // The name of the script. get_theme_file_uri( \'js/jquery.backstretch.js\' ), // Use get_theme_file_uri to get the full URL to the script. [ \'jquery\' ], // Your script depends on jQuery. \'2.1.17\', // The version of the script. true // Load it in the footer. ); /** * You need to get the proper URLs to the images using get_theme_file_uri() * and pass them to the script. Use wp_localize_script() for this. */ wp_localize_script( \'jquery-backstretch\', // The name of the original script. \'wpse344148\', // Name of the JS variable to put your data in. [ // The data to pass. get_theme_file_uri( \'images/01.jpg\' ), get_theme_file_uri( \'images/02.jpg\' ), get_theme_file_uri( \'images/03.jpg\' ), get_theme_file_uri( \'images/04.jpg\' ), get_theme_file_uri( \'images/05.jpg\' ), ] ); /** * Then use wp_add_inline_script() to add the inline script portion. Use * jQuery instead of $ in WordPress, and use wpse344148 from wp_localize_script() * to get the array of images. */ wp_add_inline_script( \'jquery-backstretch\', // The name of the original script. \'jQuery(".wp-custom-header").backstretch( wpse344148, { duration:4000, fade:1000, } );\' ); } /** * Tell WordPress when to run your function. If you function loads scripts or * styles you need to use wp_enqueue_scripts. */ add_action( \'wp_enqueue_scripts\', \'wpse_344148_backstretch\' );

小码农CODE

相关推荐

如何将作者的电话号码添加到wp配置文件中并使其显示在wp-admin/edit.php列中