php - Add a class to wordpress submit_button -


is there way add "class" line make adhere .button styling in css stylesheet?

<?php submit_button(__('update profile')); ?> 

thanks

submit_button() core admin utility function. it's 1 of many elements making wordpress admin theme , it's supposed not styled, gracefully change when wp core developers decide change admin theme.

however, if want style particular button, here's suggest: add custom attribute button, called data-style:

<?php  $attributes = array( 'data-style' => 'custom' ); submit_button ( 'update profile', 'primary', 'submit', true, $attributes ); ?> 

and, in css can style button with:

[data-style="custom"] {      /* style button here */ } 

update: trix's answer made me take closer @ function referrence , realized ($type) can safely used add custom classes wp admin button. it's simple as:

submit_button ( 'update profile', 'custom-class' ); 

note (according function reference) button still have default button class. should work:

.button.custom-class {      /* styles here */ } 

update 2: i've done more testing , apparently, function works advertised. actual output of

submit_button(__('update stuff'), "custom-class"); 

was:

<p class="submit">     <input type="submit"             name="submit"             id="submit"             class="button custom-class"             value="update stuff"> </p> 

most of rules applying buttons in wp admin area prefixed .wp-core-ui. in case, come .wp-core-ui .button or .wp-core-ui .button:hover. following selectors should work:

.wp-core-ui .button.custom-class {      /* normal state rules here */ } .wp-core-ui .button.custom-class:hover {      /* hover state rules here */ } .wp-core-ui .button.custom-class:focus, .wp-core-ui .button-custom-class:active {      /* active/focus state rules here */ } 

for example, adding dashboard css changed appearance of button, without affecting other buttons:

.wp-core-ui .button.custom-class {     background-color: #272727;     border-color: #666;     color: #ddd; } .wp-core-ui .button.custom-class:hover {     background: #212121;     border-color: #666;     color: white; } 

made this: update_stuff_button

please note .custom-class rules overridden rules set .wp-core-ui .button (the default selector buttons in wp admin).


Comments

Popular posts from this blog

routing - AngularJS State management ->load multiple states in one page -

python - GRASS parser() error -

Swift game error message -