0

Can you please let me know how I can set a function to update change the style like any CSS class from the setting option page? For example I have some <P> elements with a class name .impo. Now, I would like to change the color of the class to red when the checkbox has been checked and to default color when un-checked.

What I have is:

<?php
 add_action('admin_menu', 'fwds_plugin_settings');
 function fwds_plugin_settings() {
 add_menu_page('Price Display', 'Price Display', 'administrator', 'fwds_settings', 'fwds_display_settings');
 }
function fwds_display_settings() {
$html = '<div class="wrap"><form action="options.php" method="post" name="options">
    <h2>Change The .impo Colors</h2>
    ' . wp_nonce_field('update-options') . '
  <p>
<table>
 <tr>
 <td>Change Color To Red </td>
 <td><input type="checkbox" name="fwds_autoplay" value="enabled" /></td>
 </tr>
</table>
<br />
<input type="submit" name="Submit" value="Update" /></form></div>';
echo $html;
}
0

I think you have to solve this with jQuery. If checked -> addClass, if not -> removeClass.

Here's how to enqueue your JS file:

add_action('admin_menu', 'fwds_plugin_settings');

function fwds_plugin_settings() {
    $hook = add_menu_page(
        'Price Display', 
        'Price Display', 
        'add_users', 
        'fwds_settings', 
        'fwds_display_settings'
    );
    add_action( "admin_print_scripts-$hook", 'fwds_print_scripts' );
}
function fwds_print_scripts()
{
    wp_register_script( 
         'my-fx' 
        , plugin_dir_url( __FILE__ ) . '/my-fx.js'
        , array( 'jquery' ) // Dependencies
    );

    wp_enqueue_script( 'my-fx' );
}

And my-fx.js:

jQuery(document).ready(function($) 
{   
    alert('my page');
});             

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.