Find The Right Submission Pattern For Your Stack

Use the hosted widget when you want a copy-paste form without writing JavaScript. This is the best answer for static sites and page builders.

• Drop a div and script tag into the page.
• Set your API base URL and API key in script data attributes.
• Use the Widget Configurator to preview colors and copy the embed snippet.

Build your own markup and submit it with fetch. Use this path when you want full control over layout, copy, and host-site styling.

• Fetch active case types from the public case-type endpoint.
• POST JSON to /api/leads with the required fields.
• Use the shared token file to keep button, border, and text styling consistent.

Use a reusable component with useEffect and useState when the form belongs inside an existing SPA or marketing site built in React.

• Load case types on mount.
• Bind form state to controlled inputs.
• Submit and show inline success or error feedback.

Ideal for Vue and Nuxt frontends that want a lightweight component with the same token-ready visual system as the hosted widget.

• Fetch case types in onMounted.
• Use ref-driven form state for the required fields.
• Style the wrapper with the shared token names or your own local overrides.

A strong fit for internal marketing apps and larger Angular sites that already rely on reactive forms and typed services.

• Load case types through HttpClient.
• Use a reactive form with validation on all required fields.
• Keep the component styles token-based so it can blend into the host theme.

Great for fast, minimal form experiences where you want simple reactivity and a very small integration surface.

• Load case types in onMount.
• Track form and result state with simple local variables.
• Override tokens in a local wrapper to align the card and inputs with your theme.

Use this when a CRM, webhook engine, or lead marketplace can post directly to the partner API. This path is built for JSON, XML, and classic form-style payloads.

• Call GET https://partners.dipetrillolaw.com/api/leads/casetypes first so you have a valid caseTypeId.
• POST to https://partners.dipetrillolaw.com/api/leads with X-Api-Key and choose JSON, XML, or form data.
• Store the returned leadId and status so your system can audit or reconcile submissions.

Use a single PHP file or fold the handler into an existing site. The browser posts only to your PHP page, and PHP forwards the inquiry to the partner API.

• Render the form in PHP or plain HTML.
• Post to your own PHP handler.
• Use cURL server-side to forward the payload with the private API key.

Use a simple Express route when you already own a Node backend or want a middle layer between the browser form and the partner API.

• Accept a local POST from your frontend.
• Validate and normalize the body inside Express.
• Forward the request with the private key from an environment variable.

Use the same server-side pattern across ASP.NET Core MVC, Razor Pages, Blazor, minimal APIs, or other .NET web apps. The host application validates locally and forwards the payload with a private key.

• Load case types from the public endpoint or cache them server-side.
• Collect the lead in your controller, page handler, component, or endpoint.
• Forward the request with HttpClient from the server tier so the key stays private.

Use the installable plugin when you want a normal WordPress admin flow with no PHP editing. Upload it, configure the settings page, and paste the shortcode into any page or block.

• Download the plugin zip and upload it under Plugins > Add New > Upload Plugin.
• Activate it, then open Settings > DiPetrillo Affiliate to enter the Affiliate Site URL, for example https://example.com, and your API key.
• Paste [dp_affiliate_lead_form] into the page, post, or block where you want the form to appear.