Fuente

El módulo Fuente es tu centro de gestión de recursos para organizar y crear todo el contenido de tu sitio web y CRM. Aquí puedes crear y gestionar páginas con editor visual, diagramas colaborativos, enlaces, archivos multimedia y organizarlos en carpetas para mantener tu proyecto ordenado.

1. ¿Qué es el módulo de Fuente? 📚

El módulo Fuente centraliza todos los recursos de contenido de tu cuenta en un solo lugar. A diferencia de otros módulos que se enfocan en funciones específicas, aquí puedes crear, editar y organizar diferentes tipos de contenido que luego usarás en tu sitio web o compartirás con tu equipo.

• Para dueños de negocio y marketing: organiza documentos, imágenes, páginas informativas y enlaces importantes en carpetas temáticas. Crea páginas de contenido sin depender de desarrolladores.
• Para desarrolladores: gestiona recursos técnicos, diagramas de arquitectura, documentación de proyectos y archivos de código. Usa el editor de páginas para crear documentación técnica o el editor de diagramas para diseñar flujos.

El módulo está dividido en tres secciones principales:

• Resumen: editor de contenido para describir tu proyecto o cuenta.
• Sitio Web: gestión completa de recursos para tu sitio (páginas, diagramas, enlaces, archivos, carpetas).
• CRM: próximamente, recursos específicos para gestión comercial.

2. Acceso rápido y estructura del módulo

1. Entra a MGPanel y ve al menú lateral → Fuente.
2. Verás tres pestañas en la navegación lateral:
   1. Resumen: editor de contenido para describir tu proyecto.
   2. Sitio Web: gestión de recursos (páginas, diagramas, enlaces, archivos, carpetas).
   3. CRM: próximamente.

Cada pestaña tiene su propia funcionalidad y contenido independiente, así que puedes trabajar en diferentes áreas sin mezclar recursos.

3. Sección Resumen

La pestaña Resumen te permite escribir una descripción general de tu proyecto o cuenta usando un editor visual moderno. Este contenido es útil para documentar objetivos, contexto o información importante que quieras tener visible.

3.1 Editar el resumen

1. Haz clic en la pestaña Resumen.
2. El editor visual se mostrará automáticamente.
3. Escribe tu contenido usando las herramientas disponibles:
   1. Títulos y subtítulos
   2. Párrafos de texto
   3. Listas ordenadas y no ordenadas
   4. Texto resaltado y código en línea
   5. Enlaces
4. Haz clic en Guardar cuando termines.

El contenido se guarda automáticamente y estará disponible cada vez que accedas a esta sección.

4. Sección Sitio Web: Gestión de recursos

La pestaña Sitio Web es donde gestionas todos los recursos de contenido para tu sitio. Aquí puedes crear diferentes tipos de recursos y organizarlos en carpetas.

4.1 Tipos de recursos disponibles

MGPanel te permite crear cinco tipos de recursos:

• Página: contenido web editable. Ideal para crear páginas informativas, documentación o contenido estructurado.
• Diagrama: diagramas colaborativos creados con Excalidraw. Perfecto para flujos, arquitecturas, wireframes y esquemas.
• Enlace: URLs externas organizadas. Útil para guardar referencias, recursos online o enlaces importantes.
• Archivo: documentos y multimedia. Puedes subir imágenes, PDFs, videos, documentos de Office, fuentes y más.
• Carpeta: organización jerárquica. Crea carpetas para agrupar recursos relacionados y mantener todo ordenado.

5. Crear y gestionar recursos paso a paso

5.1 Crear un nuevo recurso

1. Haz clic en la pestaña Sitio Web.
2. Presiona el botón "Nuevo recurso" en la parte superior.
3. Se abrirá un panel lateral con un formulario.
4. Completa los campos:
   1. Título: nombre descriptivo para identificar el recurso (obligatorio).
   2. Tipo de recurso: selecciona entre Página, Diagrama, Enlace, Archivo o Carpeta (obligatorio).
   3. URL: solo necesario si seleccionas "Enlace" (debe ser una URL válida).
   4. Archivos: solo necesario si seleccionas "Archivo" (puedes subir múltiples archivos a la vez).
