【WP|4】WordPress 简码（Shortcode）开发详解-EW帮帮网

简码（Shortcode）是 WordPress
提供的一项强大功能，允许开发者创建自定义的代码块，以便在文章、页面或小工具中轻松插入动态内容。本文将详细讲解简码的开发，从基础概念到高级用法，帮助你充分利用这一功能。

一、简码的基础

简码是一段简短的代码，用户可以在 WordPress 编辑器中使用它来插入动态内容。简码通常以方括号包围，例如 [shortcode]。

1. 创建简单的简码

让我们从创建一个简单的简码开始，该简码将输出一段文本。首先，在你的主题的 functions.php 文件中添加以下代码：

function hello_world_shortcode() {
    return 'Hello, World!';
}
add_shortcode('hello_world', 'hello_world_shortcode');

以上代码定义了一个名为 hello_world_shortcode 的函数，该函数返回一段简单的文本 'Hello, World!'。然后，通过 add_shortcode 函数将此函数注册为一个简码，简码标签为 hello_world。

在文章或页面中使用 [hello_world] 即可显示 Hello, World!。

2. 带参数的简码

简码可以接受参数，使其更具灵活性。以下是一个带参数的简码示例：

function custom_message_shortcode($atts) {
    $atts = shortcode_atts(array(
        'message' => 'Hello, World!',
    ), $atts, 'custom_message');
    
    return $atts['message'];
}
add_shortcode('custom_message', 'custom_message_shortcode');

在这个例子中，shortcode_atts 函数用于定义简码的默认参数，然后将用户提供的参数与默认参数合并。在文章或页面中使用 [custom_message message="Hello, WordPress!"] 即可显示 Hello, WordPress!。

二、高级简码用法

1. 处理内容的简码

简码不仅可以生成内容，还可以处理包含在简码中的内容。以下是一个处理内容的简码示例：

function wrap_content_shortcode($atts, $content = null) {
    return '<div class="custom-wrap">' . do_shortcode($content) . '</div>';
}
add_shortcode('wrap_content', 'wrap_content_shortcode');

使用该简码 [wrap_content]Your content here[/wrap_content]，可以将包含的内容包裹在一个 div 标签中。

2. 嵌套简码

简码可以嵌套使用，这需要确保简码内容经过正确的处理。下面的示例展示了如何处理嵌套简码：

function outer_shortcode($atts, $content = null) {
    return '<div class="outer">' . do_shortcode($content) . '</div>';
}
add_shortcode('outer', 'outer_shortcode');

function inner_shortcode() {
    return '<span class="inner">Inner content</span>';
}
add_shortcode('inner', 'inner_shortcode');

在文章中使用 [outer][inner][/outer]，会正确解析嵌套的简码，并输出：

<div class="outer">
    <span class="inner">Inner content</span>
</div>

3. 复杂输出的简码

简码不仅可以输出简单的文本，还可以输出复杂的 HTML 结构或动态内容。以下是一个复杂输出的简码示例：

function recent_posts_shortcode($atts) {
    $atts = shortcode_atts(array(
        'posts' => 5,
    ), $atts, 'recent_posts');
    
    $query = new WP_Query(array(
        'posts_per_page' => $atts['posts'],
    ));
    
    $output = '<ul class="recent-posts">';
    
    while ($query->have_posts()) {
        $query->the_post();
        $output .= '<li><a href="' . get_permalink() . '">' . get_the_title() . '</a></li>';
    }
    
    wp_reset_postdata();
    
    $output .= '</ul>';
    
    return $output;
}
add_shortcode('recent_posts', 'recent_posts_shortcode');

使用 [recent_posts posts="3"] 可以显示最近的三篇文章标题和链接。

三、简码的最佳实践

1. 使用命名空间

为了避免简码名称冲突，建议为你的简码添加前缀。例如，如果你的简码属于某个插件，可以使用插件名作为前缀：

add_shortcode('plugin_recent_posts', 'recent_posts_shortcode');

2. 安全输出

在输出 HTML 内容时，确保使用适当的 WordPress 函数进行转义，以防止 XSS 攻击。

function secure_message_shortcode($atts) {
    $atts = shortcode_atts(array(
        'message' => 'Hello, World!',
    ), $atts, 'secure_message');
    
    return esc_html($atts['message']);
}
add_shortcode('secure_message', 'secure_message_shortcode');

3. 处理空内容

确保处理简码内容为空的情况，以提高代码的健壮性。

function safe_wrap_content_shortcode($atts, $content = null) {
    if (is_null($content)) {
        return '';
    }
    
    return '<div class="custom-wrap">' . do_shortcode($content) . '</div>';
}
add_shortcode('safe_wrap_content', 'safe_wrap_content_shortcode');

结语

简码是 WordPress 提供的一项强大功能，能够帮助开发者创建灵活、可复用的内容块。通过本文的讲解，你可以了解从基础到高级的简码开发技巧。掌握这些技巧，可以让你在开发 WordPress 主题和插件时，更加高效地实现各种动态内容和复杂功能。希望这篇文章对你的简码开发之路有所帮助。

【WP|4】WordPress 简码（Shortcode）开发详解