Voyager Laravel Admin Panel

repository·1.7·Indexed 11 days ago

https://github.com/thedevdojo/voyager

A Laravel Admin panel and BREAD (Browse, Read, Edit, Add, & Delete) system that provides a visual interface for managing database content and application settings. It includes a flexible BREAD system with customizable formfields, a media picker, and support for Laravel 8+ and Laravel 10.

Tokens
22.5K
Snippets
90
Records
109
Agent score
94%

What's inside Voyager

  1. Understand the purpose and capabilities of Voyager

    1.7

    Voyager is an administrative interface for Laravel applications designed to simplify backend management. It is not a standalone Content Management System (CMS) or blogging platform, but rather a toolset that allows you to build them.

    Core Capabilities:

    • Data Management: Easily add, edit, and delete application data.
    • Menu Builder: Create and manage application menus directly from the admin interface.
    • Media Manager: Manage files and assets for your application.
    • BREAD/CRUD Generator: Automatically generate interfaces for managing database tables (Browse, Read, Edit, Add, Delete).
  2. What is BREAD in Voyager?

    1.7

    BREAD is a core Voyager concept that stands for Browse, Read, Edit, Add, & Delete. It represents the full CRUD (Create, Read, Update, Delete) functionality for a specific database table.

    By adding BREAD to a table via the Database Manager, Voyager automatically generates the administrative interface required to manage that table's data. Once BREAD is applied, you can use the Database Manager to further Edit the BREAD settings (to customize how fields are handled) or Delete the BREAD functionality entirely.

  3. Use the Voyager Media Manager

    1.7

    Voyager includes a built-in Media Manager for managing assets. It provides a full-fledged interface to:

    • Upload files (including drag-and-drop onto the 'upload' button for multiple files)
    • Rename files
    • Delete files
    • Create new folders
    • Move files and folders

    You can also configure the Media Manager to automatically create thumbnails and add watermarks to uploaded images via the configuration file. For specific configuration options regarding watermarks, refer to the media-picker documentation.

  4. Use Compass to run Artisan commands and view logs

    1.7

    The Compass section in Voyager provides a centralized interface for administrative tasks. It is divided into three main functional areas:

    1. Resources & Fonts: Provides quick link references and a list of all available fonts compatible with the Voyager interface.
    2. Command Section: Allows you to execute Laravel artisan commands directly from the Voyager dashboard without needing terminal access.
    3. Logs Tab: Provides a view of your application's logs directly within the UI for quick debugging.
  5. Configure common Formfield options in Voyager BREAD

    1.7

    Formfields are the core of Voyager's BREAD system, representing database table fields as inputs or outputs. You can customize their behavior by inserting JSON options into the Optional Details field within the BREAD configuration.

    Commonly shared options include:

    • Description: Add a helpful description for the field.
    • Display: Control the visual layout (width and custom ID).
    • Default Value: Set a fallback value for new entries.
    • Null Values: Convert specific strings into null in the database.
    • Generating Slugs: Automatically derive a slug from another field.
    • Custom Views: Override the default rendering with a custom Blade view.
    // Example of combining multiple options
    {
        "description": "A helpful description text here.",
        "display": {
            "width": "3",
            "id": "custom_id"
        },
        "default": "Default text"
    }
  6. Generate image thumbnails in Media Picker

    1.7

    You can define an array of thumbnails to automatically generate different image sizes upon upload. There are three supported types:

    1. Fit

    Combines cropping and resizing to match dimensions. Requires width.

    • height (optional)
    • position (optional)

    2. Crop

    Crops the image to specific dimensions. Requires width and height.

    • x (optional): Left offset
    • y (optional): Top offset

    3. Resize

    Resizes the image to given dimensions.

    • width (required/optional)
    • height (required/optional)
    • upsize (optional): Boolean. Set to false to prevent enlarging images smaller than the target dimensions.

    Note: If a watermark is defined at the parent level, you can set "watermark": true within a thumbnail configuration to apply it to that specific thumbnail.

    {
        "thumbnails": [
            {
                "type": "fit",
                "name": "fit-500",
                "width": 500,
                "height": 500,
                "position": "center"
            },
            {
                "type": "crop",
                "name": "crop-500-500",
                "width": 500,
                "height": 500,
                "x": 50,
                "y": 50
            },
            {
                "type": "resize",
                "name": "resize-500",
                "width": 500,
                "upsize": true
            }
        ]
    }
  7. Configure BREAD field visibility and form types

    1.7

    When configuring BREAD (Browse, Read, Edit, Add, Delete) for a database table, you can control which views each field appears in by selecting the following checkboxes:

    • BROWSE: Field shows up in the data list view.
    • READ: Field shows up when viewing a single record's details.
    • EDIT: Field is visible and editable in the edit form.
    • ADD: Field is visible in the creation form.
    • DELETE: (Does not affect deletion logic; can be toggled for UI preference).

    You can also specify the form type for each field (e.g., TextBox, TextArea, Checkbox, Image, etc.) and provide additional details such as checkbox, dropdown, radio button, or image options.

  8. Manage site-wide settings in Voyager

    1.7

    The Settings section in Voyager allows you to define and manage site-wide configuration values, such as site logos (via image uploads) or homepage headlines (via text boxes).

    Settings are organized into groups. To reference a setting in your application, use the dot notation format: {group}.{key}.

  9. How Roles and Permissions work in Voyager

    1.7

    Voyager uses a hierarchical authorization system where each User is assigned a Role, and each Role contains a set of Permissions.

    Permissions can be managed directly within the Voyager dashboard by adding, editing, or deleting roles and specifying BREAD permissions for each role.

    Voyager's authorization system is designed to be compatible with Laravel's native authorization, allowing you to check permissions via the user object, the Auth facade, or within controllers using $this->authorize().

  10. Use expressions in base_path and rename

    1.7

    The base_path and rename configuration options support placeholders to dynamically generate paths and filenames.

    Available placeholders:

    • {pk}: The primary-key of the entry (available only for base_path).
    • {uid}: The ID of the currently logged-in user.
    • {date:format}: The current date using a specific format (e.g., {date:d.m.Y}).
    • {random:N}: A random string with N characters (e.g., {random:10}).

    Example base_path usage:

    {
        "base_path": "/my-bread/{pk}/{date:Y}/{date:m}/"
    }
  11. Override Voyager Controllers

    1.7

    You can change the default namespace for Voyager's controllers in config/voyager.php using the controllers.namespace key. This allows you to duplicate core controllers and provide your own implementations.

    To overwrite a single specific controller without duplicating the entire namespace, bind your custom controller in the register method of your AppServiceProvider:

    $this->app->bind(VoyagerBreadController::class, MyBreadController::class);
    'controllers' => [
        'namespace' => 'TCG\\Voyager\\Http\\Controllers',
    ],
  12. Enable Tagging for Belongs-To-Many relationships

    1.7

    Tagging allows you to add new items to a Belongs-To-Many relationship directly from the BREAD edit or add forms.

    To use this:

    1. Enable Tagging in the relationship details within the BREAD settings.
    2. In the UI, you can enter free-text into the select field and press Enter to save a new relationship item.

    Note: Tagging only stores the display-column. Ensure that all other fields in the related table are either nullable or have a default value to prevent errors when creating items via tagging.