How can I change the classes to display the items of a form in Webflow and have the changes apply to the embedded typeform?

To change the classes and display of items in a form in Webflow and have these changes apply to an embedded Typeform, follow these steps:

1. Access the form settings: Open your Webflow project and navigate to the page where the form is embedded. Double-click on the form element to open the form settings.

2. Edit the form classes: In the form settings panel, you will find a field labeled "Class". Modify the class name to change the styles and layout of the form items. You can add multiple classes separated by a space for more specific targeting.

3. Apply changes using custom code: Typeform uses its own embedded code to display the form. To apply the changes made in Webflow to the embedded Typeform, add custom CSS code in the Webflow project.

   • Create a new stylesheet: In Webflow, go to the project settings and click on the "Custom Code" tab. In the "Head Code" section, create a new <style> tag.

   • Target the form classes: Inside the <style> tag, write CSS rules that target the same classes you modified in the Webflow form settings. You can use the same class name(s) or create additional ones for more specific styling.

   • Write the CSS rules: Use CSS properties like font-size, color, padding, and margin to adjust the appearance of the form items. If you want to change the layout, you can use properties like display, float, and position.

4. Save and publish the changes: Save the Webflow project and publish it. The changes made to the form classes in Webflow, as well as the custom CSS code targeting those classes, will now affect the embedded Typeform.

By following these steps, you can easily change the classes to display the items of a form in Webflow and have the changes apply to the embedded Typeform.

Additional Questions:

1. How can I customize the layout of a form in Webflow?
2. Are there any limitations to customizing an embedded Typeform in Webflow?
3. Can I add custom JavaScript code to manipulate the behavior of the embedded Typeform?