For AI agents: the complete documentation index is available at https://docs.clickmax.io/en/llms.txt, the full documentation bundle is available at https://docs.clickmax.io/en/llms-full.txt, and this page is available as Markdown at https://docs.clickmax.io/en/reference/browser-sdk/forms/unstyled.md.
  • English

      • Unstyled forms

      Use this page when you want to keep the SDK's behaviour but control the look of the form or modal entirely with your own CSS.

      An existing form without styles

      <form
  data-cx-ingest-form
  data-cx-nostyles
  data-cx-success-message="Sent successfully!">
  <label>
    Name
    <input data-cx-field="name" placeholder="Your name" />
  </label>

  <label>
    Email
    <input data-cx-field="email" placeholder="Your email" />
  </label>

  <label>
    Phone
    <input data-cx-field="telephone" placeholder="Your phone number" />
  </label>

  <input type="text" data-cx-field="website" hidden />

  <button type="submit">Send</button>
</form>

      A modal without styles

      <button data-cx-open="contato-nostyles" type="button">
  Open modal
</button>

<div
  data-cx-form-widget
  data-cx-widget-id="contato-nostyles"
  data-cx-mode="modal"
  data-cx-nostyles
  data-cx-title="Request a call"
  data-cx-description="This modal uses only the SDK's JS behaviour."
  data-cx-submit-label="Send"
  data-cx-show-lgpd="true"
  data-cx-lgpd-required="true"></div>

      What keeps working

      • form submission
      • validation
      • success and error messages
      • opening the modal
      • the flow's redirect
      • sending page data, such as UTMs

      What stops being the SDK's job

      • the form's appearance
      • the modal's appearance
      • the default visual theme
      • the default visual classes

      When to use it

      Use data-cx-nostyles when:

      • you already have a design system
      • the page has to follow a look of its own
      • you do not want to mix Clickmax styles with your local CSS