Panda WooCommerce Android App Documentation

1. Introduction

Panda WooCommerce Android App is a native Android application built with Java and connected to a WordPress WooCommerce store using the WooCommerce REST API.

The app allows store owners to display products, product categories, product details, cart, wishlist, checkout, customer account, orders, payment methods, Firebase push notifications, splash screen, and customizable branding.

This documentation explains how to install, configure, and customize the app for your own WooCommerce store.

Download Demo App 

---

2. Main Features

• Native Android Java application

• WooCommerce REST API integration

• Product listing

• Product details page

• Categories

• Cart system

• Wishlist / favorites

• Checkout system

• Cash on Delivery support

• Online payment inside WebView

• Customer login and registration

• Customer account page

• My Orders page

• Order details page

• Firebase push notifications

• Splash screen

• App icon customization

• Logo customization

• Store URL customization

• App color customization

• Package name customization

• DeepL translation support through WordPress API

• WordPress / WooCommerce compatible

---

3. Requirements

Before installing the app, make sure you have:

• Android Studio installed

• Java-based Android project

• WordPress website

• WooCommerce plugin installed and activated

• WooCommerce REST API keys

• Firebase project for push notifications

• google-services.json file from Firebase

• Internet connection

• Minimum Android SDK supported by the project

• Basic knowledge of Android Studio and WordPress

---

4. Project Structure

Important files and folders:

app/src/main/java/com/tefagoopro/panda/

Main Android Java source code.

app/src/main/java/com/tefagoopro/panda/api/

API connection files such as WooCommerce API and app configuration.

app/src/main/java/com/tefagoopro/panda/models/

Model classes used for products, categories, orders, customers, payments, shipping, and translation.

app/src/main/java/com/tefagoopro/panda/cart/

Cart system files.

app/src/main/java/com/tefagoopro/panda/wishlist/

Wishlist / favorites system files.

app/src/main/java/com/tefagoopro/panda/firebase/

Firebase notification files.

app/src/main/java/com/tefagoopro/panda/lang/

Language and translation manager files.

app/src/main/res/drawable/

Drawable files such as backgrounds, buttons, images, and logos.

app/src/main/res/mipmap-*/

App launcher icon files.

app/src/main/res/layout/

XML layout files for app screens.

app/google-services.json

Firebase configuration file.

---

5. WooCommerce REST API Setup

To connect the Android app with your WooCommerce store, you need WooCommerce REST API keys.

Steps

1. Open your WordPress Admin Dashboard.

2. Go to:

WooCommerce > Settings

3. Open the Advanced tab.

4. Click REST API.

5. Click Add Key.

6. Add a description, for example:

Panda Android App

7. Choose user.

8. Set permissions to:

Read/Write

9. Click Generate API Key.

10. Copy:

Consumer Key

Consumer Secret

---

6. Change Store API Keys

Open:

app/src/main/java/com/tefagoopro/panda/api/PandaConfig.java

Replace the keys:

package com.tefagoopro.panda.api;

 

public class PandaConfig {

public static final String CONSUMER_KEY = “YOUR_CONSUMER_KEY_HERE”;

public static final String CONSUMER_SECRET = “YOUR_CONSUMER_SECRET_HERE”;

}

Example:

public static final String CONSUMER_KEY = “ck_xxxxxxxxxxxxxxxxx”;

public static final String CONSUMER_SECRET = “cs_xxxxxxxxxxxxxxxxx”;

---

7. Change Store Website URL

Open:

app/src/main/java/com/tefagoopro/panda/api/ApiClient.java

Find:

private static final String BASE_URL = "https://www.alpanda.pro/";

Replace it with your WooCommerce website URL:

private static final String BASE_URL = "https://www.yourstore.com/";

Important:

• The URL must end with /

• WooCommerce must be installed on this website

• REST API must be enabled

---

8. Change App Name

Open:

app/src/main/res/values/strings.xml

Change:

<string name="app_name">Panda Store</string>

To:

<string name="app_name">Your Store Name</string>

Also update the app label in:

app/src/main/AndroidManifest.xml

Find:

android:label="Panda Store"

Change it to:

android:label="Your Store Name"

---

9. Change Package Name

Current package name:

com.tefagoopro.panda

To change it:

1. Open Android Studio.

2. Go to:

Edit > Find > Replace in Files

3. Search for:

com.tefagoopro.panda

4. Replace with your new package name, for example:

com.yourcompany.yourstore

5. Click Replace All.

6. Open:

app/build.gradle.kts

Update:

namespace = "com.yourcompany.yourstore"

And:

applicationId = "com.yourcompany.yourstore"

7. Sync Gradle.

8. Clean and rebuild the project.

Important:

After changing the package name, you must create a new Firebase Android app using the same new package name and download a new google-services.json file.

