Form

Have a “radio button” selected by default in Webflow

tools :
Illustration croce

Table of contents

Introduction

Not possible natively in Webflow, I show you in this tutorial how to have a “radio button” selected by default in your form when the page loads.

Super useful for improving the user experience in some cases, especially for satisfaction forms for example.

1. Add your radio buttons

Radio button Webflow

2. Add value to your radio buttons

Radio Button Value Webflow

3. Add this script <head>to your page

Remember to replace the ID value with the value of the radio button that you want to select by default in the code below.

 <script>
window.onload = function() {
    var radioButton = document.getElementById("incroyable");
    if (radioButton) {
        radioButton.checked = true;
    }
};
</script>

4. Publish and test the result

Photo de l'auteur
Sandro D.
Published on
30/5/2024
Updated on
30/5/2024
Growth Marketer, Webflow expert and a jack of all trades. I take care of commercial operations, ensure the smooth running of projects and take care of issues related to marketing (SEO, Tracking, Copywriting, etc.)
Home
>
Gemeos Academy
>
Have a “radio button” selected by default in Webflow
These tutorials might interest you

Our tutorials in the same category

See all our tutorials
Illustration traits
We use the best tools

Your site is developed using the best tools and best practices

Gemeos doesn't just offer you a website, but expertise in the best tools to guarantee you the best possible return on your investment.

Figma

To design your custom website and optimize its conversion rate

Webflow

For pixel-perfect, optimized integration of your website

Client-first

Organizing your project to perfection

Wized

To add advanced features to your project

Make

Automate your workflows and save maximum time