WordPress Plugin Docs

OrderReport for WordPress

This is the full setup guide for the OrderReport WordPress plugin. It walks through the complete flow: what to prepare in OrderReport, how to install the plugin, where to paste the API key, how to enable WooCommerce and form integrations, how to verify delivery, and what to do if something is not working.

What you need before starting

  • An active project in OrderReport.
  • Your website domain added and enabled inside the project.
  • An active project API key.
  • Administrator access to WordPress.
  • WooCommerce if you want to sync store orders.

What the plugin does

One integration point

The plugin connects your WordPress site to OrderReport and can send WooCommerce orders, frontend events, and successful submissions from popular form plugins.

Important detail

Your API key stays server-side

The plugin sends orders and events through WordPress and does not expose the API key in the visitor browser. This is safer and easier to manage in production.

After setup

Verification is built in

The settings page includes a diagnostics block that shows the latest successful request and the latest error, so you can quickly understand whether data is reaching OrderReport.

1

Step

Prepare your OrderReport project

Before installing the plugin, prepare the project inside OrderReport itself. This is the most important part: without an active project, allowed domain, and API key, the WordPress plugin cannot send anything.

  1. 1

    Create or choose a project

    Open OrderReport and create a new project or choose an existing one that should receive orders and events from your WordPress site.

  2. 2

    Add the website domain

    Inside the project, add your website domain such as example.com or shop.example.com. The domain must be active, otherwise API requests will be rejected.

    Even if WordPress sends the request server-side, the API still validates Origin. The domain must be added.
  3. 3

    Create a project API key

    Create the API key and save it somewhere safe. You will paste this exact key into the WordPress plugin settings later.

  4. 4

    Create events if you plan to track forms

    If you want form submissions to appear in OrderReport, create the required events in the Events section and copy their keys. Those keys are used in Contact Form 7, WPForms, Elementor Forms, and the other supported integrations.

Screenshot #1

Project, domain, and API key inside OrderReport

Insert a screenshot here that shows the project, active domain, and the place where the user copies the API key.

2

Step

Install and activate the plugin in WordPress

Once the project is ready, install the plugin in WordPress. If you have a release archive, the installation is done through the standard upload-zip flow.

  1. 1

    Open the Plugins section

    In the WordPress admin panel go to “Plugins” -> “Add New”. If the plugin was provided as a zip archive, use the upload option.

  2. 2

    Upload the plugin archive

    Choose the OrderReport zip archive and wait for WordPress to finish the installation.

  3. 3

    Activate the plugin

    After installation click “Activate”. Once the plugin is active, a dedicated OrderReport settings page will appear in the admin panel.

Screenshot #2

Install the zip archive through WordPress

Insert a screenshot of “Plugins -> Add New -> Upload Plugin” so the user can follow the exact installation flow.

3

Step

Fill in the basic plugin settings

After activation, open the OrderReport page in WordPress admin and complete the base configuration. This is the minimum setup required before the plugin can work.

  1. 1

    Open the OrderReport page

    Use the OrderReport item in the left WordPress admin menu. The page contains configuration, detected integrations, and diagnostics.

  2. 2

    Paste the project API key

    Paste the API key you created in OrderReport into the API key field and save the settings.

  3. 3

    Review the diagnostics block

    Once the first requests are sent, this block will show the latest successful request or the latest error. If anything goes wrong, this section is usually the fastest place to diagnose it.

    The plugin uses a fixed API endpoint. You do not need to configure the base URL manually.
Screenshot #3

OrderReport settings page in WordPress

Insert a general screenshot of the settings page with the API key field, diagnostics block, and integrations section.

4

Step

Enable WooCommerce order sync

If your site uses WooCommerce, the plugin can automatically send orders to OrderReport. This is a server-side integration, so site visitors do not need to do anything extra.

  1. 1

    Enable WooCommerce order sync

    On the plugin settings page turn on WooCommerce order syncing.

  2. 2

    Choose tracked order statuses

    Select the order statuses that should trigger sending the order to OrderReport. Typical choices are Processing, Completed, or one of your custom statuses.

  3. 3

    Understand what is sent

    The plugin sends the order ID, total amount, currency, customer contact fields, product list, and additional order data in the data array.

  4. 4

    Create a test order

    Place a test order on the storefront or create one from WooCommerce admin and move it into one of the tracked statuses. The order should then appear in OrderReport.

Screenshot #4

WooCommerce sync configuration

Insert a screenshot that shows WooCommerce order sync enabled and the selected tracked statuses.

5

Step

Enable forms and event tracking

