子比主题—用户复选框签订协议与已经签订的协议页面

子比主题页面增加一个复选框来让用户签订协议
子比主题新增一个已经签订的协议页面
图片[4]-子比主题—用户复选框签订协议与已经签订的协议页面-黔客侠

使用教程:

  • 在主题的根目录新建个func.php文件
  • 然后将在func.php文件里写上<?php ?>
  • 在<?php在这里添加下面的代码?>
  • 在新建的页面里使用古腾堡的简码,简码我添加到下面代码中了.
// 引入SweetAlert2 插件的样式
function load_sweetalert_scripts() {
    wp_enqueue_style( 'sweetalert2', 'https://cdn.jsdelivr.net/npm/sweetalert2@11.0.18/dist/sweetalert2.min.css' );
    wp_enqueue_script( 'sweetalert2', 'https://cdn.jsdelivr.net/npm/sweetalert2@11.0.18/dist/sweetalert2.min.js', array(), '1.0', true );
}
add_action( 'wp_enqueue_scripts', 'load_sweetalert_scripts' );

// 在后台创建插件页面
function agreement_plugin_page() {
    global $post; // 添加全局变量$post,用于获取当前页面的ID

    // 设置一个签署成功的变量名
    $success = '<p style="color:green;text-align: center;background: rgba(136, 136, 136, .1);padding: 5px;">您已经成功签署本内容!</p>';

    // 检查当前用户是否已登录
    $is_logged_in = is_user_logged_in();

    $current_user_id = get_current_user_id();

    // 获取当前页面的ID
    $page_id = isset($post->ID) ? $post->ID : '';

    // 检查当前用户是否已签订协议
    $agreement_checked = get_user_meta($current_user_id, 'agreement_checked_' . $page_id, true);

    // 如果用户点击提交按钮且勾选了同意协议复选框,则更新用户元数据,并显示成功签署提示信息
    if (isset($_POST['submit']) && isset($_POST['agreement_checkbox'])) {
        update_user_meta($current_user_id, 'agreement_checked_' . $page_id, true);
        $agreement_checked = true; // 更新变量的值为true
    }
    
    if ($agreement_checked || (isset($_POST['submit']) && isset($_POST['agreement_checkbox']))) {
        echo $success;
        return; // 在签署成功后直接返回,无需执行下面的代码
    }
    

    echo '<form method="post" id="agreement-form" style="text-align: center;background: rgba(136, 136, 136, .1);padding: 5px;">';
    echo '<div style="display: inline-flex;">';

    // 如果当前用户未登录则调用登录框到按钮上
    if (!$is_logged_in) {
        echo '<button class="newadd-btns hover-show but nowave jb-blue radius" style="border-radius: 5px"><a href="javascript:;" class="signin-loader">登录</a></button>';
    } else {
        echo '<input type="checkbox" style="height: 20px;width: 20px;margin-right: 5px;" name="agreement_checkbox" id="agreement_checkbox"> 我已阅读并同意上述内容<br>';
        echo '<input type="hidden" name="page_id" value="' . $page_id . '">'; // 添加一个隐藏字段保存当前页面的ID
        echo '<input type="submit" class="newadd-btns hover-show but nowave jb-blue radius" style="border-radius: 5px;line-height: 0.5;margin-left: 5px;" name="submit" value="确认">';
    }

    echo '</div>';
    echo '</form>';

    // 添加 JavaScript 来进行表单验证
    echo '<script>
        document.getElementById("agreement-form").addEventListener("submit", function(event) {
            if (!document.getElementById("agreement_checkbox").checked) {
                event.preventDefault();
                Swal.fire({
                    icon: "error",
                    title: "提交失败",
                    text: "请您先勾选本内容后再提交!",
                    confirmButtonText: "确定"
                });
            }
        });
    </script>';
}

// 注册短代码
function agreement_shortcode() {
    ob_start();
    agreement_plugin_page(); // 调用插件页面
    return ob_get_clean();
}
add_shortcode('agreement', 'agreement_shortcode');


在新建的页面里使用古腾堡的简码,添加短代码:[agreement]

定位/zibll/inc/functions/user/page.php文件

在page.php文件搜索function zib_user_ctnter_main_tabs_array_filter_main($tabs_array)下方添加选项卡代码

    $tabs_array['security'] = array(
        'title'         => '我的协议',
        'nav_attr'      => 'drawer-title="我的协议"',
        'content_class' => 'security-settings',
        'loader'        => '<div class="zib-widget">
                                <div class="placeholder k1 mb10"></div>
                                <div class="placeholder k1 mb10"></div>
                                <div class="placeholder s1"></div>
                                <div class="placeholder t1 mt20"></div>
                                <div class="placeholder s2"></div>
                                <div class="placeholder k1 mb10"></div>
                                <div class="placeholder k1 mb10"></div>
                                <div class="placeholder s1"></div>
                                <div class="placeholder t1 mt20"></div>
                                <div class="placeholder s2"></div>
                            </div>',
        'content_func'  => 'zib_main_user_tab_content_security', // 添加此行
    );

