If you have bought the source code to the WordPress Android App, then you can read on – as these are the instructions on how to customize and make the source code your own.
There is an article that you might want to read before making a decision of buying the source code:
Android Studio Package Structure
The android application has been built with Android Studio as the IDE, the structures of the files are straightforward.
Rename the Package
For android developer package name is very important, because it’s the identifier for the application. It needs to be unique, you can check if an app exist by going to the Google Play service https://play.google.com/store/apps/details?id=com.new.package
If your purpose renaming package is for google play upload, on Android Studio you only need to change applicationId at app/build.gradle
Then you no need to do instruction below because some case face error,
- Create new package in java directory, e.g. “com.new.package“. Right click on app/src/main/java directory -> New -> Package.
- Select all packages and classes in “com.old.package” and move (drag) them to the new package. Confirm by click on “Do Refactor“.
- Delete the old package “com.old.package“.
- Open app/src/main/AndroidManifest.xml and rename the package name by selecting text package name “com.old.package” -> Right click on selected text -> Refactor -> Rename -> enter the new package name, select “Search in comments and strings” option -> Refactor -> Do Refactor.
- Clean the project. Main menu -> Build -> Clean Project.
- Replace all occurrences of “com.old.package” for a new package name, e.g. “com.new.package“. Right click on appdirectory -> Replace in Path -> set old and new package names, Case sensitive to true -> Find -> Replace.
- Clean the project again. Main menu -> Build -> Clean Project.
- Synchronize the project. Main menu -> Tools -> Android -> Sync Project with Gradle Files.
- If you see “Activity class does not exist” error, restart Android Studio.
Customizing Android App – Prepare Android
To connect Android app with your wordpress site you only need to change on line from file app/const.java
change all the:
- String URL_*_* to the urls of your WordPress site.
The easy way to customize this app is by only inserting your own urls to your WordPress site. To do this open Const file located under app/java/com.app.torbjornzetterlund/app directory.
public static final String URL_BLOG_CATEGORIES = "http://www.torbjornzetterlund.com/wp-json/wp/v2/categories?per_page=60"; public static final String URL_RECENTLY_ADDED = "http://www.torbjornzetterlund.com/wp-json/wp/v2/posts/"; public static final String URL_AUTHOR = "https://torbjornzetterlund.com/wp-json/wp/v2/users/";// public static final String URL_RECENTLY_ADDED = "http://www.torbjornzetterlund.com/api/get_recent_posts/"; public static final String URL_CATEGORY_POST = "http://torbjornzetterlund.com/wp-json/wp/v2/posts?categories=_CAT_ID_"; public static final String URL_STORY_PAGE = "http://torbjornzetterlund.com/wp-json/wp/v2/posts/_STORY_ID_/"; public static final String URL_SEARCH_RESULT = "http://www.torbjornzetterlund.com/wp-json/wp/v2/posts?search=_SEARCH_KEYWORD_"; public static final String URL_COMMENTS_LIST_PAGE = "http://torbjornzetterlund.com/wp-json/wp/v2/comments?post=_STORY_ID_";
Change all the above urls in this code with your own WordPress url and save the file.
Customizing App color and strings
You can also change the app default colors and name of this app. Colors used in this app are all in hexadecimal value (e.g. : #CECECE). Now just find hex values you want to change in all xml files located in drawable, layout, and values directories of resources. Many colors used in this app are placed in color.xml file. Which you can find app/res/values
And, just find the strings.xml file in the values directory of the resources and open it to change the name of this app or other word used in this app. Look for app_name to change the applications name.
Customizing Application logo and icons
To make this app represent your WordPress site you need to change the application icon, and logo with your own. To change them you need to create and replace images from drawable directory.
Note: Make 4 different sizes icons and place them in the (drawable-ldpi, drawable-mdpi, drawable-hdpi, and drawable-xhdpi). Sizes are as following
- drawable-ldpi: 36×36 pixels
- drawable-mdpi: 48×48 pixels
- drawable-hdpi: 72×72 pixels
- drawable-xhdpi: 96×96 pixels
Also, Make it sure that all images you create have the same file name with the file name and type of images that they have.
Please visit Google AdMob to get the AdMob Unit and Publisher ID. Please do the following settings, once you get the AdMob Unit ID.
- Open Const file located underapp/java/com.app.torbjornzetterlund/app directory.
- Change the ADMOBService_ACTIVE variable to true from false.
- Now open strings.xml file form values resources directory.
- Paste your AdMob Unit and Publisher ID in the unit_id string.
Note: Make sure your AdMob Unit ID that you are going to Paste is in ca-app-pub-xxxxxxxxxxxxxxxx/xxxxxxxxxx format. If you want to disable the AdMob Support then set the ADMOBService_ACTIVE to false.
Configure Google FirebaseCloud Messaging (FCM)
We are using Google Firebase Cloud Messaging(FCM) for notifications, please look at these details on how to setup your FCM. On the server side, you require the WP Thor FCM plugin, learn more Get Exposure to your WordPress mobile App.
Google Analytics Tracking Code
This Android App has an ability to track detailed statistics about the app usage using Google Analytics Service. It’s the most widely used website statistics service. The basic service is free of charge and a premium version is available for a fee.
- Open global_tracker.xml, app_tracker.xml, ecommerce_tracker.xml files one by one. These files are located under app/res/xml directory.
- Change the ga_trackingId string to your own Analytics Tracking ID.
- You can toggle Analytics_ACTIVE variable to true or false to enable or disable.
Note: Make sure you’ve changed the tracking id to get your own statistics.
Change Colors of the App
You can also change the colors of action bar, post title, heading etc from the app style files.
- Open style.xml and color.xml files located under app/res/values/ directory.
- You will see two style.xml files. One for Pre-Lollipop devices and other for Lollipop device.
- Change the colors and style and Enjoy 🙂
Localization / Translation
WordPress Android now have RTL support. You can add your own language.
In your projects file navigator, expand the values directory, right-click the strings.xml file to open the Translation Editor.
In the Translation Editor, click the globe-icon to add a new language file. You may need to close and re-open the Translation Editor tab after adding a new language if it does not show up immediately. Please share any translations.
Forcing your app to follow RTL Layout
This Android App has an ability to force the app to follow RTL Layout. If you need to change the layout to RTL.
- Open Const file located underapp/java/com.app.torbjornzetterlund/app directory.
- Change the forceRTL variable from false to true.
- Change the forceRTLLang variable to your desire language. e.g. ar for Arabic
Note: Make sure you’ve created a language translation file in the package under the values directory.
Configure the Social Media Pages
In the app you can add links to your Facebook, Twitter and Google+. To configure these pages, do follow these steps
- Open Const file located under app/java/com.app.torbjornzetterlund/app directory.
- Change the Facebook_URL variable to configure the Facebook Page.
- Change the Twitter_URL variable to configure the Twitter Page.
- Change the GooglePlus_URL variable to configure the Google Plus Page.
Testing Android App
To test this android app, on Android Studio IDE, press Shift + F10 key and select Run As > Android Application.
Publishing Android App
Android Studio has provided App-signing capability so you don’t have to open up your keytool or do any complicated task.
- Go to Build -> Generate Signed APK…
- Click Create new…
- To make a new keystore, just put a non-exist keystore in “Key store path:” (The folder MUST exist, while the file MUST NOT exist).
- It will automatically completed our last dialog in keystore. Just click “Next“
- And “Finish“