Saltar al contenido principal

Documentación del Schema GraphQL del Headless CMS Directus

Introducción​

Este documento describe las colecciones y tipos disponibles en nuestro Headless CMS basado en Directus con extensión GraphQL. El schema incluye todas las entidades necesarias para gestionar contenido de e-commerce, landing pages, filtros de productos, y más.

Estructura Principal​

Colecciones Principales​

🏠 Contenido de Página de Inicio​

home_page​

Configuración principal de la página de inicio:

  • Hero campaign (carrusel o banner)
  • Banners internos (superior, medio, inferior)
  • Quotes y testimonios
  • Recomendaciones de productos más vendidos

Carrusel principal de la página de inicio:

  • Configuración de autoplay, loop infinito
  • Slides personalizables con imágenes y contenido
  • Estilos CSS personalizados para desktop y mobile

home_hero_banner (deprecated)​

Banner hero alternativo para campañas específicas:

  • Imágenes para desktop y mobile
  • Configuración de colores y textos
  • Términos y condiciones personalizables

🏷️ Categorías y Navegación​

category​

Sistema completo de categorías de productos:

  • Configuración de búsqueda (Algolia/Typesense)
  • Filtros y grupos de filtros
  • Navegación y menús subcategorías
  • Metadata SEO y descripciones

Menús de navegación del sitio:

  • Estructura jerárquica con padres/hijos
  • Iconos, colores y estilos personalizados
  • Tipos de renderizado (dropdown, cards, etc.)
  • Tracking para SEO

🎯 Productos y Promociones​

products​

Gestión de productos y SKUs:

  • Relación con promociones
  • Ordenamiento personalizado
  • Estado de publicación

product_promotions​

Promociones específicas por producto:

  • Compra X, lleva Y
  • Textos y estilos personalizados para botones
  • SKUs de regalo

tag_promotions​

Etiquetas promocionales para productos:

  • Countdowns flash
  • Prioridades y posiciones
  • Colores personalizados

🖼️ Banners y Elementos Visuales​

Banners reutilizables:

  • Versiones desktop y mobile
  • Estado activo/inactivo

inner_banner​

Banners para posiciones internas:

  • Background colors personalizables
  • Links de redirección

top_campaign_banner​

Banner superior de campaña:

  • Countdowns configurables
  • Textos iniciales y finales personalizados
  • Colores de fondo y texto

🔍 Búsqueda y Filtros​

search_view​

Configuración de vistas de búsqueda:

  • Query por defecto
  • Filtros y grupos de filtros
  • Resultados por página

filter​

Filtros individuales:

  • Nombres de campos en Algolia/Typesense
  • Tipos de refinamiento
  • Nombres para mostrar

filter_group​

Grupos de filtros:

  • Agrupación lógica de filtros
  • Imágenes representativas
  • Ordenamiento

📄 Landing Pages​

landing_page​

Sistema completo de landing pages:

  • Slug y URLs canónicas
  • Contenido modular (bloques)
  • Metadata SEO

landing_page_content​

Sistema de bloques modulares para LPs:

  • Tipos de bloques disponibles:
    • banner
    • benefits_block
    • category_cards
    • channels_block
    • home_hero_carousel
    • home_hero_carousel_slice
    • inner_banner
    • recommender
    • vertical_spacer

🚚 Servicios Adicionales​

servicio_adicional​

Servicios adicionales de e-commerce:

  • Costos y tipos de costo
  • Días extra de procesamiento
  • Integración con Highjump
  • Descripciones en formato rich text

⚙️ Configuración Global​

category_view​

Configuración de vistas de categoría:

  • Hits por página por defecto

seo_homepage_description​

SEO específico para homepage:

  • Título y descripción meta

Funcionalidades Técnicas​

Sistema de Archivos​

  • Integración con directus_files para gestión de assets
  • Soporte para imágenes responsive (desktop/mobile)
  • Metadatos de imágenes y optimizaciones

Ejemplos de Consultas Comunes​

Obtener página de inicio con contenido completo​

query GetHomePage {
  home_page {
    home_hero_campaign {
      carousel_slices {
        item {
          ... on home_hero_carousel_slice {
            name
            background_image {
              filename_download
            }
            button_text
            link
          }
        }
      }
    }
    testing {
      item {
        ... on banner {
          title
          image_desktop {
            filename_download
          }
        }
        ... on products {
          sku
          product_promotions {
            title_block
          }
        }
      }
    }
  }
}

Obtener categoría con filtros​

query GetCategory($slug: String) {
  category(filter: {slug: {_eq: $slug}}) {
    category_name
    description
    filters {
      item {
        ... on filter {
          display_name
          refinement_type
        }
      }
    }
    filters_groups {
      item {
        ... on filter_group {
          display_name
          filters {
            item {
              ... on filter {
                display_name
              }
            }
          }
        }
      }
    }
  }
}

Consideraciones de Implementación​

Performance​

  • Utilizar paginación en consultas con muchos resultados
  • Usar filtros específicos para reducir datos transferidos

Caching​

  • Implementar caching a nivel de aplicación para consultas frecuentes

Integraciones Externas​

DatoCMS (deprecated)​

  • Campos datocms_id y datocms para sincronización
  • Migración de contenido desde DatoCMS

Magento (deprecated)​

  • Campos magento_url para integración
  • SKUs de productos sincronizados

Algolia/Typesense​

  • Configuración de campos para búsqueda
  • Queries personalizadas por categoría