Installing Admin Panel on Shared Hosting

1. Create your domain or subdomain in shared hosting.
2. Set up an empty database in your shared hosting and keep track of these credentials:
   1. Database name
   2. Database username
   3. Database password
   
   

   Note Avoid using hyphens(-) in the Database Name, as it doesn't work in some configurations.

3. Uploading the source code to Server
   1. Begin by extracting the Source Code you acquired from CodeCanyon.
   2. Unpack the Admin Panel zip file and proceed to upload the PHP Code Folder's contents onto your Server.
   
   

   important .htaccess file is essential; kindly verify its existence. If it is not visible, enable the option to display hidden files.

   important Supported PHP version should be greater than or equal to 8.1.

4. Now head to your project's URL (e.g., mydomain.com or subdomain.mydomain.com).
   The Installation screen will then walk you through the process seamlessly.

Great news! You're all set to start your Elite Quiz experience.

Customize Admin Panel for your brand

• Change Login Page Background Image & Bot Image from here
• Include a JWT Key (optional) to enhance security by generating user tokens. You have the flexibility to input any passphrase or password of your choice.
• Adjusting the Theme Color lets you change the main panel color to suit your preferences.
• Revise Footer Copyright Text to incorporate your copyright information.

Settings for the App

• System Timezone: This option sets the time zone of the admin panel.
• App Links: You can set your apps play store/app store links in here, when user refers the app this links will be used.
• Refer Coins: Amount of coins your referral gets for using your referral code.
• Earn Coins: Amount of coins user gets for referring.
• Force Update: if you want to require users to update the app to latest version. you can enable force update and add the Android/IOS App Version if app has given version it will show force update dialog to those users.
• True/False Values: When Creating True False Question these values will be added as default values, then you can also edit them.
• Share App Text: sharing the app will share this text.
• App Maintenance: When you are working on the admin panel or apps Maintenance, you can enable this option so it will show users that app is in Maintenance Mode.
• Language Mode: If you want to only use one language in the app you can disable this option. if you want to add multiple languages enable this feature.
• Option E: If you want 5 options for the answer you can enable this option. otherwise there will be 4 options to select from for answer.
• Daily Quiz/Contest Mode:Toggle Daily Quiz/Contest feature functionality
• In App Purchase: This option controls 'Coin Store' functionality in the app. if you disable this feature user won't be able to purchase coins.

Required Softwares

• Android Studio Koala | 2024.1.1 (Not checked with Ladybug version, might not work so use the aforementioned version)
• Flutter 3.27.1 (Latest)
• Java Version 21

Additionally, for Macos

• HomeBrew
• Cocoapods (1.16.2)
• XCode 15 (XCode 16 is also supported)

Setup flutter

important Install the current supported Flutter v3.27.1 (Latest) from the Stable channel.

Explore the official Flutter website at https://docs.flutter.dev/get-started/install for a complete installation guide for your platform.
Prefer video tutorials? Check out the playlist:

After installation run flutter doctor -v to check if everything is correctly setup.

important It is your responsibility to install and set up Flutter correctly. Ensure that Flutter is properly installed and configured before moving forward. You must verify that there are no issues reported by the flutter doctor command

important Android Toolchain, Android Studio, and XCode for Mac users should be correctly configured.

If you are using Android Studio, install the flutter & dart plugin from Android Studio plugin market place.
and if you are using VS Code you can install flutter extension.

If not do the necessary steps to resolve them, check the official flutter documentation for the guide.

After everything is verified to be correct you can continue with the documentation.

Steps to run this project successfully:

1. Begin by extracting the downloaded code.
2. Next, extract the contents of the Elite Quiz App XXX.zip and launch it in either Android Studio or Visual Studio Code.
3. Access the IDE terminal and enter the command flutter pub get to fetch the necessary dependencies.
4. If you want to run the app in IOS simulator (otherwise skip this step), then execute the following commands in the terminal:
   cd ios
pod install
cd ..
5. Finally, To run the application, run flutter run command.

Change app package name

1. If you are using Android Studio , you can press CTRL+SHIFT+R to open Replace in Files tool.
   then search our package name com.wrteam.flutterquiz and replace it with your package name in all places.
   
2. And if you are using VS Code , you can press CTRL+SHIFT+F to open Find in Files Tool.
   then search our package name com.wrteam.flutterquiz and replace it with your package name in all places.
   

Change application name

Similarly you can change the app name by finding and replacing in all the places.

Integrate firebase with your Project

1. First, Create a new Firebase Project
   
   
2. After creating your Firebase project, you'll now connect your Android application to it


3. Now, fill in the details, to get your SHA-1 & SHA-256 keys visit https://developers.google.com/android/guides/client-auth .
   SHA keys are required for using firebase authentication. if you have doubts about SHA keys, click here.
   
   Skip this step
   Skip this step
   Continue
   


4. Now it's time for connecting IOS to your Firebase Project.

