Laravel Installation

AddChat can be installed via composer. Smooth... 🍻

{info.fa-youtube} Here's a complete video tutorial guide for getting started quickly AddChat Laravel Academy ✌️

Prerequisites

  • Laravel version 5.5 / 5.6 / 5.7 / 5.8 / 6.x / 7.x / 8.x
  • Make sure to install AddChat package on a Fresh or Existing Laravel application.
  • We also assume that you've setup the database.
  • If you're running MySql version older than < 5.7 then disable strict mode in Laravel config/database.php 'strict' => false

Install

  1. If installing AddChat on an existing Laravel application and you already have Auth system then skip this step

    If installing on a Fresh Laravel application then run

    For Laravel 5.5 to 5.8

    php artisan make:auth

php artisan migrate

    For Laravel 6.x

    composer require laravel/ui --dev

php artisan ui vue --auth

npm install && npm run dev

php artisan migrate

  2. Install AddChat via Composer

    composer require classiebit/addchat-laravel

  3. Run AddChat install command

    php artisan addchat:install

  4. Open the common layout file, mostly the common layout file is the file which contains the HTML & BODY tags.

    • Copy AddChat CSS code and paste it right before closing </head> tag

      <!-- 1. Addchat css -->
<link href="<?php echo asset('assets/addchat/css/addchat.min.css') ?>" rel="stylesheet">

    • Copy AddChat Widget code and paste it right after opening <body> tag

      <!-- 2. AddChat widget -->
<div id="addchat_app" 
    data-baseurl="<?php echo url('') ?>"
    data-csrfname="<?php echo 'X-CSRF-Token' ?>"
    data-csrftoken="<?php echo csrf_token() ?>"
></div>

    • Copy AddChat JS code and paste it right before closing </body> tag

      <!-- 3. AddChat JS -->
<!-- Modern browsers -->
<script type="module" src="<?php echo asset('assets/addchat/js/addchat.min.js') ?>"></script>
<!-- Fallback support for Older browsers -->
<script nomodule src="<?php echo asset('assets/addchat/js/addchat-legacy.min.js') ?>"></script>

    {warning} Please replace <php ?> tag by {{}} curly brackets.

    The final layout will look something like this

    <head>

    <!-- **** your site other content **** -->

    <!-- 1. Addchat css -->
    <link href="<?php echo asset('assets/addchat/css/addchat.min.css') ?>" rel="stylesheet">

</head>
<body>

    <!-- 2. AddChat widget -->
    <div id="addchat_app" 
        data-baseurl="<?php echo url('') ?>"
        data-csrfname="<?php echo 'X-CSRF-Token' ?>"
        data-csrftoken="<?php echo csrf_token() ?>"
    ></div>

    <!-- **** your site other content **** -->

    <!-- 3. AddChat JS -->
    <!-- 3. AddChat JS -->
    <!-- Modern browsers -->
    <script type="module" src="<?php echo asset('assets/addchat/js/addchat.min.js') ?>"></script>
    <!-- Fallback support for Older browsers -->
    <script nomodule src="<?php echo asset('assets/addchat/js/addchat-legacy.min.js') ?>"></script>

</body>

{info} For Info, the php artisan addchat:install publishes AddChat assets to your application public/assets directory

{info} addchat.min.js for modern browsers & addchat-legacy.min.js for older browsers. These will be used switched by the browsers automatically on the basis on type="module" & nomodule, you need to nothing.

{success} Setup finishes here, now heads-up straight to Settings docs