Javascript 允许用户启用/禁用选项

我正在开发一个wordpress插件，它只在所有页面上显示一个简单的div。我有创建它的代码，使它成为一个短代码，然后显示在每一页上

我想在管理员设置中添加一个复选框，使用户可以打开/关闭此选项。如果他们不选中方框，div就不会显示在页面上

我的代码：

add_action('after_setup_theme', 'webdev_load');

//Main PLugin Page
function plugin_home(){

       // This is the admin page for the plugin. A checkbox should go here

}

function webdev_create(){  

return '<span style="position:fixed;bottom:0;left:0;padding:10px;background-color:red;color:white;z-index:9999">- WEBDEV2 -</span>';
}

// Loads the webdev banner on every page automatically
function webdev_load(){

        echo do_shortcode('[webdev]');

}

add_shortcode('webdev', 'webdev_create');

add_action（'after_setup_theme'，'webdev_load'）；
//主插件页面
函数插件_home（）{
//这是插件的管理页面。这里应该有一个复选框
}
函数webdev_create（）{
返回“-WEBDEV2-”；
}
//在每个页面上自动加载webdev横幅
函数webdev_load（）{
echo do_短代码（“[webdev]”）；
}
添加_短代码（'webdev'，'webdev_create'）；

我知道我需要这个代码：

  add_settings_field("demo-checkbox", "Demo Checkbox", "demo_checkbox_display", "demo", "section");  
    register_setting("section", "demo-checkbox");
<?php checked(1, get_option('demo-checkbox'), true); ?> /> 

添加设置字段（“演示复选框”、“演示复选框”、“演示复选框”、“显示”、“演示”、“部分”）；
注册设置（“部分”、“演示复选框”）；
/> 

请参阅本页上的示例，或者如果您不想弄乱代码，可以使用高级自定义字段选项页-这非常简单-

到目前为止，您尝试了哪些方法来集成此复选框，为什么失败？或者你希望我们为你编写代码吗？@Connum Iv添加了一些我知道我需要的东西，但不知道从那里去哪里。