The plugin works with both custom frontend forms and popular WordPress form builders. Those integrations use OrderReport events.

  1. 1

    Create the event in OrderReport

    For each form workflow, create the related event in OrderReport and copy its key. Examples: lead_form_submitted or callback_request.

  2. 2

    Configure the specific form plugin

    Open the target form in Contact Form 7, WPForms, Elementor Forms, Fluent Forms, Forminator, or Gravity Forms. Find the OrderReport section, enable the integration, and paste the event key.

  3. 3

    Use data-orderreport-event for custom forms

    If the form is custom-built, add the data-orderreport-event attribute with the event key. The plugin frontend bridge will automatically capture successful form submissions and send them to OrderReport.

  4. 4

    Verify the event is active

    If the event is disabled in OrderReport, the form itself should still submit, but the event will not be processed. This case will be visible in diagnostics.

Screenshot #5

Event key inside a form integration

Insert a screenshot of one supported form builder where the OrderReport section and event key field are visible.

6

Step

Run an end-to-end verification

After configuration, run one short controlled test. It only takes a few minutes and helps confirm that the project is ready for production.

  1. 1

    Send a test order or form submission

    Perform one controlled action: place a WooCommerce order or submit a form that is already connected to an OrderReport event.

  2. 2

    Open the WordPress plugin page

    Confirm that the diagnostics block shows a recent successful request. If it shows an error, open the message and fix the underlying problem.

  3. 3

    Check the OrderReport interface

    Open the OrderReport application and verify that the new order or event appears in the expected section.

  4. 4

    Save screenshots for your team

    Once the test is successful, it is useful to save screenshots of the plugin settings page, a successful order, and a successful form integration. This makes future onboarding much faster.

Screenshot #6

Successful integration check

Insert a screenshot here that shows a successful order or event in OrderReport and/or a green success state in the WordPress plugin diagnostics block.

E

Event setup

Detailed form setup for each supported plugin

Choose the form plugin you are using. Each tab below shows the exact admin path, where to enable OrderReport, where to paste the event key, and what to check after saving.

CF7 Supported

Contact Form 7 -> OrderReport tab

In Contact Form 7 the plugin adds a dedicated OrderReport tab inside the form editor. You can enable the integration there and set the event key for that exact form.

  1. 1

    Open the form in Contact Form 7

    Go to Contact Form 7 in WordPress admin and edit the target form.

  2. 2

    Open the OrderReport tab

    Look for the OrderReport tab next to the standard form editor tabs.

  3. 3

    Enable the integration

    Turn on the integration so that successful form submits are sent to OrderReport.

  4. 4

    Paste the event key

    Enter the active event key from your OrderReport project and save the form.

Contact Form 7 sends the event only after a successful submission. If the event is disabled in OrderReport, the visitor-facing form should still submit normally.
CF7 Screenshot

OrderReport tab inside Contact Form 7

Insert a screenshot here that shows the OrderReport tab inside the CF7 form editor with the integration toggle and event key field.

What to verify after setup

  • The form was saved after enabling the integration.
  • The correct event key is configured.
  • A successful event request appears in plugin diagnostics after submit.
WPForms Supported

WPForms -> Settings -> OrderReport

For WPForms the plugin adds a dedicated OrderReport section inside form settings. Configuration is done per form.

  1. 1

    Open the form in WPForms Builder

    Go to WPForms and open the form in the visual builder.

  2. 2

    Open Settings

    In the left panel open the Settings section for the form.

  3. 3

    Select OrderReport

    Find the separate OrderReport settings section in the list.

  4. 4

    Enable integration and set event key

    Turn on the integration, paste the event key, and save the form.

If the OrderReport section does not appear immediately, refresh the builder page fully. WPForms sometimes needs a full reload before new sections appear.
WPForms Screenshot

OrderReport settings inside WPForms

Insert a screenshot of Settings -> OrderReport inside WPForms Builder.

What to verify after setup

  • The OrderReport section is visible in Settings.
  • Integration is enabled for the correct form.
  • A test submission appears in OrderReport as an event.
Elementor Supported

Elementor Form widget -> Actions After Submit

For Elementor Forms, OrderReport is added as a custom action in Actions After Submit. Once selected, a dedicated OrderReport settings section appears.

  1. 1

    Open the page in Elementor

    Edit the page that contains the Form widget in Elementor.

  2. 2

    Select the Form widget

    Open the settings panel for the target form widget.

  3. 3

    Add the OrderReport action

    In Actions After Submit, add OrderReport as one of the post-submit actions.

  4. 4

    Configure the event key

    After adding the action, fill in the event key inside the OrderReport section and save the page.

