# Introduction

Version: 3.0.0 (Last Update: 14/11/2025)

### Newsfreak - Flutter Mobile App for WordPress

Newsfreak is a complete mobile app for both Android & iOS based on the WordPress blog. Using this, you can build an Android & iOS app for your WordPress blog.

> Product Details: <https://1.envato.market/newsfreak>
>
> Android Demo: [Google Play](https://play.google.com/store/apps/details?id=com.mrblab.newsfreak)
>
> iOS Demo: [AppStore (TestFlight)](https://testflight.apple.com/join/mFGxNnRM)
>
> Demo Wordpress Site: [newsfreak.mrb-lab.com](https://newsfreak.mrb-lab.com)

<div align="left"><figure><img src="/files/KuVkegaqEchCasr8aXFL" alt=""><figcaption></figcaption></figure></div>

### Other Projects that Might Capture Your Interest

***

1. [DreamCart - Flutter Mobile App for WooCommerce](https://codecanyon.net/item/dreamcart-flutter-ecommerce-mobile-app-for-woocommerce/60400026)

<div align="left"><figure><img src="/files/JEbONOgK16IXVcW0kogY" alt=""><figcaption></figcaption></figure></div>

1. [<mark style="color:purple;">PrimeLMS - Online Course Learning Flutter Mobile App</mark>](https://codecanyon.net/item/prime-lms-flutter-elearning-mobile-app/50417076)

<div align="left"><figure><img src="/files/B0Q0B3q3b0RudS8Ahjke" alt=""><figcaption></figcaption></figure></div>

2. [<mark style="color:purple;">QuizHour: Flutter Quiz App for Android & iOS with Admin Panel</mark>](https://1.envato.market/quizhour)

<div align="left"><figure><img src="/files/BSy0etR8AO70B8lCiMPD" alt=""><figcaption></figcaption></figure></div>

3. [<mark style="color:purple;">TravelHour: Flutter Complete Travel Guide App</mark>](https://1.envato.market/LzAgj)

<div align="left"><figure><img src="/files/9Rs9A2CpWw7mBOlEMQAO" alt=""><figcaption></figcaption></figure></div>


# Changelogs

Newsfreak is constantly being updated with new features, bug fixes, and adjustments. Below is a full listing of change log information.

## Version: 3.0.0

> 14 November  2025
>
> ```
> - A whole new UI experience. Redesigned the entire interface with tons of new features and improvements, including new dark mode and new article layouts.
> - Added font size selection in the settings for the whole app.
> - Added font increase/decrease buttons and a dark mode toggle on the article details screen.
> - Added a “scroll to top” button on every screen.
> - Fix: Scrolling issues in the home tab and other screens. Scrolling and content loading are now 2× smoother than before.
> - Fix: Issue with the video player when playing YouTube videos.
> - Fix: Deep link error screen when the URL doesn’t exist.
> - Compatible with the latest Flutter version 3.38.x.
> ```

> Changed Files
>
> Many files have been chnaged. Please use the latest source code.

## Version: 2.2.5

> 25 October 2025
>
> ```
> - Fix: Scrolling issues on home tab
> - Fix: Hero animation issue while navigating article details
> - Added support for 16 KB memory page size requiremnts for Google Play Store
> - Compatible with flutter latest version 3.35.x
> ```

> Changed Files
>
> Many files have been chnaged. Please use the latest source code.

## Version: 2.2.3

> 03 April 2025
>
> ```
> - Fix: Issues with OneSignal push notifcations
> - Fix: Android build released issues
> - Newsfreak App Functions wordpress plugin updated to v1.1.3
> - Compatible with flutter latest version 3.29.x
> ```

> Changed Files
>
> ```
> - pubspec.yaml
> - android/app/build.gradle
> - android/app/src/main/AndroidManifest.xml
> - android/build.gradle
> - android/gradle/wrapper/gradle-wrapper.properties
> - android/settings.gradle
> - ios/Runner/Info.plist (ios)
> - lib/blocs/settings_bloc.dart
> - lib/pages/article_details/article_details_layout2.dart
> - lib/pages/article_details/article_details_layout3.dart
> - lib/pages/article_details/article_details_layout_1.dart
> - lib/pages/article_details/video_article_details.dart
> - lib/services/app_links_service.dart
> - lib/services/app_service.dart
> - lib/widgets/featured.dart
> ```

## Version: 2.2.2

> 05 February 2025
>
> ```
> - Compatible with flutter latest version 3.27.x
> - Fix: Gradle versioning issues on android
> ```

## Version: 2.2.1

> 20 November 2024
>
> ```
> - Compatible with flutter latest version 3.24.x
> - Fix: Video player issues with youtube
> ```

> Changed Files
>
> ```
> - pubspec.yaml
> - lib/services/auth_service.dart
> - lib/widgets/video_player_widget.dart
> - ios/Runner/Info.plist (ios)
> ```

## Version: 2.2.0

[<mark style="color:purple;">Migrate to V2.2</mark>](https://doc.newsfreak.mrb-lab.com/updates/migrate-to-v2.2)

> 08 August 2024
>
> ```
> - Fixed notification issue. Added Onesignal notification.
> - Fixed UI deprecated issues according to the latest Flutter SDK
> - Compatible with Flutter latest version 3.24.x
> ```

## Version: 2.1.2

> 14 March 2024
>
> ```
> - Compatible with flutter latest version 3.19.x
> - Fix: Home categories sorting issue
> - Fixed an issue where sub-categories in the side menu were not connected to the main scroll controller
> ```

> Changed Files
>
> ```
> - pubspec.yaml
> - android/settings.gradle
> - android/build.gradle
> - android/app/build.gradle
> - android/gradle/wrapper/gradle-wrapper.properties
> - lib/blocs/notification_bloc.dart
> - lib/services/wordpress_service.dart
> - lib/tabs/profile_tab.dart
> - lib/widgets/drawer.dart
> ```

## Version: 2.1.1 (Hotifx for v2.1.0)

> 10 February 2024
>
> ```
> - Fixed an issue where some articles weren't loading
> - Fixed an issue where some articles from notifications and related articles weren't opening
> ```

> Changed Files
>
> ```
> - lib/models/article.dart
> - lib/pages/article_details/article_details_layout_1.dart
> - lib/pages/article_details/article_details_layout_2.dart
> - lib/pages/article_details/article_details_layout_3.dart
> - lib/tabs/profile_tab.dart
> ```

## Version: 2.1.0

> 06 February 2024
>
> ```
> - Added code preview and quote support in the post details screen
> - Added post views count. This feature can be disabled from our wordpress plugin
> - Added an option to disable/enable datetime in the app
> - Added a new screen for sub-categories and sub-categories are now removed from the category tab.
> - In the sidebar, the dropdown icon won't show if there is no sub-category.
> - Added Instagram-embedded post support in the post details screen
> - Added automatic slider for feature posts. This can be disabled from our wordpress plugin.
> - Fixed country flag issue in the changing language tab.
> - Fixed color issues of the tab bar and switches for dark mode.
> - 10+ UI Improvements and more...
> - Updated all packages
> - Updated with Flutter latest version 3.16.x
> ```

> Changed Files ([<mark style="color:purple;">Migrate to v2.1</mark>](https://doc.newsfreak.mrb-lab.com/updates/migrate-to-v2.1))
>
> ```
> - all folders from wordpress_app/lib (except lib/configs)
> ```

## Version: 2.0.5

> 19 November 2023
>
> ```
> - Updated with flutter latest version 3.16.x
> ```

> Changed Files
>
> ```
> - pubspec.yaml
> - lib/pages/home.dart
> - lib/tabs/home_tab.dart
> ```

## Version: 2.0.4 (hotfix-1)

> 13 September 2023
>
> ```
> - Fixed BorderRadius error on flutter latest version 3.13.3
> ```

> Changed Files
>
> ```
> - pubspec.yaml (Replace skeleton_text: ^3.0.0 with skeleton_text: ^3.0.1)
> ```

## Version: 2.0.4

> 20 August 2023
>
> ```
> - Fixed youtube video player issue
> - Fixed custom ad placement issue in the home screen
> - Fixed overflowing text error on some contents
> ```

> Changed Files
>
> ```
> - lib/services/app_service.dart
> - lib/cards/card6.dart
> - lib/pubspec.yaml
> ```

## Version: 2.0.3 (hotfix-1)

> 26 July 2023
>
> ```
> - Fixed latest articles not showing issue
> ```

> Changed Files
>
> ```
> - lib/services/app_service.dart
> ```

## Version: 2.0.3

> 17 July 2023
>
> ```
> - Fixed social links opening issue
> ```

> Changed Files
>
> ```
> - lib/models/app_config_model.dart
> - lib/services/app_service.dart
> ```

## Version: 2.0.2

Major update and recommended to all

> 16 July 2023
>
> ```
> - Dedicated wordpress plugin to control and customize the app
> - Added Material 3 support
> - Added social logins (Google, Facebook & Apple)
> - Added tags support at the bottom of the post details and tag-based posts
> - Added author-based posts
> - Added 3 new post details layout and ability to select specific layout
> - Added deep links (Open posts inside the app from outside links)
> - Added Native ads with placement options
> - Added Custom Ads with placement options
> - Added the ability to control all types of ads directly from wordpress admin
> - Added the ability to add category thumbnails from wordpress admin
> - Added the ability to add Youtube, Vimeo, and Network videos as video posts
> - Added social embedded posts support in the post details
> - Added table, SVG images, and audio support in the post details
> - Added country flags to the languages
> - Added date translation
> - Added reading time feature (like medium) in the post details
> - Added comment reply and ability to reply on specific comments.
> - Added missing email validation layer on forgot password screen
> - Added the dark logo for dark mode
> - Added onboarding screens
> - Added the ability to select special categories as tabs from the wordpress admin
> - Added the ability to remove special categories from the Home tab
> - Added the ability to hide video tab from wordpress admin
> - Added the ability to assign feature and video posts directly from the wordpress post page
> - Fixed time-ago conflicts
> - App UI improvements
> - Updated with flutter latest version 3.10x
>
>
> ```

## Version: 1.8.1(hotfix)

> 14 May 2023
>
> ```
> - Updated with flutter latest version 3.10.x
> ```

## Version: 1.8.1

> 30 April 2023
>
> ```
> - Updated with flutter latest version 3.7.x
> ```

## Version: 1.8.0

> 06 February 2023
>
> ```
> - Updated with flutter latest version 3.7.x
> - Added reset password feature
> - Added account delete feature from the app (According to appstore guidelines)
> - Added notification support for Android 13
> - Fixed ios notification permission issue
> - Fixed timimg issue on custom notifications
> - Fixed vimeo video issues
> - New wordpress configurations
> - New online documentation
> ```

## Version: 1.7.4

> 25 December 2022
>
> ```
> - Updated with flutter latest version v3.3.10
> ```

## Version: 1.7.3

> 27 September 2022
>
> ```
> - Android 13 support
> - iOS 16 support
> - Video player improvements
> - Fix: Snackbar issues
> - Updated all the packages
> - Updated with flutter latest version v3.3.x
> ```

## Version: 1.7.2

> 17 August 2022
>
> ```
> - Changed targetSDKversion to 33 (Android 13 support)
> - Fixed ALL_QUERY_PERMISSION ISSUE
> - Added an option to the Profile tab for users to request deletion of their account and data via email. (According to apple app store law)
> - Updated all dependencies..
> ```


# Getting Started

Welcome to the Newsfreak Configuration Document. You can configure your WordPress site and the app (Android & iOS) by following this doc.

{% hint style="info" %}
You can choose any WordPress news/blog theme. The app has no relation to the theme as the app will fetch the data automatically via **WP REST API**.
{% endhint %}

> * Before starting the configuration, Please make sure that your WordPress website is up and running.
> * Follow the WORDPRESS SETUP first and then follow the APP SETUP.

{% hint style="info" %}
Note: We provide installation/reskin service for the Newsfreak app. If you can’t do the installation by yourself, we can do that for you. You can check out our [Installation Plans](https://www.mrb-lab.com/installation-plans/newsfreak) for more details.
{% endhint %}


# 1. Install Plugins

Install and activate the plugins

You have to install some WordPress plugins which are mandatory for the app. You can install these plugins (from your WordPress dashboard > plugins) by searching for them. Install and activate them.

Four wp plugins are required for the app to run. All of them are completely free on the wp plugin store. So, you don't have to buy any plugins.

> 1. J[WT Authentication for WP-API](https://wordpress.org/plugins/jwt-authentication-for-wp-rest-api/) (Required)
> 2. [WordPress Popular Posts](https://wordpress.org/plugins/wordpress-popular-posts/) (Required)
> 3. [OneSignal – Web Push Notifications](https://wordpress.org/plugins/onesignal-free-web-push-notifications/) (Required)
> 4. [Pods - Custom Content Types and Fields](https://wordpress.org/plugins/pods/) (Required)
> 5. [Easy WP SMTP](https://wordpress.org/plugins/easy-wp-smtp/) (Optional but required if you're using any shared hosting server or if your wordpress email is not working. You should follow the additional steps required by following the plugin doc. This is required for sending reset password email to the users)
> 6. [WP REST Cache](https://wordpress.org/plugins/wp-rest-cache/) (Optional but recommended for speed up the data loading time)


# 1.1  JWT Authentication Setup

For User Authentication

This plugin is required for the authentication purpose of user registration & login. After installing and activating the plugin, you have to configure some stuff. You can follow their guide or follow the steps below:

* You have to edit your .htaccess file and add two lines of code there. You can get the file in your Cpanel > File manager > public\_html > your\_site directory. Now click on edit the file and add the following two lines under the **RewriteEngine On** line and click on Save changes at the top.

```
RewriteCond %{HTTP:Authorization} ^(.*)
RewriteRule ^(.*) - [E=HTTP_AUTHORIZATION:%1]
```

{% hint style="info" %}
Note: There are many .htaccess files in the Cpanel file manager. You have to edit the right one, or else the login/registration process in the app won’t work. So, How do you know which is the right one?  You have to edit the .htaccess file from the folder where you have stored your WordPress site. Example:&#x20;

a) If you have installed the site directly in the public\_html directory without creating any additional folder, then you have to edit the .htaccess file from the public\_html directory.

b) if you have installed the site with an additional folder, like public\_html/recipehour.xyz/ then you have to edit the .htaccess file from the recipehour.xyz folder. That’s it.
{% endhint %}

* Now, again you have to edit your **wp-config.php** file and add two lines of code. You will get the file in the same directory **Cpanel > File manager > public\_html> your\_site> wp-config.php**. Now click on edit the file and add the following two lines under the define( 'WP\_DEBUG', false ); line.

```php
define('JWT_AUTH_SECRET_KEY', 'your-top-secret-key');
define('JWT_AUTH_CORS_ENABLE', true);
```

* After adding these two lines of code, you have to add a top-secret key in the first line of the following code. To get the code go to this [url](https://api.wordpress.org/secret-key/1.1/salt/) and copy the **NONCE SALT** key and paste it here. After this, your lines will look like in the picture below:

<figure><img src="https://lh3.googleusercontent.com/edwtp9A7Am4i7tqkCmULNX7z7k7JDOaFyuhffP5tihLo2aU4TdeKYWSoFFYCWmL8BCw9opTRw3v0q6KCaE3TAxKob_Sw4VaGYkIcDvDeZbvwlDzZpw47Dhovt_goQKT18akWt3jjQf2yVzPMDICJS2DKhk3wCly48XAwkVG4mQSoCH5mmB7XUQSexH9G" alt=""><figcaption></figcaption></figure>

Now save the file. That’s it.


# 2. Import Newsfreak Assets

## 2.1 Import Json File

From the **main\_files/wp** folder, you will get a **newsfreak.json** file. From your WordPress Admin Dashboard,

Go to the **Pod Admin > Import/Export Packages > Import** and upload the **.json** file and click on continue.

***

## 2.2 Import Newsfreak Plugin

From the **main\_files/wp** folder, you will get a **newsfreak.zip** file. &#x20;

Go to your **WordPress Admin Dashboard > Plugins > Add New > Upload Plugin**.

Upload the plugin and activate it.

<figure><img src="/files/XblPMgLSVmOASTG7daX1" alt=""><figcaption></figcaption></figure>

***

After that, You will see a **Newsfreak Configs** option at the left bar of your WordPress admin dashboard. You can control and customize the app with that. Add your app details and save the configurations.

<figure><img src="/files/e5oxkeUZcyvfExP0gwjn" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
If you are using any cache plugins like LiteSpeed Cache or others then clear the cache after saving the configuration.
{% endhint %}


# 1. Flutter Installation

The complete application has been developed & built on Flutter. First, You have to install Flutter on your computer. You can use Both Visual Studio Code & Android Studio as IDE for Flutter. The steps are the same for both IDEs. We have used Visual Studio Code. So, Our Setup will be based on this IDE.

> To install flutter on your computer, follow the official documentation from Google. Flutter Official Site: <https://flutter.dev/>.

You can follow these YouTube videos to install Flutter too.

> * For Mac: <https://www.youtube.com/watch?v=9GuzMsZQUYs>
> * For Windows: <https://www.youtube.com/watch?v=T9LdScRVhv8>

{% hint style="success" %}
**The recommended compatible Flutter version is 3.29.2**
{% endhint %}

{% hint style="info" %}
Note: A Mac (Apple Desktop/laptop) device and an Apple developer account are required for the iOS setup. If you don’t have both of them, you can ignore the iOS steps.
{% endhint %}


# 2. Code Setup

After purchasing the app you will get a .zip file and unzip it. Inside the **main\_files** folder, you will get a folder named **wordpress\_app**. This is the source code of the app. You have to work on this to set up your app. Now open your IDE and open the **wordpress\_app** folder on your IDE. Wait some time to load the project.

Now go to the IDE terminal and run the following commands one after one :&#x20;

> * Run the following command on the IDE terminal to clean the whole project first.
>
> ```
> flutter clean
> ```
>
> * Run the following command on the IDE terminal to get all the required packages.
>
> ```
> flutter pub get
> ```

{% hint style="info" %}
Make sure these commands should be run from the root directory of the code.
{% endhint %}

<figure><img src="/files/5Q5VQoYvovyt5v8RlCeR" alt=""><figcaption></figcaption></figure>

Wait some time to get all the packages. Now, your project is ready for configuration.


# 3. Push Notification Setup

We have used Onesignal push notifications which use Firebase. With this, you can directly send notifications from your WordPress admin dashboard. You need to create a Firebase project for that.

> 1. First, go to the [Firebase Console](https://firebase.google.com/) and sign in with your email account and go to the console.
> 2. Then Create A project by your app name.

<figure><img src="/files/gTaC2MEDDPytZY6MCmNg" alt=""><figcaption></figcaption></figure>


# 3.1 Android Notification Setup

Follow the steps below:

* From your firebase console, open the project you have just created.&#x20;
* Go to the Project Overview and click on the **plus icon** and then click on the **Android Icon**.

<figure><img src="https://lh5.googleusercontent.com/wA6DOYAr2HxlFpffjqzEBVqWqAs4DVnBsXYCIA2BJEyxTJvixZ5wyxt6MOgJvtva2u_O1eT4nYdVblrAwX7zugWX3xh4KFA5JpqhO2W0eaVh1MONjqP6uiFuAJuhFLHWwR2dkGeCvR_gODxo0LAXntVSbYTdGz_b5zJjVrR3uJYQU1WbGTLM3BcajqGs" alt=""><figcaption></figcaption></figure>

* Enter your android package name.

{% hint style="info" %}
Your package name should be like com.your\_name.your\_app\_name . Example: **com.microsoft.skype**. You can use the same package name for android & iOS. iOS doesn’t support under space in the package name. So, keep in mind that if you want to use the same package name for both android & iOS.
{% endhint %}

<figure><img src="https://lh5.googleusercontent.com/PZ1JJDDPG4pof2yBnXOK9V5pRKY5tH18s7QTd3ZZ8aDmFPAwjRhKWt7KejVewaSIK7JaHiy_Z6w8yZ8SGEufQw3RkmQ4tDSfCIRuNc4HQG_ac1s0jF_tfiQrca-EKFY9gvgywfVs_DgcYBRrDbiH83_4He4RLDy07VFpcozVyr0RIoiJpAXcrNMu1cTc" alt=""><figcaption></figcaption></figure>

* Click on the register app and skip other steps by clicking next.&#x20;
* Now go to **Project Settings** and click on the android icon and download **​google-service.json** file.

<figure><img src="https://lh5.googleusercontent.com/kYi266_IM16oZH5Apd4bzI2qDkyLeckBxJC5MosyvoZKFJkZOC4FdklKC3h4Xx2RAcgfGZqOCBbKc3M4aIbH7B1ebJB2HDDk4HkoeEXEpJ88w6c7CISu444Dol9WqLN8Fb8B60l1PGXflmoKgrk0G4J5peTE6beWavxVpEKDsvTPRVxNfrchmUZKEB6P" alt=""><figcaption></figcaption></figure>

* Now go to ​the **wordpress\_app/android/app**​ directory and paste the **google-service.json**​ file here.

<div align="left"><figure><img src="https://lh4.googleusercontent.com/6XmlMWnO1l1_jEBzRnGgDRQB-mLxXXilzsfscFgBXO0EhRZYxBe91vJWmUw_tO4CJ20GntFFVjHKe6dq5o5kfUO4-OFv-CGkTMSpiTz_gKeexPAKeiWlhRLoUUdRRpAcZ6hKJ2n_oS7NGkRphcFzbDRQwFzrgBjEsdToV-ghRhMKSYO-YHpGqIKF-mA4" alt=""><figcaption></figcaption></figure></div>


# 3.2 iOS Notification Setup

Follow the steps below:

* From your Firebase Console > Project Overview,  click on the iOS icon and enter your iOS package name and click on the Register app and skip the other steps.

<div align="left"><figure><img src="/files/ufb3tNthnZN8pYxAWQXe" alt=""><figcaption></figcaption></figure></div>

* Now go to **Project Settings** and click on iOS and download the **GoogleService-info.plist**​ file.
* Then go to the **wordpress\_app/i​os/Runner** directory​ and paste the file here.
* Now, Open the iOS folder on Xcode by right-clicking on the iOS folder from VSCode or Android Studio and go to the runner folder and drag & drop the **GoogleService-info.plist​** file here. You will get a popup and click yes or confirm the popup message. That’s it.

{% hint style="success" %}
For iOS, Go to this [link](https://firebase.flutter.dev/docs/messaging/apple-integration) and follow the instructions. This is a well-written doc from Flutter Team. Please ignore the (Advanced, Optional) step from there.
{% endhint %}


# 3.3 OneSignal Setup

### 3.1.1 Android Setup for Onesignal

1. Create your Onesignal account from [here](https://dashboard.onesignal.com/) or use your existing Onesignal account and create an app.

<figure><img src="/files/x6pj6jjGZQ8mgWzLJ1Uc" alt=""><figcaption></figcaption></figure>

2. Enter your app name select Google Android FCM and click on Next.

<figure><img src="/files/kXO6AZv65uMqglNIKQnW" alt=""><figcaption></figcaption></figure>

3. For the next step, you need to download your **Firebase Admin SDK** from your Firebase project. Follow [<mark style="color:purple;">this (2 & 3)</mark>](https://documentation.onesignal.com/docs/android-firebase-credentials) to download the file and upload the JSON file here.

<figure><img src="/files/5WwAoa2gQJk6DXtuQqAJ" alt=""><figcaption></figcaption></figure>

4. In the next step, select **Flutter** as your target SDK.

<figure><img src="/files/t1AlrAAgx9jvic6zBBjA" alt=""><figcaption></figcaption></figure>

5. Click Save and Done to complete the Android setup.

### 3.1.2 iOS Setup for Onesignal

1. From 3.2, you will get your key (.p8 file) from your Apple developer account. For more details, you can check [this](https://documentation.onesignal.com/docs/ios-p8-token-based-connection-to-apns) out.
2. From Onesignal > Your app > Settings > Platforms, Select **Apple iOS.**

<figure><img src="/files/Mdr7CYMxFjQ9tUWHWG3k" alt=""><figcaption></figcaption></figure>

3. Now, upload your key, Key ID, Team ID, and iOS package name.

<figure><img src="/files/Ic6g7lvtxP1xdJHkQTKp" alt=""><figcaption></figcaption></figure>

4. Select Flutter as Your SDK if you get any sdk steps after this.
5. Save and activate this configuration.

### 3.1.3 WordPress Setup for Onesignal

1. From your WordPress Dashboard > Onesignal Push > Configuration, Add your **Onesignal App ID**, and **Rest API key**.

{% hint style="info" %}
You can get both the **Onesignal App ID** and **Rest API key** from your Onesignal Account > Your app > Settings > Keys & IDs.
{% endhint %}

<div align="left"><figure><img src="/files/HYLe3HEgyGm0PQ5kOfKq" alt=""><figcaption></figcaption></figure></div>

2. **Enable** Send notifications additionally to iOS & Android Platforms.
3. Save the configurations.

After this setup, you will get an option in your editor to send notifications on post updates.

<figure><img src="/files/CkgukbD1ThJJTkuK8KB8" alt=""><figcaption></figcaption></figure>

### 3.1.4 Update OneSignal App ID in the code

From Onesignal > Your app > Settings > Keys & IDs, You will get your **Onesignal App ID**. Copy this and update the ID in the **lib/config/config.dart** file.


# 4. App Information Setup

{% hint style="info" %}
Go to the **l​ib/config/config.dart​** file and change the existing values with all of your details.
{% endhint %}

> * Chnage the app name
> * iOS app ID (Only for iOS and you can ignore this for now)

{% hint style="info" %}
iOS app id can be found from your Apple developer account > Appstore Connect > Your App > App Information page. (This is required to open the AppStore app to provide ratings)
{% endhint %}


# 4.1 Change Package Name

## Android Package Name

{% hint style="info" %}
You have to use the same package name that you have registered in the firebase console.
{% endhint %}

* Go to your IDE and run the following command from your IDE terminal by changing the package name with yours.

```
flutter pub run change_app_package_name:main com.new.package.name
```

{% hint style="info" %}
Don’t forget to replace **com.new\.package.name** with your package name.&#x20;
{% endhint %}

***

## iOS Package Name

Go to the **i​os/Runner/Info.plist**​ file and replace the **CFBundleIdentifier value** with your **iOS package name**. (See the picture below)

<figure><img src="/files/lIpXyh7ICny7QK9OSIU7" alt=""><figcaption></figcaption></figure>


# 4.2 Change App Name

## Android

Go to the **a​ndroid/app/src/main/AndroidManifest.xml​** file and Change your app name.

<figure><img src="/files/a7g5RHGsf0SUSM2kSIXa" alt=""><figcaption></figcaption></figure>

***

## iOS

Go to the **i​os/Runner/Info.plist​** file and Change your app name.

<figure><img src="/files/aHdndATZPyO8gZLjO9oS" alt=""><figcaption></figcaption></figure>


# 4.3 Change App Icon

> * Go to the **assets/images** and delete the default icon (i**con.png**).
> * Now upload your app icon as png in the **assets/images** folder and rename it to **icon.png**

Now run the following command on the terminal:

```
flutter pub get
flutter pub run flutter_launcher_icons:main
```

This command will create android & iOS icons for your app.

{% hint style="info" %}
That’s it. For more info, visit this [site](https://pub.dev/packages/flutter_launcher_icons#-readme-tab-).
{% endhint %}


# 4.4 Change Splash Icon

To change the splash icon, you have to upload your own splash icon. The icon should be in the .png format and make sure you have renamed it to **splash.png**. Go to the **lib/assets/images** folder and drop the icon here and replace it with our icon. That’s it.


# 4.5 Change Logo

## Logo (Light Mode)

The logo icon should be in the **transparent .png** format and make sure you have renamed it to **logo.png**. Go to the **lib/assets/images** folder and drop the icon here and replace it with our icon. That’s it.

***

## Logo (Dark Mode)

Make sure you have renamed it to **logo\_dark.png**. Go to the **lib/assets/images** folder and drop the icon here and replace it with our icon. That’s it.


# 4.6 Change App Theme Color

Go to the **lib/config/config.dart** file and edit the **appThemeColor**. You can use any color and the changes will happen in the whole app.


# 4.7 On-Boarding Setup

## Change On-boarding Images

To change the Intro images, you have to use your own images. These images must be in .svg format. We have used images from the following site: <https://undraw.co/illustrations>. You can get the images from there too.

* Select your 3 images and rename them to **inro\_1.svg, intro\_2.svg** and **intro\_3.svg**.
* Go to the **assets/images** folder and paste and replace with the existing images.

***

## Disable On-Boarding Screens

You can disable the onboarding screen directly from the Newsfreak Configs plugin.


# 4.8 Update Website URL

Go to the **lib/config/wp\_config.dart** file and update the **baseURL** with your website url.

```
static const String baseURL = "your_website_url";
```

{% hint style="warning" %}
Don't use any slash (/) at the end of the URL. Just use like **<https://yourdomain.com>**
{% endhint %}


# 5. Run the App

{% hint style="warning" %}
Before doing that, Please make sure that you have followed all of the previous steps. Otherwise, it won't work.
{% endhint %}

{% hint style="info" %}
Before doing this, connect An Android Emulator from Android Studio or a real Android device or an iOS Simulator from Xcode, or a real iOS device.
{% endhint %}

Before running the app, clean the project & get the packages by running the following commands one after one:

```
flutter clean
```

```
flutter pub get
```

And finally, run the following command to run the app:

```
flutter run
```


# 6. Releasing the Android App

At Google Play Store


# 6.1 Generate Keystore File

Required to upload the app at Google Play

To generate a release certificate, You have to generate a Keystore file. To generate a Keystore file, run this command below from the root of your project directory.

{% tabs %}
{% tab title="Mac" %}

```
keytool -genkey -v -keystore ~/upload-keystore.jks -keyalg RSA -keysize 2048 -validity 10000 -alias upload
```

{% endtab %}

{% tab title="WIndows" %}

```
keytool -genkey -v -keystore c:\Users\USER_NAME\upload-keystore.jks -storetype JKS -keyalg RSA -keysize 2048 -validity 10000 -alias upload
```

{% endtab %}
{% endtabs %}

* Enter your details and remember the **password**. After this, you will get an **upload-keystore.jks** Keystore file.
* Locate this file and move the file into the **android/app** folder.
* Then go to the **android/key.properties**​ file and replace the ​**password​** which you have inputted to generate the Keystore file.

<figure><img src="https://lh5.googleusercontent.com/tYMAq1QSqHV4Zm_e407IT-QBg90hWj--VlbKT72QKhJBGYx-4NRnkL-9AhPoOnSYC1WN_Fgw4Xek96zBjMcZfBg7vOUSJn12TTw8DK_SqJl_aRGscZPLatWP7pTWOuZMLbr30doWuf259fK2YYZGkUqDmXNMAXyR8m7zyZhjb2c93EvoFR8-ba_F6oQs" alt=""><figcaption></figcaption></figure>


# 6.2 Uploading At Google Play

At Google Play Store

{% hint style="info" %}
Make sure that you have done all the things that are required for the android release.
{% endhint %}

To test the released android app, run the following command on the terminal:

```
flutter build apk --split-per-abi
```

You will get 3 apk files from the **build/app/output/apk/release** folder. You can test the **app-armeabi-v7a-release.apk** file on your android device.

{% hint style="warning" %}
If you want to publish the app in the google play store, don’t upload any of the following apk files. Use an **appbundle** file which is recommended by Google
{% endhint %}

To generate an appbundle, run the following command on the terminal:

```
flutter build appbundle
```

After that, you will get a .aab file in the **build/app/output/appbundle/release** folder.

{% hint style="success" %}
Now you can upload this .aab file to the google play store.
{% endhint %}


# 7. Releasing the iOS App

At Apple Appstore

{% hint style="info" %}
Make sure that you have done all the things that are required for the ios release.
{% endhint %}

{% hint style="success" %}
Follow the official doc from the flutter team [here](https://flutter.dev/docs/deployment/ios).
{% endhint %}


# 8. Multi-Language Setup

{% hint style="success" %}
You can skip this setup for now. This is not a mandatory setup to run this app.
{% endhint %}

So, we have used 6 languages in this app for demo purposes. English, Spanish, Arabic, Hindi, Bangla & French.

{% hint style="info" %}
You can add as many languages as you want. The multi-language feature is only for all of the static texts in the app. It's static and not related to the database.
{% endhint %}

{% hint style="info" %}
English is the default & Starting Language. You can change the default language too if you want.
{% endhint %}

## Editing An Existing Language

If your language is already available on the list and you want to make some changes, then follow the steps below:

Example: If your want to change some text in the Spanish language, then open the **assets/translations/es-ES.json** file and edit only **right-side values**.

<figure><img src="/files/112DSpEizflOD9nQwdCw" alt=""><figcaption></figcaption></figure>

{% hint style="warning" %}
Don't edit the keys (Left side values)
{% endhint %}

***

## Adding A New Language

If you want to add a new language that is not available in the default list, follow the steps below:

* First, go to the **assets/translations** folder from your IDE. Add a .json file here with <**language\_code>-\<country\_code>.json** name. Now go to the **assets/translations/en-US.json** file and copy everything from this file and paste it to your newly created .json file.

<div align="left"><figure><img src="/files/fvSTd7BGgV9cw7cwkTIH" alt=""><figcaption></figcaption></figure></div>

* Now, Rename the all right-side strings. Look at the es.json file and you will understand what to do.

{% hint style="warning" %}
Don't edit the keys (Left side values)
{% endhint %}

* Now go to **lib/config/language\_config.dart** the file and add your language code to the **language** list.

<figure><img src="/files/2SKLni2lsper654pA66M" alt=""><figcaption></figcaption></figure>

Your code should look like this:

```
"<Language_Name>": [<'Language_Code'>, <'COUNTRY_CODE'> ]
```

* For Android, you don’t have to do anything.
* For iOS, go to **ios/Runner/Info.plist** and add your language code in a string. Look at the picture below.

<figure><img src="https://lh5.googleusercontent.com/EkhzVmyi31RxPNhRSkzSNl3ZVnt6_x9erkBZcWohRlAzqmdV_H7x_mppnwBB8yDksaME_2YaJtdoVy3Ky6-pW4lHgKaKYwqkfaj6KKVT_YSkhxM5hn4ntwit3SlN_7qLWDjcA4-61l4p3ICWk5gPGw" alt=""><figcaption></figcaption></figure>

* Add  **\<string>your\_language\_code\</string>** inside the array. That's it

***

## Removing An Existing Language

To remove any language that is available in the list, please follow the steps below:

> * Go to the **asset/translations** folder and delete the your\_language\_code.json file that you want. (You shouldn't delete the en.json file because this is the default language).
> * Now go to **lib/config/language\_config.dart** file and remove the list item that you want to remove from the **langauges** list.
> * And finally go to **ios/Runner/Info.plist** and remove the string. That’s it. (Only for iOS)

## Start Locale Setup

English ('en') is added as the start language of the app by default. If you want to add any other language as a Start Language then go to the **lib/language\_config.dart** file and replace the **startLocale** and the **fallbackLocale** values with your own local values.

***

## Disable Multi-Language Feature

You can disable the multi-language feature directly from the Newsfreak Configs Plugin. If you do that, changing language option will be hidden from the app and the app will run with the default language.


# 9. Ads Setup


# 9.1 Admob Setup

{% hint style="info" %}
We have used Admob ads by default with test unit ids. To test the ads, you should test with the test unit ids. Before releasing the app for production, make sure you have changed the app ids and ad unit ids with yours. Admob is applied by default. So you don’t have to do anything before releasing.
{% endhint %}

We have used 3 types of AdMob ads. Banner, Interstitial & Native Ads. You can control the ads directly from the Newsfreak Configs plugin.

<figure><img src="/files/C7WHj6BZ93Ut1YobnPO1" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/mcO8nM1acC0hoccZ0jzD" alt=""><figcaption></figcaption></figure>


# 9.1.1 Admob Setup for Android

{% hint style="warning" %}
Follow these steps only for production (release):
{% endhint %}

* From your AdMob account, create an app for Android. You will get an **app id** for Android.
* Create 3 ad units. One banner, One Interstitial & One Native Ad.
* Now, go to the **android/app/src/main/AndroidManifest.xml** file and change the AdMob app id(Android) with yours.

<figure><img src="https://lh4.googleusercontent.com/cyIYSrQi2wyQF4RbDJbGUyVPKShtGCcek-rZwNCJ65pFa29_aq6wEnuneAlzMf__FISLqK4icehONb-K18L2bNZGDbdlpB8jEu2skt9bMvseuuJiq-ZGJO4boXljKk_oJQ-tuJCBlnrqk4wlqKKfw9tUYJuhnETdp-ShNigFuuqcDMN3w_TNMjlqFYHM" alt=""><figcaption></figcaption></figure>

* Go to the **lib/config/ad\_config.dart** file and change the ad unit ids with your values.

<figure><img src="/files/htCP2cg2Q27yLpZnKBPG" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
Ignore the iOS ids if you don’t want to make the app for iOS.
{% endhint %}


# 9.1.2 Admob Setup for iOS

{% hint style="warning" %}
Follow these steps only for production (release):
{% endhint %}

* From your AdMob account, create an app for iOS. You will get an **app id** for iOS.
* Create 3 ad units. One banner, One Interstitial & One Native Ad.
* Now, go to the **ios/Runner/Info.plist** file and change the AdMob app(iOS) with yours.

<div align="left"><figure><img src="/files/Ke893Hs5dkLhPnHFJDch" alt=""><figcaption></figcaption></figure></div>

* Go to the **lib/config/ad\_config.dart** file and change the ad unit ids with your values.

<figure><img src="/files/m1PRVIIG4P1EmTQ0Pj4c" alt=""><figcaption></figcaption></figure>


# 9.2 Custom Ads Setup

Control your custom ads directly from the Newsfreak Configs Plugin.

<figure><img src="/files/7ulhAWTl2kEOiJeDKoIi" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/pPbCNKCsh91FDsjRPqIz" alt=""><figcaption></figcaption></figure>

{% hint style="danger" %}
You need to choose one between native ads and custom ads. If native ads are enabled, custom ads will be ignored.
{% endhint %}


# 10. Social Logins Setup

Social Logins are optional. By default, it is disabled. If you want to add this feature, follow the steps one by one.


# 10.1 Google Login

Go to your Firebase console>Your Project>Authentication>Sign-in-method and enable **Google** and save it.

<div align="left" data-full-width="false"><figure><img src="/files/kaT78YcZfr674eXpRHnS" alt=""><figcaption></figcaption></figure></div>

## Android Setup

1. You have to configure some stuff for Google sign-in. Go to the Google Cloud Console.

> Google Cloud Console: <https://console.cloud.google.com/apis/credentials/consent?project=travel-hour-252505>

2. Make sure you are signed in with the same account with which you have created the Firebase project. Also, make sure that on the top-left corner, your project is selected for which you are filling this consent.

<figure><img src="/files/9gtZhm6X1tgkguMVPXc4" alt=""><figcaption></figcaption></figure>

3. Now Click on the **OAuth consent screen tab > External > Create** and start filling out the form.
4. Enter the **Application name**, **Application logo** & **Support email**.

<figure><img src="/files/D0DenrmKEq7fahoyuY64" alt=""><figcaption></figcaption></figure>

5. In all these places, you have to enter the same link starting with **https\://** then your app domain name which I have marked with green below.
6. Then, scroll down and fill in the Application Homepage link, Application Privacy Policy link, and Application Terms of Services link.

<figure><img src="/files/1Go5PLCatxNkg9JOJNI7" alt=""><figcaption></figcaption></figure>

7. Save the form by clicking on the Save button.

### Generate Debug Certificate

* To generate a debug certificate, run this command on your terminal from your app

  root directory.

{% tabs %}
{% tab title="Mac" %}

```
keytool -list -v \
-alias androiddebugkey -keystore ~/.android/debug.keystore
```

{% endtab %}

{% tab title="Windows" %}

```
keytool -list -v \
-alias androiddebugkey -keystore %USERPROFILE%\.android\debug.keystore
```

{% endtab %}
{% endtabs %}

{% hint style="info" %}
If this command doesn’t work, then go to this [link](https://developers.google.com/android/guides/client-auth) and copy the debug command from there according to your os.
{% endhint %}

* Use ​**android** as a debug password when the terminal asks for a password.

<figure><img src="https://lh6.googleusercontent.com/f8BzDO8crzYiwc2v7AfkKyJq1yFmoF6IwFblbkm89LrcKJWkRVuxxgxiTCrVyjxNQaffwhoaaXoPpNy5GBPIw869tiOZzlZ_lxfJezWD9D924HhKCEC8ET3-ahE8xRYJiQZsjUt2L1NC76p17zapQyRy-AP55MvHG-H5PRN_0zpn7RGGxlhVBnyN5-Zu" alt=""><figcaption></figcaption></figure>

* Copy the **SHA1** certificate code and go to **Firebase Console > Your Project > Project Settings** and click on the android icon and then add the **SHA1** code by clicking ​**add fingerprint​** button. Look at the picture below:

<figure><img src="https://lh3.googleusercontent.com/NiFFfBOiIGw_FxsQ_DDn57E3-Q9LvspXdAdpmred0Z1eXBM_1SFFDjIW-CUHEi7YnmQKoBf2JGi3LysoNoqZH9jh0iNIPOap0WZQULQvURTiOqx9gOyk-n2Nnm_H_pY6JnEj4uZVbl6GsLWtGquqEbB83w12csRd3u8hVdMliaV47CoyVAdCBZWG9rTZ" alt=""><figcaption></figcaption></figure>

### Generate Release Certificate

To generate a release certificate,

* Run with replacing your **alias\_name** and **keystore\_location**.

```
keytool -list -v -keystore keystore_location -alias alias_name
```

{% hint style="info" %}
Your alias\_name is **upload** and keystore\_location is the path(directory) of the **upload-keystore.jks** file.
{% endhint %}

* After that, you will get a **SHA1** code. Copy that code and add it to your **Firebase Console > Project Settings >  Android**, where you previously added a debug SHA1 code.

<figure><img src="https://lh3.googleusercontent.com/NiFFfBOiIGw_FxsQ_DDn57E3-Q9LvspXdAdpmred0Z1eXBM_1SFFDjIW-CUHEi7YnmQKoBf2JGi3LysoNoqZH9jh0iNIPOap0WZQULQvURTiOqx9gOyk-n2Nnm_H_pY6JnEj4uZVbl6GsLWtGquqEbB83w12csRd3u8hVdMliaV47CoyVAdCBZWG9rTZ" alt=""><figcaption></figcaption></figure>

***

## iOS Setup

From the Source code, go to the **ios/runner/**&#x200B;**GoogleService-info.plist**​ file from your IDE or from  Xcode and copy the **REVERSED\_CLIENT\_ID**. (See the picture below)​

<figure><img src="/files/BwvCi2EUZy9Iyj92QENr" alt=""><figcaption></figcaption></figure>

* Go to the **i​os/Runner/Info.plist​** file and replace the **R​EVERSED\_CLIENT\_ID** here.

<figure><img src="/files/tbQ3ulYSyemLdvMlAIeV" alt=""><figcaption></figcaption></figure>


# 10.2 Facebook Login

{% hint style="warning" %}
Facebook login requires **business verification** now. So, If you have any organization that completed the business verification process, then you can set up the Facebook login. Otherwise, skip this.
{% endhint %}

{% hint style="info" %}
You can use social logins by disabling the Facebook login. You can disable Facebook login directly from the Newsfreak Configs plugin.
{% endhint %}

* Go to this ​[URL](https://developers.facebook.com/) and create an account if you don't have an account.
* Go to My Apps > Create App > Other > Consumer.
* Enter the App name and email and go to the Dashboard tab.

<figure><img src="https://lh4.googleusercontent.com/LZUrxaeFyo1FH1a7Cwy3_FdkY20WJ4PaC_y8H2eKnHja_J_nOzECN9NAFtD1T_s_bp1Kx_Tr615AEt2NHjUCn63KOo8cTwbjEMXu6s763SLuvTcfVfdh0BG4fRbi033EYPXxVXDmZsBGtW2umCVsYH5mb3cVfeVRI4aLm9KPaOLACcCHsPBJB064-RE8" alt=""><figcaption></figcaption></figure>

* Scroll down on the right pane until you reach ‘Add a product’, select Facebook Login&#x20;
* You will be redirected to the quick start page.

***

## Android Setup

* Select Android. Skip 1 & 2.
* Enter **your\_package\_name** in the package option and enter **your\_package\_name.MainActivity​** in the activity option.

{% hint style="info" %}
**your\_package\_name** is the package name of your Android app
{% endhint %}

> For the next step, you need to generate two hash ids. To do that, run the following commands on the terminal.

{% tabs %}
{% tab title="Mac" %}

```
keytool -exportcert -alias androiddebugkey -keystore ~/.android/debug.keystore | openssl sha1 -binary | openssl base64
```

{% endtab %}

{% tab title="WIndows" %}

```
keytool -exportcert -alias androiddebugkey -keystore "C:\Users\USERNAME\.android\debug.keystore" | "PATH_TO_OPENSSL_LIBRARY\bin\openssl" sha1 -binary | "PATH_TO_OPENSSL_LIBRARY\bin\openssl" base64
```

{% endtab %}
{% endtabs %}

* Use ​**android**​ as a debug password. After that, you will get a hash id like this.

<figure><img src="https://lh4.googleusercontent.com/VGAPLDNgDz1kC1o3e_qhHwQJ3bJGOVRJlsVASR5fjBLKOLF3lQT6BKjiiO9CRsVOimtnUZC6M-txuD4RNg3-RE1Ti-2XX2jKs6Y_HVNQk3ZZxsr4TPX5He8BG7UfTKcexA7zrVFPLFg8usv4kT6S1KVB4R4FvDeo_Yvvb4LMXbGBck8APFs8glMbRNbF" alt=""><figcaption></figcaption></figure>

* For the release hash id, run the following command by replacing your **YOUR\_RELEASE\_KEY\_ALIAS** and **YOUR\_RELEASE\_KEY\_PATH**. You can get these from your **a​ndroid/key.properties** ​file.

```
keytool -exportcert -alias YOUR_RELEASE_KEY_ALIAS -keystore YOUR_RELEASE_KEY_PATH | openssl sha1 -binary | openssl base64
```

* After that, you will get another **hash id**. Now, copy and paste them into the next steps of the Facebook developer site. Like this,

<figure><img src="https://lh5.googleusercontent.com/mJQCQrssuY0MhConK4o64otgSH-3h-FQmQMcPrtNuUqB6Zks3WqstSgPl6ax-_XIcoYJ7AZs6edqbDX7SI4pvZnVUJTsCBQ-zE57FNYHBnSNYXbPvfr_5r6N5EgtEbH_ix4SsU2xKguQddAEGCQNDDBWChkSm0l3Jj43ZCYzPLNhoLygLdLj0gq8qK3T" alt=""><figcaption></figcaption></figure>

* Skip all the steps by clicking next.
* Now go to the **Settings tab > Basic** & copy both the **app id**.
* Now, from the source code, go to ​**android/app/src/main/res/values/strings.xml** file​ and change the **facebook\_app\_id** and **facebook\_client\_token**.

<figure><img src="https://lh5.googleusercontent.com/UxZOD8g90c4Y0QQkPdfU__zk03ESq9WGxojaxg7fNjGj6f24Lyyil0SGmnr5589hKBhXijfs5bIbLMXWk5ozqXsICFmPBRbYPFqk6V8pAZIgIMBVQ5GO1_cx_UeOFMMQQwv0jn-tKfmvcs5h2xz6P5hYMPKz_SF8FsmTGnJPpBShchtCyZCA5a1QICSC" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
You will get the **Facebook client token** from  <https://developers.facebook.com/> > Your\_app > Settings > Advance tab.
{% endhint %}

***

## iOS Setup

* Go to [Facebook Dev Site](https://developers.facebook.com/) again and navigate to your project and click Facebook login > Quickstart > iOS icon.
* Skip 1 & go to step 2.
* Enter your **ios package name** in the **bundle ID** ​option & skip others by clicking next.
* Now, from the source code, go to the **ios/Runner/Info.plist** file and replace your **FacebookAppID, FacebookDisplayName**(Your App Name) & **FacebookClientToken.**

{% hint style="info" %}
You will get the **Facebook client token** from  <https://developers.facebook.com/> > Your\_app > Settings > Advance tab.
{% endhint %}

<figure><img src="https://lh4.googleusercontent.com/1tf5KOpccNmz8cYqkBB6fYGqXRcXgbOH25R6V_sRyyiyEdwHrnQ4ft5oKd9A3cWG_RDcQxdGxvIlaLU07p1BSK3xoLEOo_bxYM0qL2OGQDYNtPhk855j5DXyeOLY7Y7r4J1Qpm1b5yxI1oilkmYImI7qeUYSWduRWwY4qt3BQ0kl-WDMy9gS05ZwHiHF" alt=""><figcaption></figcaption></figure>


# 10.3 Apple Login

Only for iOS

{% hint style="warning" %}
A paid Apple developer account and Xcode app on your Mac are required.
{% endhint %}

* From your IDE, Right click on the ios folder and click on open on Xcode and then go to runner > sign in & capability tab.

<figure><img src="https://lh5.googleusercontent.com/RvYYFr0Lj9AbDACK10oRt-qWMrggl99znz4ea2aJO1ezcZ4gHwYb0i1Zk96zBo2gMBPoTSmaFPHwgQYNNA4_KWq4D26bhjUwh4pup-iASQAkP_QoRop1EQQ-TYhsgjYTLRQJpjpR8yS0C4yplv_okxVAv5ygFqYG7pHZGThvpBssfH7mgw3qWmAT4jTA" alt=""><figcaption></figcaption></figure>

* Add **Sign in with Apple**. We already did this in the project. If this is not available in the project, do this by yourself.
* Now go to your Firebase console > your project > authentication page and enable the Apple sign-in option. You don’t have to put anything in the text fields.

<figure><img src="https://lh4.googleusercontent.com/nB_mYeCZ39oVc2Vy49x9SrMxCC2SZM48EDcJ4rnk4wFvBoaKI8BaL0fVIDX-s0bLwPFZWriufAbBTPE6Dp8ZOXvSKFRg2-h0jv5xwcGV7Wv-QckCra6EbXt89SJZbjUDaWok8mUNC80O2bd5Z3jXQFVtmAx4H8KsJ-UujVopDjKmXw48rfo9zuMfaUch" alt=""><figcaption></figcaption></figure>


# 11. Deep/App Links Setup

### How Deep/App Links Work?

If you enable deep links, users can directly open a particular post in the app from a link from your website. For example, You shared a post link of your site with your friend on WhatsApp or somewhere else. After clicking the link, if your friend already installed your app then the post will be opened inside the app, otherwise it will be opened on a browser.&#x20;


# 11.1 WordPress Setup

In your WordPress Admin Dashboard > Settings > Permalinks, make sure you have selected the **Post Name** as Permalink structure.

<figure><img src="/files/bgjgu25C3Zuu8Zqq3nAZ" alt=""><figcaption></figcaption></figure>


# 11.2 Android Setup

1. From your Cpanel, go to the **File Manager > Your Site > .well-known** folder and create a file named **assetlinks.json** and open the file and insert the following code.

```json
[
    {
        "relation": [
            "delegate_permission/common.handle_all_urls"
        ],
        "target": {
            "namespace": "android_app",
            "package_name": "com.mrblab.newsfreak",
            "sha256_cert_fingerprints": [
                "56:35:86:19:1F:37:76:31:7F:16:F5:48:0F:8A:67:D8:42:3A:98:09:A0:45:3D:18:E9:F1:40:04:CB:30:52:54",
                
                "4C:5F:7D:8F:45:F8:AF:BF:06:21:FA:76:0A:A5:FC:0B:17:38:42:7F:55:DE:B8:BA:50:85:D4:DA:DD:0B:63:C9"
            ]
        }
    }
]
```

2. Replace the package\_name value with your **Android package name**.
3. Now you need to generate two **sha256** fingerprints (Debug and Release).
4. Replace the **sha256\_cert\_fingerprints** values with your values.&#x20;
5. Save the file. Now, You can check on this site if your deep link setup working not: <https://developers.google.com/digital-asset-links/tools/generator>

<figure><img src="/files/tYBSnzU7Emo9iZlBcYNh" alt=""><figcaption></figcaption></figure>

5. From the source code, go to the **android/app/src/main/AndroidManifest.xml** file and add your site URL.

<figure><img src="/files/nfuhvq8NcCK0v40EMnz9" alt=""><figcaption></figcaption></figure>

That's it. Android configuration for deep/app links is complete.


# 11.3 iOS Setup

1. From your Cpanel, go to the **File Manager > Your Site > .well-known** folder and create a file named **apple-app-site-association** and open the file and insert the following code.

```json
{
  "applinks": {
      "apps": [],
      "details": [
      {
        "appID": "V2M9M9Y2.com.mrblab.newsfreak",
        "paths": ["*"]
      }
    ]
  }
}
```

2. Now, replace the appID value with your **"\<teamID>.\<ios\_package\_name>"**

{% hint style="info" %}
You can get Team Id from your ios developer account and the iOS package name is the package name of your ios app which you have created before.
{% endhint %}

2. Save the file.
3. From the source code, go to the **ios/Runner/Runner.entitlements** file and add your website URL. (Don't add any http/https scheme)

<figure><img src="/files/Gc1k2t4JwX9NqbGPXnGr" alt=""><figcaption></figcaption></figure>

4. Go to the **ios/Runner/Info.plist** file and add your site URL. (Don't add any http/https scheme)

<figure><img src="/files/wEAa7kJpFK1kajjbv7Od" alt=""><figcaption></figcaption></figure>

That's it. iOS configuration for deep/app links is complete.


# 12. Featured Posts Setup

How to assign posts as featured in the app?

> Feature posts will show at the top section of the home tab (Look at the picture below). You can assign up to 5 posts as featured posts.

![](/files/ad1kB3ZwEFNJ3u6daoPP)

***

## Assign Feature Posts

> To set featured posts, Open any post in your WordPress dashboard and scroll down to the bottom section. Set the Featured Post value to Yes and update the post.

<figure><img src="/files/IsmdAoZLFAUDWz398Jpt" alt=""><figcaption></figcaption></figure>

***

## Disable Feature Posts

You can hide/disable featured posts from the Newsfreak Configs Plugin.


# 13. Video Posts Setup

How to assign posts as video posts in the app?

Video posts are different than normal posts. Look at the picture below. A video will be shown at the top section of the screen.

<img src="/files/mh4rR5mXgn6MoE1YIi6O" alt="" data-size="original">

{% hint style="info" %}
You can add Network, Youtube, and Vimeo videos as video posts. The app will show only one video. So, if you add a Network video then Youtube and Vimeo videos will be ignored. So, Just add one type of video.
{% endhint %}

{% hint style="info" %}
You can add only one video for a video post. If you want to add multiple videos inside a single post, then don't assign them as Video Posts. Multiple videos are supported in a normal post.
{% endhint %}

***

## Assign Video Posts

> To set video posts, Open any post in your WordPress dashboard and scroll down to the bottom section. Set the Video Post value to Yes and add your video and update the post.

<figure><img src="/files/qVcNPY2e799TSS3bDk6B" alt=""><figcaption></figcaption></figure>

***

## Disable Video Tab

If you want to disable the video tab from the app, you can do that directly from the Newsfreak Configs plugin. Video posts will work but the video tab will be hidden.


# 14. Home Categories Setup

Special categories in the Home Tab

You can see on our demo app that special 4 categories are available on the home screen. You can add up to 10 categories here.

![](/files/gnFUYfHQzoiylb00yDkl)

***

## Assign Home Categories

You can add home categories directly from the Newsfreak Configs Plugin.

<figure><img src="/files/QblXpCuVxBDdu5IUJ05E" alt=""><figcaption></figcaption></figure>

***

## Disable Home Categories

You can also hide home categories if you don't want them. To do that, just don't select any categories. See the screenshot below with no home categories.

![](/files/sKUNlXCp8txK05Z0IlrX)


# Migrate to v2.2

### WordPress Setup

* Deactivate the **FCM Push Notification from WP** plugin. This is not required now.
* Install Onesignal Plugin which is added in the **1. Install Plugin**
* From 2.2, **Deactivate & delete** the old **Newsfreak App Functions plugin** and upload and activate the new one which you will get from the updated main\_files folder. The new plugin version is **1.1.2**.

### App Setup

Since many files have been edited for new flutter updates and new configurations have been added, we recommend using the latest code for updating your app.

* Use the latest Flutter version 3.22.x
* Use the latest code
* Follow 2, 3.1, 3.2 (Use your previous Firebase project)
* Follow 3.3, 4 (all)
* Follow 6.1 (Use your previous keystore file)
* Follow 8, 9.1.1, 9.1.2, 10.1 (iOS part only), 10.2
* Follow 11.2 & 11.3 (Update the app code only)


# Migrate to v2.1

### WordPress Setup

* Follow 2.1
* From 2.2, **Deactivate & delete** the old **Newsfreak App Functions plugin** and upload and activate the new one. The new plugin version is **1.1.0**.

### App Setup

* Replace all folders from **wordpress\_app/lib** (<mark style="color:blue;">**except lib/configs**</mark>)


# Migrate to v2.0

### WordPress Setup

* Disable/Delete the previous snippet. Go to **Snippets** and disable the **Newsfreak App** Snippet. You can delete the Snippet plugin. It is not required from now.
* From the **WORDPRESS SETUP**, follow: 1 (Install missing plugins), 2

### App Setup

* Use the new source code.
* From the **APP SETUP**, follow 1 (Use Flutter latest version 3.710x), 2, 3.1(Only place the **google-service.json** file), 3.2(Only place the **GoogleService-info.plist** file).
* 4, 4.1-4.7
* 6, 6.1(Use your old keystore file)
* 8, 9, 10, 11, 12, 13, 14


# 1. No Internet Issue

After completing both WordPress Setup and App setup, If you are facing **No Internet** problem in the app then check out the solution below.

## Why is this happening?

The issue can happen when the **Newsfreak Configs** plugin doesn't return any data. You can check whether your site returning any data or not from the endpoint below:

> <https://example.com/wp-json/newsfreak/configs>

{% hint style="info" %}
Don't forget to replace the **example.com** with your website domain.
{% endhint %}

If your configuration is successful then the endpoint will return a list of data otherwise it will return no data.

## Fix:

1. You need to make sure that you have followed **2.1** from [<mark style="color:purple;">here</mark>](https://doc.newsfreak.mrb-lab.com/wordpress-setup/2.-import-newsfreak-assets#id-2.1-import-json-file).
2. You need to save the form in the **Newsfreak Configs** first. Don't forget to add your **purchase code** in the Purchase code field.

{% hint style="danger" %}
If your purchase code is not correct, then it won't return any data. Where is your purchase code? Check this out: [link](https://help.market.envato.com/hc/en-us/articles/202822600-Where-Is-My-Purchase-Code-)
{% endhint %}

1. After saving the form successfully, Clear the cache if you are using any cache plugins like LiteSpeed Cache or others.
2. Now check out the endpoint again. It should return data now.