Add HTML to Card value in Widget

Is there a simple way of doing this...

namespace App\Filament\Widgets;

use App\Models\Order;
use Filament\Widgets\StatsOverviewWidget\Card;
use Filament\Widgets\StatsOverviewWidget as BaseWidget;

class OrderStats extends BaseWidget
{
    protected function getCards(): array
    {
        return [
            Card::make('Pending Orders',Order::where('StatusID',5)->count()),
            Card::make('Cards To Ship',Order::where('StatusID',5)->withSum('OrderDetail','ItemQuantity')->get()->sum('order_detail_sum_item_quantity')),
            Card::make('Links:','<a href="/filament/resources/orders">Orders</a></br><a href="/filament/resources/orders">Orders</a>'),
        ];
    }
}

namespace App\Filament\Widgets;

use App\Models\Order;
use Filament\Widgets\StatsOverviewWidget\Card;
use Filament\Widgets\StatsOverviewWidget as BaseWidget;

class OrderStats extends BaseWidget
{
    protected function getCards(): array
    {
        return [
            Card::make('Pending Orders',Order::where('StatusID',5)->count()),
            Card::make('Cards To Ship',Order::where('StatusID',5)->withSum('OrderDetail','ItemQuantity')->get()->sum('order_detail_sum_item_quantity')),
            Card::make('Links:','<a href="/filament/resources/orders">Orders</a></br><a href="/filament/resources/orders">Orders</a>'),
        ];
    }
}

namespace App\Filament\Widgets;

use App\Models\Order;
use Filament\Widgets\StatsOverviewWidget\Card;
use Filament\Widgets\StatsOverviewWidget as BaseWidget;

class OrderStats extends BaseWidget
{
    protected function getCards(): array
    {
        return [
            Card::make('Pending Orders',Order::where('StatusID',5)->count()),
            Card::make('Cards To Ship',Order::where('StatusID',5)->withSum('OrderDetail','ItemQuantity')->get()->sum('order_detail_sum_item_quantity')),
            Card::make('Links:','<a href="/filament/resources/orders">Orders</a></br><a href="/filament/resources/orders">Orders</a>'),
        ];
    }
}

namespace App\Filament\Widgets;

use App\Models\Order;
use Filament\Widgets\StatsOverviewWidget\Card;
use Filament\Widgets\StatsOverviewWidget as BaseWidget;

class OrderStats extends BaseWidget
{
    protected function getCards(): array
    {
        return [
            Card::make('Pending Orders',Order::where('StatusID',5)->count()),
            Card::make('Cards To Ship',Order::where('StatusID',5)->withSum('OrderDetail','ItemQuantity')->get()->sum('order_detail_sum_item_quantity')),
            Card::make('Links:','<a href="/filament/resources/orders">Orders</a></br><a href="/filament/resources/orders">Orders</a>'),
        ];
    }
}

This does not work as it shows the full HTML. I tried the blade '{!!' but that doesn't have any effect.

I tried creating a separate Widget but then it does not show all three cards on the same line.

Is there a way to include another widget as the third item within this return statement?

Solution

I think this should work in your case:

Jump to solution

Tin•8/10/23, 8:55 PM

can you try new HtmlString('....')new HtmlString('....') Not sure tbh!

Solution

Tin•8/10/23, 8:57 PM

I think this should work in your case:

TTin I think this should work in your case:

rubendnOP•8/10/23, 8:59 PM

Perfect. Worked.

Card::make('Links:',new HtmlString('<a href="/filament/resources/orders">Orders</a></br><a href="/filament/resources/orders">Orders</a>')),

Card::make('Links:',new HtmlString('<a href="/filament/resources/orders">Orders</a></br><a href="/filament/resources/orders">Orders</a>')),

Thank You!