Skip to content
Documentación

Manual Técnico appServiserAdmin

Documentación Técnica del Archivo index.html en la Carpeta

appServiserAdmin/web/ckeditor

Español

¿Para qué es?

El archivo index.html es una página de demostración y configuración inicial para la implementación de CKEditor 5 en la aplicación ServiserAdmin. Sirve como punto de entrada para la integración del editor de texto enriquecido.

Definición de la Carpeta

Ubicación: appServiserAdmin/web/ckeditor/index.html Contexto: Se encuentra en la carpeta ckeditor, actuando como archivo de inicialización y demostración del editor.

Propósito

  • Proporcionar una implementación base de CKEditor 5
  • Servir como plantilla de integración
  • Demostrar la configuración básica del editor
  • Establecer la estructura HTML necesaria

Estructura y Componentes

  1. Configuración del Documento
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>CKEditor 5 - Quick start ZIP</title>
  1. Estilos CSS
.main-container {
    width: 795px;
    margin-left: auto;
    margin-right: auto;
}
  1. Import Map Configuration
<script type="importmap">
    {
        "imports": {
            "ckeditor5": "./ckeditor5/ckeditor5.js",
            "ckeditor5/": "./ckeditor5/"
        }
    }
</script>
  1. Validación de Servidor
window.onload = function() {
    if (window.location.protocol === "file:") {
        alert("This sample requires an HTTP server. Please serve this file with a web server.");
    }
};

Technical Requirements

  1. Debe ejecutarse en un servidor web (no funciona con protocolo file://)
  2. Requiere acceso a los archivos de CKEditor 5
  3. Soporte para ES6 modules
  4. Navegador moderno con soporte para Import Maps

English

Technical Documentation - index.html File

English

What is it for?

The index.html file is a demonstration and initial configuration page for CKEditor 5 implementation in the ServiserAdmin application. It serves as an entry point for rich text editor integration.

Folder Definition

Location: appServiserAdmin/web/ckeditor/index.html Context: Located in the ckeditor folder, acting as an initialization and demonstration file for the editor.

Purpose

  • Provide a base implementation of CKEditor 5
  • Serve as an integration template
  • Demonstrate basic editor configuration
  • Establish necessary HTML structure

Structure and Components

  1. Document Configuration
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>CKEditor 5 - Quick start ZIP</title>
  1. CSS Styles
.main-container {
    width: 795px;
    margin-left: auto;
    margin-right: auto;
}
  1. Import Map Configuration
<script type="importmap">
    {
        "imports": {
            "ckeditor5": "./ckeditor5/ckeditor5.js",
            "ckeditor5/": "./ckeditor5/"
        }
    }
</script>
  1. Server Validation
window.onload = function() {
    if (window.location.protocol === "file:") {
        alert("This sample requires an HTTP server. Please serve this file with a web server.");
    }
};

Additional Notes

  • Includes commented-out alternative configuration example
  • Implements responsive design considerations
  • Contains server-side validation check
  • Links to external CKEditor resources
  • Provides modular script loading