Mighty News - App Intro Video
MightyNews app is a smart Flutter news app. It contains Flutter source code and to build your news application with most useful features and eye-catching outlook. If you are planning to deploy your news app project for android and ios users, then it’s your perfect match to have on your hand. The product comes with current weather update, breaking news tab, topics to filter, push notification as well as RTL support. You can customise a bit and decide what to show or not into the app real-time.
Mighty News - App Intro Video
Android Studio: Android Studio Giraffe | 2022.3.1
Flutter: 3.13.x
Flutter is Google’s UI toolkit for building beautiful, natively compiled applications for MOBILE, WEB, and DESKTOP from a single codebase. It is very easy to learn and currently it is getting more and more popular. With this blog post, you will learn some basic stuff about Flutter and after reading it, you will be able to create a simple application using this technology.
Click here to check out more details about flutter.
Prerequisite
Step 1 : Get the Flutter SDK
1 Download the following installation bundle to get the latest stable release of the Flutter SDK:
2 Extract the zip file and place the contained flutter in the desired installation location for the Flutter SDK (for example, C:\src\flutter; do not install Flutter in a directory like C:\Program Files\ that requires elevated privileges).
Step 2 : Update your path
If you wish to run Flutter commands in the regular Windows console, take these steps to add Flutter to the PATH environment variable: From the Start search bar, enter ‘env’ and select Edit environment variables for your account. Under User variables check if there is an entry called Path:
Step 3 : Run flutter doctor
From a console window that has the Flutter directory in the path (see above), run the following command to see if there are any platform dependencies you need to complete the setup:
c:\src\flutter>flutter doctorStep 1 : Get the Flutter SDK
Step 2 : Update your path
To update PATH variable, we need to open terminal.
To update PATH variable for current terminal window only, then enter this command "export PATH="$PATH:`pwd`/flutter/bin"" and hit enter key.
To update PATH variable permanently, then Open or create .bash_profile file. to open or create that file, then enter "sudo open -e $HOME/.bash_profile" and hit enter key.
Append below line to bash_profile file at bottom of all other content. "export PATH="$PATH:[PATH_TO_FLUTTER_GIT_DIRECTORY]/flutter/bin"" as [PATH_TO_FLUTTER_GIT_DIRECTORY] is actual path of SDK folder.Run this command on terminal "source $HOME/.bash_profile" to refresh PATH variables.
Then check whether our SDK is successfully installed or not.
You are now ready to run Flutter commands in the Flutter Console!
Run "flutter doctor" into terminal, If you are getting check list of flutter sdk requirements, it means SDK is successfully installed on your machine. and you can start building flutter apps on your machine.
If you find any issue during environment setup in macos, please go online Click here
Step 1 : Get the Flutter SDK
Step 2 : Update your path
You’ll probably want to update this variable permanently, so you can
run flutter commands in any terminal session. To update PATH variable, we need
to open terminal.
export PATH="$PATH:[PATH_TO_FLUTTER_GIT_DIRECTORY]/flutter/bin"source $HOME/.
to refresh the current window, or open a new terminal window to
automatically source the file.
flutter/bin
directory is now in your PATH by running:
echo $PATHVerify that the flutter
command is available by running:
which flutterDownload Project
Download and find the your project folder, use your preferred IDE (Android Studio / Visual Studio Code / IntelliJ IDEA) to run the project.
Get Dependencies
After you loaded project successfully, run the following command in the terminal
to install all the dependencies listed in the pubspec.yaml
file in the project's
root directory or just click on Pub get
in pubspec.yaml file if you don't
want to use command.
flutter pub get
Build and Run App
After the app build completes, you’ll see the app on your device.
If you don’t use Android Studio or IntelliJ you can use the command line to run your application using the following command
flutter runYou will see below like screen after you have build your app successfully
Try hot reload
Flutter offers a fast development cycle with Stateful Hot Reload, the ability to reload the code of a live running app without restarting or losing app state. Make a change to app source, tell your IDE or command-line tool that you want to hot reload, and see the change in your simulator, emulator, or device.
Setup Firebase
Setup AdMob
Now, replace ca-app-pub-1399327544318575~7586962359 with your new generated application id.
Open Android module in Android Studio
Change Application Name
manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.example">
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<application
android:name="io.flutter.app.FlutterApplication"
android:label="YOUR_APPLICATION_NAME"
android:icon="@mipmap/ic_launcher">
<activity>
Change Application Icon
Change Application ID
defaultConfig
{
applicationId "YOUR_APPLICATION_ID"
minSdkVersion 21
targetSdkVersion 29
versionCode 1
versionName "1.0.0"
testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
}
Generate Signed APK
Select Build variants - release and Signature versions both V1 and V2 respectively as shown above screen shot and click Finish button.
Open Project in Xcode
Change Bundle Name
Change Bundle Identifier.
Bundle Id is a unique Identifier of your of app on iOS and MacOS. iOS and MacOS use it to recognise updates to your app. The identifier must be unique for your app.
Change App Icons
Change Admob App Id
<key>GADApplicationIdentifier</key>
<string>Add your Admob appId</string>
Google SignIn:-
In iOS Integration
Open Xcode and then open Info.plist file.
<key>CFBundleURLTypes</key>
<array>
<dict>
<key>CFBundleTypeRole</key>
<string>Editor</string>
<key>CFBundleURLSchemes</key>
<array>
< TODO Replace this value:>
< Copied from GoogleService-Info.plist key REVERSED_CLIENT_ID>
<string>"Enter your REVERSED_CLIENT_ID"</string>
</array>
</dict>
</array>
Apple SignIn:-
Create a Firebase project
Before you can add Firebase to your Flutter app, you need to create a Firebase project to connect to your app. Visit Understand Firebase Projects to learn more about Firebase projects.
Visit for more information on how to setup for Android
Visit for more information on how to setup for iOS
Register your app with Firebase
Add a Firebase configuration file
Follow the instruction for enabling Firebase services in your Android app here
Enable the Google, Phone and Apple SignIn
Firebase configuration for web apps
Open your firebase console and follow steps shown in video tutorial for flutter web app configuration.
Setup AdMob
1. Banner Ad
2. Interstitial Ad
3. open Ad
4. Rewarded Ad
Setup Facebook Audience ad
Change mDisplayBanner="admob" value
Display Interstitial admob Facebook adChange mDisplayInterstitial="admob" value
Display banner Reward Facebook adChange mDisplayReward="admob" value
Display Native admob Facebook adChange mDisplayNative="admob" value
isOpenAdEnable= true;
isBannerAdsEnable= true;
isInterstitialAdsEnable= true;
isAdEnableBetweenList= true;
Enable/Disable ads on Bookmark, Share details, Play in details,Choose topic and Give comment Change the bool value ofadEnableOnBookmark = true;
adEnableOnShare = true;
adEnableOnPlay = true;
adEnableOnAddComment = true;
adEnableOnChooseTopic = true;
Setup OneSignal
For Android and iOS:-
Follow instruction for OneSignal Configure Here.
Enable the Twitter:-
Open this link and add your API Key and API Secret which you have newly generated, then click on save button.
Step 1 : Goto the lang folder and create new file or paste your file.
This file name must be languagecode.json. For example : en.json
Step 2 : After adding json file in lang folder. Add language flag image in assets/flag folder.
Step 3 : Goto lib/models directory and open LanguageModel.dart file and add language code in getLanguages() List.
For example : Language(0, 'English', 'en', 'assets/flags/ic_us.png', 'en-EN')
Change Text To Speech Language :-
Step 1 : Goto lib/utils/Constants.dart file
Step 2 : Asign language code to defaultTTSLanguage variable (default :- 'en-US')
List of language supported by Text To Speech
Generate Weather API key :-
Step 1 : Goto https://weatherapi.com/api/ link
Step 2 : Sign Up here and login.
Step 3 : Now, generate new API Key and open lib/utils/Constants.dart file and replace your key in mWeatherAPIKey variable.
General Information
Thank you for choosing our plugin. We hope you enjoy building your project with us. It is a powerhouse of great features and powerful functionalities that would take months to develop.
Help and Support
The expert team at MeetMighty is always happy to help you with any questions or concerns you encounter. If you need any support with the item, please contact us through our email.
Support email:- [email protected]
Plugin Installation
For WordPress Installation you can check the Famous 5-Minutes Install here:
Support System: http://codex.wordpress.org/Installing_WordPress
To use Plugin, you must be running WordPress 4.9.1 or higher, PHP 7.2 or higher, MySQL 5.6 or higher
White screen, demo content fails when importing, empty page content and other similar issues are all related to low PHP configuration limits. The solution is to increase the PHP limits. You can do this on your own, or contact your web host and ask them to increase those limits to a minimum as follows:
WordPress JSON Web Token Authentication allows you to do REST API authentication via token. It is a simple, non-complex, and easy to use.This plugin probably is the most convenient way to do JWT Authentication in WordPress.
Enable PHP HTTP Authorization Header
Shared Hosts
Most shared hosts have disabled the HTTP Authorization Header by default.
To enable this option you’ll need to edit your .htaccess file by adding the following:
RewriteCond %{HTTP:Authorization} ^(.*)
RewriteRule ^(.*) - [E=HTTP_AUTHORIZATION:%1]To enable this option you’ll need to edit your .htaccess file by adding the following: (See Issues)
SetEnvIf Authorization "(.*)" HTTP_AUTHORIZATION=$1How to add a new plugin in WordPress
You can locate the plugin zip folder in your package zip file
worpress_zip/mighty-news-api.zip
Make sure required plugin should be activated.
How to Set OneSignal – Web Push Notifications
OneSignal is an easy way to increase user engagement. Use OneSignal to send visitors targeted push notifications so they keep coming back.
Install WP Mail SMTP
Note : If sent mail goes into the spam then change mailer and set email configuration as per mailer.Default mailer is php mailer.
If you set gmail account as Other SMTP configuration then perform below steps:
How to add video
Add your video title , select any one video type (youtube, iframe/embedded and custom URL) and paste your video URL. Set your video image in featured image and then publish.
Select categories for dashboard post, Set social link, privacy policy, terms and condition, and copyright text
Note : If you are adding new post ( news ) then it is default showing on newest post ( news ). And for breaking / story post ( news ), display only those post ( news ) which is mark as breaking / story.
Step 1 : Add Twitter or Instagram post embed content in the news post and remove all style from blockquote tag
Step 2 : Remove script tag from the post only add blockquote tag
Setup AdMob
1. Banner Ad
2. Interstitial Ad
Setup OneSignal
1. Create a OneSignal AccountOne Signal is used for send the push notification into mobile or web. for more detail about OneSignal Documentation.
Follow below steps
For Android and iOS:-
Follow instruction for OneSignal Configure Here.
Step 1 : Goto the lang folder and create new file or paste your file.
This file name must be languagecode.json. For example : en.json
Step 2 : After adding json file in lang folder. Add language flag image in assets/flag folder.
Step 3 : Goto lib/models directory and open LanguageModel.dart file and add language code in getLanguages() List.
For example : Language(0, 'English', 'en', 'assets/flags/ic_us.png', 'en-EN')
Generate Weather API key :-
Step 1 : Goto https://weatherapi.com/api/ link
Step 2 : Sign Up here and login.
Step 3 : Now, generate new API Key and open lib/utils/Constants.dart file and replace your key in mWeatherAPIKey variable.
Step 1 : Register yourself using your email address and a password from the user app.
Step 2 : After successfully creating the user, navigate to the firebase console and locate your document in the user collection. Change the value of isAdmin to true in that document.
Step 3 : Now, open the admin panel and sign in with your admin credentials.
Step 1 : Navigate to the Firebase Console and then to Indexes.
Step 2 : This type of error will appear when you launch the admin panel.
Step 3 : Copy and paste this link into your browser to get this type of dialogue, then click on Create Indexes.
Step 4 : Create all indexes in this manner.
Step 1 : Click on the Add Index button, and then enter the collection id.
Step 2 : Create all of the indexes listed below and wait for them to be built.
Step 1 : Upload your images to Google Drive and then generate the image URL.
Step 2 : Then copy and paste it into the upload news section.
As per envato policy installation, setup and configurations or modification are not included in free
support. Free support is only for any bug/ error in original code. we do not provide installation
and customization support in FREE SUPPORT.
Still, We are providing steps for How to update future release code to existing source code for your
knowledge purpose.
If you want which file changes are on the latest updated version then you have to manage the git repository by yourself.
For First time: Initial project downloaded from codecanyon server.
Step 1: Create or login with gitlabLogin or register your account with gitlab: https://gitlab.com/users/sign_in
Step 2: Create a new project in GitLab
Once successfully downloaded project from codecanyon, copy/paste your downloaded project into clone directories
Onces copy/paste your changes to clone directres, you have to push all files to your gitlab server. For that use the following commands.
Before commit to server directores, you have to remove below folder from your project
After That follow below steps
“git push” And provide you gitlab credential details
Once you will received mail for updates. Just download latest code from codecanyon server.
Step 2: Copy/paste your initial downloaded project to clone directories.Once successfully downloaded project from codecanyon, copy/paste your downloaded project into clone directories
Follow same Step 6: Commit and push to gitlab server
Step 4: Check updated filesAfter committing your latest changes. Goto the gitlab project dashboard and click on the commit link.
Click on link which you have commit message on above steps 3
Now check the all changed file.
Click on “XYZ changed file” to see which file has been changed.
package_name and applicationId both
are
same.
Download the SDK and point the SDK folder path in your future projects.
There are different sources you can try
When you run the application and you see error like this
Running "flutter pub upgrade" in mighty_news...
The current Flutter SDK version is 1.17.5.
Because mighty_news depends on flutter_svg >=0.18.0 which requires Flutter SDK version
>=1.18.0-6.0.pre <2.0.0, version solving failed. pub upgrade failed (1; Because
mighty_news depends on flutter_svg >=0.18.0 which requires Flutter SDK version
>=1.18.0-6.0.pre <2.0.0, version solving failed.) Process finished with exit code 1
Error Possibilities:
Generally, this error occurs when Generally, this error occurs when
After implementing the above solution, run the below command in the terminal.
flutter pub getNote If you faced this error during development then this error due to header not set on your admin panel
1. Open project_root_directory/android in Android Studio
2. Wait for indexing
3. Now run your application from android module
We like to hear you out when you get stuck or encounter difficulty with our products. As soon as you buy one of our products – you can open a support ticket and share your concern right away.
Submit support ticket: https://support.meetmighty.com/
It is recommended that before submitting a ticket you take a close look at product documentation (Docs folder in the archive you have downloaded from Themeforest/Codecanyon). To get technical support and assistance, you need to have a valid purchase code. You will find this when you SignIn your Codecanyon/Themeforest “Download” page. Click on the product’s download link.
Free support policy includes troubleshooting, technical assistance with the product only. It does not include any customization, additional features integration or concerns about third-party plugins compatibility. But, support is applied to plugin(s) we have developed and integrated ourselves. We appreciate your understanding!
If you need assistance and information on purchased product that is not covered in documentation, post them on our support portal at https://support.meetmighty.com/ You can expect answer within 24-48 hours, usually as soon as possible in the order they were received.
Additionally, if any support ticket has no response from the item owner for more than 7 days, that support ticket will be closed by default. However, if you need further assistance, you can create a new ticket.
All support requests are being processed on business days (Monday to Saturday) from 9:00 to 18:00 (GMT +05.30). We are in GMT+5:30 time zone. We address all the support queries 6 days weekly on the first-come, first-solve basis (Sundays off).
Do you have any pre-sales questions or concerns, please write to us via our website contact page or email us at [email protected]. We like getting positive feedback from our customers, and this is why we do our best to earn it! Write a review: https://codecanyon.net/downloads
Update your application to give for the best experience – check out what’s new and improved. Thank you
Designed with ♥ by MeetMighty
