Thêm CSS Tùy Chỉnh Cho Bài Viết và Sản Phẩm Trong WordPress

function giza_add_custom_css_meta_box() {
    foreach (['post', 'product'] as $post_type) {
        add_meta_box(
            'giza_custom_css_box',
            '🎨 CSS Tùy chỉnh riêng',
            'giza_custom_css_box_callback',
            $post_type,
            'normal',
            'high'
        );
    }
}
add_action('add_meta_boxes', 'giza_add_custom_css_meta_box');

function giza_custom_css_box_callback($post) {
    $css_code = get_post_meta($post->ID, '_giza_custom_css', true);
    ?>
    <textarea name="giza_custom_css" style="width:100%;height:150px;" placeholder="CSS chỉ áp dụng cho bài viết/sản phẩm này..."><?php echo esc_textarea($css_code); ?></textarea>
    <?php
    wp_nonce_field('giza_save_custom_css', 'giza_custom_css_nonce');
}

function giza_save_custom_css($post_id) {
    if (!isset($_POST['giza_custom_css_nonce']) || !wp_verify_nonce($_POST['giza_custom_css_nonce'], 'giza_save_custom_css')) return;
    if (defined('DOING_AUTOSAVE') && DOING_AUTOSAVE) return;

    update_post_meta($post_id, '_giza_custom_css', wp_kses_post($_POST['giza_custom_css']));
}
add_action('save_post', 'giza_save_custom_css');

function giza_add_admin_menu() {
    add_menu_page(
        'CSS Tùy chỉnh',
        'CSS tuỳ chỉnh',
        'manage_options',
        'giza-css-settings',
        'giza_css_settings_page',
        'dashicons-art',
        81
    );
}
add_action('admin_menu', 'giza_add_admin_menu');

function giza_css_settings_page() {
    ?>
    <div class="wrap">
        <h1>🎨 Cài đặt CSS Tùy chỉnh</h1>
        <form method="post" action="options.php">
            <?php
            settings_fields('giza_css_options');
            do_settings_sections('giza-css-settings');
            submit_button();
            ?>
        </form>
    </div>
    <?php
}

function giza_register_settings() {
    register_setting('giza_css_options', 'giza_css_post');
    register_setting('giza_css_options', 'giza_css_product');

    add_settings_section('giza_css_section', 'CSS áp dụng toàn site', null, 'giza-css-settings');

    add_settings_field('giza_css_post', 'CSS cho tất cả bài viết (post)', 'giza_css_post_callback', 'giza-css-settings', 'giza_css_section');
    add_settings_field('giza_css_product', 'CSS cho tất cả sản phẩm (product)', 'giza_css_product_callback', 'giza-css-settings', 'giza_css_section');
}
add_action('admin_init', 'giza_register_settings');

function giza_css_post_callback() {
    $value = get_option('giza_css_post', '');
    echo '<textarea name="giza_css_post" style="width:100%;height:150px;" placeholder="CSS áp dụng cho toàn bộ bài viết...">' . esc_textarea($value) . '</textarea>';
}
function giza_css_product_callback() {
    $value = get_option('giza_css_product', '');
    echo '<textarea name="giza_css_product" style="width:100%;height:150px;" placeholder="CSS áp dụng cho toàn bộ sản phẩm...">' . esc_textarea($value) . '</textarea>';
}

function giza_output_custom_css() {
    if (is_singular('post') || is_singular('product')) {
        global $post;

        $post_css = get_post_meta($post->ID, '_giza_custom_css', true);
        if ($post_css) {
            echo "<style id='giza-post-css'>\n$post_css\n</style>";
        } else {
            if (is_singular('post')) {
                $global_css = get_option('giza_css_post', '');
            } elseif (is_singular('product')) {
                $global_css = get_option('giza_css_product', '');
            }
            if (!empty($global_css)) {
                echo "<style id='giza-global-css'>\n$global_css\n</style>";
            }
        }
    }
}
add_action('wp_head', 'giza_output_custom_css');