Better Entity Reference

Better Entity Reference provides an enhanced field widget for entity reference fields. Instead of the standard autocomplete widget, it offers a tag-based interface where selected items appear as removable tags and can be reordered via drag and drop, with the order automatically saved. A round "+" button opens a popover for browsing and selecting entities, featuring search, sorting, alphabetical grouping, and folder-style navigation for hierarchical vocabularies. The widget stores values using Drupal core's underlying entity reference input, ensuring graceful fallback to the standard autocomplete experience when JavaScript is unavailable.

Key features

• Two widgets: Better Entity Reference for entity reference fields (any selection handler, including views; a broken handler falls back to the plain autocomplete instead of breaking the form) and Better Options for list (text, integer, float) fields.
• Add/remove popover with search (contains or starts with), sort by name or created date, a Glossary view grouping options under letter headings, and a Parent terms first toggle - the toggles and sort buttons sit in a collapsible tray next to the search box, and choices are remembered per browser.
• Folder-style browsing for hierarchical vocabularies: drill into parent terms level by level with a breadcrumb and per-folder counts, loaded on demand above a configurable threshold.
• Live search for non-taxonomy and views-driven fields: options come from a CSRF- and HMAC-guarded endpoint through the field's configured selection handler, respecting its scoping and access checks.
• Drag to reorder (or use the arrow keys on a focused tag) - the tag order is the saved field order. Off for single-value fields, optional everywhere else.
• Quick create: fields with auto-create show a "+ New ..." row that creates and picks the item in one step - inside a folder the new term is created under it. Typing an existing label picks it instead of duplicating. Guarded by create access and flood control.
• Tag colors: each entity gets a stable color of its own - Random over all hues, Shades of a main color, or One color for every tag - drawn as a Stroke (border and dot) or a Fill (whole tag, with readable text picked by brightness). An entity's own color field always wins, and hook_better_entity_reference_option_alter() can change any tag's color and data.
• Tooltips on the popover options and the picked tags, with configurable contents: hierarchy, type, ID, publication status and description.
• Better Tags formatter for both field types, inheriting the widget's color settings by default (or configuring its own), with an optional link to the referenced entity.
• Validation you can see: required fields warn on submit with a red label and message; values the server refuses ("cannot be referenced") get a red border on their exact tag; fields limited to N values disable the "+" at the limit and re-enable it when a tag is removed.
• Form elements for custom forms: better_entity_reference (ordered entity ids, lazy browsing, live search, auto-create) and better_options (any keyed options array with per-option colors and metadata).
• Accessible: full keyboard support, ARIA roles and labels on tags and controls, and screen reader announcements for picks, reorders and limits.

Screenshots

Configuration

1. On the field's Manage form display, choose Better Entity Reference (entity reference fields) or Better Options (list fields).
2. Open the widget settings: Colors (coloring mode, tag style, main color), Options list (draggable, search, sorting, Glossary and Parent terms first buttons, options shown at once), Tooltips (where they show and what they contain) and Loading (on-demand loading and its threshold, taxonomy parent term).
3. Optionally pick the Better Tags formatter on Manage display - it inherits the widget's colors by default and can link each tag to its entity.

Usage

1. Picked items show as tags in the order they were picked. Remove one with its "x", or drag it (or focus it and use the arrow keys) to reorder - the order is saved.
2. The "+" opens the popover: type to filter or live-search, sort by name or created date, and use the sliders button next to the search box to open the Glossary and Parent terms first toggles.
3. In hierarchical vocabularies, rows with nested terms show an arrow - drill in, and step back with the breadcrumb.
4. If the field allows creating new items, the "+ New ..." row creates and picks one in place.

Requirements

• Drupal 10.6+, 11.3+ or 12.
• No dependencies beyond Drupal core.

Built with AI assistance