Voyager 在管理員登入後，Dashboard 就會出現三個預設的 Widgets

這裡記錄客製化 Widgets 的方式

修改預設 Widgets config

首先，開啟 config/voyager.php

可以找到預設的 Widgets：

<?php ...
        'widgets' => [
            'TCG\\Voyager\\Widgets\\UserDimmer',
            'TCG\\Voyager\\Widgets\\PostDimmer',
            'TCG\\Voyager\\Widgets\\PageDimmer',
        ],

先將預設的 Widgets 註解掉，改為我們需要

<?php ...
        'widgets' => [
            // 'TCG\\Voyager\\Widgets\\UserDimmer',
            // 'TCG\\Voyager\\Widgets\\PostDimmer',
            // 'TCG\\Voyager\\Widgets\\PageDimmer',
            'App\\Widgets\\Guardian',
            'App\\Widgets\\Adoptee',
            'App\\Widgets\\Adoptor',
        ],

複製 Widgets 進行修改

前往 vendor\tcg\voyager\src\Widgets\

並且將檔名更改為你在config/voyager.php 設定的名稱，

例如我這裡設定的 Guardian.php, Adoptee.php, Adoptor.php

接著，修改檔案

  • 修改 namespace
  • 引入 BaseDimmer
  • 修改 $count 所引用的 Model
  • 修改預設 $string
  • 修改 icon
  • 修改 button 文字及連結
  • 修改背景圖
CVT2HUGO: 將資料夾搬移到 ```app\```
<?php
//修改 namespace
namespace App\Widgets;
//引入 BaseDimmer 
use TCG\Voyager\Widgets\BaseDimmer;


class Guardian extends BaseDimmer
{
		//修改 $count 所引用的 Model
        $count = \App\Guardian::count();
        //修改預設 $string
        $string = '送養人';
        //修改 icon
        'icon'   => 'voyager-person',
        //修改 button 文字及連結
        'button' => [
                'text' => '前往',
                'link' => asset('admin/guardians'),
            ],
            // 修改背景圖
            'image' => '01.jpg',

CVT2HUGO: 底下

接著陸續修改其他兩個檔案

添加背景圖

在前面設定，我們加入了背景圖

可以將你想設定為背景圖的照片，放在 public/ 資料夾中即可

完成～