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

Source: Dev.to

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. 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

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; } }

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()); } });

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

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