How to Build a WordPress AI Plugin (Step-by-Step Guide 2026)

This guide builds a complete WordPress plugin with AI content generation: settings page, OpenAI API wrapper, secure AJAX handlers, and a Gutenberg sidebar panel.

Plugin Structure

wp-ai-assistant/
├── wp-ai-assistant.php    # Headers + init
├── includes/class-api.php # OpenAI wrapper
├── includes/class-ajax.php# AJAX handlers
└── assets/editor.js       # Gutenberg sidebar

OpenAI Wrapper

class WP_AI_Assistant_API {
    public function generate(string $prompt): string {
        $client = OpenAI::client(get_option('wp_ai_assistant_api_key'));
        $response = $client->chat()->create([
            'model' => 'gpt-4o-mini',
            'messages' => [['role' => 'user', 'content' => $prompt]],
        ]);
        return $response->choices[0]->message->content;
    }
}

Secure AJAX Handler

add_action('wp_ajax_wp_ai_generate', function () {
    check_ajax_referer('wp_ai_assistant_nonce', 'nonce');
    if (!current_user_can('edit_posts')) wp_send_json_error('Forbidden', 403);
    $prompt = sanitize_textarea_field($_POST['prompt'] ?? '');
    try {
        $result = (new WP_AI_Assistant_API())->generate($prompt);
        wp_send_json_success(['content' => $result]);
    } catch (Exception $e) {
        wp_send_json_error($e->getMessage());
    }
});

Gutenberg Sidebar (editor.js)

const { registerPlugin } = wp.plugins;
registerPlugin('wp-ai-assistant', { render: AIAssistantPanel });
// Panel calls admin-ajax.php → inserts generated content as a paragraph block

Security Checklist

• check_ajax_referer() on every AJAX action
• current_user_can() before processing
• sanitize_* on all inputs, esc_* on all outputs
• Store API key in wp_options, never in code

Originally published at kalyna.pro