• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

XenForo - "input button" changing style.

Cryptaline

Active member
#1
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:

gif.gif

Default buttons:

stop.png
 

Attachments

Jake Bunce

XenForo moderator
Staff member
#2
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.
 

Cryptaline

Active member
#3
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.
 

Jake Bunce

XenForo moderator
Staff member
#4
First find the root template of the page:

http://xenforo.com/community/threads/1-0-0-b1-how-to-identify-the-root-template-of-a-page.5591/

That template contains all of the HTML.

There are examples of radio buttons in this template:

Admin CP -> Appearance -> Templates -> account_personal_details

Code:
		<dl class="ctrlUnit">
			<dt><label>{xen:phrase gender}:</label></dt>
			<dd>
				<ul>
					<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>
				</ul>
			</dd>
		</dl>