PHP的Laravel架構中使用AdminLTE模板來編寫網站後台介面，laraveladminlte_PHP教程

PHP的Laravel架構中使用AdminLTE模板來編寫網站後台介面，laraveladminlte

AdminLTE 是一個基於Bootstrap 3.x的免費進階管理控制台主題，完全響應式管理，適合從小型行動裝置到大型台式機很多的螢幕解析度。

AdminLTE的特點：

• 充分響應
• 可分類的儀錶盤
• 18外掛程式和3自訂外掛程式
• 重量輕和快速
• 與大多數主流瀏覽器安全色
• 完全支援Glyphicons,Fontawesome和表徵圖

我們使用的工具

• Laravel
• AdminLTE 2.3.2
• Bower
• Composer

下載一個全新的 Laravel
如果不太清楚可以去官方網站查看文檔link
在此我們直接使用命令列即可

composer create-project laravel/laravel myapp --prefer-dist

通過這個命令我們建立了一個全新的名字為 myapp 的Laravel項目，如果你成功的話你可以看到下面的圖片

通過 Bower 下載 AdminLTE
進入到 myapp/public 檔案夾

  cd myapp/public

在這個檔案夾下執行下面的命令

 bower install admin-lte

一旦完成，你會發現多了一個 bower_componets 的檔案夾，而且在這個檔案夾中你會看到 AdminLTE

將 AdminLTE 的starter.html 轉化為 Blade 模板
Laravel 在此使用了一個很好的模板引擎 Blade，為了更充分的利用Blade，我們需要將一些常規的通用的 HTML 的 起始頁面應用到 Blade 模板中，首先建立一個 view 在 resources/views檔案夾中，命名為admin_template.blade.php，而後我們為這個頁面建立一個對應的路由。如下面我所建立的

 Route::get('admin', function () {  return view('admin_template'); });

然後，將bower_components/admin-lte/starter.html中的內容複寫到我們視圖模板中，並且將其中的相關連結指向我們的 AdminLTE 的對應目錄下，如下是我初步的設定：

類似這樣，將css 和 js 的相關的連結指向相應的目錄下，而後我們通過 localhost:8000/admin 查看頁面的變化，此時頁面變成了如：

現在我們擁有了所有的使用 AdminLTE 的所有的資源，下面對我們的主要視圖增加最後的收尾工作，我將分開這個模板為三個檔案，sidebar.blade.php, header.blade.php, 和 footer.blade.php
這三個檔案的內容分別是admin_template.blade.phpheader 部分和 aside 部分和footer 部分，將這三部分截取出來依次放到三個檔案中。

最後的潤色工作
現在我們已經將我們的模板個人化的分離開了，下面我們需要設定我們的最初的admin_template.blade.php
模板以便於內容動態載入，如下所示：

head>{{ $page_title or "AdminLTE Dashboard" }}@include('header')@include('sidebar')    
   {{ $page_title or "Page Title" }}   {{ $page_description or null }}  
    
 
   
  
 Level
   
  
Here
  
 
       @yield('content') @include('footer')
 
 
  
 
  

 
   
Recent Activity
 
 
  
  
  
Langdon's Birthday
 
Will be 23 on April 24th
 
 
 
  
Tasks Progress
 
 
  
  
 
 Custom Template Design 70% 
 
 
 
     Stats Tab Content      

在上面代碼中，我們添加了contetn，這裡包含著我們的主要的內容，增加了頁面標題針對不同的頁面，將其重新命名為dashboard.blade.php現在這個模板已經可以使用了。

測試頁面

為了驗證我們之前所做的工作，我將建立一個簡單的頁面

1.建立 test.blade.php

@extends('dashboard')@section('content')            
Randomly Generated Tasks
                            @foreach($tasks as $task)     
      {{ $task['name'] }}      {{$task['progress']}}%     
                    @endforeach                            
Second Box
                            A separate section to add any kind of widget. Feel free    to explore all of AdminLTE widgets by visiting the demo page    on Almsaeed Studio.      @endsection

2.建立TestController.php

php artisan make:controller TestController --plain

下面是這個控制器的代碼部分：

 <?php  namespace App\Http\Controllers;  use Illuminate\Http\Request;  use App\Http\Requests;  use App\Http\Controllers\Controller;  class TestController extends Controller  {   public function index() {   $data['tasks'] = [     [      'name' => 'Design New Dashboard',      'progress' => '87',      'color' => 'danger'     ],     [      'name' => 'Create Home Page',      'progress' => '76',      'color' => 'warning'     ],     [      'name' => 'Some Other Task',      'progress' => '32',      'color' => 'success'     ],     [      'name' => 'Start Building Website',      'progress' => '56',      'color' => 'info'     ],     [      'name' => 'Develop an Awesome Algorithm',      'progress' => '10',      'color' => 'success'     ]   ];   return view('test')->with($data);  } }

3.建立對應的路由

 Route::get('test', 'TestController@index');

4.開啟對應的頁面，如果你沒有出錯的 應該如所示

您可能感興趣的文章:

• 深入解析PHP的Laravel架構中的event事件操作
• PHP的Laravel架構結合MySQL與Redis資料庫的使用部署
• PHP的Laravel架構中使用訊息佇列queue及非同步隊列的方法
• 詳解PHP的Laravel架構中Eloquent對象關係映射使用
• PHP架構Laravel學習心得體會
• 全面解讀PHP的人氣開發架構Laravel
• Nginx中運行PHP架構Laravel的設定檔分享
• PHP IDE PHPStorm配置支援友好Laravel代碼提示方法
• 使用 PHPStorm 開發 Laravel
• PHP開發架構laravel安裝與配置教程
• PHP架構Laravel的小技巧兩則

http://www.bkjia.com/PHPjc/1113726.htmlwww.bkjia.comtruehttp://www.bkjia.com/PHPjc/1113726.htmlTechArticlePHP的Laravel架構中使用AdminLTE模板來編寫網站後台介面，laraveladminlte AdminLTE 是一個基於Bootstrap 3.x的免費進階管理控制台主題，完全響應式...

