What is the current best workaround in Webflow for adding a "select country" list into forms, without using ecommerce and considering limitations on maximum number of items and characters for custom code?

TL;DR
  • Use third-party form services like Typeform or Google Forms to embed a fully-featured dropdown into Webflow.
  • Create a CMS collection in Webflow for countries and use a collection list to display them in the form.
  • Host a JavaScript file with the country list externally and link it in Webflow to manage character limits.

Adding a "select country" list to a Webflow form can be challenging due to the limitations on maximum items and characters for custom code. Here’s a current workaround:

1. Use a Third-Party Form Integration

  • Consider third-party form services such as Typeform, JotForm, or Google Forms which allow for more complex form functionalities, including dropdown lists with numerous options.
  • Embed the form into your Webflow site using an embed block. For example, you can get the embed code from the third-party form provider and insert it into an HTML Embed element in Webflow.

2. Utilize Webflow's CMS Collections

  • If your project does not have a built-in ecommerce feature but uses CMS, create a CMS collection called "Countries."
  • Add each country as a separate item in the collection. Though it may be tedious, it's a one-time setup.
  • Use a collection list to dynamically display these items in your form.

3. Custom Code with External JavaScript

  • Host your country list externally in a JavaScript file at a CDN or GitHub repository.
  • Link the JavaScript file in your Webflow project settings or via an HTML Embed element. This keeps your Webflow project within character limits.

  

4. Use a Webflow Template or Component

  • Explore the Webflow community for pre-built templates or components that might already contain a country selection functionality you can integrate with your site.

Summary

To add a "select country" list in Webflow forms, consider using a third-party form integration or Webflow CMS collections to manage extended lists efficiently. Alternatively, external JavaScript can be leveraged within your Webflow project to maintain character limits compliance. These solutions provide flexibility without the need for Webflow's ecommerce features.

Rate this answer

Other Webflow Questions