Add a native Multi-Select/Tags field

Right now there is the option to have a single-select (dropdown) by adding a text field with predefined values.

However, there is no multi-select option with the closest thing being a modular content block built up of single-select dropdowns, which is slow to build out and looks messy.

This is particularly useful for things like blog posts, portfolio projects and products, or anything which can be categorised into multiple groups where you want to ensure flexibility.

Bonus: A step up from this would be to allow a tag field, where the categories are not predefined by an administrator but preserved across entries once created by an editor (example: https://bootstrap-tagsinput.github.io/bootstrap-tagsinput/examples/)

thank you @dan1 for this!

Have you tried already this plugin: https://www.datocms.com/marketplace/plugins/i/@ecologic/datocms-plugin-multiselect ?

I have, and a few of the other select plugins which have been created but they all have significant UX issues, where the plugins work for a very specific use case. The one linked is more of a ‘multi-toggle’ than a ‘multi-select’.

With many categories, this approach is incredibly overwhelming for an editor, who might just want to select a few categories but is presented with a list of tens (or hundreds) all displayed at once.

Technically, it works, but it’s not a great experience as more options are added (all plugins and current native approaches fail due to this issue) which is why I suggested a native approach built with usability & scalability in mind from the start.

Thanks for considering this!

Yes, I agree that it’s not meant for that use case you are saying.

Thank you for the feature request, we’ll consider this!

@dan1 FWIW we just use a separate model for “Categories” and have a Multiple Links field referencing them from our Blog Posts. This makes for a good editing experience (can create new or re-use existing, all inline):

It also makes it easy to render a static page for each set of blog posts, by category:

query BlogPostsByCategoryId($id: ItemId) {
  allBlogPosts(filter: { categories: { anyIn: [$id] } }) {
    ...etc
  }
}
2 Likes