Using Helpful Widget in a Headless WordPress setup

  • Resolved jessicatf

    (@jessicatf)


    2 years, 10 months ago

    Hi there, thanks for the work put into the plugin!

    I was wondering if the below is possible, please:
    I have a client who uses a headless WordPress installation to manage the blog posts on their React App. They fetch the post content via WordPress’ API, with some new fields added to the JSON payload (Metadata, linked YouTube videos, etc – all managed within the WP CMS).

    We need users of the React app to mark an article as helpful/not helpful and then have that data reflect back to the CMS.

    We’ve been able to include the markup, styling and the JS (via includes) of the Helpful widget in our post content that gets pulled through to the React app (it gets compiled to an asset.js file that is then loaded by the React app), and we’ve been able to pull the pro/contra counts in the JSON output.

    However, upon clicking on the pro/contra buttons on the react app, the widget doesn’t do anything – the “thank you” text doesn’t display and the post’s pro/contra counts don’t get updated on the WordPress CMS.

    Do you have any insight for how we may incorporate this plugin on a React app via a WordPress headless install?

    Thanks!

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author Pixelbart

    (@pixelbart)

    Hi @jessicatf

    Unfortunately Helpful does not support this. But you can build it yourself, because Helpful works with the REST-Api of WordPress.

    Here are two examples how you can save a vote. Feedback form unfortunately doesn’t work yet, but at least a vote can be realized with it:

    // save pro
wp_remote_post('/wp-json/helpful/pro/', [
    'body' => [
        'user_id' => 'unique_string_for_the_user',
        'post_id' => 12345,
    ],
]);

// save contra
wp_remote_post('/wp-json/helpful/contra/', [
    'body' => [
        'user_id' => 'unique_string_for_the_user',
        'post_id' => 12345,
    ],
]);

    This is now a WordPress solution. You can also do it easily with cURL or Ajax. Here is an Ajax example:

    // save pro
$.ajax({
    url: "/wp-json/helpful/pro/",
    data: {
        "user_id" : "unique_string_for_the_user",
        "post_id" : 12345,
    },
    method: "POST",
});

// save contra
$.ajax({
    url: "/wp-json/helpful/contra/",
    data: {
        "user_id" : "unique_string_for_the_user",
        "post_id" : 12345,
    },
    method: "POST",
});

    Maybe this will help you, or your programmer, to make Helpful usable for you.

    Stay healthy and thank you for your time!

    Greetings Kevin

    Thread Starter jessicatf

    (@jessicatf)

    Thanks for the quick response, Kevin! I’ll pass this on to the team – this should work nicely. I’ll revert here to let you know how it turns out.

    Thanks again!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Using Helpful Widget in a Headless WordPress setup’ is closed to new replies.