Bright Plugins está adquiriendo plugins de WordPress y WooCommerce. Hablemos

Diseñe el estado de su pedido personalizado

2 min read Updated 20 de abril de 2026 By the Bright Plugins team

Resumen rápido#

  • Agrega un icono reconocible a su estado personalizado.
  • Poner Color y Color de fondo del texto para una insignia legible.
  • Elige cómo aparece en las listas con Vista de estado (Nombre o Icono ).
  • Obtenga una vista previa del resultado en Pedidos → WooCommerce .

Abrir el editor de estado#

Camino: WooCommerce → Pedidos → Estado del pedido → Editar (elija un estado) o Agregar nuevo (crear uno).


ALT: Editor de estado abierto desde WooCommerce → Pedidos → Estado del pedido.
Subtítulo: "Abra el editor de estado desde Pedidos → Estado del pedido".

Agregar un icono#

Clic Agregar icono y elige un ícono simple y descriptivo. Evite las formas demasiado detalladas; Prefiere siluetas claras.


ALT: Selector de iconos abierto para el estado personalizado.
Subtítulo: "Elige un ícono simple y fácil de reconocer".


ALT: Icono seleccionado aplicado al estado.
Subtítulo: "Confirme que el icono está asignado".

Elige los colores de las insignias#

Uso Color (texto/icono) y Color de fondo del texto (fondo de la credencial) para garantizar el contraste y el escaneo rápido.


ALT: Selectores de color abiertos para texto/icono y fondo de insignia.
Subtítulo: "Establecer el color del texto/icono y el fondo de la insignia".

Consejos de contraste#

  • Texto oscuro en un luz fondo o texto claro en un oscuro fondo.
  • Evite los pares de bajo contraste (por ejemplo, gris medio sobre gris claro).
  • Mantén una paleta coherente en todos tus estados.


ALT: Comparación de insignias de estado de alto contraste frente a bajo contraste.
Subtítulo: "Prefiera combinaciones de alto contraste para facilitar la lectura".

Vista de estado: Nombre vs Icono#

Controle cómo se representa el estado en la tabla de pedidos.

  • Nombre: muestra la etiqueta de texto (más clara para todos los usuarios).
  • Icono: Reemplaza el texto con el icono (funciona si su equipo reconoce los símbolos).


ALT: Se abre el menú desplegable Vista de estado con las opciones Nombre e Icono.
Subtítulo: "Elige si quieres mostrar el nombre o solo el icono".

Vista previa en pedidos#

Guarde el estado y abra Pedidos → WooCommerce para validar la legibilidad de un vistazo.

  • Verifique el insignia En Estado columna.
  • Si usa Icono ver, asegúrese de que el icono se explica por sí mismo.


ALT: Vista de pedidos que muestra las insignias representadas como Nombre y como Icono.
Subtítulo: "Verifique la legibilidad y la coherencia en la lista de pedidos".

Prácticas recomendadas#

  • Reutilización 2-4 colores principales a las fases de grupos (por ejemplo, azules = en curso, verdes = completado, rojos = bloqueado).
  • Reserva rojo/amarillo para alertas o estados que requieren atención.
  • No confíe solo en el color: el Mensaje de texto o icono debe ser claro.

Solución de problemas#

  • La insignia se ve pálida / difícil de leer: aumentar contraste (texto vs fondo).
  • El icono es confuso: cambiar a un símbolo más simple o usar Vista de estado = Nombre .
  • Sin cambios en los pedidos: Guarde el status y actualizar ; Borra la caché si utilizas un plugin de almacenamiento en caché.

Updated on 20 de abril de 2026 · Need help? Open a support ticket