تخصيص واجهة Laravel Nova

بإمكانك تعديل الأشكال والألوان وتغيير التصميم العام باستخدام CSS وتخصيص العناصر باستخدام JavaScript.

أو إضافة صفحات مخصصة جديدة في واجهة لارافل نوفا، باتباع الخطوات التالية:

عليك بإنشاء ملف طلب جديد للصفحة المخصصة باستخدام الأمر php artisan nova:resource في موجه الأوامر (Command Line)، وذلك الأمر سيولد ملف طلب جديد يمثل صفحة المورد المخصص.

php artisan nova:resource MyCustomPage

ثم، انتقل إلى ملف الطلب الذي تم إنشاؤه في المسار app/Nova/MyCustomPage.php وقم بتحريره لتحديد اللوحة والمعالج المرتبط بالصفحة المخصصة.

// app/Nova/MyCustomPage.php

namespace App\Nova;

use Laravel\Nova\Resource;
use Laravel\Nova\Fields\Text;

class MyCustomPage extends Resource
{
    public static $displayInNavigation = false;

    public function fields(Request $request)
    {
        return [
            Text::make('Title'),
        ];
    }
}

ثم قم بتسجيل الصفحة المخصصة في ملف التحكم (NovaServiceProvider) الخاص بك في المسار app/Providers/NovaServiceProvider.php باستخدام الأسلوب nova::resources.

// app/Providers/NovaServiceProvider.php

use App\Nova\MyCustomPage;

protected function resources()
{
    return [
        MyCustomPage::class,
    ];
}

وبتلك الخطوات، ستظهر صفحة المورد المخصصة الخاصة بك في واجهة لارافل نوفا.

بتاريخ 18 دقائق مضت قال Mustafa Suleiman:

بإمكانك تعديل الأشكال والألوان وتغيير التصميم العام باستخدام CSS وتخصيص العناصر باستخدام JavaScript.

أو إضافة صفحات مخصصة جديدة في واجهة لارافل نوفا، باتباع الخطوات التالية:

عليك بإنشاء ملف طلب جديد للصفحة المخصصة باستخدام الأمر php artisan nova:resource في موجه الأوامر (Command Line)، وذلك الأمر سيولد ملف طلب جديد يمثل صفحة المورد المخصص.

php artisan nova:resource MyCustomPage

ثم، انتقل إلى ملف الطلب الذي تم إنشاؤه في المسار app/Nova/MyCustomPage.php وقم بتحريره لتحديد اللوحة والمعالج المرتبط بالصفحة المخصصة.

// app/Nova/MyCustomPage.php

namespace App\Nova;

use Laravel\Nova\Resource;
use Laravel\Nova\Fields\Text;

class MyCustomPage extends Resource
{
    public static $displayInNavigation = false;

    public function fields(Request $request)
    {
        return [
            Text::make('Title'),
        ];
    }
}

ثم قم بتسجيل الصفحة المخصصة في ملف التحكم (NovaServiceProvider) الخاص بك في المسار app/Providers/NovaServiceProvider.php باستخدام الأسلوب nova::resources.

// app/Providers/NovaServiceProvider.php

use App\Nova\MyCustomPage;

protected function resources()
{
    return [
        MyCustomPage::class,
    ];
}

وبتلك الخطوات، ستظهر صفحة المورد المخصصة الخاصة بك في واجهة لارافل نوفا.

اريد تخصيص الصفحة HTML CSS

مثلاً MyCustomPage.blade.php 

او MyCustomPage.vue

تخصيص واجهة Laravel Nova يتيح لك تغيير مظهر وسلوك لوحة التحكم الإدارية Nova وفقًا لاحتياجات مشروعك. يمكنك تخصيص عوامل مثل النمط، الألوان، القوائم، البيانات المعروضة، والإضافات. هناك عدة طرق يمكنك استخدامها لتخصيص واجهة Laravel Nova:

• تخصيص النمط والتصميم:

يمكنك تخصيص النمط العام لواجهة Nova باستخدام ملفات CSS المخصصة. يمكنك إضافة ملفات CSS الخاصة بك وتغيير الألوان والخطوط والهوامش وما إلى ذلك.

يُعتبر ملف

resources/views/vendor/nova/partials/meta.blade.php

ملفًا مرجعيًا لتعديل العناصر الرئيسية لواجهة Nova.

• تخصيص القوائم والتصفح:
  • يمكنك تغيير ترتيب القوائم والقوائم الجانبية عن طريق تحديد القوائم المعروفة في ملف NovaServiceProvider.php واستخدام الدوال المتاحة مثل tools, cards, meta, وغيرها.
  • يمكنك تخصيص واجهة التصفح باستخدام الفصول (Resources) المخصصة وتغيير طريقة عرض البيانات.
• تخصيص تفاصيل الموارد (Resources):
  • يمكنك تعديل طريقة عرض وتحرير التفاصيل لكل مورد (Resource) عبر استخدام ملفات المشاهدة (Views) الخاصة بالموارد.
  • يمكنك أيضًا تخصيص العرض والتحرير باستخدام المعلقات (Lenses) والحقول المخصصة (Custom Fields).

اقتباس

اريد تخصيص الصفحة HTML CSS

مثلاً MyCustomPage.blade.php 

او MyCustomPage.vue

أيضا يمكنك تخصيص هذه الصفحات حيث شئت بصورة بسيطة ، حيث يمكنك إنشاء أي قالب لهذه الصفحات أو الاعتماد على قالب متوفر بشكلٍ مجاني على الأنترنت.