Support

Account

Home Forums Backend Issues (wp-admin) create post within acf block

Helping

create post within acf block

  • is it possible to create a post from an ACF block, while in the wordpress dashboard, not the frontend?

    I have built a block using ACF, and I use it insert Video Cassette cards on a post. These cards come from a custom post type named ‘cassette_card’, and they’re very basic, having only a title, post content and featured image.

    Let’s say I’m inserting these blocks on a post and I can’t find the one I’m looking for, because it doesn’t exist. Is there I way I can create one ‘cassette_card’ post record from within the block, so I don’t have to save, quit the editor, go add the record I want to the custom post type, and then come back?

  • I don’t think it’s worth the effort but in theory it may be possible..

    1. Extend ACF Block with a JavaScript Interface
    You would need to enhance your ACF block with JavaScript (likely using React if you are using the latest WordPress editor, Gutenberg) to include a user interface element, such as a button, for adding new ‘cassette_card’ posts.

    2. Use WordPress REST API
    Leverage the WordPress REST API to create new posts. You’d need to ensure that your custom post type ‘cassette_card’ is exposed to the REST API with the appropriate arguments set in the register_post_type() function, like so:

    
    register_post_type('cassette_card', [
        'public' => true,
        'show_in_rest' => true,
        // Other necessary arguments...
    ]);
    

    3. JavaScript to Handle Post Creation
    Within your block’s JavaScript, add a function that handles the creation of new ‘cassette_card’ posts. This function would use the WordPress REST API to create a new post asynchronously. Here’s a basic example using fetch API:

    
    function createCassetteCard(title, content) {
        const postData = {
            title: title,
            content: content,
            status: 'publish',  // Or 'draft' depending on your needs
        };
    
        fetch('/wp-json/wp/v2/cassette_card', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
                'X-WP-Nonce': wpApiSettings.nonce  // nonce for verification
            },
            body: JSON.stringify(postData)
        })
        .then(response => response.json())
        .then(post => {
            console.log('New cassette card created:', post);
            // Handle the newly created post (e.g., adding to a select dropdown)
        })
        .catch(error => console.error('Error:', error));
    }
    

    4. Authentication and Security
    Ensure that proper authentication (like nonce checks) and capability checks are implemented to secure the post creation process. The X-WP-Nonce header in the fetch API call above is crucial for security.

    5. Update the Editor Interface
    After a post is successfully created, you’ll need to update the editor’s interface to include the new post. This might mean refreshing a dropdown or a list component that lets you pick ‘cassette_card’ posts.

    6. Enqueue Scripts and Localize
    Make sure your JavaScript is properly enqueued and localized in your plugin or theme’s functions file to ensure it has access to WordPress core functionality like wpApiSettings.nonce.

    None of this is tested and may not even work. Maybe this will help though.

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.