¶ Importante leer
¶ ¡Hola Sergio!
El menú lateral es una propuesta, pero no sé todavía qué tienes en mente.
¶ Gestión de visibilidad de secciones
Se pueden crear grupos de usuarios (por ejemplo, un grupo por cada funcionalidad) y vincular a los usuarios a uno o varios grupos, después, a cada sección se le puede habilitar la visibilidad para unos grupos y para otros no. Esto permite hacer un manual completo para los usuarios high-ticket e ir capando información conforme bajemos de plan.
¶ API integrada
La Wiki trae una API integrada, he hecho algunas pruebas y se podrían crear usuarios y asignarlos a grupos de forma automática por ejemplo para, una vez han pagado, se les envíe un correo con el acceso a la Wiki.
¶ Diseño
Con respecto al diseño de la Wiki, se puede cambiar lo básico desde la configuración (color principal, logo, título, etc)
¶ Tres formas de editar
Se pueden editar las páginas de tres formas distintas: Con el editor visual, usando Markdown o con el editor de HTML online.
¶ Ejemplos de uso
De aquí en adelante el texto está generado por ChatGPT para que veas algunos ejemplos de cosas que se pueden mostrar, el texto no es importante, no es necesario leerlo.
Muestra ejemplos de los elementos más habituales que puedes usar en Wiki.js. Pega como un bloque HTML o usa las secciones como referencia para convertirlas a Markdown.
Contenido
- Textos y formato
- Listas
- Tablas
- Código y resaltado
- Multimedia (imágenes, audio, video)
- Embeds / iframe / YouTube
- Mermaid (diagramas)
- Matemáticas (LaTeX)
- Admoniciones / callouts
- Galería / attachments
- Otros: anchors, footnotes, tasks
¶ Textos y formato
¶ Encabezados
¶ Encabezado H1
¶ Encabezado H2
¶ Encabezado H3
¶ Encabezado H4
¶ Encabezado H5
¶ Encabezado H6
¶ Énfasis
Normal, negrita, cursiva, subrayado, tachado, texto en monoespacio.
¶ Enlaces y anclas
Enlace externo: Wiki.js docs
Enlace interno / ancla: Ir a la sección Mermaid
¶ Listas
¶ Lista desordenada
- Elemento A
- Elemento B
- Subelemento B.1
- Subelemento B.2
- Elemento C
¶ Lista ordenada
- Paso 1
- Paso 2
- Subpaso 2.1
- Paso 3
¶ Lista de tareas (task list)
- Tarea completada (Wiki.js renderiza esto si está en Markdown)
- Tarea pendiente
¶ Tablas
Tabla simple:
| Campo | Descripción | Estado |
|---|---|---|
| Nombre | Nombre del artículo | Activo |
| Autor | Equipo | Revisión |
¶ Tabla con código y enlaces
| Ejemplo | Uso |
|---|---|
npm install |
Comando de instalación |
| Ir a ejemplos de código | Referencia |
¶ Código
¶ Bloque de código (sin resaltar)
#!/bin/bash
echo "Hola mundo"
¶ Bloque de código con lenguaje (ej. JavaScript)
// Ejemplo JS
function saludo(name) {
return `Hola, ${name}!`;
}
console.log(saludo('Wiki.js'));
¶ Inline code
Usa git clone para clonar el repositorio.
¶ Gist o snippet embebido
Wiki.js permite embeber Gists; aquí mostramos la sintaxis que usarías (en Markdown):
Aquí tengo un snippet embebido
¶ Multimedia
¶ Imagen simple
(Reemplaza src por la URL o por tu archivo adjunto en Wiki.js)
Figura 1 — Ejemplo de imagen con caption.
¶ Audio
Tu navegador no soporta audio embebido.
¶ Video
Tu navegador no soporta vídeo embebido.
¶ Embeds / iframe / YouTube
Embeber YouTube (ejemplo):
¶ Embed de OpenStreetMaps (ejemplo)
¶ Mermaid (diagramas)
Wiki.js soporta Mermaid, estos gráficos se generan mediante texto. Ejemplos:
Nota: Para que se renderice como diagrama, pega el bloque de Mermaid en un bloque de Markdown/Diagram en Wiki.js (o usa la extensión Mermaid).
¶ Admoniciones / callouts
Markdown típico en Wiki.js (ejemplos):
Esto es una cita.
Esto es información.
Esto es confirmación.
Esto es aviso.
Esto es error.
¶ Galería y adjuntos
Galería (ejemplo de imágenes en miniatura):
¶ Adjuntos / enlaces de descarga
¶ Otros elementos útiles
¶ Anclas permanentes
Puedes crear IDs (como este) y enlazarlos: <h2 id="mi-ancla">Título</h2>.
¶ Footnotes (notas al pie)
Ejemplo en Markdown: Texto con nota[^1]
Y al final:
[^1]: Esto es la nota al pie.
¶ Permisos y contenido privado
Wiki.js permite controlar acceso por roles a las páginas; el contenido aquí mostrado puede protegerse con permisos desde la administración.
¶ Metadatos / frontmatter
Si usas páginas Markdown, puedes incluir YAML frontmatter al inicio:
---
title: "Mi página"
tags: [manual, faq]
published: true
---
¶ Snippet: tecla rápida
Atajo sugerido: Ctrl + S
¶ Conclusión
Esta página incluye ejemplos de los elementos más frecuentes que puedes usar en Wiki.js. Dependiendo de la configuración de tu instalación (módulos activados, tema, extensiones) algunos bloques se renderizarán automáticamente (Mermaid, Math, admonitions, galerías, etc.).
Si quieres, convierto cualquiera de estas secciones a Markdown listo para pegar en el editor de Wiki.js o te genero un bloque HTML más pequeño adaptado a tu tema.
¶ 🎉 ¡A darle duro! 🎉
