# Payment Gateway Setup Guide 💳 ## Complete Guide to Setting Up Stripe & PayPal --- ## 📍 Where to Access Payment Settings ### Step 1: Navigate to Website Settings 1. Go to your website management dashboard 2. Click on **Websites** in the main navigation 3. Select the website you want to configure 4. Click on **Settings** or the gear icon 5. Navigate to the **Payment** tab **URL Format**: `https://your-domain.test/websites/{website_id}/settings` → Click "Payment" tab --- ## 🔵 STRIPE SETUP ### Part 1: Getting Your Stripe API Keys #### 1.1 Create a Stripe Account - Visit: [https://stripe.com](https://stripe.com) - Click "Sign Up" or "Start Now" - Complete registration with your email and business details #### 1.2 Access Your Dashboard - Login to [https://dashboard.stripe.com](https://dashboard.stripe.com) - You'll be in **Test Mode** by default (good for testing!) #### 1.3 Get Your API Keys 1. Click **Developers** in the left sidebar 2. Click **API keys** 3. You'll see two types of keys: **Test Keys (for testing):** - **Publishable key**: Starts with `pk_test_...` - **Secret key**: Starts with `sk_test_...` **Live Keys (for production):** - Toggle the switch from "Test mode" to "Live mode" - **Publishable key**: Starts with `pk_live_...` - **Secret key**: Starts with `sk_live_...` > ⚠️ **IMPORTANT**: Never share your secret key publicly! ### Part 2: Configure Stripe in Your Website #### 2.1 Enable Stripe 1. Go to **Website Settings → Payment Tab** 2. Find the **Stripe Payment Gateway** card 3. Toggle **Enable Stripe** switch to ON 4. The settings form will appear #### 2.2 Enter Your Keys Fill in the following fields: **Publishable Key:** ``` pk_test_51ABC123...xyz789 ``` - This is safe to expose on your website - Used for client-side payment forms **Secret Key:** ``` sk_test_51ABC123...xyz789 ``` - Keep this secure and never expose it - Used for server-side payment processing **Environment:** - Select **Test Mode** for testing - Select **Live Mode** when ready for production > 💡 **Tip**: Always test with test keys before going live! #### 2.3 Set Up Webhooks (Optional but Recommended) Webhooks allow Stripe to notify your website about payment events. 1. **Copy Your Webhook URL** - In the Stripe settings card, you'll see a webhook URL - Example: `https://mbi.neosolvix.test/api/webhooks/stripe/1` - Click the **Copy** button 2. **Configure in Stripe Dashboard** - Go to [Stripe Dashboard → Developers → Webhooks](https://dashboard.stripe.com/webhooks) - Click **Add endpoint** - Paste your webhook URL - Select events to listen to: - `payment_intent.succeeded` - `payment_intent.payment_failed` - `checkout.session.completed` - `customer.subscription.created` - `customer.subscription.updated` - `customer.subscription.deleted` - Click **Add endpoint** 3. **Get Webhook Secret** - After creating the endpoint, click on it - Click **Reveal** under "Signing secret" - Copy the secret (starts with `whsec_...`) - Paste it in the **Webhook Secret** field in your website settings #### 2.4 Test Your Connection 1. Click **Test Stripe Connection** button 2. Wait for the result 3. ✅ Success: "Stripe connection successful!" 4. ❌ Failure: Check your keys and try again #### 2.5 Save Settings - Scroll to the bottom of the settings page - Click **Save Settings** ### Part 3: Testing Stripe Payments #### Test Card Numbers Use these test cards in **Test Mode**: **Successful Payment:** ``` Card Number: 4242 4242 4242 4242 Expiry: Any future date (e.g., 12/25) CVC: Any 3 digits (e.g., 123) ZIP: Any 5 digits (e.g., 12345) ``` **Declined Payment:** ``` Card Number: 4000 0000 0000 0002 ``` **Requires Authentication (3D Secure):** ``` Card Number: 4000 0027 6000 3184 ``` [Full list of test cards](https://stripe.com/docs/testing#cards) --- ## 🔴 PAYPAL SETUP ### Part 1: Getting Your PayPal API Credentials #### 1.1 Create PayPal Developer Account - Visit: [https://developer.paypal.com](https://developer.paypal.com) - Click **Log in to Dashboard** - Use your existing PayPal account or create a new one #### 1.2 Create a REST API App 1. Go to [Apps & Credentials](https://developer.paypal.com/dashboard/applications/live) 2. Click **Create App** button 3. Enter an **App Name** (e.g., "My Website Payments") 4. Select **Merchant** as the App Type 5. Click **Create App** #### 1.3 Get Your API Credentials **Sandbox (Testing) Credentials:** 1. Make sure you're in **Sandbox** mode (toggle at top) 2. Click on your app name 3. You'll see: - **Client ID**: Starts with `AX...` or `Ab...` - **Secret**: Click "Show" to reveal **Live (Production) Credentials:** 1. Toggle to **Live** mode 2. Click on your app name 3. Get your **Client ID** and **Secret** > ⚠️ **IMPORTANT**: Keep your secret confidential! ### Part 2: Configure PayPal in Your Website #### 2.1 Enable PayPal 1. Go to **Website Settings → Payment Tab** 2. Find the **PayPal Payment Gateway** card 3. Toggle **Enable PayPal** switch to ON 4. The settings form will appear #### 2.2 Enter Your Credentials Fill in the following fields: **Client ID:** ``` AbcdEFGH12345IjklMNOP67890QrstUVWX... ``` - Your PayPal REST API Client ID **Secret:** ``` EFGH-ijkl9876MNOPqrst5432UVWXyzab... ``` - Your PayPal REST API Secret (keep this secure!) **Environment:** - Select **Sandbox (Testing)** for testing - Select **Live (Production)** when ready for real payments #### 2.3 Test Your Connection 1. Click **Test PayPal Connection** button 2. Wait for the result 3. ✅ Success: "PayPal connection successful!" 4. ❌ Failure: Check your credentials and try again #### 2.4 Save Settings - Scroll to the bottom of the settings page - Click **Save Settings** ### Part 3: Testing PayPal Payments #### Sandbox Test Accounts PayPal provides test accounts in Sandbox mode: 1. Go to [Sandbox Accounts](https://developer.paypal.com/dashboard/accounts) 2. You'll see pre-created test accounts: - **Personal Account** (buyer): For making purchases - **Business Account** (seller): For receiving payments **Test Buyer Account:** - Email: Your sandbox buyer email - Password: Available in the account details **To make a test purchase:** 1. Proceed to checkout on your website 2. Select PayPal as payment method 3. You'll be redirected to PayPal sandbox 4. Login with your test buyer account 5. Complete the payment --- ## 🏦 OTHER PAYMENT METHODS ### Cash on Delivery (COD) 1. In the **Other Payment Methods** section 2. Check **Cash on Delivery (COD)** 3. Customers can choose to pay upon delivery 4. No additional configuration needed ### Bank Transfer 1. Check **Bank Transfer** 2. Additional fields will appear: **Bank Details to Fill:** - **Bank Name**: e.g., "Maybank" - **Account Number**: e.g., "1234567890" - **Account Holder Name**: e.g., "Your Company Sdn Bhd" 3. These details will be shown to customers 4. Save settings --- ## 🔍 TESTING YOUR SETUP ### Test Checklist #### For Stripe: - [ ] Enable Stripe with test keys - [ ] Test connection (should show success) - [ ] Make a test booking with test card 4242... - [ ] Verify payment appears in Stripe Dashboard - [ ] Test webhook (if configured) - [ ] Switch to live keys when ready #### For PayPal: - [ ] Enable PayPal with sandbox credentials - [ ] Test connection (should show success) - [ ] Make a test booking with PayPal - [ ] Login with sandbox buyer account - [ ] Complete payment - [ ] Verify payment appears in PayPal sandbox - [ ] Switch to live credentials when ready --- ## 🚀 GOING LIVE ### Before Going Live: #### Stripe: 1. ✅ Complete Stripe account verification 2. ✅ Add business information 3. ✅ Set up bank account for payouts 4. ✅ Switch to **Live Mode** in settings 5. ✅ Replace test keys with live keys 6. ✅ Update webhook endpoint to use live keys 7. ✅ Test with a real small transaction 8. ✅ Verify payout settings #### PayPal: 1. ✅ Complete PayPal business verification 2. ✅ Add bank account 3. ✅ Switch to **Live (Production)** in settings 4. ✅ Replace sandbox credentials with live credentials 5. ✅ Test with a real small transaction 6. ✅ Verify withdrawal settings --- ## ⚠️ TROUBLESHOOTING ### Common Issues #### Stripe Issues: **"Connection failed" Error:** - ✓ Check if keys are correct (no extra spaces) - ✓ Ensure using correct mode (test vs live) - ✓ Verify keys are from the same Stripe account - ✓ Check if secret key starts with `sk_` not `pk_` **Payment Not Processing:** - ✓ Check if Stripe is enabled - ✓ Verify keys are entered correctly - ✓ Check browser console for errors - ✓ Ensure test mode matches your keys **Webhook Not Working:** - ✓ Verify webhook URL is accessible - ✓ Check webhook secret is correct - ✓ Ensure selected events match what you're testing - ✓ Check webhook logs in Stripe dashboard #### PayPal Issues: **"Connection failed" Error:** - ✓ Verify Client ID and Secret are correct - ✓ Ensure using correct environment (Sandbox vs Live) - ✓ Check if credentials are from the same app - ✓ Verify app is approved (for live mode) **Payment Fails:** - ✓ Check if PayPal is enabled - ✓ Verify credentials match the environment - ✓ Ensure test account has sufficient balance (sandbox) - ✓ Check if app has proper permissions **Redirect Issues:** - ✓ Ensure return URLs are configured - ✓ Check if website URL is accessible - ✓ Verify SSL certificate (required for live mode) --- ## 🔐 SECURITY BEST PRACTICES ### 1. Key Management - ❌ Never commit API keys to version control - ❌ Never share secret keys publicly - ❌ Never use live keys in test environments - ✅ Use environment variables for keys - ✅ Rotate keys periodically - ✅ Use different keys for each environment ### 2. Webhook Security - ✅ Always use webhook secrets - ✅ Verify webhook signatures - ✅ Use HTTPS for webhook URLs - ✅ Log webhook events for debugging - ✅ Handle webhook retries properly ### 3. Testing - ✅ Always test in sandbox/test mode first - ✅ Test all payment scenarios (success, failure, pending) - ✅ Test webhook handling - ✅ Test refunds and cancellations - ✅ Do a small live transaction before full launch --- ## 📚 ADDITIONAL RESOURCES ### Stripe Resources: - [Stripe Documentation](https://stripe.com/docs) - [API Reference](https://stripe.com/docs/api) - [Test Cards](https://stripe.com/docs/testing) - [Webhook Events](https://stripe.com/docs/webhooks) - [Dashboard](https://dashboard.stripe.com) ### PayPal Resources: - [PayPal Developer Docs](https://developer.paypal.com/docs/) - [REST API Reference](https://developer.paypal.com/api/rest/) - [Sandbox Testing](https://developer.paypal.com/tools/sandbox/) - [Dashboard](https://developer.paypal.com/dashboard/) --- ## 📋 QUICK SETUP CHECKLIST ### Stripe Setup (5 minutes): 1. ☐ Create Stripe account 2. ☐ Get test API keys 3. ☐ Enable Stripe in website settings 4. ☐ Enter publishable and secret keys 5. ☐ Select test mode 6. ☐ Test connection 7. ☐ Save settings 8. ☐ Test payment with card 4242... ### PayPal Setup (10 minutes): 1. ☐ Create PayPal Developer account 2. ☐ Create REST API app 3. ☐ Get sandbox credentials 4. ☐ Enable PayPal in website settings 5. ☐ Enter Client ID and Secret 6. ☐ Select Sandbox mode 7. ☐ Test connection 8. ☐ Save settings 9. ☐ Test payment with sandbox account --- ## 💡 TIPS & BEST PRACTICES ### 1. Start with Test Mode Always configure and test with sandbox/test credentials before using live credentials. ### 2. Use Both Gateways Offering both Stripe and PayPal gives customers more payment options and can increase conversion rates. ### 3. Monitor Your Dashboards Regularly check your Stripe and PayPal dashboards for: - Successful payments - Failed payments - Disputes/chargebacks - Payout schedules ### 4. Set Up Webhooks Webhooks ensure your website stays in sync with payment status changes, refunds, and subscription events. ### 5. Test Everything Before going live: - Test successful payments - Test failed payments - Test refunds - Test subscription renewals (if applicable) - Test webhook handling ### 6. Keep Backup Payment Method Always have at least one offline payment method (Bank Transfer or COD) in case of gateway issues. --- ## 🎯 SUMMARY **You're all set!** With Stripe and PayPal configured, your website can now accept: ✅ Credit/Debit Cards (via Stripe) ✅ PayPal Payments ✅ One-time Payments ✅ Recurring Subscriptions ✅ International Payments **Next Steps:** 1. Test thoroughly in sandbox/test mode 2. Complete payment gateway verification 3. Switch to live credentials 4. Monitor your first few transactions closely 5. Set up automatic payouts **Need Help?** - Check the troubleshooting section above - Review Stripe/PayPal documentation - Contact support if issues persist 🎉 **Happy selling!**