WordPress通用代码如何适配所有网页？-网页设计-锦华智联科技

⚠️ 重要提示：使用代码前的准备工作

在修改任何代码之前,请务必备份您的网站！强烈建议您：

（图片来源网络，侵删）

使用子主题：在子主题中修改，这样在主题更新时您的代码不会被覆盖。
使用代码片段插件：如 WPCode 或 Code Snippets，这些插件可以安全地添加和管理代码，无需直接编辑主题文件，是最推荐的方法。
了解基本 PHP：虽然大部分代码可以直接用，但了解一点 PHP 基础可以帮助您更好地理解和调试。

网站基本信息输出

这些代码通常用于网站页脚、侧边栏或 <head> 标签中。

功能	代码	说明
	`<?php bloginfo('name'); ?>`	输出网站在“设置 > 常规”中设置的标题。
	`<?php bloginfo('description'); ?>`	输出网站在“设置 > 常规”中设置的副标题/描述。
网站首页 URL	`<?php echo home_url(); ?>`	输出网站首页的完整 URL。
WordPress 版本	`<?php bloginfo('version'); ?>`	输出当前安装的 WordPress 版本。
主题名称	`<?php bloginfo('template_name'); ?>`	输出当前激活的主题名称。
主题版本	`<?php echo esc_attr(wp_get_theme()->get('Version')); ?>`	输出当前主题的版本号。
站点 URL (WordPress 地址)	`<?php echo site_url(); ?>`	输出 WordPress 核心文件所在的 URL，通常和首页 URL 相同。
插件 URL	`<?php echo plugins_url(); ?>`	输出 `wp-content/plugins` 目录的 URL。

文章/页面内容循环

这是 WordPress 最核心的部分，用于在首页、分类页、存档页等地方显示文章列表。

<?php if ( have_posts() ) : ?>
    <?php while ( have_posts() ) : the_post(); ?>
        <!-- 文章循环开始 -->
        <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
            <!-- 文章标题 -->
            <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
            <!-- 文章元信息 (发布时间、作者、分类等) -->
            <div class="entry-meta">
                发布于 <?php echo get_the_date(); ?> | 作者 <?php the_author(); ?> | 分类 <?php the_category(', '); ?>
            </div>
            <!-- 文章摘要或特色图片 -->
            <?php if ( has_post_thumbnail() ) : ?>
                <a href="<?php the_permalink(); ?>">
                    <?php the_post_thumbnail( 'medium' ); ?>
                </a>
            <?php endif; ?>
            <?php the_excerpt(); // 输出文章摘要 ?>
            <!-- 或者使用 the_content(); 输出全文，但需要配合 "more" 标签 -->
            <!-- 阅读更多链接 -->
            <a href="<?php the_permalink(); ?>">阅读更多</a>
        </article>
        <!-- 文章循环结束 -->
    <?php endwhile; ?>
    <!-- 文章分页导航 -->
    <div class="pagination">
        <?php echo paginate_links(); ?>
    </div>
<?php else : ?>
    <p>抱歉，没有找到任何文章。</p>
<?php endif; ?>

常用函数与标签

这些函数通常在文章循环内部或单个文章页面（single.php）中使用。

函数	说明
`the_ID()`	输出当前文章的 ID。
`the_title()`	输出文章标题。
`the_permalink()`	输出文章的永久链接（URL）。
`the_content()`	输出文章的完整内容。
`the_excerpt()`	输出文章的摘要，如果没有手动设置摘要，则自动截取内容的前 55 个单词。
`get_the_content()`	获取文章内容（不直接输出），可以进行处理后再输出。
`get_the_excerpt()`	获取文章摘要（不直接输出）。
`has_post_thumbnail()`	判断文章是否有特色图片，返回 `true` 或 `false`。
`the_post_thumbnail( $size )`	输出文章的特色图片。`$size` 可以是 `'thumbnail'`, `'medium'`, `'large'` 或自定义尺寸。
`wp_trim_excerpt( $text )`	自定义摘要的长度和“...”后的文本。

文章元信息 (作者、时间、分类等)

函数	说明
`the_time( $format )`	输出文章的发布时间。`$format` 是日期格式，如 `Y-m-d` 或 `F j, Y`。
`get_the_date( $format )`	获取文章日期（不直接输出）。
`the_author()`	输出文章作者名。
`the_author_meta( $field )`	输出作者的更多信息，如 `$field = 'description'` 输出作者简介。
`the_category( $separator )`	输出文章所属的分类。`$separator` 是分类间的分隔符，如。
`the_tags( $before, $separator, $after )`	输出文章的标签。
`edit_post_link( $text, $before, $after )`	输出“编辑”文章的链接。

评论相关

函数	说明
`comments_number( $zero, $one, $more )`	输出文章的评论数量。
`comments_popup_link( $zero, $one, $more, $css_class, $none )`	输出评论链接。
`comment_form()`	输出评论表单。
`wp_list_comments()`	在评论循环中输出评论列表。

在 `functions.php` 中添加功能

这是 WordPress 最强大的地方，通过在子主题的 functions.php 文件中添加代码，可以为您的网站添加无限可能。

（图片来源网络，侵删）

添加自定义菜单支持

