How to Embed a Form on Your GoDaddy Website

Add a contact form, order form, or service request to your GoDaddy site in minutes—no coding required. With Cognito Forms, your form instantly blends in no matter how your site is built.

GoDaddy Website Builder can help you launch a professional site quickly, but its native form tools are limited to basic contact fields. Whether you’re collecting service requests, onboarding new clients, or routing inquiries to the right team member, Cognito Forms fills that gap for you. When you embed a form you created in Cognito Forms, you have full control over what you collect, how it looks, and what happens after someone submits—without requiring clients to leave your site.

Here’s how Cognito Forms can improve your GoDaddy website:

• Forms that actually work for your business. Cognito Forms handles the complexity that GoDaddy’s built-in forms can’t touch. Set up multi-step approvals and advanced conditional logic to show or hide fields based on what a client selects. You can also easily collect files and payments, create automatic calculations, and collect e-signatures right inside your form.
• Submissions that go somewhere useful. Instead of a notification buried in a spam folder, every submission feeds a structured workflow. You can trigger email notifications, populate a client portal, connect to the tools you already use, and keep a searchable record of every response, all managed from one place.
• A form that looks like it belongs on your site. Cognito Forms can visually match any GoDaddy site. Enable Chameleon Mode for automatic style matching, or use custom CSS for precise control over specific elements. Any changes you make in Cognito Forms appear on your live GoDaddy site automatically.

---

How to Embed a Form on Your GoDaddy Website: Step-by-Step

Follow these three steps to get your form live on any GoDaddy page. You’ll start by configuring how the form looks, choose your embed code, and then paste it directly into an HTML section within GoDaddy’s Website Builder.

Step 1: Configure how your form appears on your site

Before grabbing your form’s embed code, take a moment to customize how your embedded form looks. To do this, hover over the form name in the Cognito Forms sidebar and select Publish Form.

From the Form Styles tab on the Publish page, here are a few options you have to get your form looking its best before adding it to your site:

• Customize your form’s style: Change button colors, choose a new font style, add your logo, and more.
• Field styles: This option controls the visual style of your form’s fields. You have several options that tend to work well for most people, but you can also select Chameleon to automatically match your site’s fonts and colors. See below for more information on Chameleon mode.
• Hide form header when embedded: Check this box to hide the logo, title, and description when your form is embedded. These elements will still appear when someone visits the form via a direct URL.
• Adjust embedded form margins: Set the margin around your embedded form anywhere between 0 and 80 pixels to control spacing within your page layout.

Chameleon field styles

For the most seamless visual integration, enable Chameleon Mode. It automatically adopts the surrounding page’s fonts, colors, and styles, with no CSS knowledge required.

To enable Chameleon mode:

1. From the form’s Publish page, select the Form Styles tab.
2. Expand the Field Style dropdown and select Chameleon.
3. Click Save and your form is now ready to inherit your site’s styling automatically.

Note: Chameleon field styles work only with Seamless embedding. If you plan to use an Iframe embed, see the Custom CSS section below.

---

Step 2: Copy your form’s embed code

Once your form is styled and ready, it’s time to copy the code you’ll paste into GoDaddy’s Website Builder. Here’s how:

1. From the form’s Publish page, click the Publish Code tab.
2. Under Embed in your site, select the type of embed code you want to use.
3. Click inside the code’s text box to copy it to your clipboard. This is what you’ll paste into GoDaddy.

Seamless vs. Iframe embedding: Which should you use?

The main difference between the two types of embed codes is how the form interacts with your site’s existing styles. In short, we recommend starting with the Seamless embed option for most GoDaddy websites. If you run into styling conflicts or slow loading times, switch to the Iframe embed option.

	Seamless Embedding	Iframe Embedding
Setup	Integrates the form directly into the page, making it look and feel like a natural part of your site	Loads your form inside a contained frame, keeping it visually separate from the surrounding page
Best Used When	Recommended for most sites	Seamless embed causes styling conflicts or display issues
Styling	Inherits your site’s styles naturally (especially with Chameleon Mode)	Isolated from page styles; requires CSS to match your site’s styles

---

Step 3: Add the embed code to Your GoDaddy page

No matter which embed code you choose, you’ll paste it directly into a GoDaddy HTML section:

