Sindbad~EG File Manager

Current Path : /home/copmadinaarea/thecopmadinaarea.org/attendance/admin/
Upload File :
Current File : /home/copmadinaarea/thecopmadinaarea.org/attendance/admin/email_setup_guide.php

<?php
require_once '../config/config.php';

// Check if user is logged in and has proper permissions
if (!isLoggedIn()) {
    redirect('login.php');
}

// Only superusers can access email setup guide
if (!hasRole('superuser')) {
    redirect('dashboard.php');
}

// Get site settings
$db = new Database();
$conn = $db->getConnection();
$query = "SELECT setting_key, setting_value FROM settings WHERE setting_key IN ('site_title', 'site_logo')";
$stmt = $conn->prepare($query);
$stmt->execute();
$settings = [];
while ($row = $stmt->fetch()) {
    $settings[$row['setting_key']] = $row['setting_value'];
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Email Setup Guide - <?php echo $settings['site_title'] ?? SITE_TITLE; ?></title>
    <script src="https://cdn.tailwindcss.com"></script>
    <script>
        tailwind.config = {
            theme: {
                extend: {
                    colors: {
                        primary: '#3B82F6',
                        secondary: '#F59E0B',
                        accent: '#6B7280'
                    }
                }
            }
        }
    </script>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
    <style>
        .gradient-bg {
            background: linear-gradient(135deg, #3B82F6 0%, #F59E0B 50%, #6B7280 100%);
        }
    </style>
</head>
<body class="bg-gray-50">
    <!-- Include Sidebar -->
    <?php include 'includes/sidebar.php'; ?>

    <!-- Main Content -->
    <div class="md:ml-64">
        <!-- Header -->
        <header class="bg-white shadow-sm border-b">
            <div class="px-6 py-4">
                <h1 class="text-2xl font-bold text-gray-900">Email Setup Guide</h1>
            </div>
        </header>

        <!-- Content -->
        <main class="p-6">
            <div class="max-w-4xl mx-auto">
                <!-- Introduction -->
                <div class="bg-blue-50 border border-blue-200 rounded-lg p-6 mb-8">
                    <h2 class="text-xl font-semibold text-blue-900 mb-4">
                        <i class="fas fa-info-circle mr-2"></i>Why Emails Might Fail
                    </h2>
                    <p class="text-blue-800 mb-4">
                        Email failures are common in local development environments like XAMPP because the basic PHP mail() function 
                        requires proper SMTP server configuration. Here's how to fix it:
                    </p>
                </div>

                <!-- Quick Solutions -->
                <div class="grid grid-cols-1 lg:grid-cols-2 gap-8 mb-8">
                    <!-- Gmail Setup -->
                    <div class="bg-white rounded-lg shadow p-6">
                        <h3 class="text-lg font-semibold text-gray-900 mb-4">
                            <i class="fab fa-google text-red-600 mr-2"></i>Gmail SMTP Setup
                        </h3>
                        <div class="space-y-3 text-sm">
                            <div>
                                <strong>SMTP Host:</strong> smtp.gmail.com
                            </div>
                            <div>
                                <strong>SMTP Port:</strong> 587 (TLS) or 465 (SSL)
                            </div>
                            <div>
                                <strong>Username:</strong> your-email@gmail.com
                            </div>
                            <div>
                                <strong>Password:</strong> Use App Password (not regular password)
                            </div>
                            <div>
                                <strong>Encryption:</strong> TLS
                            </div>
                        </div>
                        <div class="mt-4 p-3 bg-yellow-50 border border-yellow-200 rounded">
                            <p class="text-xs text-yellow-800">
                                <strong>Important:</strong> Enable 2-factor authentication and generate an App Password 
                                in your Google Account settings.
                            </p>
                        </div>
                    </div>

                    <!-- Local Testing -->
                    <div class="bg-white rounded-lg shadow p-6">
                        <h3 class="text-lg font-semibold text-gray-900 mb-4">
                            <i class="fas fa-laptop-code text-blue-600 mr-2"></i>Local Testing Solutions
                        </h3>
                        <div class="space-y-3 text-sm">
                            <div>
                                <strong>Option 1:</strong> Use Gmail SMTP (recommended)
                            </div>
                            <div>
                                <strong>Option 2:</strong> Install MailHog for local testing
                            </div>
                            <div>
                                <strong>Option 3:</strong> Use online SMTP services (SendGrid, Mailgun)
                            </div>
                            <div>
                                <strong>Option 4:</strong> Configure XAMPP sendmail
                            </div>
                        </div>
                        <div class="mt-4 p-3 bg-blue-50 border border-blue-200 rounded">
                            <p class="text-xs text-blue-800">
                                <strong>Tip:</strong> Gmail SMTP is the easiest solution for development and testing.
                            </p>
                        </div>
                    </div>
                </div>

                <!-- Step by Step Gmail Setup -->
                <div class="bg-white rounded-lg shadow mb-8">
                    <div class="px-6 py-4 border-b border-gray-200">
                        <h2 class="text-xl font-semibold text-gray-900">
                            <i class="fas fa-list-ol mr-2 text-primary"></i>Step-by-Step Gmail Setup
                        </h2>
                    </div>
                    <div class="p-6">
                        <div class="space-y-6">
                            <div class="flex">
                                <div class="flex-shrink-0">
                                    <div class="w-8 h-8 bg-blue-100 rounded-full flex items-center justify-center">
                                        <span class="text-blue-600 font-semibold text-sm">1</span>
                                    </div>
                                </div>
                                <div class="ml-4">
                                    <h4 class="font-medium text-gray-900">Enable 2-Factor Authentication</h4>
                                    <p class="text-sm text-gray-600">Go to your Google Account settings and enable 2-factor authentication.</p>
                                </div>
                            </div>

                            <div class="flex">
                                <div class="flex-shrink-0">
                                    <div class="w-8 h-8 bg-blue-100 rounded-full flex items-center justify-center">
                                        <span class="text-blue-600 font-semibold text-sm">2</span>
                                    </div>
                                </div>
                                <div class="ml-4">
                                    <h4 class="font-medium text-gray-900">Generate App Password</h4>
                                    <p class="text-sm text-gray-600">In Google Account settings, go to Security → App passwords → Generate new password for "Mail".</p>
                                </div>
                            </div>

                            <div class="flex">
                                <div class="flex-shrink-0">
                                    <div class="w-8 h-8 bg-blue-100 rounded-full flex items-center justify-center">
                                        <span class="text-blue-600 font-semibold text-sm">3</span>
                                    </div>
                                </div>
                                <div class="ml-4">
                                    <h4 class="font-medium text-gray-900">Configure Email Settings</h4>
                                    <p class="text-sm text-gray-600">Go to <a href="email_management.php" class="text-blue-600 underline">Email Management</a> and enter your Gmail SMTP settings with the app password.</p>
                                </div>
                            </div>

                            <div class="flex">
                                <div class="flex-shrink-0">
                                    <div class="w-8 h-8 bg-blue-100 rounded-full flex items-center justify-center">
                                        <span class="text-blue-600 font-semibold text-sm">4</span>
                                    </div>
                                </div>
                                <div class="ml-4">
                                    <h4 class="font-medium text-gray-900">Test Email</h4>
                                    <p class="text-sm text-gray-600">Use the test email function to verify your configuration works.</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- XAMPP Configuration -->
                <div class="bg-white rounded-lg shadow mb-8">
                    <div class="px-6 py-4 border-b border-gray-200">
                        <h2 class="text-xl font-semibold text-gray-900">
                            <i class="fas fa-server mr-2 text-primary"></i>XAMPP sendmail Configuration (Alternative)
                        </h2>
                    </div>
                    <div class="p-6">
                        <p class="text-gray-600 mb-4">If you prefer to configure XAMPP's sendmail instead of using SMTP:</p>
                        
                        <div class="bg-gray-50 rounded-lg p-4 mb-4">
                            <h4 class="font-medium text-gray-900 mb-2">1. Edit php.ini file:</h4>
                            <code class="text-sm text-gray-800 block bg-white p-2 rounded border">
                                [mail function]<br>
                                SMTP = smtp.gmail.com<br>
                                smtp_port = 587<br>
                                sendmail_from = your-email@gmail.com
                            </code>
                        </div>

                        <div class="bg-gray-50 rounded-lg p-4">
                            <h4 class="font-medium text-gray-900 mb-2">2. Edit sendmail.ini file:</h4>
                            <code class="text-sm text-gray-800 block bg-white p-2 rounded border">
                                smtp_server=smtp.gmail.com<br>
                                smtp_port=587<br>
                                auth_username=your-email@gmail.com<br>
                                auth_password=your-app-password
                            </code>
                        </div>
                    </div>
                </div>

                <!-- Troubleshooting -->
                <div class="bg-red-50 border border-red-200 rounded-lg p-6">
                    <h3 class="text-lg font-semibold text-red-900 mb-4">
                        <i class="fas fa-exclamation-triangle mr-2"></i>Common Issues & Solutions
                    </h3>
                    <div class="space-y-3 text-sm text-red-800">
                        <div>
                            <strong>Error: "SMTP connect() failed"</strong><br>
                            Solution: Check firewall settings, ensure port 587 is open
                        </div>
                        <div>
                            <strong>Error: "Authentication failed"</strong><br>
                            Solution: Use App Password instead of regular Gmail password
                        </div>
                        <div>
                            <strong>Error: "mail() function failed"</strong><br>
                            Solution: XAMPP doesn't have SMTP configured, use Gmail SMTP instead
                        </div>
                        <div>
                            <strong>Emails go to spam folder</strong><br>
                            Solution: Configure SPF/DKIM records, use reputable SMTP service
                        </div>
                    </div>
                </div>

                <!-- Quick Actions -->
                <div class="mt-8 text-center space-x-4">
                    <a href="email_management.php" class="bg-primary text-white px-6 py-2 rounded-lg hover:bg-blue-700 transition duration-300 inline-block">
                        <i class="fas fa-cog mr-2"></i>Configure Email Settings
                    </a>
                    <a href="email_diagnostics.php" class="bg-secondary text-white px-6 py-2 rounded-lg hover:bg-yellow-600 transition duration-300 inline-block">
                        <i class="fas fa-stethoscope mr-2"></i>Run Diagnostics
                    </a>
                </div>
            </div>
        </main>
    </div>
</body>
</html>

Sindbad File Manager Version 1.0, Coded By Sindbad EG ~ The Terrorists