5. Haz clic en Guardar.

El recurso se creará inmediatamente y aparecerá en la lista. Si es una página o diagrama, se abrirá automáticamente en una nueva pestaña para que empieces a editarlo.

5.2 Editar un recurso existente

1. Haz clic en el recurso que quieres modificar.
2. Se abrirá un menú contextual con opciones:
   1. Ver página/diagrama/archivo: abre el recurso en una nueva pestaña.
   2. Editar: modifica el título, tipo o URL del recurso.
   3. Eliminar: borra el recurso permanentemente.

Para páginas y diagramas, al hacer clic directamente se abre el editor. Para otros tipos, usa el menú contextual (tres puntos) para acceder a las opciones.

5.3 Eliminar un recurso

1. Haz clic en los tres puntos del recurso.
2. Selecciona "Eliminar" en el menú contextual.
3. Confirma la eliminación.

Importante: Esta acción no se puede deshacer. Si eliminas un archivo, también se eliminará del almacenamiento.

6. Organización en carpetas

Las carpetas te permiten organizar tus recursos de forma jerárquica, similar a cómo organizas archivos en tu computadora.

6.1 Crear una carpeta

1. Haz clic en "Nuevo recurso".
2. Selecciona "Carpeta" como tipo de recurso.
3. Asigna un nombre descriptivo.
4. Guarda la carpeta.

Nota: Solo puedes crear carpetas en el nivel raíz (directorio principal). No se permiten carpetas dentro de otras carpetas para mantener la estructura simple.

6.2 Navegar por carpetas

1. Haz clic en una carpeta para entrar a ella.
2. Verás todos los recursos que contiene.
3. Usa el botón "Volver" para regresar al nivel anterior.
4. El título superior muestra tu ubicación actual (ej: "Recursos / Mi Carpeta").

Puedes crear recursos directamente dentro de una carpeta usando el botón "Nuevo recurso" mientras estás dentro de ella.

6.3 Organizar recursos en carpetas

• Al crear: cuando creas un nuevo recurso dentro de una carpeta, automáticamente se guarda en esa ubicación.
• Al editar: no puedes mover recursos entre carpetas editándolos. Si necesitas reorganizar, elimina y vuelve a crear el recurso en la ubicación correcta.

7. Trabajar con páginas

Las páginas son recursos de contenido web que puedes editar con un editor visual potente.

7.1 Crear una nueva página

1. Crea un recurso de tipo "Página" siguiendo los pasos de la sección 5.1.
2. Asigna un nombre descriptivo (ej: "Lineamientos", "Política de Privacidad").
3. Haz clic en Guardar.
4. La página se abrirá automáticamente en una nueva pestaña con el editor.

7.2 Editor de páginas

El editor visual incluye las siguientes herramientas:

• Títulos: crea encabezados de diferentes niveles (H1, H2, H3).
• Párrafos: escribe texto con formato básico (negrita, cursiva).
• Listas: crea listas ordenadas o con viñetas.
• Resaltado (Marker): selecciona texto y aplica resaltado amarillo.
• Código en línea: marca texto como código técnico.
• Enlaces: agrega enlaces a otros sitios o recursos internos.
• Bloques de código: inserta fragmentos de código extensos (incluye soporte para etiquetas HTML como <link> y <script>).

7.3 Guardar una página

1. Edita el contenido usando las herramientas del editor.
2. Haz clic en el botón "Guardar" en la barra superior.
3. Verás una confirmación cuando se guarde correctamente.

8. Trabajar con diagramas

Los diagramas son recursos visuales creados con Excalidraw, una herramienta profesional de diagramación colaborativa.

8.1 Crear un nuevo diagrama

1. Crea un recurso de tipo "Diagrama" siguiendo los pasos de la sección 5.1.
2. Asigna un nombre descriptivo (ej: "Flujo de Usuario", "Arquitectura del Sistema").
3. Haz clic en Guardar.
4. El diagrama se abrirá automáticamente en una nueva pestaña con Excalidraw.

8.2 Editor de diagramas

Excalidraw ofrece herramientas profesionales:

