404 error in Wordpress plugin development

got a 404 error with the folowing code. Advise? or if you have ready code for custom asstant or GPT, please also share. I am new to this. Thanks.

Plugin Name: Custom Assistant Plugin
Description: A plugin to integrate the customized assistant with your WordPress site.
Version: 1.2
Author: Your Name

function custom_assistant_shortcode() {
    <div id="custom-assistant-container">
        <div id="assistant-chat-box">
            <div id="assistant-messages"></div>
        <input type="text" id="assistant-input" placeholder="Type your message..." />
        <button id="assistant-send">Send</button>
        (function() {
            var apiKey = 'sk-proj-';
            var assistantId = 'asst_UORg3Wtcx2eyA42DYvzbiBt6';
            var projectId = 'proj_07QmEs2VCe0Y0cNIRf7tfjmL';
            var organizationId = 'org-gDDGigMURpY91HrlbkI3OTOs';

            var assistantContainer = document.getElementById('custom-assistant-container');
            var messagesContainer = document.getElementById('assistant-messages');
            var inputField = document.getElementById('assistant-input');
            var sendButton = document.getElementById('assistant-send');

            // Function to initialize the assistant
            function initializeAssistant() {
                messagesContainer.innerHTML = '<p>Custom Assistant is ready!</p>';

            // Function to send user message and receive assistant response
            function sendMessage() {
                var userMessage = inputField.value;
                if (userMessage.trim() === '') return;

                // Display user message
                var userMessageElem = document.createElement('div');
                userMessageElem.className = 'user-message';
                userMessageElem.textContent = userMessage;

                // Clear the input field
                inputField.value = '';

                // Send the user message to the assistant
                fetch('https://api.openai.com/v1/assistants/' + assistantId + '/interactions', {
                    method: 'POST',
                    headers: {
                        'Content-Type': 'application/json',
                        'Authorization': 'Bearer ' + apiKey,
                        'OpenAI-Beta': 'assistants=v2'
                    body: JSON.stringify({
                        message: userMessage,
                        project_id: projectId,
                        organization_id: organizationId
                .then(response => {
                    console.log('Response status:', response.status);
                    if (!response.ok) {
                        return response.json().then(err => { throw new Error(err.message || 'Unknown error'); });
                    return response.json();
                .then(data => {
                    console.log('Response data:', data);
                    // Display assistant response
                    var assistantMessageElem = document.createElement('div');
                    assistantMessageElem.className = 'assistant-message';
                    assistantMessageElem.textContent = data.response; // Adjust based on your API response format
                    messagesContainer.scrollTop = messagesContainer.scrollHeight;
                .catch(error => {
                    console.error('Error communicating with assistant:', error);
                    var errorMessageElem = document.createElement('div');
                    errorMessageElem.className = 'error-message';
                    errorMessageElem.textContent = 'Error communicating with assistant. Please try again later. (' + error.message + ')';
                    messagesContainer.scrollTop = messagesContainer.scrollHeight;

            // Initialize the assistant when the page loads
            document.addEventListener('DOMContentLoaded', initializeAssistant);

            // Send message on button click
            sendButton.addEventListener('click', sendMessage);

            // Send message on Enter key press
            inputField.addEventListener('keypress', function(event) {
                if (event.key === 'Enter') {
        #custom-assistant-container {
            border: 1px solid #ccc;
            padding: 10px;
            max-width: 500px;
            margin: 0 auto;
        #assistant-chat-box {
            border: 1px solid #ddd;
            padding: 10px;
            height: 300px;
            overflow-y: auto;
            margin-bottom: 10px;
        #assistant-messages {
            display: flex;
            flex-direction: column;
        .user-message {
            align-self: flex-end;
            background-color: #e1ffc7;
            padding: 5px;
            border-radius: 5px;
            margin: 5px 0;
        .assistant-message {
            align-self: flex-start;
            background-color: #f1f1f1;
            padding: 5px;
            border-radius: 5px;
            margin: 5px 0;
        .error-message {
            color: red;
            align-self: center;
            padding: 5px;
            margin: 5px 0;
        #assistant-input {
            width: calc(100% - 60px);
            padding: 5px;
            margin-right: 10px;
        #assistant-send {
            padding: 5px 10px;
    return ob_get_clean();

add_shortcode('custom_assistant', 'custom_assistant_shortcode');

There is no URL path “interactions”, and you don’t send messages to an assistant ID, along with tons of other mistakes an AI would make.

You need to read the API reference and write real code.

1 Like

sorry, the code was generated by chatGPT. I don’t know enough about api.

You are a bit unlucky. It seems like ChatGPT doesn’t know enough about OpenAI APIs yet to be able to help. Keep asking in the forum though, it’s the best way to solve your questions about them.