---

10. Change App Logo

The splash screen logo file is usually located at:

app/src/main/res/drawable-nodpi/panda_logo.png

or:

app/src/main/res/drawable/panda_logo.png

Replace this file with your new logo using the same file name:

panda_logo.png

If you want to use another file name, open:

app/src/main/res/layout/activity_splash.xml

Find:

android:src="@drawable/panda_logo"

or:

android:src="@drawable-nodpi/panda_logo"

Update it with your new image name.

Example:

android:src="@drawable/your_logo"

---

11. Change App Icon

The app icon files are located inside:

app/src/main/res/mipmap-mdpi/

app/src/main/res/mipmap-hdpi/

app/src/main/res/mipmap-xhdpi/

app/src/main/res/mipmap-xxhdpi/

app/src/main/res/mipmap-xxxhdpi/

Recommended icon file names:

ic_launcher.png

ic_launcher_round.png

To change the app icon:

1. Prepare your app icon in all required Android sizes.

2. Replace the existing files inside the mipmap-* folders.

3. Open:

app/src/main/AndroidManifest.xml

Make sure the application tag contains:

android:icon=”@mipmap/ic_launcher”

android:roundIcon=”@mipmap/ic_launcher_round”

Example:

<application

android:allowBackup=”true”

android:icon=”@mipmap/ic_launcher”

android:roundIcon=”@mipmap/ic_launcher_round”

android:label=”Your Store Name”

android:supportsRtl=”true”

android:theme=”@style/Theme.Panda”>

---

12. Change Splash Screen

Splash screen files:

app/src/main/java/com/tefagoopro/panda/SplashActivity.java

app/src/main/res/layout/activity_splash.xml

Splash logo image:

app/src/main/res/drawable-nodpi/panda_logo.png

or:

app/src/main/res/drawable/panda_logo.png

To change splash screen text, open:

SplashActivity.java

Find:

txtSplashTitle.setText(“Panda Store”);

txtSplashSubTitle.setText(“Shop easily and safely”);

Replace with your own app name and tagline.

You can also change the splash delay inside:

private static final int SPLASH_DELAY = 2500;

Example:

private static final int SPLASH_DELAY = 3000;

---

13. Change Slider Images

The home slider images are located in:

app/src/main/res/drawable/

Recommended file names:

slider_1.png

slider_2.png

slider_3.png

Recommended size:

1200 x 600 px

or:

1440 x 720 px

To replace slider images:

1. Prepare 3 banner images.

2. Rename them:

slider_1.png

slider_2.png

slider_3.png

3. Replace the existing files in:

app/src/main/res/drawable/

The slider is used inside:

MainActivity.java

---

14. Change App Colors

Main colors are located in:

app/src/main/res/values/colors.xml

Example:

<color name=”panda_bg”>#FAF7F2</color>

<color name=”panda_dark”>#111111</color>

<color name=”panda_gold”>#C9A44C</color>

<color name=”panda_text”>#1A1A1A</color>

<color name=”panda_gray”>#777777</color>

<color name=”panda_light_gray”>#EFEAE2</color>

<color name=”panda_white”>#FFFFFF</color>

<color name=”panda_red”>#D72638</color>

You can change these colors to match your store branding.

Example:

<color name="panda_gold">#FF6600</color>

---

15. Firebase Push Notifications Setup

The app supports Firebase Cloud Messaging notifications.

Firebase Setup

1. Open Firebase Console.

2. Create a new Firebase project.

3. Add Android App.

4. Enter your package name.

Example:

com.yourcompany.yourstore

5. Download:

google-services.json

6. Put the file here:

app/google-services.json

7. Enable Firebase Cloud Messaging.

---

16. Firebase Gradle Setup

Project-level Gradle:

plugins {

alias(libs.plugins.android.application) apply false

id(“com.google.gms.google-services”) version “4.4.4” apply false

}

App-level Gradle:

plugins {

alias(libs.plugins.android.application)

id(“com.google.gms.google-services”)

}

Dependencies:

implementation(platform(“com.google.firebase:firebase-bom:33.16.0”))

implementation(“com.google.firebase:firebase-messaging”)

---

17. Firebase Files

Firebase Java files are located at:

app/src/main/java/com/tefagoopro/panda/firebase/

Files:

MyFirebaseMessagingService.java

FcmTokenManager.java

FcmTokenManager gets the device FCM token and subscribes to topic:

all

This allows the WordPress plugin to send notifications to all devices.

---

18. Firebase Service in AndroidManifest

Open:

app/src/main/AndroidManifest.xml

Make sure this permission exists:

<uses-permission android:name="android.permission.POST_NOTIFICATIONS" />

Inside <application>, make sure this service exists:

