2

I am creating my first WordPress plugin. It is a simple plugin that extends Visual Composer allowing you to remove the element options in VC (shown in the screenshot).

enter image description here

On the plugin "options" page I am creating a form to show/hide the elements. Here is my code:

// Going to add a conditional statement here to run this vc_remove_element function if the checkbox for Row is selected
vc_remove_element( "vc_row" ); // Row

add_action('admin_menu', 'plugin_admin_settings_tab');

function plugin_admin_settings_tab() {

    add_options_page('Remove Visual Composer Elements', 'Remove Visual Composer Elements', 'manage_options', 'remove_visual_composer_elements', 'plugin_rvce_options_page');

}

?>

<?php function plugin_rvce_options_page() { ?>

<div>

    <form action="options.php" method="post">

        <?php settings_fields('plugin_options'); ?>
        <?php do_settings_sections('plugin'); ?>

        <input name="Submit" type="submit" value="<?php esc_attr_e('Save Changes'); ?>" />

    </form>

</div>

<?php } ?>

<?php

// ADMIN SETTINGS

add_action('admin_init', 'plugin_rvce_admin_init');

function plugin_rvce_admin_init(){

register_setting( 'plugin_options', 'plugin_options', 'plugin_rvce_options_validate' );
add_settings_section('plugin_main', 'Visual Composer Element Settings', 'plugin_rvce_section_text', 'plugin');
add_settings_field('Checkbox Element', 'Row', 'sandbox_checkbox_element_callback', 'plugin', 'plugin_main' );

} 

function sandbox_checkbox_element_callback() {

$options = get_option( 'plugin_options' );

$html = '<input type="checkbox" id="checkbox_example" name="sandbox_theme_input_examples[checkbox_example]" value="1"' . checked( 1, $options['checkbox_example'], false ) . '/>';
$html .= '<label for="checkbox_example"> Hide</label>';

echo $html;

}

?>

<?php function plugin_rvce_section_text() {
    echo '<p>Remove Visual Composer elements from the interface.</p>';
} ?>

<?php // validate our options
function plugin_rvce_options_validate($input) {
$options = get_option('plugin_options');
return $options;
}

The form looks correct on the front end but when I click the checkbox and save it.. the settings are NOT saved. I can tell that the sandbox_checkbox_element_callback function is not set up correctly but I can't figure out the correct way to set this up.

Form:

enter image description here

Can someone help me accomplish this?

1

This should do it:

// Going to add a conditional statement here to run this vc_remove_element function if the checkbox for Row is selected
vc_remove_element( "vc_row" ); // Row

add_action('admin_menu', 'plugin_admin_settings_tab');

function plugin_admin_settings_tab() {

    add_options_page('Remove Visual Composer Elements', 'Remove Visual Composer Elements', 'manage_options', 'remove_visual_composer_elements', 'plugin_rvce_options_page');
    add_action('admin_init', 'plugin_rvce_admin_init');

}

?>

<?php function plugin_rvce_options_page() { ?>

<div>

    <form action="options.php" method="post">

        <?php settings_fields('plugin_options'); ?>
        <?php do_settings_sections('plugin'); ?>

        <?php submit_button(); ?>

    </form>

</div>

<?php } ?>

<?php

// ADMIN SETTINGS


function plugin_rvce_admin_init(){

register_setting( 'plugin_options', 'plugin_options' );
add_settings_section('plugin_main', 'Visual Composer Element Settings', 'plugin_rvce_section_text', 'plugin');
add_settings_field('Checkbox Element', 'Row', 'sandbox_checkbox_element_callback', 'plugin', 'plugin_main' );

}

function sandbox_checkbox_element_callback() {

$options = get_option( 'plugin_options' );

$checked = ( isset($options['checkbox_example']) && $options['checkbox_example'] == 1) ? 1 : 0;

$html = '<input type="checkbox" id="checkbox_example" name="plugin_options[checkbox_example]" value="1"' . checked( 1, $checked, false ) . '/>';
$html .= '<label for="checkbox_example"> Hide</label>';

echo $html;

}

?>

<?php function plugin_rvce_section_text() {
    echo '<p>Remove Visual Composer elements from the interface.</p>';
} ?>

<?php // validate our options
function plugin_rvce_options_validate($input) {
$options = get_option('plugin_options');
return $options;
}

You need to get the checked value first and see if it's set in the first place. Because when you uncheck your checkbox the plugin_options in the database in the wp_options table will be nothing. So if it is nothing, you need to set the $checked to 0, and 1 otherwise. Also the name of the input field was wrong, and I replaced the submit button by the default one.

Tested on twenty sixteen theme, and worked for me :) Hope this helps.

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.