3

I want to add simple html form without breaking the extisiting design or license of Classic Editor plugin which is GPLv2

I added simple code in classic-edior.php file (I'm not sure If it's the best way but I'm making a wp-plugin that must this simple form comes in Classic Edior creating post page so I can't use adding short code maybe?.

function myfunction()
{
    // after this next, plain HTML
?>
    <!-- HTML !-->

    <!-- HTML !-->

    <div style="      ">

        <button class="button-2" role="button" style=" display: flex; margin-left:25%;  justify-content: center; ">Button</button>

        <form action="/action_page.php" style="   margin: auto; width: 50%;border: 3px solid black; padding: 10px;">
            <label for="fname">Action:</label><br>
            <input type="text" id="fname" name="fname" value=" "><br>

            <input type="submit" value="Submit">
        </form>
    </div>


    <!-- more HTML code here -->
    <?php   // back to PHP
    // .. some more PHP stuff
    return;
}
myfunction();

a

11
  • you should use hooks and filters, never modify plugins or WP itself directly or your changes will be destroyed when you install updates. Can you add context for what you're doing? Why are you adding a form and what is the purpose of the form?
    – Tom J Nowell
    Jan 31 at 14:10
  • @TomJNowell The purpose of the form is implmeneting php function that php curl code to send API call to getting the data from the API then paste into a text area that will be under the form or paste it of the text area of creating post of Classic Editor itself
    – Steve
    Jan 31 at 14:17
  • Can I know what are the related hook and filters that related to this page and enables me to add code in this part with the design I want, thanks for answering.
    – Steve
    Jan 31 at 14:17
  • if you can describe in the same way you would describe to a non-technical user, then use technical terms. Otherwise we have to work backwards from your description to figure out what it actually does. Have you tried creating a metabox instead? This isn't something you can do with a form that actually submits, it has to be done in javascript and only javascript or your form will never work no matter where you place it on the page, or wether it's done using hooks filters or by modifying the plugin
    – Tom J Nowell
    Jan 31 at 14:20
  • also, you need to avoid making AJAX and form requests to standalone PHP files, your action_page.php is a massive security problem, and will cause issues, standalone PHP files are a development dead end and the opposite of what you need to do to achieve your goal here
    – Tom J Nowell
    Jan 31 at 14:21

1 Answer 1

4

You would need to do the following:

  • add a metabox with a text input and a button ( give them unique IDs )
  • enqueue a javascript file
  • in your javascript file, look for the input and button by the unique ID you gave them
    • when the button is pressed, look up the inputs value, and make your AJAX request, jQuery should be enough to do this if you're unsure how
    • if it's successful, replace the content in the TinyMCE field using the standard javascript APIs
  • you will also need to implement an AJAX handler, either as a REST API endpoint, or via the old admin-ajax.php API. This is what makes the request to your API ( also why use curl when WordPress has a more portable wrapper around it with wp_remote_get/wp_remote_post and the WP_HTTP API )

There are quite a few parts here, each of which are covered already on the official dev docs and in questions other people have already asked and answered on the site. If you are unsure how to do any of the steps, search this stack or the official WP documentation for that smaller step.

Important notes:

  • never make direct browser requests to PHP files in your plugin or theme
  • never modify plugins you didn't write yourself
  • you don't need to modify the classic editor plugin to add metaboxes, any plugin can do that
  • you don't need the classic editor plugin to make custom post types not use the block editor
  • you could replace all the blocks in the block editors content in a 1 liner, using the classic editor does not make this task easier ( and the block editor will show a custom metabox in the sidebar anyway )
8
  • Thanks, but I still have no idea which best way to add the meta box with the button so the flow OR specifically where should I enqueue the JS file to be displayed in /wp-admin/post-new.php (btw I assume I can't even change the file due to licnese but not the big deal currently). The user click the button >> Ajax request with the metabox data >> PHP API function called then the data will printed in creating post text are
    – Steve
    Jan 31 at 14:50
  • Thanks for letting me know It's first time to know WP provide POST/GET requests like wp_remote_post
    – Steve
    Jan 31 at 14:52
  • 1
    all 3 of those steps have easy solutions that are well documented and are each a good question on their own, and have already been asked on this stack.
    – Tom J Nowell
    Jan 31 at 16:55
  • 1
    e.g. for how to add a meta box, the function is literally called add_meta_box, and the examples on the official wp.org dev site answer another question you had by accident: developer.wordpress.org/reference/functions/add_meta_box
    – Tom J Nowell
    Jan 31 at 16:57
  • 1
    and the official documentation even has a page dedicated to metaboxes, including an AJAX section developer.wordpress.org/plugins/metadata/custom-meta-boxes
    – Tom J Nowell
    Jan 31 at 16:57

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.