1. Log in to GoDaddy and open the editor for your site.
2. Navigate to the page where you’d like to add your form.
3. Click + to add a new section, then choose Files & Web > HTML from the Add Section dialog.
4. Paste your embed code into the Custom Code field in the HTML section’s settings.
5. Your changes are saved in GoDaddy automatically. Use Preview to view the form on your site, and Publish your changes when you’re ready to go live.

---

Customizing Your Form’s CSS

If the Chameleon field style doesn’t fully close the gap between your form and site’s visual design, Custom CSS lets you fine-tune it.

Custom CSS gives you precise control of specific elements like button colors, input borders, error messages, and fonts using CSS variables or traditional selectors. On GoDaddy, you add custom CSS directly into the Custom Code field of the same HTML section your form is embedded on.

To add custom CSS to your embedded form in your GoDaddy website:

1. Select the HTML Section that you added your form’s code in.
2. Paste or write your CSS after the embed code you pasted in the Custom Code field. Be sure to keep everything inline with the embed code. Both Seamless and Iframe embed codes end in </script>, and you will add your CSS rules directly after this.
3. Remember that your changes are saved in GoDaddy automatically.
4. We have found the most success with CSS on GoDaddy sites with these tips:
   • Begin and end your CSS with <script> tags, added directly after your embed code.
   • Add an id tag to the Iframe embed code, and reference this in your CSS <script> section. This follows our recommended CSS styling tips.
   • You must keep everything (embed code + CSS) on one line. There can be no line breaks.

As you adjust your custom CSS, you can view real-time style changes with the Preview option. When you’re ready to make your changes public, simply Publish your site.

---

After Embedding: Get More Out of Your Embedded Form

Once your form is embedded onto your GoDaddy site, take advantage of features offered by Cognito Forms that turn submissions into a fully automated business process:

• Automate your follow-up with Workflow.
  Set up multi-step Workflows to assign tasks to the right team member, trigger approval processes, or move submissions through defined steps automatically. This works well for requests or inquiries that require internal review before a response goes out.
• Send confirmation and notification emails automatically.
  Configure email notifications to be sent immediately after a form is submitted, such as confirmation emails to the customer and internal alerts to your team. You can personalize the content with information from the customer’s submission and set up conditional emails that send different messages based on what someone selected. No manual effort on your end, and your customers get immediate reassurance.
• Generate documents from form submissions.
  Use Cognito Forms’ document generation feature to automatically produce PDFs or Word documents from submitted data. This is useful for sending order summaries, quote confirmations, service agreements, or invoices directly from your form without preparing documents manually.
• Collect e-signatures directly in your form.
  Add a Signature field to collect legally binding electronic signatures for contracts, service agreements, or client onboarding documents, without sending files back and forth.

Add a Form to Your GoDaddy Website Today

With Cognito Forms, it’s easy to embed a custom form on your GoDaddy site that actually helps your business run smoother, rather than causing chaos.

Whether you’re collecting service inquiries, processing payments, or building out a client intake workflow, your form is live as soon as you paste the embed code. From there, layer on workflow automation, email notifications, and payment collection to build a process that works for your business.

---

FAQ

How can I collect files on my GoDaddy forms?

While GoDaddy’s native forms don’t allow for file uploads, you can collect files when using Cognito Forms. Simply add a File upload field to your form and start collecting the file(s) you need (like PDFs, images, videos, and other documents). From there, you can adjust what file types and sizes you want to allow, and even restrict the number of files allowed. Learn more about File Uploads in our Help Topic.

Do I need a specific GoDaddy plan to embed a Cognito Form?

As of May 2026, no specific GoDaddy plan is required. Any GoDaddy Website Builder plan that gives you access to the page editor and allows HTML sections supports embedding a Cognito Form. If you can add an HTML section to your page, you can embed the form. We recommend checking this information is still accurate on GoDaddy’s documentation for plan limits.

Can I embed more than one form on the same GoDaddy page?

Yes. Repeat the embed steps for each additional form by inserting a new HTML section on the same page and pasting a different form’s embed code. We recommend using the same embed code type if you’re embedding multiple forms on the same page. (e.g. all forms embedded with a Seamless code or all Iframe).

If you need to style multiple forms differently when using the Seamless embed, wrap each embed code in a div with a unique ID and target them individually with CSS. Learn more about adding custom CSS to your form in our Advanced CSS Guide.