Introduction

SocialiFied

Thank you so much for purchasing our item.


  • Created: 1 Oct. 2022
  • Updated: 11 Oct. 2024

If you have any questions that are beyond the scope of this help file, Please feel free to email via Support.


Basic

>As This is complete system with lots of modules for web and mobile apps, it is compulsory to have some basic knowledge in both server side and mobile app development if you want to do the installation, setup and publishing with your branding yourself.

  1. Flutter SDK and JDK with path setup in your IDE.
  2. Real server related knowledge like apache or local machine server,nodejs we preferred to use a real server.
  3. Basic knowledge in PHP, Yii2, Nodejs and Flutter if you want to do some customization yourself (Not compulsory).
  4. basic knowledge about google cloud and firebase.

Technologies used

  • Flutter- iOS android app
  • PHP Yii2 Framework for backend admin panel and rest apis
  • MySql Database
  • Nodejs for chat (socket.io)
  • Firebase - For Push notifications
  • Storage Option : AWS S3, Azure Storage, Local storage
  • SMS : Twilio, msg91, Firebase
  • Agora for audio/video call and live
  • Content moderation: Amazon Rekognition, SightEngine

Server

  • Requires PHP v8.1 and MySQL.
  • Mod_rewrite Apache
  • Ctype PHP, JSON, PDO, XML, Zip, Gd Extension
  • Nodejs v18.16.0
  • SSL Required
  • Preferred Server: DigitalOcean, AWS

Mobile app

  • Android studio or VC code
  • Flutter SDK setup (version 3.3.0 Stable)
  • JDK with path setup (only for vs code)
  • Xcode 13.2+ for IPA file build
  • Android studio for APK file build

Install on server

After download the code from codecayon, upload the backend code zip file (socialified_v2.5.zip) in your server root and extract the zip file. Backend admin panel can be installed on a domain or subdomain: For Example, yourdomain.com OR xyz.yourdomain.com.

Database setup
Step 1

Create a new database from your server MYSQL database “MySQL® Database Wizard”

Create a DB user to the database and link that database to the DB user and give permission

Import Mysql database file into your database. database file can be find in doc/db folder in given code.
For new setup use socialifed_v2.5.sql file

Step 2

Db configuration can be updated in common/config/main-local.php.
Update dbname, username and password.

<?php
              return [
                  'components' => [
                      'db' => [
                          'class' => 'yii\db\Connection',
                          'dsn' => 'mysql:host=localhost;dbname=DB_NAME####',
                          'username' => '#####',
                          'password' => '######',
                          'charset' => 'utf8',
                      ],
                      'mailer' => [
                          'class' => 'yii\swiftmailer\Mailer',
                          'viewPath' => '@common/mail',
                          'transport' => [
                              'class' => 'Swift_SmtpTransport',
                              'host' => 'smtp-relay.sendinblue.com',  // e.g. smtp.mandrillapp.com or smtp.gmail.com
                              'username' => '############',
                              'password' => '###########',
                              'port' => '587', // Port 25 is a very common port too
                              'encryption' => 'tls', // It is often used, check your provider or mail server specs
                          ],
                      ],
                      


                  ],
              ];

            
Step 3

Site Url and Envato purchase code
Site url can be update from common/config/params.php

<?php

            'bsVersion' => '3.1',
            'bsDependencyEnabled' => false,
            'adminEmail' => 'admin@yourdomain.com',
            'supportEmail' => 'support@yourdomain.com',
            'senderEmail' => 'admin@yourdomain.com',
            'senderName' => 'SocialiFied',
            'siteMode' => 1, // 1 for live, 2 for testing , 3 demo
            'siteUrl' => 'https://example.com',// domain here
            'enventoPurchaseCode' => '##########', // envato purchase code
            'releaseVersion' => '2.5', // current installed product version
            'testOtp' => '1111', // for testing purpose only
            'apiKey.firebaseCloudMessaging'=> '', // Leave it blank, for new v1 api it need setting  See here
            'user.passwordResetTokenExpire' => 3600
        
    ?>
            
Step 4

All done for appache srever, your software is ready to run.
Admin Url : youdomin.com/backend/web/index.php
Login information :
Username : admin
Password : 123456