• Herramientas de dibujo: lápiz para dibujo a mano alzada, formas geométricas, texto, conectores.
• Colaboración: trabaja en equipo en tiempo real (cuando esté habilitado).
• Exportación: guarda tu diagrama en múltiples formatos (PNG, SVG, PDF).
• Temas: cambia entre tema claro y oscuro.
• Biblioteca: usa elementos predefinidos reutilizables.

8.3 Guardar un diagrama

1. Crea o modifica tu diagrama usando las herramientas de Excalidraw.
2. Haz clic en el botón "Guardar" en la barra superior de MGPanel.
3. El contenido del diagrama se guardará automáticamente.

Los cambios se sincronizan con MGPanel, así que puedes cerrar la pestaña y volver más tarde para continuar editando.

8.4 Tipos de diagramas que puedes crear

• Diagramas de flujo de procesos
• Mapas mentales
• Esquemas de arquitectura de sistemas
• Wireframes y prototipos de interfaces
• Diagramas de procesos de negocio
• Organigramas

9. Trabajar con archivos

Los archivos te permiten almacenar documentos, imágenes, videos y otros recursos multimedia en MGPanel.

9.1 Subir archivos

1. Crea un recurso de tipo "Archivo".
2. Haz clic en "Agregar archivos".
3. Selecciona uno o varios archivos desde tu computadora.
4. Los archivos se subirán automáticamente y se crearán recursos individuales por cada archivo.

Formatos soportados:

• Imágenes: JPG, JPEG, PNG, WEBP, SVG, GIF, BMP
• Documentos: PDF, DOCX, PPTX
• Videos: MP4, MOV
• Audio: MP3
• Fuentes: TTF, WOFF, WOFF2, EOT, OTF

Límites:

• Tamaño máximo por archivo: 20 MB
• Puedes subir múltiples archivos a la vez

9.2 Ver y gestionar archivos

• Ver archivo: haz clic en el archivo o usa el menú contextual → "Ver Archivo" para abrirlo en una nueva pestaña.
• Editar: cambia el nombre del archivo desde el menú contextual → "Editar".
• Eliminar: borra el archivo y su contenido del almacenamiento permanentemente.

9.3 Organizar archivos

Puedes organizar archivos en carpetas para mantenerlos ordenados. Por ejemplo, crea una carpeta "Imágenes" para todas tus imágenes o "Documentos" para PDFs y archivos de Office.

10. Trabajar con enlaces

Los enlaces te permiten guardar URLs externas organizadas para referencia rápida.

10.1 Crear un enlace

1. Crea un recurso de tipo "Enlace".
2. Completa el campo URL con la dirección web completa (debe comenzar con http:// o https://).
3. Asigna un título descriptivo que te ayude a identificar el enlace.
4. Guarda el recurso.

10.2 Abrir un enlace

Haz clic directamente en el recurso de tipo enlace o usa el menú contextual → "Ver" para abrirlo en una nueva pestaña.

11. Mejores prácticas según tu perfil

11.1 Para dueños de negocio y marketing

• Crea carpetas temáticas (ej: "Marketing", "Recursos Cliente", "Documentos Legales").
• Usa páginas para crear contenido informativo que luego puedas compartir con tu equipo.
• Organiza imágenes y documentos en carpetas específicas para encontrarlos rápidamente.
• Guarda enlaces importantes a recursos externos que uses frecuentemente.
• Usa el resumen para documentar objetivos y contexto del proyecto.

11.2 Para desarrolladores

• Crea diagramas de arquitectura y flujos técnicos para documentar sistemas.
• Usa páginas para crear documentación técnica con bloques de código.
• Organiza recursos técnicos en carpetas (ej: "APIs", "Diagramas", "Documentación").
• Guarda enlaces a documentación externa, repositorios o herramientas.
• Usa el resumen para describir el stack tecnológico y decisiones de diseño.

12. Solución de problemas comunes

13. Recursos adicionales y soporte

• emyi puede ayudarte a decidir cómo organizar tus recursos, crear páginas efectivas o resolver problemas con el editor.
• Equipo de soporte: si un recurso no funciona correctamente, abre un ticket desde emyi o escribe a soporte@mgpanel.co con el nombre del recurso y una descripción del problema.