XenForo - "input button" changing style.


Active member
Have not found any topic with the description of "what is the best way to do it using xenforo".
Will be glad to hear anything about it :coffee:

New skin for the buttons:


Default buttons:



  • stop.png
    143.4 KB · Views: 4
  • stop.png
    143.4 KB · Views: 4
You want to change the checkboxes to radio bubbles? Radio bubbles aren't ideal for on/off options like that. It would normally require two radio bubbles for on/off, as opposed to one checkbox.
Well, yes i prefer checkboxes aswell, radio buttons skin is not necessary. But I'm not quite familar with it. Want an advice where 2 start with changing the default skin of the checkboxes and a simple example of how it should look in xenforo css code.
First find the root template of the page:


That template contains all of the HTML.

There are examples of radio buttons in this template:

Admin CP -> Appearance -> Templates -> account_personal_details

Rich (BB code):
		<dl class="ctrlUnit">
			<dt><label>{xen:phrase gender}:</label></dt>
					<li><label for="ctrl_gender_male"><input type="radio" name="gender" value="male" id="ctrl_gender_male" {xen:checked "{$visitor.gender} == 'male'"} /> {xen:phrase male}</label></li>
					<li><label for="ctrl_gender_female"><input type="radio" name="gender" value="female" id="ctrl_gender_female" {xen:checked "{$visitor.gender} == 'female'"}  /> {xen:phrase female}</label></li>
					<li><label for="ctrl_gender_"><input type="radio" name="gender" value="" id="ctrl_gender_" {xen:checked "{$visitor.gender} == ''"}  /> ({xen:phrase unspecified})</label></li>
Top Bottom