Skip this step


5. Finally, We need to add firebase services json file into the Admin panel.



Download the firebase json by opening your Firebase Project > Project Settings > Services Account, and clicking generate new key.




Upload the downloaded services json in the admin panel by going to Settings > Firebase Configurations section, as shown in the image.

Congrats! You have successfully connected your android & IOS app to your firebase project.

Enable Firebase Authentication

new you can toggle authentication methods from admin panel now. go to Settings -> Authentication Settings

Authentication Methods should be enabled in both Panel and the firebase to work properly.

1. Head to your Firebase project, click on the authentication menu, and enable Email, Phone, Google, and Apple sign-in methods, as shown in the image.
2. Add the SHA-256 key as shown in below image. Go to Project Settings -> Your apps -> Android apps
3. If you want to use Phone authentication in IOS then
   1. Go to ios/Runner/GoogleService-Info.plist and copy REVERSED_CLIENT_ID
   2. Paste it in ios/Runner/Info.plist as shown in below image

Firebase Configurations for Group and 1v1 Battles

For battles to work you will need to enable Cloud Firestore in Firebase.
Follow these steps shown in images below.

1. First Create Firestore database
2. Select the nearest location to you
   
3. After database has been created, you will need to do 2 things
   1. Set rules, to enable permissions for storing battle data in the database.

      rules_version = '2';
      service cloud.firestore {
          match /databases/{database}/documents {
              match /{document=**} {
                      allow read, write: if request.auth.uid != null;
              }
          }
      }

      
   2. Create an index, for message functionality to work in battles.

      Follow the below details exactly otherwise messages won't work in the app.

      • Collection Id : messages
      • First Field : roomId, Ascending. important here i is Capital.
      • Second Field : timestamp, Descending.
      • Select Query Scopes to be Collection
      

That's it for battles functionality.

Connect your admin panel to the app

1. Go to lib/utils/constants/constants.dart and add your admin panel url in databaseUrl variable, like shown in the image below.

   Important Make sure to not add '/' at the end of the url.
   Important Make sure to check if the admin panel is http or https.

   

SHA keys and Keystore Basics

• Basically Keystore file is used for signing your app. each keystore file having SHA keys, which gets associated with your app.
• SHA keys are required for android version of the app's login and battles functionalites to work.
• Firstly, there are 2 keystores important, debug.keystore which might be already present after you have installed android studio and release/upload keystore, which you will have to create when you want to publish the app.
• To get the debug SHA keys from debug.keystore
  Mac: keytool -list -v -alias androiddebugkey -keystore ~/.android/debug.keystore
  Windows: keytool -list -v -alias androiddebugkey -keystore %USERPROFILE%\.android\debug.keystore

• go to android/app/build.gradle and scroll down to buildTypes as shown in the image.
• you can select which keystore to use for signing by commenting and uncommenting them.

• Now, run the app in android once, after running the app, in the terminal go to android folder then,
  run ./gradlew :app:signingReport it will output which keystore the app is signed with currently.
• add both SHA-1 and SHA-256 keys in your firebase project. then re-download the Google Services json file

To Create Upload Keystore

• keytool -v -list -keystore upload.jks -storepass upload123 -keypass upload123
• Then sign your app with upload.jks for release build by adding it’s details in android/key.properties as shown in the image.
• rebuilding the app again should use your new upload keystore.
• Add both SHA-1 and SHA-256 keys in your firebase project. then re-download the Google Services json file.

Data Safety Form Submission Guide for Play Console

Please watch the YouTube video below for a concise tutorial on completing the mandatory Data Safety Form in Play Console.

FAQ

Common Issues

1. If you are seeing warnings on admin panel after the installation, then check if the warning contains ini_set()

   Solution:

   Then Add ob_start(); in your index.php file, like shown in the image.

   

2. Critical security vulnerability was discovered in reCAPTCHA Enterprise for Mobile. (Not required after v2.1.5, already added)

   

   This is issue related to Firebase Auth package. which should be fixed in next update of the firebase_auth (current version is 4.16.0).

   For currently you can add the following line in android/app/build.gradle , in the dependencies section, like shown in the image

   implementation 'com.google.android.recaptcha:recaptcha:18.4.0'

Contact Support

Your Feedback

We highly appreciate your decision to choose our product. Providing top-notch service is our priority, and we value your feedback.
Kindly take a moment to rate us by clicking the link . Your honest input helps us improve and deliver the best experience possible.

Your input helps us improve!

Sharing your thoughts and experiences with our app helps us identify areas for improvement and ensure it meets your needs. We don't collect any personal data when you provide feedback.

Share your suggestions and areas for improvement through a google form here

Reach Us

Unlock the potential of WRTeam, your go-to hub for top-notch Flutter app development and web applications.
Reach out to us today for quality solutions and exciting freelance opportunities.

Visit us at wrteam.in or drop an email to support@wrteam.in .

Thank you for considering us!