1. 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.

Discussion in 'Styling and Customization Questions' started by Cryptaline, Dec 27, 2012.

  1. Cryptaline

    Cryptaline 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:


    Attached Files:

  2. Jake Bunce

    Jake Bunce XenForo Moderator Staff Member

    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 likes this.
  3. Cryptaline

    Cryptaline Active Member

    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.
  4. Jake Bunce

    Jake Bunce XenForo Moderator Staff Member

    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

    		<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>
    Cryptaline likes this.

Share This Page