Mandatory setup

Mail Configuration (SMTP)

Mail Configurations part admin can set his Mailer host, user name and his own encryption method and password for this SMTP Mail setup. This configuratin is used for sending mails.

MAil configuration can be updated in common/config/main-local.php.

<?php
return [
    'components' => [
        'db' => [
            'class' => 'yii\db\Connection',
            'dsn' => 'mysql:host=localhost;dbname=DB_NAME####',
            'username' => '#####',
            'password' => '######',
            'charset' => 'utf8',
        ],
        'mailer' => [
            'class' => 'yii\swiftmailer\Mailer',
            'viewPath' => '@common/mail',
            'transport' => [
                'class' => 'Swift_SmtpTransport',
                'host' => 'smtp-relay.sendinblue.com',  // e.g. smtp.mandrillapp.com or smtp.gmail.com
                'username' => '############',
                'password' => '###########',
                'port' => '587', // Port 25 is a very common port too
                'encryption' => 'tls', // It is often used, check your provider or mail server specs
            ],
        ],
        


    ],
];


Storage Setting

We are giving following three option to store media files. You can choose one storage system according to your requirements

Update storage setting from admin panel setting: Admin > Setting > Storage Setting


Amazone S3 Setup

We are using amazone s3 for storage files and images.

Step 1
Create Bucket

You can create bucket on s3 with public access to follow this URL:
https://docs.aws.amazon.com/quickstarts/latest/s3backup/step-1-create-bucket.html .

Step 2
Get AWS S3 Access key and secret access key
Use following url to create secret keys and add in storage setting:
https://docs.aws.amazon.com/powershell/latest/userguide/pstools-appendix-sign-up.html#get-access-keys.

Azure Storage Setup

We are using microsoft azure for storage files and images.

Step 1
Create access keys (Account Name, Account Key, Container)

You can create azure setup from :
https://learn.microsoft.com/en-us/azure/storage/common/storage-account-keys-manage?tabs=azure-portal .

Step 2

After getting these keys you can add in storage setting


Agora key Setting

Setup Agora api key for audio video calling. You can get your keys. See here
After Getting the App ID, and App Certificate keys, update it from admin panel setting: Admin > Setting > App Setting


