★ A tags field for Nova apps
Tags: laravel, nova, php
Published: 2020-01-02 23:04:08

---
title: ★ A tags field for Nova apps
published: true
date: 2018-09-16 22:00:00 UTC
tags: laravel, nova, php
canonical_url: https://freek.dev/1154-a-tags-field-for-nova-apps
---

A while ago I [ditched the custom admin](https://github.com/spatie/murze.be/commit/287def06eb78fd5bb03181b85d0d0dca1f4efea1) of this blog in favour of [Laravel Nova](https://nova.laravel.com). As you might have noticed every blog post on murze.be has some tags. Nova ships with [many form fields](https://nova.laravel.com/docs/1.0/resources/fields.html#fields) but a field to use tags is not included out of the box. That's why I created my own tags field and released it as [spatie/nova-tags-field](https://github.com/spatie/nova-tags-field). In this post I'd like to introduce it to you.

## Using the field #

Using the tags field is very easy. You just have to add it to your Nova resource.

```
namespace App\Nova;

// ...

class BlogPost extends Resource
{
    // ...
    
    public function fields(Request $request)
    {
        return [
            // ...
            
            Tags::make('Tags'),

            // ...
        ];
    }
}
```

And that's all you need to do. This is what the field looks like:

![Screenshot of the murze.be admin](https://freek.dev/uploads/media/nova-tags-field/screenshot.png)

When typing a tag, the field will autosuggest existing tags. If you don't want that autosuggesting you can turn it off like this:

```
return [
   Tags::make('Tags')->withoutSuggestions(),
];
```

## Using types #

The field also has support for multiple tag types. If you want to use multiple tag fields on your resource you could do this:

```
return [
   Tags::make('Tags')->type('author'),
   Tags::make('Tags')->type('subject'),
];
```

The first tag field will now only suggest existing authors, the second one will suggest existing subjects.

## Allowing only one tag #

If you want to allow only one tag the be picked, you can use the single method.

```
return [
   Tags::make('Tags')->single(),
];
```

The field will be rendered as a select form element. It will be populated by the names of the tags already saved.

## Administering tags in Nova #

If you want to perform crud actions on the save tags, just create a Nova resource for it. Here's an example.

```
namespace App\Nova;

use Illuminate\Http\Request;
use Laravel\Nova\Fields\Text;
use Spatie\Tags\Tag as TagModel;

class Tag extends Resource
{
    public static $model = TagModel::class;

    public static $title = 'name';

    public static $search = [
        'name',
    ];

    public function fields(Request $request)
    {
        return [
            Text::make('Name')->sortable(),
        ];
    }
}
```

## Working with tags programmatically #

Under the hood the nova field uses [our laravel-tags package](https://docs.spatie.be/laravel-tags/v2/introduction), which makes working with tags very easy. Here are a few examples:

```
// create a model with some tags
$post = Post::create([
   'name' => 'testModel',
   'tags' => ['tag', 'tag2'], //tags will be created if they don't exist
]);

$post->tags; // returns a collection with all attached tags

// attaching tags
$post->attachTag('tag3');
$post->attachTags(['tag4', 'tag5']);

// detaching tags
$post->detachTag('tag3');
$post->detachTags(['tag4', 'tag5']);

// syncing tags
$post->syncTags(['tag1', 'tag2']); // all other tags on this model will be detached

// retrieving models that have any of the given tags
Post::withAnyTags(['tag1', 'tag2']);

// retrieve models that have all of the given tags
Post::withAllTags(['tag1', 'tag2']);
```

Under the hood our nova-tags-field package will call these methods too.

## Closing thoughts #

You'll find the installation instruction of the nova-tags-field [on GitHub](https://github.com/spatie/nova-tags-field). If you like this nova field be sure to check out our other two Nova packages:

- [nova-tail-tool](https://github.com/spatie/laravel-tail-tool)
- [nova-backup-tool](https://github.com/spatie/laravel-backup-tool)

Even if you're not into Laravel Nova, you probably will find something for your next project in [this big list of packages](https://spatie.be/open-source/packages) my team has made previously.