<service

android:name=”.firebase.MyFirebaseMessagingService”

android:exported=”false”>

<intent-filter>

<action android:name=”com.google.firebase.MESSAGING_EVENT” />

</intent-filter>

</service>

---

19. WordPress Firebase Notifications Plugin

If you use the included WordPress Firebase notification plugin:

1. Upload the plugin to:

wp-content/plugins/panda-firebase-notifications/

2. Activate it from WordPress Admin:

Plugins > Panda Firebase Notifications > Activate

3. Open:

Panda Firebase

4. Add your Firebase Service Account JSON.

To get Service Account JSON:

1. Open Firebase Console.

2. Go to:

Project Settings > Service Accounts

3. Click:

Generate new private key

4. Copy the full JSON content.

5. Paste it inside the plugin settings.

6. Save settings.

7. Send a test notification.

The app must be installed and opened at least once to subscribe to Firebase topic all.

---

20. DeepL Translation Setup

The app supports Arabic / English switching and product translation using a WordPress DeepL translation endpoint.

Do not put the DeepL API key directly inside the Android app.

Recommended flow:

Android App

↓

WordPress Translation Plugin

↓

DeepL API

WordPress Setup

1. Upload and activate the DeepL translation plugin.

2. Open plugin settings.

3. Add your DeepL API key.

4. Save settings.

The Android app will call the WordPress endpoint to translate product names, descriptions, and categories.

Example endpoint:

https://www.yourstore.com/wp-json/panda/v1/translate

---

21. Payment Methods

The app supports:

• Cash on Delivery

• Online payment through WebView

• WooCommerce payment gateways

Cash on Delivery will complete the order and open the order success screen directly.

Online payment will open inside the app using:

PaymentWebViewActivity.java

The customer will stay inside the app while completing payment.

---

22. Checkout and Orders

Checkout file:

app/src/main/java/com/tefagoopro/panda/CheckoutActivity.java

The app creates WooCommerce orders using:

• Customer ID

• Billing details

• Shipping details

• Cart products

• Selected payment method

• Selected shipping method

Orders are created in WooCommerce and can be viewed from:

WooCommerce > Orders

---

23. Customer Account

The app includes:

• Login

• Register

• Account screen

• Profile edit

• My Orders

• Order details

Important files:

LoginRegisterActivity.java

AccountActivity.java

ProfileEditActivity.java

MyOrdersActivity.java

OrderDetailsActivity.java

---

24. Build APK

To build the APK:

1. Open Android Studio.

2. Click:

Build > Clean Project

3. Click:

Build > Rebuild Project

4. Click:

Build > Generate Signed Bundle / APK

5. Choose:

APK

6. Create or select your keystore.

7. Build release APK.

---

25. Common Issues

Products not showing

Check:

• Website URL in ApiClient.java

• WooCommerce REST API keys in PandaConfig.java

• WooCommerce is installed and active

• Products are published

• Internet permission exists in AndroidManifest

Firebase notifications not working

Check:

• Correct package name in Firebase

• Correct google-services.json

• App opened at least once

• Notification permission allowed on Android 13+

• Firebase plugin Service Account JSON added correctly

• Device has internet connection

App icon not changed

Check:

• ic_launcher.png replaced in all mipmap-* folders

• AndroidManifest.xml uses:

android:icon="@mipmap/ic_launcher"

Splash logo not changed

Check:

• panda_logo.png exists inside drawable or drawable-nodpi

• activity_splash.xml points to the correct logo file

API authentication error

Check:

• Consumer Key and Consumer Secret are correct

• WooCommerce REST API permission is Read/Write

• Website URL uses HTTPS

• REST API is enabled

---

26. Video Tutorials

You can add your tutorial video links here.

WooCommerce API Setup Video

Add your video link here

Firebase Setup Video

Add your video link here

WordPress Firebase Plugin Setup Video

Add your video link here

DeepL Translation Plugin Setup Video

Add your video link here

---

27. Support Notes

When customizing the app for another store, always update:

App Name

Package Name

Website URL

WooCommerce API Keys

Firebase google-services.json

App Logo

App Icon

Splash Screen

Slider Images

Colors

After every major change, run:

Sync Gradle

Clean Project

Rebuild Project

Run

---

28. Final Checklist Before Delivery

Before delivering the app to a client, check:

• App name is correct

• Package name is correct

• Store URL is correct

• WooCommerce API keys are correct

• Products load correctly

• Categories load correctly

• Cart works correctly

• Wishlist works correctly

• Checkout creates orders

• Cash on Delivery works

• Online payment opens inside the app

• Firebase notifications work

• App icon is changed

• Splash screen is changed

• Colors match client branding

• Language switch works

• DeepL translation endpoint works

• Release APK is signed