// 在 functions.php 中添加
function my_theme_setup() {
    // 注册一个导航菜单位置
    register_nav_menus( array(
        'primary' => '主导航菜单', // 后台显示的名称
        'footer'  => '页脚菜单',
    ) );
}
add_action( 'after_setup_theme', 'my_theme_setup' );

在模板文件中调用菜单：

<?php
wp_nav_menu( array(
    'theme_location' => 'primary', // 对应上面注册的 'primary'
    'menu_class'     => 'main-menu', // 给菜单列表添加的 CSS 类
    'container'      => 'nav',       // 用什么标签包裹菜单，如 'div' 或 'nav'
) );
?>

添加自定义文章类型

// 在 functions.php 中添加
function create_post_type() {
    register_post_type( 'product',
        array(
            'label'        => '产品',
            'public'       => true,
            'has_archive'  => true,
            'menu_icon'    => 'dashicons-cart', // 使用一个图标
            'supports'     => array( 'title', 'editor', 'thumbnail', 'excerpt' ),
        )
    );
}
add_action( 'init', 'create_post_type' );

添加自定义侧边栏

// 在 functions.php 中添加
function my_custom_sidebar() {
    register_sidebar( array(
        'name'          => '主侧边栏',
        'id'            => 'primary-sidebar',
        'description'   => '这个侧边栏显示在博客文章页面。',
        'before_widget' => '<aside id="%1$s" class="widget %2$s">',
        'after_widget'  => '</aside>',
        'before_title'  => '<h3 class="widget-title">',
        'after_title'   => '</h3>',
    ) );
}
add_action( 'widgets_init', 'my_custom_sidebar' );

在模板文件中调用侧边栏：

<?php dynamic_sidebar( 'primary-sidebar' ); ?>

禁用 WordPress 的 REST API

// 在 functions.php 中添加
add_filter('rest_enabled', '__return_false');
add_filter('rest_jsonp_enabled', '__return_false');

修改特色图片尺寸

// 在 functions.php 中添加
if ( function_exists( 'add_image_size' ) ) {
    add_image_size( 'custom-thumb', 300, 200, true ); // 300px 宽, 200px 高, true 表示裁剪
}

使用时：the_post_thumbnail( 'custom-thumb' );

添加自定义代码到 `<head>` 或 `<footer>`

// 在 functions.php 中添加
// 添加到 <head>
add_action('wp_head', 'my_custom_code_in_head');
function my_custom_code_in_head() {
    ?>
    <!-- 这里可以是 Google Analytics 代码、自定义 CSS 或其他任何 <head> 里的内容 -->
    <meta name="description" content="这是我的自定义网站描述。">
    <style>
        .some-class { color: red; }
    </style>
    <?php
}
// 添加到 </body> 前 (推荐)
add_action('wp_footer', 'my_custom_code_in_footer');
function my_custom_code_in_footer() {
    ?>
    <!-- 这里可以是自定义 JavaScript 或其他页脚内容 -->
    <script>
        console.log('Hello from WordPress footer!');
    </script>
    <?php
}

常用代码片段

自动保存和修订版本管理

减少数据库占用,适合对内容要求不高的网站。

（图片来源网络，侵删）

// 在 functions.php 中添加
// 禁用自动保存
add_action('wp_print_scripts', 'disable_autosave');
function disable_autosave() {
    wp_deregister_script('autosave');
}
// 限制修订版本数量 (例如只保留3个)
add_filter('wp_revisions_to_keep', 'wp_revisions_to_keep', 10, 2);
function wp_revisions_to_keep($num, $post) {
    return 3;
}

移除 WordPress 版本号

出于安全考虑,建议移除。

// 在 functions.php 中添加
remove_action('wp_head', 'wp_generator');

添加自定义 CSS 类到

<body>
根据不同页面添加不同的类,方便做样式控制。
// 在 functions.php 中添加
add_filter('body_class', 'my_body_classes');
function my_body_classes($classes) {
    // 如果是首页
    if (is_home()) {
        $classes[] = 'homepage';
    }
    // 如果是单篇文章
    if (is_single()) {
        $classes[] = 'single-post';
    }
    // 如果是自定义文章类型 'product'
    if (is_post_type_archive('product')) {
        $classes[] = 'product-archive';
    }
    return $classes;
}
这样,<body> 标签可能会变成 <body class="blog single-post">。

通用代码资源
如果您想寻找更多现成的代码片段,可以访问以下网站：

WPCode: https://wpcode.com/ (提供大量免费和付费代码片段)
WPBeginner: https://www.wpbeginner.com/ (有大量 WordPress 教程和代码)
WordPress 官方文档: https://developer.wordpress.org/ (最权威的参考资料)

希望这份大全能对您有所帮助！安全第一，善用子主题和代码片段插件。

WordPress通用代码如何适配所有网页？

⚠️ 重要提示：使用代码前的准备工作

网站基本信息输出

文章/页面内容循环

常用函数与标签

相关

文章元信息 (作者、时间、分类等)

评论相关

在 functions.php 中添加功能

添加自定义菜单支持

添加自定义文章类型

添加自定义侧边栏

禁用 WordPress 的 REST API

修改特色图片尺寸

添加自定义代码到 <head> 或 <footer>

常用代码片段

自动保存和修订版本管理

移除 WordPress 版本号

通用代码资源

在 `functions.php` 中添加功能

添加自定义代码到 `<head>` 或 `<footer>`