Setup Agora api key for audio video calling
  • Create Agora api key from below url
  • URL https://www.agora.io



  • SMS Setting

    We are giving following three SMS Gateway integration options to send SMS

    • Twilio
    • sms91
    • Firebase
    Implement SMS gateway integration setting from admin panel setting: Admin > Setting > SMS Gateway


    Nodejs Chat Socket Setup

    We are using nodeJs socket programming for chat, Use following instruction for chat socket setup
    All nodeJs chat code will be in /chat forder

    Step 1

    Nodejs v18.16.0 must be installed on your server
    To confirm you have nodejs install, try to run command in your console :

    node -v
    You must see installed version of nodejs
    Output
    v18.16.0

    It the nodejs is already not install you can install Nodejs with few steups.
    Open the ssh terminal and run following commands:

    To get this version, you can use the apt package manager. Refresh your local package index first:

    sudo apt update
    Then install Node.js:
    sudo apt install nodejs
    Check that the install was successful by querying node for its version number:
    node -v
    Output
    v18.16.0
    Install the npm package with apt for installing other moduels like pm2:
    sudo apt install npm

    Step 2

    You can update configuration filechat/config.json with given fields

    
    {
      "port":4000,  //server port
        "live":{    // add your db information
          "host": "127.0.0.1",    
          "user": "######",
          "password": "######",
          "database": "#######"
        },
        "dev":{ // leave it blank
          "host": "####",
          "user": "#####",
          "password": "####",
          "database": "###"
        }
      },
      "encryptionKey":"##########################", // enter key for encryption chat eg. bbC2H19lkVsQDf74rtNMQdddFloLyws
      "storageUrl":"",  // Leave it blank
      "pushNotification":{    
          "databaseURL": "https://q#############.firebaseio.com"         See here
      },
      "voipNotification":{                                               Check documentation to create
        "key": "cert/AuthKey_#####.p8", // .p8 file
        "keyId": "########", //67J4MZG469
        "teamId": "########", // T937GPNTUY
        "bundleId":"###########"  //com.example.app
      },
      "sslCertificatePath":{
        "isSsl":true,   //if ssl not available then make fasle
        "key": "############/##privkey.pem",     // ssl key certificate path
        "cert": "##############/##fullchain.pem" // ssl certificate path
        
      }
    
            

    Step 3

    Firbase Setup
  • Setup Firebase account
  • Download serviceAccountKey.json and put the file in /chat folder
  • Download Json File

  • Step 4
    Start node server

    After installing all dependencies and updated the configuration, you must start node server :
    Open a terminal and nvigate to the /chat folder that contain the file "index.js"
    Run following command to start server :

    
              cd /path/to/your/root forlder/chat
              node index.js
            
            
    OR
    For running server all time you can install pm2 package More Detail
    Run following command to run server with forever:
    
              cd /path/to/your/root forlder/chat
              pm2 start index.js
            
            
    Visit https://yourdomain:4000 in your browser. You will see following screen if server is started successfully.


    Project access URL

    Admin Panel
    Admin Url : youdomin.com/backend/web/index.php
    Login information :
    Username : admin
    Password : 123456

    Socket Url (socketApiBaseUrl)
    https://yourdomain:4000

    Rest API Endpoint Url (restApiBaseUrl)
    youdomin.com/api/web/v1/

    API name will be added in the last of above api endpoint url. This will be done on the mobile side by programming. suppose if we need to call categories api, then mobile application is calling following url with adding api name "categories" like :

    youdomin.com/api/web/v1/categories

    if the above url is working then Rest api setup successfully.


    iPhone app setup

    Step 1

    Go to developer.apple.com and login using credentials Follow the instructions given in the link below to create bundle identifier.

    https://www.appcodezip.com/2020/05/app-id.html

    Keep note of bundle identifier as we need it in firebase ios app setup and flutter ios app setup.



    Step 2
    Enbale apple pay and push notification

    Your need to enable push notification and apple login option in create identifer that you created in step 1. See below screenshot for refrence


    Step 3
    Setup iOS app source code
  • Open ios project from "mobile" project in xcode.
  • You need to double click on "Runner.xcworkspace" file to open project


  • Step 4
    Change bundle identifier

    Replace the bundle identifier with your created bundle identifier above in ios app setup in apple developer account


    Step 5
    Change app name

    Add new app name in display name field


    Step 6
    Change app icons

    Go to "Assets.xcassets" folder and replace app icon as shown in below screenshot



    Android app setup

    Step 1
    Replace package name

    Open the "build.gradle" file in android code, Replace the package with your own created package name as shown in below screenshot.


    Change app name
    Step 2
  • Go to project and then open folder in sequence android -> app -> src -> main -> AndroidManifest.xml
  • Add new app name in android:label in application tag

  • Change app icons
    Step 3
  • Go to project and then open folder in sequence android -> app -> src -> main -> res
  • There will be folders like mipmap-hdpi, mipmap-mdpi etc. Replace icons in these folders as shown in the below screenshot


  • Firebase app setup for social login and push notificatoions

    Create new firebase project
    Step 1

  • Login into your Firebase account and create an app if it's not created yet.
  • Create an app if its not created

  • Create iOS app in firebase project
    Step 2

    Follow the below screenshots to Create ios app.





    Download the plist file , We will use it later in flutter app.



    Create android app in firebase project
    Step 3

    Follow the below screenshots to Create android app.





    Download the json file , We will use it later in flutter app.





    Step 4

    Download the service account key and get database url for nodejs setup





    Enable social logins

    Go to Authentication tab from left menu and click on get started




    Google login

    Select google sign in and enable it




    Link firebase project with source code

  • Open project in android studio
  • Open iOS/Runner folder and delete the older "GoogleService-Info.plist file
  • Drag and drop the new "GoogleService-Info.plist" config file that you have created above for your ios app. Make sure you drag the file at same location from where you delete the older file
  • Copy the "REVERSED_CLIENT_ID" and paste it in URL types as shown in screenshots




  • Goto info.plist file and replace the Old facebook id with your facebook id as shown in below screenshots, Repeat the same process for facebook client token also




  • Open strings.xml file in android project under android/app/src/main/res/values folder
  • Enter facebook app id and client token as shown in screenshots




  • Third party api keys

    Facebook login setup

  • Create app on developer.facebook.com or choose existing app in My apps section
  • Enter the required details in the app page on developer.facebook.com
  • Copy the App id and Facebook client token
  • Replace the old app id and facebook client token with your one you copied from above step at below mentioned places


  • Giphy setup

  • Get the Giphy api key from below url
  • Giphy api key https://support.giphy.com/hc/en-us/articles/360020283431-Request-A-GIPHY-API-Key
  • After getting the api key enter it in admin panel app setting page, Setting > App setting > Giphy api key

  • ChatGPT setup

  • Get the ChatGPT api key from below url
  • ChatGPT api key https://chat.openai.com/auth/login
  • After getting the api key enter it in admin panel app setting page, Setting > App setting > ChatGPT api key

  • Stripe setup

  • Follow the below url to get the stripe publishable key and secret key
  • Stripe api key https://stripe.com/docs/keys
  • After getting the both keys enter it in admin panel app setting page, Setting > Payment setting > Stripe publishable key / Stripe secret key

  • Razorpay setup

  • Follow the below url to get the Razorpay api key
  • Razorpay api key https://razorpay.com/docs/payments/dashboard/account-settings/api-keys/
  • After getting the both keys enter it in admin panel app setting page, Setting > Payment setting > Razorpay api key

  • Setup Google map api key for showing google map for location sharing in chat

  • Create Google map key from below url
  • Remember to enable Places API, Maps SDK for Android, Maps SDK for iOS and Geocoding API for your API key.
  • URL https://cloud.google.com/maps-platform/
  • Replace the Google map key in project as shown below


  • Setup Google Admob api key for showing google ads

  • Create Google admob api keys for both android and ios
  • URL Setup admob key
  • Replace the admob api key for android app as shown in below screenshot


  • Replace the admob api key for ios app as shown in below screenshot


  • Share links setup (Post, event, live etc share links)

    Go to android/app/src/main/AndroidManifest.xml

    Go to tag '' as shown in screenshot

    Replace your_domain_name with your domain like instagram.com, dont add http or https, or www

    Go to ios/Runner/Info.plist

    Go to 3rd key 'CFBundleURLSchemes' under 'CFBundleURLTypes' as shown in screenshot

    Go to key 'com.apple.developer.associated-domains' as shown in screenshot

    Replace your_domain_name with your domain like instagram.com, dont add http or https, or www



    Change api urls

    Go to "app_config_constants.dart" file and change api server(PHP) url and socket server(Node.js) url as shown in below screenshot





    Change app name

    Go to "app_config_constants.dart" file and change app and as below screenshot





    Change app version for force update

    Go to "app_config_constants.dart" file and change currentVersion value to current version number of the app that you are going to publish





    Change color scheme

  • Go to "theme.dart" file and change light and dark mode theme colors as shown in below screenshots




  • Change localization strings

  • Go to "resources" folder and change the required strings in required language file





  • Common Setup problems/Answer

    The Authorization header is usually, but not always, Please make sure server must accept Authorization header.
    API name will be added in the last of above api endpoint url. This will be done on the mobile side by programming.
    suppose if we need to call categories api, then mobile application is calling following url with adding api name "categories" like :
    youdomin.com/api/web/v1/categories
    if the above url is working then Rest api setup successfully.
    You must setup SMTP for email.

    MAil configuration can be updated in common/config/main-local.php.

    <?php
                      return [
                          'components' => [
                              'db' => [
                                  'class' => 'yii\db\Connection',
                                  'dsn' => 'mysql:host=localhost;dbname=DB_NAME####',
                                  'username' => '#####',
                                  'password' => '######',
                                  'charset' => 'utf8',
                              ],
                              'mailer' => [
                                  'class' => 'yii\swiftmailer\Mailer',
                                  'viewPath' => '@common/mail',
                                  'transport' => [
                                      'class' => 'Swift_SmtpTransport',
                                      'host' => 'smtp-relay.sendinblue.com',  // e.g. smtp.mandrillapp.com or smtp.gmail.com
                                      'username' => '############',
                                      'password' => '###########',
                                      'port' => '587', // Port 25 is a very common port too
                                      'encryption' => 'tls', // It is often used, check your provider or mail server specs
                                  ],
                              ],
                              
              
              
                          ],
                      ];
              
                    

    You can also use third party https://www.brevo.com/ to setup SMTP , its easy and no need extra authentication required.

    Your mobile app version and release version in admin should be matched.
    You can udpate the release version from Admin Penal
    LeftMenu => Setting => General Setting => Release Version
    Probably nodejs server not setup/working properly. Please check the following link after replace you domain to check your nodejs server working or not.
    https://yourdomain:4000
    It must be display "Server Started" message on your screen.

    Support

    If this documentation doesn't answer your questions, So, Please send us Email or contact via Skype.

    Email : topiosappsworld@gmail.com

    Working Days : Monday To Friday

    We are located in GMT +5:30 time zone and we answer all questions within 12-24 hours in weekdays. In some rare cases the waiting time can be to 48 hours. (except holiday seasons which might take longer).

    Note: While we aim to provide the best support possible, please keep in mind that it only extends to verified buyers and only to issues related to our template like bugs and errors. Custom modifications or third party module implementations are not included.

    Changelog

    See what's new added, changed, fixed, improved or updated in the latest versions.

    Version 2.5 (11 Oct. 2024)

    • AddedSubscription : Subscription packages via content creators, Now uses can subscribe to paid content of content creators
    • AddedNudity check : Photo and video moderation (Nudity check via SightEngine and Amazon Reckognition)
    • AddedMultiple SMS gateways : Added Firebase and SMS91 SMS gateways , Now you can Send OTP via Firebase and SMS91 also (Setting from admin panel to choose from Twilio, Firebase SMS91)
    • Added Report Content : Now user are able to report post, user, comment, story and Highlight
    • Added Enable/Disable online statusEnable/disable last seen and online status can be manage by user
    • AddedNotification counter : Shows number of unread notifications
    • AddedRead notifications: User read/unread notification status
    • AddedStorage Setting : Now Storage setting (S3,Server Storage, Azure) manageable from admin
    • AddedFirebase upgraded to HTTP v1 API
    • Added Share post as link
    • Added 2 Factor authentication for admin
    • Fixed Fix minor issues

    Version 2.4 (13 Mar. 2023)

    • Added Editable stories
    • Added Upload test stories
    • Added Share story in chat
    • Added Show cached content in case of no internet
    • Added Create post : Create a post when competition is added by admin
    • Added Create post : Create a post when competition result is declared
    • Added Create post : Create a post when new club is created by user
    • Added Sharing Broadcast : When the user starts a live broadcast, he can invite his followers by sharing the broadcast.
    • Added Add moderator in Live streaming
    • Added Ban users from live
    • Added Block IP address to use app
    • Added Tag location to post
    • Added Enable/Disable Feature for particular User : Manage features user wise, now you can enable/disable feature for a particular user from admin
    • Added Add remove coins from user wallet via admin
    • Added Enable/disable last seen and online status
    • Added Change user name and password for admin
    • Fixed Fixed create post in club
    • Fixed Fixed Forgot password
    • Fixed Delete chat message issue fixed
    • Fixed Online/ offline status issues fixed
    • Fixed Chat scrolling issue fixed
    • Fixed Copy ChatGPT response
    • Fixed Duplicate phone number account reg issue
    • Fixed Show live joined users count in live users listing

    Version 2.3 (26 Nov. 2023)

    • Added Create Short videos
    • Added Added camera option for post and chat
    • Added Delete comments
    • Added Like comments
    • Added Report comment
    • Added Reply on comment
    • Added Reply on story
    • Added Account privacy
    • Added Post Photo/Video editor
    • Fixed Verified blue tick icon everywhere
    • Fixed Delete blocked and deleted users posts

    Version 2.2 (08 Sept. 2023)

    • Added Whose view my Story : User list of whose view my story
    • Added Post comment On/Off: User will ba able to On/Off comment of his post
    • Added Whose like my post: User list of whose like my post
    • Added Save Post in list
    • Added Edit Post
    • Added Public group chats
    • Modification Poll
    • Fixed Delete highlights
    • Fixed Record and play audio

    Version 2.1 (27 July, 2023)

    • Added Podcast
    • Added Gif in Comments : Image and gif support in comments
    • Added Rating for TV shows
    • Added Emoji support : Emoji support in post title and comment title
    • Added Share post
    • Added Multiple additions in admin panel
    • FixedVarious issues fixed

    Version 2.0 (18 May, 2023)

    • Added Upgraded versions : System upgraded to latest version of PHP and nodeJs
    • Added Notification changes : Modification in notification list
    • Added Post analytics : Now able to see Post anylytics
    • Added Polls
    • Added Live users : All user whose live right now
    • Added Phone login
    • Added Share out
    • Added Gift’s on post
    • Added Chat GPT
    • Added Profile cover image
    • Added Support request : User can generate support request for admin
    • Added Theme Color setting : App theme color setting from admin panel
    • FixedVarious issues fixed

    Version 1.8 (05 Mar, 2023)

    • FixedVarious issues fixed
    • FixedFixed issues related to google play console policy
    • FixedRemoved unsupported libraries

    Version 1.7 (18 Jan, 2023)

    • Added Watch TV : Tv Streaming
    • Added Chat Encryption - Now your chat is encrypted: Send gifts on live, user profile (Now available in regular licence)
    • Added Club Enhancement : Private and Join request based club, User can create private and join request based clubs and can invite the users
    • Added Enable/Disable any feature from Admin panel : Now you can remove any feature from app on run time from admin panel
    • FixedReported issues fixed

    Version 1.6 (30 Nov, 2022)

    • Added FAQ
    • Added Gifts: Send gifts on live, user profile (Now available in regular licence)
    • Added Many more minor additions
    • FixedReported issues fixed

    Version 1.5 (23 Nov, 2022)

    • Added Gifts: Send gifts on live, user profile
    • Added Redeem Coin : Redeem coins into cash
    • Added User verified tag : Request account verification with blue tick
    • Added Azure Storage : Now you can store files on microsoft Azure storage
    • Added Many more minor additions
    • Fixed5+ reported issues fixed

    Version 1.4 (27 Oct, 2022)

    • Added Competitions : Join photo and video competition to earn real money..
    • Added Random chat : Random chat with online users
    • Added Clubs: Create and join clubs and post in clubs
    • Added Links in chat : You can send link in chat now.
    • Added In app purchase: in app purchase to buy coins for joining the competitions
    • Added Reward ads: Rewarded ads to earn coins
    • Added Update chat group
    • Added Copy chat message
    • Added Live stream statistics
    • Added Pinch and zoom post image like Instagram
    • Added Unread message badge
    • Added Many more minor additions
    • Fixed 5+ issues fixed

    Version 1.3 (10 Oct, 2022)

    • Added Local Storage : Added local storage, now you choose to store file on local server or AWS S3 .
    • Added Group Chat : Group chat is enabled for this version.
    • Added Star messages
    • Added Links in chat : You can send link in chat now.
    • Added Search in chat history
    • Added Posting progress update in Home Screen
    • Added Retry /Discard failed post easily
    • Added Double tap to like
    • Added Pull to refresh
    • Added Mute/unmute audio in video post
    • Added Pip view for video call
    • Added Password strength checker
    • Added Mention users in comment
    • Added Share app with friends
    • Added Force update app : Now app has abilty to force user to install leatest released version.
    • Fixed Minor Issues

    Version 1.2 (5 Oct, 2022)

    • Added Ads : Google admob and facebook audience network is added.
    • Added Animated Splash : Animated splash screen on the start of the app.
    • Added Last seen : Now you can view last seen of user in chat screen.
    • Added Ask for review : Now user can review and rete your app.
    • Added Delete post : Now user can delete own post.
    • Fixed Minor Issues

    Version 1.1 (2 Oct, 2022)

    • Added Share Drawing : Now you can draw on drawing pad and share it on chat with yours friends.
    • Added Share Profile : Now you can share user profle on chat with yours friends.
    • Fixed Live streaming issue
    • Fixed Minor UI

    Version 1.0 (1 October 2022)

    Initial Release

    Buy