0

This maybe basically a newbie issue but I am pulling my hair out with this one. Setting up a Custom Control in WordPress Customizer. Just a modification of the radio buttons. Here is the code-

foreach ($this->choices as $key => $value) {
    ?>
        <label>
            <input
                type="radio"
                style="display: inline-block; margin: 0; width: 45px; height: 45px; background: <?php echo $key; ?>"
                value="<?php echo esc_attr($value); ?>"
                <?php $this->link(); ?>
                name="<?php echo esc_attr( $name ); ?>"
                <?php checked( $this->value(), $value ); ?>
            />
        </label>
    <?php
}

This is the code that is used to render the Radio buttons with different colors defined in the choices array. The thing that I can't get my head around is that for the last 24 hours, I have been using input type="button". Why the hell does it not work?

Also, the button does not work in the customizer. Here, I can understand there is no simple way to check if the button is selected but what's up with input type="button". It will help a lot in clearing up my doubt regarding the custom controls.

5
  • What are you trying to use the button for? Native HTML buttons don’t do anything on their own, and aren’t really used for toggles. May 24, 2018 at 1:45
  • @JacobPeattie so by default, buttons and input type="button" cannot be used for toggles? I am kind of new to custom controls, so am not aware about the capabilities of certain elements. May 24, 2018 at 2:43
  • It's not what they're meant for. Normally toggles are radio or checkbox inputs. For a single on-off toggle a checkbox should do. May 24, 2018 at 3:04
  • Ok, just one last question, can divs be used for toggles in Customizer just like they can be used in JS? May 24, 2018 at 6:52
  • If you write the JS to make them behave that way, sure. But using divs is awful for accessibility. Use the proper elements where available. May 24, 2018 at 7:15

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Browse other questions tagged or ask your own question.