WordPress 新增短代码(Shortcodes)教程

释放双眼,带上耳机,听听看~!

平时在写文章,用户通过WordPress短代码(Shortcodes)可以非常方便快速地在编辑文章或页面的时候插入动态内容,短代码的常见应用有插入最新文章、插入广告、插入音频视频、插入下载按钮等。但在这里介绍的是一些注意事项的短代码,同样实用。

将以下代码添加到主题functions.php中

回复可见

// 使用[reply]短代码添加回复后可见内容
function reply_to_read($atts, $content=null){
    extract(shortcode_atts(array("notice" => '<blockquote><p class="reply-to-read" style="color: red;">注意:本段内容须"<a href="'. get_permalink().'#respond" title="回复本文">回复本文</a>"后"<a href="javascript:window.location.reload();" title="刷新本页">刷新本页</a>"方可查看!</p></blockquote>'), $atts));
    if(is_super_admin()){
        return $content;    //如果用户是管理员则直接显示内容
    }
    $email = null;
    $user_ID = (int)wp_get_current_user()->ID;
    if($user_ID > 0){
        $email = get_userdata($user_ID)->user_email;    //如果用户已经登入则从用户信息中取得邮箱
    }else if(isset($_COOKIE['comment_author_email_'.COOKIEHASH])){
        $email = str_replace('%40', '@', $_COOKIE['comment_author_email_'.COOKIEHASH]);     //如果用户尚未登入但COOKIE内储存有邮箱信息
    }else{
        return $notice;     //如无法获取邮箱则返回提示信息
    }
    if(empty($email)){
        return $notice;     //如邮箱为空则返回提示信息
    }
    global $wpdb;
    $post_id = get_the_ID();    //获取文章的ID
    $query = "SELECT 'comment_ID' FROM {$wpdb->comments} WHERE 'comment_post_ID'={$post_id} and 'comment_approved'='1' and 'comment_author_email'='{$email}' LIMIT 1";
    if($wpdb->get_results($query)){
        return $content;        //查询到对应的评论即正常显示内容
    }else{
        return $notice;         //否则返回提示信息
    }
}
add_shortcode('reply', 'reply_to_read');

密码可见

// 使用[secret]短代码添加文章内容密码可见
function e_secret($atts, $content=null){
    extract(shortcode_atts(array('key'=>null), $atts));
    if(isset($_POST['e_secret_key']) && $_POST['e_secret_key']==$key){
        return '<div class="e-secret">'.$content.'</div>';
    } else {
        return '<form class="e-secret" style="color: red;" action="'.get_permalink().'" method="post" name="e-secret"><span>注意:本段内容须输入密码才能查看:</span><input type="password" class="e-secret-password" name="e_secret_key" maxlength="50"><input type="submit" value="确定"></form>';
    }
}
add_shortcode('secret','e_secret');

下拉短代码

function xz_alert_success($atts, $content = null) {
    return '<div class="alert alert-success">' . $content . '</div>';
}
add_shortcode('add_button_success', 'xz_alert_success');

function xz_alert_danger($atts, $content = null) {
    return '<div class="alert alert-danger">' . $content . '</div>';
}
add_shortcode('add_button_danger', 'xz_alert_danger');

function xz_alert_warning($atts, $content = null) {
    return '<div class="alert alert-warning">' . $content . '</div>';
}
add_shortcode('add_button_warning', 'xz_alert_warning');

function xz_alert_info($atts, $content = null) {
    return '<div class="alert alert-info">' . $content . '</div>';
}
add_shortcode('add_button_info', 'xz_alert_info');

function xz_select(){
echo '<select id="sc_select">
    <option value="您需要选择一个短代码">插入短代码</option>
    <option value="[add_button_success]填写内容[/add_button_success]">成功盒子</option>
    <option value="[add_button_danger]填写内容[/add_button_danger]">错误盒子</option>
    <option value="[add_button_warning]填写内容[/add_button_warning]">警告盒子</option>
    <option value="[add_button_info]填写内容[/add_button_info]">注意盒子</option>
    <option value="[reply]填写需隐藏的内容[/reply]">回复可见</option>
    <option value="[secret key=密码]需密码可见内容[/secret]">密码可见</option>
    <option value="<!--nextpage-->">文章分页</option>
</select>';
}

function xz_button_js() {
    echo '<script type="text/javascript">
    jQuery(document).ready(function(){
        jQuery("#sc_select").change(function() {
        send_to_editor(jQuery("#sc_select :selected").val());
        return false;
        });
    });
    </script>';
}

add_action('media_buttons_context', 'xz_select');
add_action('admin_head', 'xz_button_js');

将一下代码添加到一个js文件中,然后在后台中引入该js文件,例如我的是:shortcode.js

文本模式

QTags.addButton( 'h1', 'h1', '<h1>','</h1>' );								// h1
QTags.addButton( 'h2', 'h2', '<h2>','</h2>' );								// h2
QTags.addButton( 'h3', 'h3', '<h3>','</h3>' );								// h3
QTags.addButton( 'h4', 'h4', '<h4>','</h4>' );								// h4
QTags.addButton( 'h5', 'h5', '<h5>','</h5>' );								// h5
QTags.addButton( 'h6', 'h6', '<h6>','</h6>' );								// h6
QTags.addButton( 'paged', '分页', '\n<!--nextpage-->\n', "" );						// 添加文章分页
QTags.addButton( 'success', '成功盒子', '\n<div class="alert alert-success">\n\n</div>', "" ); 		// 成功信息盒子
QTags.addButton( 'info', '注意盒子', '\n<div class="alert alert-info">\n\n</div>', "" ); 		// 注意信息盒子
QTags.addButton( 'warning', '警告盒子', '\n<div class="alert alert-warning">\n\n</div>', "" ); 		// 警告信息盒子
QTags.addButton( 'danger', '错误盒子', '\n<div class="alert alert-danger">\n\n</div>', "" ); 		// 错误信息盒子
QTags.addButton( 'reply', '回复可见', '[reply]需回复可见内容[/reply]','' );				// 回复可见
QTags.addButton( 'secret', '密码可见', '[secret key="密码"]需密码可见内容[/secret]','' );		// 密码可见
// 后台编辑器添加短代码按钮
function my_quicktags() {
    wp_enqueue_script('my_quicktags',get_stylesheet_directory_uri().'/js/shortcode.js',array('quicktags'));
}
add_action('admin_print_scripts', 'my_quicktags');

注意:显示的效果请自行调节,至于如何使用,我想这里不用解释了吧,写文章的时候,按照自己的需求直接选就是了。

人已赞赏
0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