zendesk-guide-community-template
eesel Team
Last edited 25 febrero 2026
{
"title": "Cómo crear y personalizar plantillas de la comunidad de Zendesk Guide",
"slug": "zendesk-guide-community-template",
"locale": "es",
"date": "2026-02-25",
"updated": "2026-02-25",
"template": "default",
"excerpt": "Una guía completa de las plantillas de la comunidad de Zendesk Guide, que abarca los archivos de plantilla, la personalización con Curlybars y las mejores prácticas para construir foros comunitarios atractivos.",
"categories": [
"Zendesk",
"Guides"
],
"tags": [
"Zendesk Guide",
"Community Templates",
"Help Center",
"Curlybars",
"Customer Support"
],
"readTime": 13,
"author": 16,
"reviewer": 14,
"seo": {
"title": "Cómo crear y personalizar plantillas de la comunidad de Zendesk Guide",
"description": "Una guía completa de las plantillas de la comunidad de Zendesk Guide, que abarca los archivos de plantilla, la personalización con Curlybars y las mejores prácticas para construir foros comunitarios atractivos.",
"image": "https://wmeojibgfvjvinftolho.supabase.co/storage/v1/object/public/public_assets/blog-gen/banner-7072008a-2d12-45a7-8ae1-636370d73201"
},
"coverImage": "https://wmeojibgfvjvinftolho.supabase.co/storage/v1/object/public/public_assets/blog-gen/banner-7072008a-2d12-45a7-8ae1-636370d73201",
"coverImageAlt": "Imagen del banner para Cómo crear y personalizar plantillas de la comunidad de Zendesk Guide",
"coverImageWidth": 1920,
"coverImageHeight": 1080,
"faqs": {
"heading": "Preguntas frecuentes",
"type": "blog",
"answerType": "html",
"faqs": [
{
"question": "¿Necesita habilidades de codificación para personalizar las plantillas de la comunidad de Zendesk Guide?",
"answer": "Las personalizaciones básicas como los colores y las fuentes se pueden hacer a través de la configuración del tema sin necesidad de codificación. Sin embargo, la modificación de los archivos de plantilla requiere conocimientos de HTML, CSS y sintaxis de Curlybars. Para cambios complejos, es posible que desee trabajar con un desarrollador o considerar un tema de terceros."
},
{
"question": "¿Cuál es la diferencia entre una plantilla de la comunidad de Zendesk Guide y una plantilla de artículo?",
"answer": "Una plantilla de la comunidad controla el diseño de las páginas del foro, como los listados de temas y los hilos de discusión. Una plantilla de artículo controla la estructura de los artículos de la base de conocimientos. Sirven para diferentes propósitos y utilizan diferentes archivos dentro de su tema."
},
{
"question": "¿Puede utilizar las plantillas de la comunidad de Zendesk Guide en cualquier plan de precios?",
"answer": "Las funciones de la comunidad requieren un plan Suite Team o superior, a partir de $55 por agente al mes facturado anualmente. El plan Support Team ($19/agente) no incluye la funcionalidad de la comunidad. Las capacidades de personalización del tema también varían según el nivel del plan."
},
{
"question": "¿Cómo previsualizar los cambios en las plantillas de la comunidad antes de publicar?",
"answer": "En el editor de temas de Guide, haga clic en el botón Vista previa para ver los cambios con datos reales. Esto muestra exactamente cómo se verá su comunidad para los usuarios. Una vez que esté satisfecho, haga clic en Publicar para que los cambios se hagan efectivos."
},
{
"question": "¿Qué es Curlybars y por qué se utiliza en las plantillas de la comunidad de Zendesk Guide?",
"answer": "Curlybars es el lenguaje de plantillas de Zendesk, basado en Handlebars.js. Utiliza dobles llaves para insertar contenido dinámico en las plantillas. Se utiliza para mostrar los títulos de las entradas, los nombres de los autores, los comentarios y otros datos de la comunidad que cambian en función de lo que el usuario está viendo."
},
{
"question": "¿Merecen la pena los temas de Zendesk de terceros para la personalización de la comunidad?",
"answer": "Los temas de terceros pueden valer la pena si necesita resultados profesionales rápidamente y carece de recursos de desarrollo. Proveedores como Lotus Themes y Zenplates ofrecen temas probados y ricos en funciones a partir de unos $299-$489. Tenga en cuenta su cronograma, presupuesto y necesidades de personalización al decidir."
}
],
"supportLink": null
}
}
---
Un foro comunitario bien diseñado puede transformar la forma en que los clientes interactúan con su marca. En lugar de esperar tickets de soporte, se ayudan mutuamente, comparten soluciones y construyen relaciones. Pero para que esto suceda, necesita la base correcta. Ahí es donde entran las plantillas de la comunidad de [Zendesk Guide](https://www.zendesk.com/guide/).
Esta guía le explica todo lo que necesita saber sobre la creación y personalización de plantillas de la comunidad en Zendesk Guide. Tanto si está empezando desde cero como si está perfeccionando una configuración existente, aprenderá las habilidades técnicas y las mejores prácticas para construir una comunidad que realmente atraiga a sus usuarios.
## ¿Qué es una plantilla de la comunidad de Zendesk Guide?
Una plantilla de la comunidad de Zendesk Guide es un archivo de diseño que controla el aspecto y el funcionamiento de las páginas de su foro comunitario. Piense en ello como el plano de la interfaz de usuario de su comunidad. Estas plantillas determinan dónde aparecen los elementos, cómo se formatean las publicaciones y a qué funciones pueden acceder los usuarios.
Es importante distinguir entre dos conceptos relacionados que a menudo se confunden:
- Las **plantillas de artículos** son plantillas de contenido para los artículos de la base de conocimientos. Proporcionan una estructura coherente para el contenido de su centro de ayuda, como encabezados o formatos estandarizados.
- Las **plantillas de tema** (incluidas las plantillas de la comunidad) son archivos de diseño HTML que controlan la presentación visual de las páginas. Utilizan el lenguaje de plantillas Curlybars de Zendesk para mostrar contenido dinámicamente.
La funcionalidad de la comunidad de Zendesk se llama **Gather**. Se incluye en los planes Suite Team y superiores, a partir de [$55 por agente al mes](https://www.zendesk.com/pricing/) cuando se factura anualmente. El [plan Suite Professional](https://www.zendesk.com/pricing/) a $115 por agente añade moderadores de la comunidad, colas de moderación de contenido y protección contra el spam con IA. Gather permite debates de usuarios, foros de preguntas y respuestas e intercambios de ideas directamente dentro de su centro de ayuda.
¿Por qué son importantes las plantillas de la comunidad? Porque los diseños predeterminados solo le llevan hasta cierto punto. Las plantillas personalizadas le permiten:
- Destacar el contenido importante de la comunidad
- Crear jerarquías visuales que guíen a los usuarios
- Añadir elementos de marca que coincidan con la identidad de su empresa
- Implementar funciones que fomenten la participación
Mientras construye su comunidad, considere cómo las herramientas de IA pueden complementar sus esfuerzos. Hemos descubierto que la combinación de foros comunitarios con la automatización inteligente ayuda a los equipos a gestionar las preguntas repetitivas, al tiempo que permite a los humanos centrarse en los debates complejos que necesitan un toque personal. Herramientas como [eesel AI](https://www.eesel.ai/) pueden supervisar los debates, sugerir respuestas a las preguntas más comunes y escalar los problemas que necesitan atención humana.
## Archivos de plantilla de la comunidad que necesita conocer
Zendesk Guide utiliza un conjunto de archivos de plantilla basados en Handlebars para renderizar las páginas de la comunidad. Cada archivo controla un tipo de página o vista específica. Estas son las plantillas clave con las que trabajará:
| Archivo de plantilla | Propósito |
|--------------|---------|
| `community_post_list_page.hbs` | Lista todas las publicaciones de la comunidad en todos los temas |
| `community_post_page.hbs` | Muestra publicaciones individuales con comentarios |
| `community_topic_list_page.hbs` | Muestra los temas/categorías disponibles |
| `community_topic_page.hbs` | Muestra las publicaciones dentro de un tema específico |
| `new_community_post_page.hbs` | El formulario para crear nuevas publicaciones |
| `contributions_page.hbs` | Muestra la actividad y las contribuciones del usuario |
| `user_profile_page.hbs` | Páginas de perfil de los miembros de la comunidad |
Estas plantillas trabajan juntas para crear una experiencia comunitaria cohesiva. Cuando un usuario navega desde la lista de temas a una publicación específica, se mueve de `community_topic_page.hbs` a `community_post_page.hbs`, y cada plantilla gestiona su parte de la visualización. Puede obtener más información en [la documentación de la plantilla de la comunidad de Zendesk](https://support.zendesk.com/hc/en-us/articles/4408839332250).
Para acceder y editar estas plantillas, necesita permisos de administrador de Guide. Vaya a la administración de Guide y, a continuación, haga clic en el icono Personalizar diseño. Desde allí, puede editar directamente los archivos de plantilla de su tema. Para obtener documentación detallada, consulte [la guía de Zendesk para personalizar los temas del centro de ayuda](https://support.zendesk.com/hc/en-us/articles/4408839332250).
El editor de temas muestra todas las plantillas disponibles en una barra lateral. Haga clic en cualquier nombre de plantilla para abrirla en el editor de código. Verá el marcado Curlybars que controla la estructura de la página. Los cambios que realice aquí afectarán a la forma en que la comunidad aparece a los usuarios finales.
## Introducción a las plantillas Curlybars
Curlybars es el lenguaje de plantillas de Zendesk, construido sobre [Handlebars.js](https://handlebarsjs.com/). Utiliza dobles llaves para insertar contenido dinámico en sus plantillas. Si ha trabajado con otros sistemas de plantillas, la sintaxis le resultará familiar. Para obtener documentación completa, consulte [la referencia de Curlybars de Zendesk](https://support.zendesk.com/hc/en-us/articles/4408824571674).
Esta es la sintaxis básica que necesita conocer:
- **Variables:** `{{property}}` inserta un valor
- **Condicionales:** `{{#if condition}}...{{/if}}` muestra el contenido solo cuando una condición es verdadera
- **Bucles:** `{{#each items}}...{{/each}}` repite el contenido para cada elemento de una lista
- **Comentarios:** `{{! This is a comment }}` añade notas que no se renderizan
Las plantillas de la comunidad tienen acceso a propiedades específicas que contienen datos de publicaciones, temas y usuarios. Estas son las más utilizadas:
| Propiedad | Lo que contiene |
|----------|------------------|
| `post.title` | El titular de la publicación |
| `post.body` | El contenido de la publicación |
| `post.author.name` | Nombre de usuario de la persona que creó la publicación |
| `post.author.avatar_url` | URL a la imagen de perfil del autor |
| `topic.name` | El nombre del tema/categoría |
| `topic.description` | Texto de la descripción del tema |
| `user.name` | Nombre del usuario actual |
| `user.avatar_url` | Avatar del usuario actual |
Curlybars también proporciona ayudantes para tareas comunes:
- `{{excerpt post.body length=100}}` trunca el contenido a una longitud especificada
- `{{date post.created_at format='short'}}` formatea las fechas de forma coherente
- `{{link 'new_post' role='button'}}` genera URLs a páginas específicas
Aquí hay un ejemplo práctico. Este código muestra una lista de publicaciones recientes de la comunidad con extractos:
```handlebars
{{#each posts}}
<div class="post-preview">
<h3><a href="{{url}}">{{title}}</a></h3>
<p class="meta">Por {{author.name}} el {{date created_at}}</p>
<p>{{excerpt body length=150}}</p>
</div>
{{/each}}
El bucle {{#each posts}} itera a través de las publicaciones disponibles. Para cada una, muestra el título como un enlace, el nombre del autor, la fecha de creación y un extracto de 150 caracteres del contenido.
Comprender estos conceptos básicos le proporciona la base para personalizar cualquier plantilla de la comunidad. La clave es saber qué propiedades están disponibles para cada tipo de plantilla y cómo estructurar la lógica para mostrarlas de forma eficaz.
Personalización de la plantilla de la página de temas de su comunidad
La página de temas es a menudo la primera vista de la comunidad que ven sus usuarios. Muestra todas las publicaciones dentro de una categoría específica, lo que la convierte en un punto de contacto crítico para la participación. Vamos a ver cómo personalizar community_topic_page.hbs paso a paso.
Paso 1: Acceder al editor de temas
En la administración de Guide, haga clic en el icono Personalizar diseño y, a continuación, seleccione el tema que desea editar. Esto abre el editor de plantillas donde puede modificar todos los archivos de tema.
Paso 2: Localizar y abrir community_topic_page.hbs
Encuentre el archivo en la lista de plantillas en el lado izquierdo del editor. Haga clic en él para abrir la vista de código. Verá la estructura de plantilla predeterminada, que incluye secciones para el encabezado del tema, la lista de publicaciones y la paginación.
Paso 3: Comprender la estructura predeterminada
La plantilla predeterminada normalmente incluye:
- Una sección de encabezado con el nombre y la descripción del tema
- Un botón "Nueva publicación"
- Una lista de publicaciones con títulos, autores y metadatos
- Controles de paginación para navegar entre páginas
Tómese su tiempo para leer el código existente antes de realizar cambios. Comprender lo que ya está ahí le ayuda a modificar en lugar de romper la funcionalidad.
Paso 4: Añadir elementos personalizados
Ahora puede mejorar la página. Las adiciones comunes incluyen:
- Banners de temas: Añada un encabezado visual con la descripción del tema
- Publicaciones destacadas: Destaque los debates importantes o populares
- Indicaciones de suscripción: Anime a los usuarios a seguir el tema
Aquí hay un ejemplo de cómo añadir un encabezado de tema con estilo:
<div class="topic-header">
<h1>{{topic.name}}</h1>
{{#if topic.description}}
<p class="topic-description">{{topic.description}}</p>
{{/if}}
</div>
Paso 5: Estilo con variables CSS
Los temas de Zendesk admiten propiedades personalizadas de CSS (variables) para un estilo coherente. Defina sus colores, espaciado y tipografía en el CSS del tema, luego haga referencia a ellos en sus plantillas:
.topic-header {
background: var(--brand-color);
padding: var(--spacing-lg);
border-radius: var(--border-radius);
}
Paso 6: Previsualizar y publicar los cambios
Antes de publicar, utilice la función de vista previa para ver cómo se ven sus cambios con datos reales. El modo de vista previa muestra su comunidad con publicaciones y temas reales, para que pueda verificar que todo se renderiza correctamente. Una vez que esté satisfecho, haga clic en Publicar para que los cambios se hagan efectivos.
Otras personalizaciones a considerar:
- Insignias de reputación del usuario: Mostrar los principales contribuyentes o expertos verificados
- Diseños de publicaciones personalizados: Cambiar la forma en que se muestran los metadatos de las publicaciones
- Estilo específico del tema: Aplicar diferentes diseños a diferentes secciones de la comunidad
Construcción de una página de publicación de la comunidad personalizada
La página de publicación individual (community_post_page.hbs) es donde ocurre la conversación real. Esta plantilla necesita gestionar el contenido de la publicación, los comentarios, la votación y las interacciones del usuario. Veamos cómo personalizarla de forma eficaz.
La estructura de plantilla predeterminada incluye:
- Encabezado de la publicación con el título y la información del autor
- Contenido del cuerpo de la publicación
- Controles de votación (votar a favor/votar en contra)
- Hilo de comentarios
- Formulario de respuesta
Para personalizar la visualización de los comentarios, es posible que desee cambiar la forma en que aparece la información del autor o añadir una distinción visual entre los niveles de comentarios. Aquí hay un ejemplo de un comentario con estilo:
<div class="comment {{#if official}}comment-official{{/if}}">
<div class="comment-author">
<img src="{{author.avatar_url}}" alt="" class="avatar">
<span class="author-name">{{author.name}}</span>
{{#if author.badges}}
<span class="badges">
{{#each author.badges}}
<span class="badge">{{name}}</span>
{{/each}}
</span>
{{/if}}
</div>
<div class="comment-body">
{{body}}
</div>
<div class="comment-actions">
{{vote 'up' role='button'}}
{{vote 'down' role='button'}}
{{subscribe role='button'}}
</div>
</div>
Esto añade insignias de autor y organiza el comentario en secciones claras. La condicional {{#if official}} aplica un estilo especial a las respuestas oficiales de su equipo.
Para la funcionalidad de votación y calificación, Zendesk proporciona ayudantes integrados. El ayudante {{vote}} crea botones de voto a favor/voto en contra que gestionan automáticamente la interacción. Puede dar estilo a estos con CSS para que coincidan con su diseño.
Al implementar @menciones y el etiquetado de usuarios, tendrá que trabajar con JavaScript además de las plantillas. La capa de plantillas gestiona la visualización, pero la lógica de interacción reside en los archivos JavaScript de su tema.
La capacidad de respuesta móvil es crucial para las páginas de la comunidad. Muchos usuarios acceden a los foros desde sus teléfonos, por lo que sus plantillas deben utilizar diseños flexibles que se adapten al tamaño de la pantalla. Utilice CSS Grid o Flexbox para los listados de publicaciones, y asegúrese de que los objetivos táctiles (botones, enlaces) sean lo suficientemente grandes para la interacción móvil.
Aquí hay un ejemplo de diseño de publicación responsivo:
<article class="post">
<header class="post-header">
<h1>{{post.title}}</h1>
<div class="post-meta">
<img src="{{post.author.avatar_url}}" alt="" class="avatar">
<span>{{post.author.name}}</span>
<time datetime="{{post.created_at}}">{{date post.created_at}}</time>
</div>
</header>
<div class="post-content">
{{post.body}}
</div>
</article>
Con el CSS apropiado, esto se apila verticalmente en el móvil y se expande a un diseño más complejo en pantallas más grandes.
Mejores prácticas para el diseño de plantillas de la comunidad
La creación de plantillas de la comunidad eficaces requiere algo más que conocimientos técnicos. Necesita diseñar para la participación del usuario, la accesibilidad y el rendimiento. Estas son las prácticas que hemos encontrado más valiosas.
Principios de diseño móvil primero
Comience su diseño con diseños móviles, luego expanda para pantallas más grandes. Esto asegura que la experiencia central funcione en todas partes. Los usuarios de la comunidad a menudo revisan los debates en sus teléfonos, por lo que la optimización móvil no es opcional.
- Utilice unidades relativas (rem, em) en lugar de píxeles fijos
- Pruebe las interacciones táctiles en dispositivos reales
- Asegúrese de que el texto siga siendo legible en tamaños pequeños
- Mantenga la navegación accesible con los pulgares
Consideraciones de accesibilidad
Su comunidad debe funcionar para todos. Siga las directrices de la WCAG para asegurarse de que los usuarios con discapacidades puedan participar plenamente.
- Utilice elementos HTML semánticos (article, nav, button)
- Añada texto alternativo a todas las imágenes
- Asegúrese de que el contraste de color cumple con los estándares AA
- Soporte la navegación con el teclado
- Pruebe con lectores de pantalla
Optimización del rendimiento
Las páginas de carga lenta matan el compromiso. Optimice sus plantillas para la velocidad:
- Minimice CSS y JavaScript
- Utilice consultas Curlybars eficientes
- Cargue imágenes de forma diferida por debajo del pliegue
- Limite el número de publicaciones mostradas por página
Marca consistente
Su comunidad debe sentirse como parte de su producto, no como una ocurrencia tardía. Aplique los colores, la tipografía y la voz de su marca en todas las plantillas. Esto genera confianza y refuerza su identidad.
Funciones de participación del usuario
Diseñe plantillas que fomenten la participación:
- Haga que el botón "Nueva publicación" sea prominente
- Muestre publicaciones relacionadas para mantener a los usuarios navegando
- Destaque las preguntas sin respuesta
- Muestre la reputación del usuario para motivar las contribuciones
Integración de herramientas de moderación
La salud de la comunidad requiere moderación. Asegúrese de que sus plantillas admiten:
- Marcar contenido inapropiado
- Ocultar las publicaciones pendientes de revisión
- Mostrar insignias de moderador
- Mostrar las directrices de la comunidad
A medida que su comunidad crece, la gestión se vuelve más compleja. Hemos visto equipos que se benefician de la adición de asistencia impulsada por la IA para manejar las tareas rutinarias de moderación. eesel AI puede supervisar los debates, sugerir respuestas a las preguntas más comunes y escalar los problemas que necesitan atención humana. Esto permite a su equipo centrarse en la construcción de relaciones en lugar de perseguir el spam.
Opciones de temas de terceros para comunidades
La construcción de plantillas personalizadas desde cero no siempre es el mejor enfoque. A veces, la compra de un tema preconstruido tiene más sentido, especialmente si necesita resultados profesionales rápidamente.
Así es como se comparan los principales proveedores:
| Proveedor | Precio de inicio | Fortaleza clave |
|---|---|---|
| Lotus Themes | $299 | Trayectoria probada con más de 5.800 clientes |
| Zenplates | $489 | Amplia personalización sin codificación |
| Diziana | $299 | Opciones económicas |
Cuándo considerar los temas premium:
- Necesita resultados rápidamente sin tiempo de desarrollo
- Su equipo carece de experiencia en desarrollo front-end
- Quiere un diseño profesional sin contratar a un diseñador
- Necesita funciones que tardaría semanas en construir usted mismo
Ventajas de los temas comprados:
- Apariencia profesional inmediata
- Código probado y sin errores
- Actualizaciones y soporte regulares
- A menudo incluyen funciones específicas de la comunidad
Contras de los temas comprados:
- Menos flexibilidad que las construcciones personalizadas
- Puede requerir soluciones alternativas para necesidades únicas
- Costos continuos para actualizaciones o soporte
- Riesgo de parecerse a otros sitios que utilizan el mismo tema
Consideraciones de migración:
El cambio de temas requiere planificación. Documente sus personalizaciones actuales antes de la migración. Compruebe si su contenido existente se mostrará correctamente en el nuevo tema. La mayoría de los proveedores ofrecen asistencia para la migración o documentación para ayudar con la transición.
Empiece a construir su comunidad de Zendesk hoy mismo
Ahora tiene el conocimiento para crear y personalizar las plantillas de la comunidad de Zendesk Guide. Vamos a recapitular los pasos clave:
- Comprender la diferencia entre las plantillas de artículos y las plantillas de temas
- Familiarícese con los siete archivos de plantilla de la comunidad principales
- Aprenda la sintaxis de Curlybars para el contenido dinámico
- Personalice las páginas de temas y publicaciones para que coincidan con sus necesidades
- Aplique las mejores prácticas para móviles, accesibilidad y rendimiento
- Considere los temas de terceros si el desarrollo personalizado no es factible
Las mejores comunidades evolucionan con el tiempo. Comience con lo básico, recopile comentarios de sus usuarios e itere en su diseño. Preste atención a qué temas generan la mayor participación y ajuste sus plantillas para destacar ese contenido.
A medida que construye su comunidad, piense en cómo la automatización puede apoyar sus objetivos. eesel AI trabaja junto con los foros de la comunidad, respondiendo a las preguntas rutinarias y dirigiendo los problemas complejos a las personas adecuadas. Si está buscando escalar el soporte de su comunidad sin escalar su equipo, pruebe eesel AI gratis y vea cómo complementa su configuración de Zendesk.
Compartir esta entrada
Article by
