PAYMENT PAGE SETUP

✅ CHANGES MADE

  1. Created Payment Page - payment.qmd with Paystack integration
  2. Removed Pricing from Navigation - Replaced with “Make Payment”
  3. Updated Links - Services page now links to payment instead of pricing

💳 PAYMENT PAGE FEATURES

  • Service Dropdown - Pre-filled amounts for common services
  • Custom Amount Option - For negotiable services
  • Paystack Integration - Secure payment processing
  • Auto-calculation - Amount updates when service selected
  • Customer Details - Name, email, phone collected
  • Success Message - Confirmation after payment

🔑 IMPORTANT: API KEYS

The payment page uses your Paystack Public Key:

pk_3de9727013a37303d1e96e6c2ec34ef034d01112

Keep your Secret Key private! Never put it in the website code.

📋 TO DEPLOY

  1. Replace files on your server:

    • Upload all files from this folder
    • Replace old files

  2. Rebuild website:

    quarto render

  3. Upload to Netlify:

    • Drag docs/ folder to Netlify
    • OR push to GitHub (auto-deploys)

🧪 TEST THE PAYMENT

  1. Visit: www.mtjdataanalytics.com/payment.html
  2. Select a service or enter custom amount
  3. Fill in details
  4. Click “Pay Now”
  5. Complete test payment

Paystack Test Cards:

Card: 4084 0840 8408 4081
Expiry: Any future date
CVV: 408
OTP: 123456

📊 VIEW PAYMENTS

Paystack Dashboard: 1. Login to dashboard.paystack.com 2. Go to “Transactions” 3. See all payments with customer details

⚙️ CUSTOMIZATION

To change prices: Edit payment.qmd, find the <option> tags and update amounts.

To add services: Add new <option> lines in the service dropdown.

To change API key: Replace the key: value in the PaystackPop.setup function.

🔒 SECURITY NOTES

  • Public key is safe in frontend code
  • Keep Secret key on backend only
  • Paystack handles all card data securely
  • No card details stored on your site

📞 SUPPORT

Payment Issues: - Paystack: support@paystack.com - Docs: paystack.com/docs

Website Issues: - Email: info@mtjdataanalytics.com - WhatsApp: +234 901 944 1200

Your payment page is ready! Deploy and start accepting payments. 🚀