Data Bars vs. Status Badges in TableCrafter: Which to Use When

Updated July 2026 • 6 min read • By Fahad Murtaza • By Fahad Murtaza

TableCrafter gives you two powerful visual tools for making numeric and categorical data scannable at a glance: data bars and status badges. Data bars are a Pro feature for numeric magnitude visualization. Status badges are a Free feature for color-coding categorical text values. They serve fundamentally different purposes. Knowing which to reach for, and when to combine them, will make your tables clearer without adding clutter. WordPress powers 43% of all websites globally (W3Techs, July 2026), and TableCrafter bridges the gap between the data you collect and the tables your users need to see, no custom PHP, no dashboard access required for viewers. The free version on WordPress.org supports CSV, JSON, Google Sheets, and Excel. Pro adds Gravity Forms, Airtable, Notion, WooCommerce, REST APIs, inline cell editing, export to CSV and Excel, role-based column visibility, and auto-refresh. Every table embeds on any page with a [tablecrafter] shortcode or the native Gutenberg block.

How Do What Data Bars Do and When They Help Work?

Data bars render an inline bar chart inside a numeric cell. The bar fills a proportion of the cell width based on the value relative to the column's min and max range. This gives readers an immediate visual sense of magnitude without forcing them to compare raw numbers mentally.

Data bars are the right choice when:

• The column holds a continuous numeric value (revenue, load weight, mileage, score, quantity)
• The relative size of values matters more than the exact number
• You want to expose outliers quickly, a bar that barely fills the cell stands out immediately next to one that's near full
• You have more than a handful of rows, so visual scanning is faster than reading each number

A practical trucking example: a Miles Driven column with data bars lets a dispatcher instantly spot which drivers are approaching their hour limits without reading every cell. The exact number is still visible; the bar adds context.

How Do What Status Badges Do and When They Help Work?

Status badges convert a text value into a colored pill or label. You define a mapping, for example, Active → green, Pending → yellow, Cancelled → red, and TableCrafter renders the matching badge instead of raw text. The result is a color-coded legend that readers can scan vertically down a column in milliseconds.

Status badges are the right choice when:

• The column holds a fixed set of categorical values (status, stage, type, priority)
• The distinction between categories carries urgency (errors vs. warnings vs. success states)
• Your audience needs to filter visually by state before applying table filters
• The raw text values are long or technical and a shorter badge label communicates the same thing faster

An order management example: a Fulfillment Status column with badges turns a wall of text into an at-a-glance dashboard. Rows with Awaiting Shipment get a yellow badge; Delivered gets green; Returned gets red. Staff can triage without reading a word.

How Do I Configure Data Bars in the Table Builder?

Data bars are configured at the column level inside the TableCrafter admin. Navigate to TableCrafter → Tables, open your table, and find the column you want to enhance.

1. Set the column Display Type to Data Bar.
2. Choose a Bar Color using the hex color picker. The color must be a valid hex value (e.g., #3b82f6). Named colors and rgb() values are not supported; invalid values fall back to the default blue #3b82f6.
3. Optionally enable Show Label to display the raw numeric value alongside the bar, or disable it to show the bar alone.
4. Optionally enable Gradient or Bipolar modes for more advanced visualizations.

The bar scale is computed automatically from the column's maximum value across the currently visible page of data. There are no user-configurable Min Value or Max Value fields: the bar fill is always proportional to the page-scoped maximum, so the widest bar always belongs to the largest value visible. Save the table and embed with [tablecrafter id="42"].

How Do I Configure Status Badges in the Table Builder?

Badge configuration lives in the same column settings panel. Set the Display Type to Status Badge, then build your value-to-color mapping. Status badges are a Free feature; no Pro license is required.

1. Click Add Mapping for each distinct value in the field.
2. Enter the stored value exactly as it appears in the data source. Matching is case-sensitive: "Active" and "active" are different.
3. Pick a background color hex and a text color hex. Both are required. If either is missing or not a valid hex, TC_Badge_Service::sanitize_map() drops the entire rule.

The badge displays the raw cell value as its text label. There is no separate display label field. There is also no wildcard fallback (*) mapping: unmapped values render as plain text, not inside a badge. A complete badge mapping for an order status column might look like this:

active      → bg: #22c55e  text: #ffffff
pending     → bg: #f59e0b  text: #ffffff
cancelled   → bg: #ef4444  text: #ffffff
on-hold     → bg: #6b7280  text: #ffffff

What Is Choosing Between Them: A Quick Decision Framework?

The core distinction is simple: data bars are for magnitude; status badges are for categories. A few edge cases are worth calling out explicitly.

• Numeric status codes (e.g., HTTP status codes stored as integers): use badges, not bars. The numbers aren't on a continuous scale where relative size matters, 404 is not "more" than 200 in any meaningful visual sense.
• Percentages: data bars are almost always the right call. A 0–100 scale with a fixed min/max makes the bar immediately intuitive.
• Star ratings (1–5): either can work. Bars show the spectrum nicely; badges work well if you want color-coded tiers (1–2 red, 3 yellow, 4–5 green) and are willing to create mappings for each value.
• Currency values: data bars, assuming the goal is comparison. If you want to flag overdue amounts as red, consider adding a separate Payment Status column with badges rather than bending the currency column.
• Boolean fields (Yes/No, True/False): status badges win every time. A two-value bar chart conveys no meaningful difference in magnitude.

When in doubt, ask: "Does the size of this value relative to other values matter?" If yes, use a data bar. If the value is a label that happens to be stored as text or a number, use a badge.

How Does Combining Both in the Same Table Work?

Data bars and status badges are not mutually exclusive. A well-designed TableCrafter table often uses both in different columns. Consider a delivery management table:

• Load Weight (lbs), data bar, 0–80,000 lb scale, orange fill
• Miles This Week, data bar, 0–3,500 mi scale, blue fill
• Driver Status, status badge: Available (green), En Route (blue), Off Duty (gray)
• Compliance Flag, status badge: Clear (green), Review Needed (yellow), Violation (red)

This combination gives dispatchers a scannable dashboard from a single shortcode embed. The data bars handle the quantitative columns while badges handle the qualitative state columns. Role-based column visibility (another Pro feature) can then hide the compliance column from drivers while keeping it visible to managers, no separate table required.