Ejemplos de vistas de WordPress

Los siguientes “layouts” o plantillas reúnen las vistas más utilizadas en los portales de contenido de las diferentes operaciones, implementados en WordPress. Estas plantillas aplican a portales institucionales que requieran comunicar información, habilitar consultas ciudadanas y acompañar la gestión de trámites digitales.

Su propósito es estandarizar experiencias, reutilizar componentes y acelerar nuevas implementaciones sin perder consistencia visual ni funcional.

Plantillas más utilizadas

Requisitos de trámites
Carta de servicio por trámite
¿Qué es Servicios Digitales [operación]?

Componentes transversales

Todas las plantillas pueden componerse con los siguientes elementos del sistema de diseño:

Header institucional
Footer institucional
Contenedores responsivos
Sistema de grillas
Botones
Inputs
Cards
Tabs
Accordion
Tablas
Alertas
Enlaces destacados
Iconografía institucional

1. Requisitos de trámites

Objetivo

Permitir al usuario consultar de forma clara los diferentes trámites, y sus clasificaciones, que puede encontrar y realizar en una Secretaría de Tránsito respectiva.

Anatomía

Header
Título y descripción de la página
Buscador de trámites
Contenedor principal de contenido, dividido en dos columnas
Accesos directos
Footer

Contenido editable

Categorización
Trámites
Accesos directos

2. Carta de servicio por trámite

Objetivo

Presentar de manera clara las condiciones del servicio asociadas a un trámite específico.

Anatomía

Header
Buscador de trámites
Nombre del trámite
Información del trámite
Enlaces de interés
Botones
Footer

Contenido editable

Nombre e información del trámite
Enlaces de interés
Botones

3. ¿Qué es Servicios Digitales [operación]?

Objetivo

Explicar qué es el portal, comunicar beneficios y presentar el valor del canal digital para la ciudadanía.

Anatomía

Header
Título y descripción de la página
Imagen destacada
Reto + La solución + El resultado
Banner informativo
Beneficios
Footer

Contenido editable

Nombre de la operación
Textos principales
Imágenes
Banner informativo

Nota

Buenas prácticas

Usar mensajes simples y directos.
Resaltar beneficios reales para el usuario.
Utilizar imágenes alineadas al contexto institucional.
Mantener jerarquía clara entre secciones.

Aplicaciones por operación

Medellín

Descarga aquí el favicon de Movilidad en Línea Medellín.

Cali

Descarga aquí el favicon de Movilidad en Línea Medellín.

Manizales

Descarga aquí el favicon de Movilidad en Línea Medellín.