How to Create a Post on Multiple Websites via One Form

To install the add-on, move to the main site, then go to WordPress Dashboard > JetFormBuilder > Addons. Find the “Formless Actions Endpoints” add-on in the All Available Addons section. Press the “Install Addon“ button, and once installed, it will appear in the Your Installed Addons section. Next, click “Activate Addon” to prepare it for further work. 

Also, you can install and activate this add-on as any WordPress plugin. Read a detailed tutorial to go through the installation process.

After the add-on activation, the Endpoint tab will be added to the JetFormBuilder Dashboard.

This form is created on the first site (“Findero” in this tutorial).

Navigate to the WordPress Dashboard > JetFormBuilder > Add New tab to create a new form.

Insert form fields

Press the “Start from scratch” button in the Welcome block to develop your form. Then, press the “replace” link.

Type the form’s name (“Rest API form (main)” for this case) instead of the Add title placeholder.

In the next stage, add the needed fields.

In this case, we did the following to the form fields:

• Deleted the default Hidden Field;
• Customized the default Text Field: inserted its FIELD LABEL (“Name”), and the FORM FIELD NAME was generated automatically based on the completed FIELD LABEL; then we made this field required for completion by pressing the “asterisk” button in the block’s inline toolbar;
• Added another Text Field (typed the “Phone” FIELD LABEL and selected the “Tel“ FIELD TYPE) for inserting the contact phone;
• Inserted a Textarea Field for a message.

Finally, insert the Action Button.

This form creation tutorial explains how to build forms in more detail.

Set the Post-Submit Actions

In this case, for the form on the main site, we kept the default “Save Form Record” and set the “Insert/Update Post” Post Submit Actions.

You can also watch the Post Submit Actions Overview video for more details about managing the Post Submit Actions.

To add the needed Post Submit Action, press the “+ New Action” button under the default “Save Form Record” and select the “Insert/Update Post” option in the pop-up. Then, in the newly-appeared Edit Insert/Update Post pop-up, set the POST TYPE and POST STATUS, and select the options in the FIELD MAP block. 

In this case, we selected the “Info1” CPT as the POST TYPE and picked the “Published” POST STATUS. Then, we set values that would be entered into the form’s “Name” field as the CPT “Post Title” and assigned the corresponding CPT “Post Meta” fields to the form’s fields.

Finally, press the “Update” button and save the form by pressing the “Publish/Save” button.

Navigate to the WordPress Dashboard > JetFormBuilder > Endpoints tab to set the needed route options. First, press the “Add new route” button to create a new one.

Select the required form from the RELATED FORM drop-down list (here, we selected the previously developed “Rest API form (main)”). Then, choose the “Rest API Endpoint” ACTION TYPE option.

After that, the ROUTE NAMESPACE and ROUTE text fields were activated. Type the names of the ROUTE NAMESPACE and ROUTE 一 the “item” and “new-post” texts in this case, respectively. In the next step, enable the Log Request toggle to allow logging requests to collect all attempts to submit the form via this route. 

Finally, scroll the tab down and press the “Update” button.

Read about managing the endpoint settings in the How to Set Up Formless Actions Endpoints tutorial.

Navigate to the auxiliary site (the “BaliRento” in this case). Move to the WordPress Dashboard > JetEngine > JetEngine dashboard tab. Then, enable the Rest API Listings toggle of the opened Modules > Default Modules section. Scroll this section down and press the “Save” button under the Default Modules section.

Navigate to the WordPress Dashboard > JetFormBuilder > Add New tab to create a new form and add the needed fields that will include data to be shown on both sites.

Here, we built the form from scratch: deleted the Welcome block, typed the “Rest API” text as the form’s name instead of the Add title placeholder, and inserted the Text Fields and Textarea Fields.

After that, navigate to the Post Submit Actions section of the JetForm settings, press the “+ New Action” button, then find the “Insert/Update Post” action in the Add new action pop-up and click on it.

In the newly-appeared Edit Insert/Update Post pop-up, select the needed POST TYPE (the “Info” CPT option, in this case), choose the needed POST STATUS (“Published”, here), then fill in the FIELDS MAP fields. As previously, we assigned the corresponding CPT “Post Meta” fields to the form’s fields.

Once completed, press the “Update” button on the pop-up.

In the next step, press the “+ New Action” button and find the “REST API Request” action in the search bar of the Add new action pop-up.

After that, press the “REST API Request” button.

Return to the main site (“Findero” in this tutorial) to the WordPress Dashboard > JetFormBuilder > Endpoints tab to the enlisted endpoint and unroll the created endpoint (hover over it and press the “pencil” icon). 

In the JetFormBuilder Actions Endpoint page, navigate to the Data Fields section and open the Sample request tab. Here, copy the URL from the request data (the “https://*******************.com/wp-json/item/new-post” text in this case).

After that, return to the auxiliary site and continue to develop the form. Here, paste the copied URL into the REST API URL field of the Edit REST API Request pop-up.

Then, return to the main site (“Findero” in this tutorial) to the JetFormBuilder Actions Endpoint page, navigate to the Data Fields section and Sample request tab. Here, copy the data referring to the form field (in our case, the following text):

{

    "name1": null,

    "phone1": null,

    "message": null

}

After that, move back to the form on the auxiliary site and paste the copied values into the CUSTOM BODY field of the Edit REST API Request pop-up. Here, you need to define the connections between the fields of forms developed on the main and auxiliary sites in the following format:

“main site form field” : “auxiliary site form field”

Press the “wrench” icon near the CUSTOM BODY field and select the name of the needed form field.

In this tutorial, the text in the CUSTOM BODY field looks as follows:

{

    "name1": "%name%",

    "phone1": "%phone%",

    "message1": "%message%"

}

Once completed, press the “Update” button to close the Edit REST API Request pop-up.

Finally, save the form.

Move to the top of the form and press the “Use the form” button. After pressing it, the Use the form pop-up will appear. Set the needed widget/block/element and a page to add the form.

Then, the page with the added form will be opened in a new window. In this case, the JetForm widget/block/element will be added to the end of the page. Here, you can customize this page according to your preferences.

Navigate to the front and fill out the form.

After completing the form, the “Form successfully submitted.” text will be displayed under the form.

Read the Displaying a JetFormBuilder Form in Any Page Builder tutorial for more details.

To check if the posts were added both to the main and auxiliary sites, navigate to the WordPress Dashboard and unroll the CPT posts tab on the auxiliary site.

Also, return to the main site. Unroll the corresponding CPT posts tab.

That’s it. Now you know how to use the Formless Actions Endpoints addon for the JetFormBuilder plugin to create an endpoint on the main site that allows users to add the WordPress default posts or/and CPT posts simultaneously both on the main and auxiliary sites via the same form.