效果图演示

教程开始

第一步：去打开/wp-content/themes/zibll/func.php文件，没有这个文件可以自己创建一个，或者打开functions.php文件，把下方代码放进去。

代码部署

第一个版本（用户登录之后就有这个弹窗）

// 将以下代码添加到主题的 functions.php 文件
function zib_login_security_notice() {
    if (is_user_logged_in() && !wp_is_mobile()) { // 添加移动端判断
        $user = wp_get_current_user();
        $login_ip = !empty($_SERVER['HTTP_X_FORWARDED_FOR']) ? explode(',', $_SERVER['HTTP_X_FORWARDED_FOR'])[0] : $_SERVER['REMOTE_ADDR'];
        $login_time = current_time('mysql');
        
        // 获取上次登录信息
        $last_login = get_user_meta($user->ID, 'last_login', true);
        update_user_meta($user->ID, 'last_login', $login_time);
        
        // 安全检测逻辑
        $security_message = '本次登录信息正常';
        $last_ip = get_user_meta($user->ID, 'last_login_ip', true);
        if ($last_ip && $last_ip != $login_ip) {
            $security_message = '检测到新登录地点，请确认是否本人操作！';
        }
        update_user_meta($user->ID, 'last_login_ip', $login_ip);

        ob_start(); ?>
        
        <div class="zib-security-alert" id="zibSecurityAlert">
            <div class="alert-close" onclick="handleCloseSecurity()">
                <svg viewBox="0 0 24 24" width="18"><path fill="currentColor" d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/></svg>
            </div>
            <div class="alert-header">
                <svg viewBox="0 0 24 24" width="24"><path fill="currentColor" d="M12 1L3 5v6c0 5.55 3.84 10.74 9 12 5.16-1.26 9-6.45 9-12V5l-9-4zm-1 7h2v2h-2zm0 4h2v6h-2z"/></svg>
                <h3>账户安全提醒</h3>
            </div>
            <div class="alert-content">
                <div class="alert-item">
                    <div class="item-icon">
                        <svg viewBox="0 0 24 24" width="20"><path fill="currentColor" d="M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 10a3 3 0 1 1 0-6 3 3 0 0 1 0 6z"/></svg>
                    </div>
                    <div class="item-info">
                        <span class="label">登录IP</span>
                        <span class="value"><?php echo esc_html($login_ip); ?></span>
                    </div>
                </div>
                <div class="alert-item">
                    <div class="item-icon">
                        <svg viewBox="0 0 24 24" width="20"><path fill="currentColor" d="M12 2C6.486 2 2 6.486 2 12s4.486 10 10 10 10-4.486 10-10S17.514 2 12 2zm0 18c-4.411 0-8-3.589-8-8s3.589-8 8-8 8 3.589 8 8-3.589 8-8 8zm1-8h4v2h-6V7h2v5z"/></svg>
                    </div>
                    <div class="item-info">
                        <span class="label">登录时间</span>
                        <span class="value"><?php echo date_i18n('Y-m-d H:i', strtotime($login_time)); ?></span>
                    </div>
                </div>
            </div>
            <div class="alert-footer <?php echo ($security_message != '本次登录信息正常') ? 'warning' : ''; ?>">
                <?php echo esc_html($security_message); ?>
            </div>
        </div>

        <style>
        .zib-security-alert {
            position: fixed;
            bottom: 20px;
            right: 20px;
            background: rgba(255,255,255,0.98);
            border: 1px solid rgba(0,0,0,0.1);
            border-radius: 12px;
            padding: 16px;
            width: 320px;
            box-shadow: 0 8px 24px rgba(0,0,0,0.1);
            z-index: 999999;
            transform: translateY(20px);
            opacity: 0;
            animation: alertSlide 0.3s ease-out forwards;
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, sans-serif;
        }

        @media (max-width: 768px) {
            .zib-security-alert {
                display: none !important;
            }
        }

        @media (prefers-color-scheme: dark) {
            .zib-security-alert {
                background: rgba(30,30,30,0.98);
                border-color: rgba(255,255,255,0.1);
            }
            .label { color: #858585; }
            .value { color: #e0e0e0; }
        }

        .alert-header {
            display: flex;
            align-items: center;
            margin-bottom: 16px;
        }
        .alert-header svg {
            color: #1677ff;
            margin-right: 12px;
        }
        .alert-header h3 {
            margin: 0;
            font-size: 16px;
            color: #1a1a1a;
        }

        .alert-item {
            display: flex;
            align-items: center;
            margin: 12px 0;
        }
        .item-icon {
            width: 36px;
            height: 36px;
            background: rgba(22,119,255,0.1);
            border-radius: 8px;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-right: 12px;
        }
        .item-icon svg {
            color: #1677ff;
        }
        .item-info {
            flex: 1;
        }
        .label {
            display: block;
            font-size: 12px;
            color: #666;
            margin-bottom: 2px;
        }
        .value {
            display: block;
            font-size: 14px;
            font-weight: 500;
            color: #1a1a1a;
        }

        .alert-footer {
            margin-top: 16px;
            padding: 12px;
            background: #f5f5f5;
            border-radius: 8px;
            font-size: 13px;
            text-align: center;
        }
        .alert-footer.warning {
            background: #fffbe6;
            color: #d48806;
            border: 1px solid #ffe58f;
        }

        .alert-close {
            position: absolute;
            top: 16px;
            right: 16px;
            cursor: pointer;
            opacity: 0.6;
            transition: all 0.2s;
        }
        .alert-close:hover {
            opacity: 1;
            transform: rotate(90deg);
        }

        @keyframes alertSlide {
            to {
                transform: translateY(0);
                opacity: 1;
            }
        }
        </style>

        <script>
        function handleCloseSecurity() {
            document.getElementById('zibSecurityAlert').style.display = 'none';
            var date = new Date();
            date.setDate(date.getDate() + 1);
            document.cookie = "zib_security_closed=1; expires=" + date.toUTCString() + "; path=/";
        }
        
        document.addEventListener('DOMContentLoaded', function() {
            if (/Mobi|Android/i.test(navigator.userAgent)) return;
            if (document.cookie.includes('zib_security_closed')) {
                document.getElementById('zibSecurityAlert').style.display = 'none';
            }
        });
        </script>
        
        <?php
        echo ob_get_clean();
    }
}
add_action('wp_footer', 'zib_login_security_notice');

第二个版本（用户登录新IP的时候会有确认）

function zib_login_security_notice() {
    if (is_user_logged_in() && !wp_is_mobile()) {
        $user = wp_get_current_user();
        $login_ip = !empty($_SERVER['HTTP_X_FORWARDED_FOR']) ? explode(',', $_SERVER['HTTP_X_FORWARDED_FOR'])[0] : $_SERVER['REMOTE_ADDR'];
        $login_time = current_time('mysql');
        
        // 获取上次登录信息
        $last_ip = get_user_meta($user->ID, 'last_login_ip', true);
        $last_login = get_user_meta($user->ID, 'last_login', true);
        
        // 更新本次登录信息
        update_user_meta($user->ID, 'last_login', $login_time);
        update_user_meta($user->ID, 'last_login_ip', $login_ip);

        // 仅在检测到新 IP 时显示通知
        if ($last_ip && $last_ip != $login_ip) {
            $security_message = '检测到新登录地点，请确认是否本人操作！';
            
            ob_start(); ?>
            
            
                
                    
                
                
                    
                    账户安全提醒
                
                
                    
                        
                            
                        
                        
                            登录IP
                            
                        
                    
                    
                        
                            
                        
                        
                            登录时间
                            
                        
                    
                    
                        
                            
                        
                        
                            上次登录IP
                            
                        
                    
                
                
                    
                
            

            
            .zib-security-alert {
                position: fixed;
                bottom: 20px;
                right: 20px;
                background: rgba(255,255,255,0.98);
                border: 1px solid rgba(0,0,0,0.1);
                border-radius: 12px;
                padding: 16px;
                width: 320px;
                box-shadow: 0 8px 24px rgba(0,0,0,0.1);
                z-index: 999999;
                transform: translateY(20px);
                opacity: 0;
                animation: alertSlide 0.3s ease-out forwards;
                font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, sans-serif;
            }

            @media (max-width: 768px) {
                .zib-security-alert {
                    display: none !important;
                }
            }

            @media (prefers-color-scheme: dark) {
                .zib-security-alert {
                    background: rgba(30,30,30,0.98);
                    border-color: rgba(255,255,255,0.1);
                }
                .label { color: #858585; }
                .value { color: #e0e0e0; }
                .alert-footer.warning {
                    background: rgba(255, 213, 153, 0.15);
                    color: #ffb347;
                    border-color: rgba(255, 179, 71, 0.2);
                }
            }

            .alert-header {
                display: flex;
                align-items: center;
                margin-bottom: 16px;
            }
            .alert-header svg {
                color: #ff4d4f;
                margin-right: 12px;
            }
            .alert-header h3 {
                margin: 0;
                font-size: 16px;
                color: #1a1a1a;
            }

            .alert-item {
                display: flex;
                align-items: center;
                margin: 12px 0;
            }
            .item-icon {
                width: 36px;
                height: 36px;
                background: rgba(255,77,79,0.1);
                border-radius: 8px;
                display: flex;
                align-items: center;
                justify-content: center;
                margin-right: 12px;
            }
            .item-icon svg {
                color: #ff4d4f;
            }
            .item-info {
                flex: 1;
            }
            .label {
                display: block;
                font-size: 12px;
                color: #666;
                margin-bottom: 2px;
            }
            .value {
                display: block;
                font-size: 14px;
                font-weight: 500;
                color: #1a1a1a;
            }

            .alert-footer {
                margin-top: 16px;
                padding: 12px;
                border-radius: 8px;
                font-size: 13px;
                text-align: center;
            }
            .alert-footer.warning {
                background: #fff2f0;
                color: #ff4d4f;
                border: 1px solid #ffccc7;
            }

            .alert-close {
                position: absolute;
                top: 16px;
                right: 16px;
                cursor: pointer;
                opacity: 0.6;
                transition: all 0.2s;
            }
            .alert-close:hover {
                opacity: 1;
                transform: rotate(90deg);
            }

            @keyframes alertSlide {
                to {
                    transform: translateY(0);
                    opacity: 1;
                }
            }
            

            
            function handleCloseSecurity() {
                document.getElementById('zibSecurityAlert').style.display = 'none';
                var date = new Date();
                date.setDate(date.getDate() + 1);
                document.cookie = "zib_security_closed=1; expires=" + date.toUTCString() + "; path=/";
            }
            
            document.addEventListener('DOMContentLoaded', function() {
                if (/Mobi|Android/i.test(navigator.userAgent)) return;
                if (document.cookie.includes('zib_security_closed')) {
                    document.getElementById('zibSecurityAlert').style.display = 'none';
                }
            });
            
            
            <?php
            echo ob_get_clean();
        }
    }
}
add_action('wp_footer', 'zib_login_security_notice');