在page.php文件搜索function zib_user_center_page_sidebar_button_1($con)里面添加一个图标按钮

          $buttons[] = array(
            'html' => '',
            'icon' => '<svg t="1688630862278" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6861" width="200" height="200"><path d="M341.333333 0h398.222223a227.555556 227.555556 0 0 1 227.555555 227.555556v568.888888a227.555556 227.555556 0 0 1-227.555555 227.555556H341.333333a227.555556 227.555556 0 0 1-227.555555-227.555556V227.555556a227.555556 227.555556 0 0 1 227.555555-227.555556z" fill="#4C7BF6" p-id="6862"></path><path d="M682.666667 824.604444l-100.295111 53.020445 19.342222-111.786667-81.351111-79.075555 112.298666-16.042667L682.666667 568.888889l50.005333 101.831111 112.298667 16.099556-81.351111 79.075555 19.342222 111.729778z" fill="#FFFFFF" p-id="6863"></path><path d="M56.888889 227.555556m56.888889 0l0 0q56.888889 0 56.888889 56.888888l0 455.111112q0 56.888889-56.888889 56.888888l0 0q-56.888889 0-56.888889-56.888888l0-455.111112q0-56.888889 56.888889-56.888888Z" fill="#DBE5FD" p-id="6864"></path></svg>',
            'name' => '我的协议',
            'tab'  => 'security',
        );

然后搜索function zib_user_center_page_sidebar_button_2($con)在上面填”我的协议页面“来绑定上面选项卡

图片[5]-子比主题—用户复选框签订协议与已经签订的协议页面-黔客侠
    //我的协议页面
    function zib_main_user_tab_content_security()
    {
        $user_id = get_current_user_id();
      $mybankuai = 'style="clear: both;background: var(--main-bg-color);padding: 15px;box-shadow: 0 0 10px var(--main-shadow);border-radius: var(--main-radius);"';
      $myli ='style="padding: 10px;background: rgb(243, 243, 243);margin-bottom: 10px;border-radius: 5px;"';
      $myshuliang ='style="padding: 5px;margin-bottom: 5px;"';
      $icon = '<svg t="1688652517567" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4640" width="200" height="200" style="margin-right: 5px;"><path d="M512 512m-512 0a512 512 0 1 0 1024 0 512 512 0 1 0-1024 0Z" fill="#44CB5C" opacity=".15" p-id="4641"></path><path d="M432.049231 618.732308a402.628923 402.628923 0 0 0-118.547693-143.36L236.307692 549.809231a555.992615 555.992615 0 0 1 206.769231 200.861538 1145.107692 1145.107692 0 0 1 154.387692-223.704615A503.256615 503.256615 0 0 1 787.692308 372.184615V320.590769a819.2 819.2 0 0 0-355.643077 298.141539z" fill="#44CB5C" p-id="4642"></path></svg>';
      $my_prompt = 'style="margin-bottom: 10px;padding: 15px;color: #04b97e;background: rgba(8, 196, 37, 0.1);"';
      
        // 获取当前用户已签订协议的页面ID及标题
        global $wpdb;
        $results = $wpdb->get_results(
            $wpdb->prepare(
                "SELECT meta_key 
                 FROM {$wpdb->prefix}usermeta 
                 WHERE user_id = %d AND meta_key LIKE 'agreement_checked_%%'",
                $user_id
            )
        );
        // 统计已签订协议数量
        $agreement_count = count($results);
        // 初始化协议内容
        $agreement_content = '';
        foreach ($results as $result) {
            $page_id = str_replace('agreement_checked_', '', $result->meta_key);
            $page_title = get_the_title($page_id);
            $page_link = get_permalink($page_id);
            $agreement_content .= '<p ' . $myli . '><a href="' . $page_link . '">' . $page_title . '</a></p>';
        }
      
      $html .= "<div $my_prompt>为了确保您的权益和安全,我们诚挚邀请您积极参与,共同签署协议,共创一个更加可靠和互信的社区环境。</div>";
        $inner_div = "<div $myshuliang>" . $icon . "当前已签署:" . $agreement_count . " 份协议</div>";
        $html = "<div class='myxieyi' $mybankuai>" .$html . $inner_div . $agreement_content . '</div>';
        return zib_get_ajax_ajaxpager_one_centent($html);
    }
    add_filter('main_user_tab_content_security', 'zib_main_user_tab_content_security');

