How to create inline radio buttons

Bootstrap Studio Help
1

I like to create inline radio buttons lie this

<label class="radio-inline">
  <input type="radio" name="inlineRadioOptions" id="inlineRadio1" value="option1"> 1
</label>
<label class="radio-inline">
  <input type="radio" name="inlineRadioOptions" id="inlineRadio2" value="option2"> 2
</label>
<label class="radio-inline">
  <input type="radio" name="inlineRadioOptions" id="inlineRadio3" value="option3"> 3
</label>

How do i do that with Bootstrap Studio?

2

Well there is a couple ways you can do this in the app.

One way is to use the pre-built "Radio with Label" component. You can search for it in the COMPONENTS pane on the top left of the app in the STUDIO tab. Just type in the word Radio, then drag/drop the component named "Radio with Label" where you want in your project. This is by default stacked to set it inline, on the left side of the app under the OVERVIEW pane find "Radio with Label" select it then on the top right of the app in the OPTIONS pane tick the box for Inline. To add more all you need to do is duplicate it by selecting the duplicate button in the OPTIONS pane, it looks like the double page icon that's next to the pencil icon. To add your classes, make sure you have "Radio with Label" selected in the OVERVIEW pane then on the bottom middle click on the HTML pane to expose the ATTRIBUTES pane click that to expose it. Then you can add/edit your Classes or IDs.

Another way is to search in the STUDIO tab of the COMPONENTS pane for "Label" then drag/drop the one named "Field Label" where you want in your project. Then search for "Radio" and drag the one named "Radio" to your OVERVIEW pane and drop it on to the Label you just added. Add your Classes/ID like above and then duplicate it like above to add the other label/radios and update the IDs if you need.

Saj