帖子和页面的颜色选择器

时间:2016-05-23 作者:Narek Zakarian

我想在管理菜单的wordpress帖子和页面中添加颜色选择器。我有颜色选择器的代码:

add_action( \'admin_enqueue_scripts\', \'add_color_picker\' );
function add_color_picker( $hook ) {

  if( is_admin() ) { 

      // Add the color picker css file       
      wp_enqueue_style( \'wp-color-picker\' ); 

      // Include our custom jQuery file with WordPress Color Picker dependency
      wp_enqueue_script( \'custom-script-handle\', plugins_url( \'custom-script.js\', __FILE__ ), array( \'wp-color-picker\' ), false, true ); 
   }
}
和js代码

(function( $ ) {


    // Add Color Picker to all inputs that have \'color-field\' class
    $(function() {
        $(\'.color-field\').wpColorPicker();
    });

})( jQuery );
我的问题是,如何使用此代码将带有颜色选择器的元盒仅添加到每个管理帖子或页面?

1 个回复
最合适的回答,由SO网友:Narek Zakarian 整理而成

我在上找到了解决方案Denis Žoljom\'s post

1) -我添加了metabox 像这样

add\\u操作(“add\\u meta\\u box”、“mytheme\\u add\\u meta\\u box”);

if ( ! function_exists( \'mytheme_add_meta_box\' ) ) {
    function mytheme_add_meta_box(){
        add_meta_box( \'header-page-metabox-options\', esc_html__(\'Header Color\', \'mytheme\' ), \'mytheme_header_meta_box\', \'page\', \'side\', \'low\');
    }
}
2)-将颜色选择器样式和脚本排队

add_action( \'admin_enqueue_scripts\', \'mytheme_backend_scripts\');

if ( ! function_exists( \'mytheme_backend_scripts\' ) ){
    function mytheme_backend_scripts( $hook ) {
        wp_enqueue_style( \'wp-color-picker\');
        wp_enqueue_script( \'wp-color-picker\');
    }
}
3)-为颜色选择器、一些描述文本和输入字段创建HTML容器

if ( ! function_exists( \'mytheme_header_meta_box\' ) ) {
    function mytheme_header_meta_box( $post ) {
        $custom = get_post_custom( $post->ID );
        $header_color = ( isset( $custom[\'header_color\'][0] ) ) ? $custom[\'header_color\'][0] : \'\';
        wp_nonce_field( \'mytheme_header_meta_box\', \'mytheme_header_meta_box_nonce\' );
        ?>
        <script>
        jQuery(document).ready(function($){
            $(\'.color_field\').each(function(){
                $(this).wpColorPicker();
                });
        });
        </script>
        <div class="pagebox">
            <p><?php esc_attr_e(\'Choosse a color for your post header.\', \'mytheme\' ); ?></p>
            <input class="color_field" type="hidden" name="header_color" value="<?php esc_attr_e( $header_color ); ?>"/>
        </div>
        <?php
    }
}
4)-保存元框

if ( ! function_exists( \'mytheme_save_header_meta_box\' ) ) {
    function mytheme_save_header_meta_box( $post_id ) {
        if ( defined( \'DOING_AUTOSAVE\' ) && DOING_AUTOSAVE ) {
            return;
        }
        if( !current_user_can( \'edit_pages\' ) ) {
            return;
        }
        if ( !isset( $_POST[\'header_color\'] ) || !wp_verify_nonce( $_POST[\'mytheme_header_meta_box_nonce\'], \'mytheme_header_meta_box\' ) ) {
            return;
        }
        $header_color = (isset($_POST[\'header_color\']) && $_POST[\'header_color\']!=\'\') ? $_POST[\'header_color\'] : \'\';
        update_post_meta($post_id, \'header_color\', $header_color);
    }
}

add_action( \'save_post\', \'mytheme_save_header_meta_box\' );
Yeeeeeh)))希望这能帮助其他人;)

相关推荐

在将代码添加到函数后无法登录WordPress wp-admin。php

我在函数末尾添加以下代码。php文件,用于根据自定义帖子的帖子标题填充分类法。问题是,当我添加代码时,尝试登录wp admin时会出现以下错误。非常感谢您能帮助我们弄清楚为什么会发生这种情况。Error:错误:由于意外输出,Cookie被阻止。有关帮助,请参阅此文档或尝试支持论坛。Code: <?php function update_custom_terms($post_id) { // only update terms if