下面代码和勾选复选框的代码一致

// 引入SweetAlert2 插件的样式
    function load_sweetalert_scripts() {
        wp_enqueue_style( 'sweetalert2', 'https://cdn.jsdelivr.net/npm/sweetalert2@11.0.18/dist/sweetalert2.min.css' );
        wp_enqueue_script( 'sweetalert2', 'https://cdn.jsdelivr.net/npm/sweetalert2@11.0.18/dist/sweetalert2.min.js', array(), '1.0', true );
    }
    add_action( 'wp_enqueue_scripts', 'load_sweetalert_scripts' );
    // 在后台创建插件页面
    function agreement_plugin_page() {
        global $post; // 添加全局变量$post,用于获取当前页面的ID
        // 设置一个签署成功的变量名
        $success = '<p style="color:green;text-align: center;background: rgba(136, 136, 136, .1);padding: 5px;">您已经成功签署本内容!</p>';
        // 检查当前用户是否已登录
        $is_logged_in = is_user_logged_in();
        $current_user_id = get_current_user_id();
        // 获取当前页面的ID
        $page_id = isset($post->ID) ? $post->ID : '';
        // 检查当前用户是否已签订协议
        $agreement_checked = get_user_meta($current_user_id, 'agreement_checked_' . $page_id, true);
        // 如果用户点击提交按钮且勾选了同意协议复选框,则更新用户元数据,并显示成功签署提示信息
        if (isset($_POST['submit']) && isset($_POST['agreement_checkbox'])) {
            update_user_meta($current_user_id, 'agreement_checked_' . $page_id, true);
            $agreement_checked = true; // 更新变量的值为true
        }
        
        if ($agreement_checked || (isset($_POST['submit']) && isset($_POST['agreement_checkbox']))) {
            echo $success;
            return; // 在签署成功后直接返回,无需执行下面的代码
        }
        
        echo '<form method="post" id="agreement-form" style="text-align: center;background: rgba(136, 136, 136, .1);padding: 5px;">';
        echo '<div style="display: inline-flex;">';
        // 如果当前用户未登录则调用登录框到按钮上
        if (!$is_logged_in) {
            echo '<button class="newadd-btns hover-show but nowave jb-blue radius" style="border-radius: 5px"><a href="javascript:;" class="signin-loader">登录</a></button>';
        } else {
            echo '<input type="checkbox" style="height: 20px;width: 20px;margin-right: 5px;" name="agreement_checkbox" id="agreement_checkbox"> 我已阅读并同意上述内容<br>';
            echo '<input type="hidden" name="page_id" value="' . $page_id . '">'; // 添加一个隐藏字段保存当前页面的ID
            echo '<input type="submit" class="newadd-btns hover-show but nowave jb-blue radius" style="border-radius: 5px;line-height: 0.5;margin-left: 5px;" name="submit" value="确认">';
        }
        echo '</div>';
        echo '</form>';
        // 添加 JavaScript 来进行表单验证
        echo '<script>
            document.getElementById("agreement-form").addEventListener("submit", function(event) {
                if (!document.getElementById("agreement_checkbox").checked) {
                    event.preventDefault();
                    Swal.fire({
                        icon: "error",
                        title: "提交失败",
                        text: "请您先勾选本内容后再提交!",
                        confirmButtonText: "确定"
                    });
                }
            });
        </script>';
    }
    // 注册短代码并调用插件页面
    function agreement_shortcode() {
        ob_start();
        agreement_plugin_page(); // 调用插件页面函数
        return ob_get_clean();
    }
    add_shortcode('agreement', 'agreement_shortcode');

如果您想要创建别的页面,请更改下面代码

  1. 修改定义的函数名称function zib_main_user_tab_content_security()里面的security
  2. 修改过滤器add_filter(‘main_user_tab_content_security’, ‘zib_main_user_tab_content_security’);里面的security
    function zib_main_user_tab_content_security()
    {
        $html = '<div>
                    <!-- 在这里添加您想要显示的内容 -->
                </div>';
        $html = '<form class="zib-widget">' . $html . '</form>';
        return zib_get_ajax_ajaxpager_one_centent($html);
    }
    add_filter('main_user_tab_content_security', 'zib_main_user_tab_content_security');
------本页内容已结束,喜欢请分享------
本站代码模板仅供学习交流使用请勿商业运营,严禁从事违法,侵权等任何非法活动,否则后果自负!
© 版权声明
THE END
喜欢就支持一下吧
点赞0 分享
评论 抢沙发

请登录后发表评论

    暂无评论内容