Cuba Admin is a responsive HTML template that is based on the CSS framework Bootstrap 4 and it is built with Sass, Gulp and Pug. Sass compiler makes it easier to code and customize. If you are unfamiliar with Bootstrap or Gulp, visit their website and read through the documentation. All of Bootstrap components have been modified to fit the style of Cuba Admin and provide a consistent look throughout the template.
Before you start working with the template, we suggest you go through the pages that are bundled with the theme. Most of the template example pages contain quick tips on how to create or use a component which can be really helpful when you need to create something on the fly.
Build your Laravel Project with cuba , perfect choice for your laravel project. Cuba laravel project is included with 2 version laravel starter kit and laravel full version. Cuba laravel is build in laravel 8.0 latest version with all features and assets. you can start project from scratch by laravel starter kit or rewamp your existing project with cuba laravel admin template
The Laravel framework has a few system requirements. All of these requirements are satisfied by the Laravel Homestead virtual machine, so it's highly recommended that you use Homestead as your local Laravel development environment.
However, if you are not using Homestead, you will need to make sure your server meets the following requirements:
Laravel utilizes Composer to manage its dependencies. So, before using Laravel, make sure you have Composer installed on your machine.
composer update
After successfully executing of composer update command check the Laravel version
php artisan --version
Now Need some Laravel Commands (old versions required)
php artisan key:generate
If you have PHP installed locally and you would like to use PHP's built-in development server to serve your application, you may use the serve Artisan command. This command will start a development server at http://localhost:8000:
php artisan serve
Serves your projectYou need to know how laravel works in order to use this version. Check the Laravel 8 official documentation.
<html lang="en" dir="ltr"> <body class="light-only" main-theme-layout="ltr"> <header class="main-nav"> <!-- Content --> </header"> <div class="page-wrapper compact-wrapper" id="pageWrapper"> <div class="page-body-wrapper sidebar-icon"> <!-- Content --> </div> </div> </body> </html>
<html lang="en" dir="ltr"> <body class="dark-only" main-theme-layout="ltr"> <header class="main-nav"> <!-- Content --> </header"> <div class="page-wrapper compact-wrapper" id="pageWrapper"> <div class="page-body-wrapper sidebar-icon"> <!-- Content --> </div> </div> </body> </html>
<html lang="en" dir="rtl"> <body class="dark-only" main-theme-layout="rtl"> <header class="main-nav"> <!-- Content --> </header"> <div class="page-wrapper compact-wrapper" id="pageWrapper"> <div class="page-body-wrapper sidebar-icon"> <!-- Content --> </div> </div> </body> </html>
<html lang="en" dir="ltr"> <body class="light-only" main-theme-layout="box-layout"> <header class="main-nav"> <!-- Content --> </header"> <div class="page-wrapper compact-wrapper box-layout" id="pageWrapper"> <div class="page-body-wrapper sidebar-icon"> <!-- Content --> </div> </div> </body> </html>
<html lang="en" dir="ltr"> <body class="dark-only" main-theme-layout="box-layout"> <header class="main-nav"> <!-- Content --> </header"> <div class="page-wrapper compact-wrapper box-layout" id="pageWrapper"> <div class="page-body-wrapper sidebar-icon"> <!-- Content --> </div> </div> </body> </html>
<html lang="en" dir="rtl"> <body class="light-only" main-theme-layout="rtl"> <header class="main-nav"> <!-- Content --> </header"> <div class="page-wrapper compact-wrapper" id="pageWrapper"> <div class="page-body-wrapper sidebar-icon"> <!-- Content --> <div> <div> </body> </html>
<html lang="en" dir="ltr"> <body class="light-only" main-theme-layout="ltr"> <header class="main-nav close_icon"> <!-- Content --> </header"> <div class="page-wrapper compact-wrapper" id="pageWrapper"> <div class="page-body-wrapper sidebar-icon"> <!-- Content --> </div> </div> </body> </html>
<html lang="en" dir="rtl"> <body class="light-only" main-theme-layout="rtl"> <header class="main-nav close_icon"> <!-- Content --> </header"> <div class="page-wrapper compact-wrapper" id="pageWrapper"> <div class="page-body-wrapper sidebar-icon"> <!-- Content --> </div> </div> </body> </html>
<html lang="en" dir="ltr"> <body class="dark-only" main-theme-layout="ltr"> <header class="main-nav close_icon"> <!-- Content --> </header"> <div class="page-wrapper compact-wrapper" id="pageWrapper"> <div class="page-body-wrapper sidebar-icon"> <!-- Content --> </div> </div> </body> </html>
<html lang="en" dir="rtl"> <body class="dark-only" main-theme-layout="rtl"> <header class="main-nav close_icon"> <!-- Content --> </header"> <div class="page-wrapper compact-wrapper" id="pageWrapper"> <div class="page-body-wrapper sidebar-icon"> <!-- Content --> </div> </div> </body> </html>
Vertical Menu use sidebar script :
<script src="{{asset('assets/js/vertical-sidebar-menu.js')}}"></script>
<html lang="en" dir="ltr"> <head> <script src="{{asset('assets/js/vertical-sidebar-menu.js')}}"></script> </head> <body class="light-only" main-theme-layout="ltr"> <header class="main-nav"> <!-- Content --> </header"> <div class="page-wrapper horizontal-wrapper" id="pageWrapper"> <div class="page-body-wrapper horizontal-menu"> <!-- Content --> </div> </div> </body> </html>
<html lang="en" dir="ltr"> <body class="light-only" main-theme-layout="box-layout"> <header class="main-nav"> <!-- Content --> </header"> <div class="page-wrapper horizontal-wrapper box-layout" id="pageWrapper"> <div class="page-body-wrapper horizontal-menu"> <!-- Content --> </div> </div> </body> </html>
<html lang="en" dir="rtl"> <body class="light-only" main-theme-layout="rtl"> <header class="main-nav"> <!-- Content --> </header"> <div class="page-wrapper horizontal-wrapper" id="pageWrapper"> <div class="page-body-wrapper horizontal-menu"> <!-- Content --> </div> </div> </body> </html>
<html lang="en" dir="ltr"> <body class="dark-sidebar" main-theme-layout="ltr"> <header class="main-nav"> <!-- Content --> </header"> <div class="page-wrapper compact-wrapper" id="pageWrapper"> <div class="page-body-wrapper sidebar-icon"> <!-- Content --> </div> </div> </body> </html>
<html lang="en" dir="rtl"> <body class="dark-sidebar" main-theme-layout="rtl"> <header class="main-nav"> <!-- Content --> </header"> <div class="page-wrapper compact-wrapper" id="pageWrapper"> <div class="page-body-wrapper sidebar-icon"> <!-- Content --> </div> </div> </body> </html>
/resources
/lang
/en
lang.php
/es
lang.php
All language files return an array of keyed strings. For example:
<?php
return[
'welcome' => 'Welcome to our application',
];
?>
The default language for your application is stored in the config/app.php configuration file. You may modify this value to suit the needs of your application. You may also change the active language at runtime using the setLocale method on the App facade:
//Language Change
Route::get('lang/{locale}', function ($locale) {
if (! in_array($locale, ['en', 'de', 'es','fr','pt', 'cn', 'ae'])) {
abort(400);
}
Session()->put('locale', $locale);
Session::get('locale');
return redirect()->back();
})->name('lang');
'fallback_locale' => 'en',
Next up, we are going to create a middleware for dynamically changing the language.
php artisan make:middleware Localization
App\Http\Middleware\Localization.php
namespace App\Http\Middleware;
use Closure;
use Session;
use Illuminate\Http\Request;
use Illuminate\Foundation\Application;
class Localization
{
public function __construct(Application $app, Request $request) {
$this->app = $app;
$this->request = $request;
}
public function handle($request, Closure $next)
{
$this->app->setLocale(session()->get('locale') ?? 'en');
return $next($request);
}
}
You may retrieve lines from language files using the __ helper function. The __ method accepts the file and key of the translation string as its first argument. For example, let's retrieve the welcome translation string from the resources/lang/lang.php language file:
welcome.blade.php
{{ __('lang.welcome') }}
{{ __('I love programming.') }}
If you are using the Blade templating engine, you may use the {{ }} syntax to echo the translation string or use the @lang directive:
{{ __('lang.welcome') }}
@lang('lang.welcome')
{{ trans('lang.welcome') }}
If the specified translation string does not exist, the __ function will return the translation string key. So, using the example above, the __ function would return lang.welcome if the translation string does not exist.
Nore: The @lang directive does not escape any output. You are fully responsible for escaping your own output when using this directive.
You can directly use the compiled and ready-to-use the version of the template. But in case you plan to customize the template extensively the template allows you to do so.
Within the download you'll find the following directories and files, logically grouping common assets and providing both compiled and minified variations:
Note: The root folder denoted further in this documentation refers to the 'template' folder inside the downloaded folder
Open up your FTP manager and connect to your hosting
Browse to required directory (Normally public_html)
Upload the files inside strong Main folder.
We have provided a bunch of page layouts and menu layouts that can be implemented with just a options change to body! Please refer the below table for corresponding classes.
Layout | Options |
---|---|
Boxed Layout | Class: box-layout |
RTL Layout | Class: rtl |
Light layout | - |
Dark Sidebar | Class: sidebar-dark |
Dark Layout | Class: dark-only |
To use another types button you have to link the related css file according to types of buttons in a head tag
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting,remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages,and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting,remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages,and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum
To use another types button you have to link the related css file according to types of buttons in a head tag
# | First Name | Last Name | Username | Role | Country |
---|---|---|---|---|---|
1 | Alexander | Orton | @mdorton | Admin | USA |
2 | John Deo | Deo | @johndeo | User | USA |
3 | Randy Orton | the Bird | admin | UK | |
4 | Randy Mark | Ottandy | @mdothe | user | AUS |
5 | Ram Jacob | Thornton | admin | IND |
We have used the following plugins in Serein admin