In Elementor, the OrderReport action itself is what triggers sending. If the action is not selected, the event will not be sent even if the form submits visually.
Elementor Screenshot

OrderReport action in Elementor Forms

Insert a screenshot of the Form widget that shows Actions After Submit and the OrderReport event key section.

What to verify after setup

  • OrderReport is listed in Actions After Submit.
  • The OrderReport section is visible in widget settings.
  • The event key is saved with the page.
Fluent Supported

Fluent Forms -> Settings & Integrations -> OrderReport

For Fluent Forms the plugin adds a dedicated OrderReport settings screen per form. That screen is used to enable integration and save the event key.

  1. 1

    Open the form in Fluent Forms

    Go to Fluent Forms and open the target form for editing.

  2. 2

    Open Settings & Integrations

    Inside form settings, go to Settings & Integrations.

  3. 3

    Choose OrderReport

    Find the OrderReport page inside the available form settings sections.

  4. 4

    Save the event key

    Enable the integration, paste the event key, and save the form settings.

If the event key is empty, Fluent Forms will not know which OrderReport event to send. This plugin expects the key to be configured on the form.
Fluent Forms Screenshot

OrderReport screen inside Fluent Forms

Insert a screenshot of the OrderReport page inside Settings & Integrations for a Fluent Forms form.

What to verify after setup

  • The OrderReport screen is available inside the form.
  • Settings were saved successfully.
  • A successful submission appears in diagnostics.
Forminator Supported

Forminator -> Integrations -> OrderReport

Forminator uses a native addon-style integration. First OrderReport appears in the global Forminator integrations list, then it is connected per form.

  1. 1

    Open Forminator Integrations

    Go to the global Forminator Integrations page and find OrderReport in the available services list.

  2. 2

    Check the main plugin configuration

    Forminator uses the API key and default event key from the main OrderReport plugin settings, so you do not need to enter them again here.

  3. 3

    Open the target form

    Go to the specific Forminator form and open its Integrations tab.

  4. 4

    Create an OrderReport connection

    Add an OrderReport connection for the form and set a form-specific event key if needed.

Forminator has two layers: the global addon and the per-form connection. If the addon is visible but the form has no connection, nothing will be sent.
Forminator Screenshot

OrderReport inside Forminator Integrations

Insert a screenshot of either the global integration page or the form connection settings that shows OrderReport and the event key field.

What to verify after setup

  • OrderReport is visible on the global Integrations page.
  • A connection exists on the specific form.
  • The connection uses either its own event key or the global default.
Gravity Supported

Gravity Forms -> Form Settings -> OrderReport

In Gravity Forms the plugin adds an OrderReport section directly to the native form settings screen. That is where you enable the integration and set the event key.

  1. 1

    Open the form in Gravity Forms

    Go to Gravity Forms and select the form you want to connect.

  2. 2

    Open Form Settings

    Navigate to Settings -> Form Settings.

  3. 3

    Find the OrderReport section

    Scroll to the OrderReport block inside the settings page.

  4. 4

    Enable and configure the event key

    Turn on the integration, paste the event key, and save the form settings.

If you leave the event key empty, it is a good idea to configure a global default event key in the main plugin settings so Gravity Forms has a fallback.
Gravity Forms Screenshot

OrderReport section in Gravity Forms

Insert a screenshot of Form Settings that shows the OrderReport block and the event key configuration.

What to verify after setup

  • The OrderReport section is visible in Form Settings.
  • Integration is enabled for the target form.
  • A submission appears in OrderReport after testing.
Custom Frontend bridge

Custom forms via data-orderreport-event

If you do not use a ready-made form plugin, you can connect a simple HTML form through the plugin frontend bridge by adding one attribute with the event key.

  1. 1

    Add data-orderreport-event to the form

    Place the data-orderreport-event="your_event_key" attribute on the form element.

  2. 2

    Make sure all fields have name attributes

    The plugin collects values with FormData, so input, select, and textarea fields need proper name attributes.

  3. 3

    Use a real submit button

    For automatic tracking use button type="submit" or input type="submit" so the browser emits a real submit event.

  4. 4

    Check browser logs if needed

    The frontend script logs its actions in DevTools with the [OrderReport] prefix, which helps verify whether payload collection and sending were triggered.

If you use input type="button" instead of a submit button, the native form submit event does not fire and automatic tracking will not run.
Custom Form Screenshot

HTML form with data-orderreport-event

Insert a screenshot of the HTML example or browser DevTools showing the form markup and a successful frontend log.

What to verify after setup

  • The form has data-orderreport-event.
  • Every useful field has a name attribute.
  • The form is submitted through a real submit action.