Instrucciones del rediseño

1. Contenido del paquete

La carpeta contiene ocho páginas rediseñadas, una plantilla mixta, una hoja de estilos compartida, JavaScript compartido, un índice de búsqueda y favicons. No necesita instalar ninguna biblioteca ni usar un sistema de compilación.

2. Instalación

Haga una copia de seguridad del sitio actual.
Suba todas las páginas HTML y la carpeta assets, conservando exactamente su estructura.
Renombre o coloque las páginas en las rutas definitivas de su servidor. Los archivos de este paquete usan enlaces relativos para la navegación nueva.
Conserve en el servidor las imágenes antiguas, especialmente abc.jpg y tse.jpg. Si no están disponibles, el diseño muestra automáticamente un monograma alternativo.
Pruebe primero en una carpeta temporal antes de reemplazar la versión pública.

3. Archivos compartidos

assets/css/styles.css controla colores, tipografía, diseño adaptable, modo oscuro, poesía, prosa, impresión y navegación móvil. assets/js/site.js controla el menú, el tamaño del texto, el modo oscuro, el progreso, el buscador y el botón para volver arriba. assets/js/search-data.js contiene el índice de búsqueda.

Una modificación en estos archivos se refleja en todas las páginas.

4. Colores de las colecciones

Las páginas del conjunto español usan class="theme-es", con una gama cálida de vino, oro y papel. Las páginas de otros idiomas usan class="theme-world", con una gama azul y verde. Para cambiar una página de colección, modifique esa clase en la etiqueta <body>.

5. Añadir prosa

Copie este bloque dentro de <article class="content-shell">:

<div class="prose-reading literary-work">
  <p><span class="small-caps">Primeras palabras.</span> Primer párrafo…</p>
  <p>Segundo párrafo…</p>
</div>

La anchura, interlineado, sangría y capitular se aplican automáticamente.

6. Añadir poesía

Use un <br> por cada verso y dos para separar estrofas:

<div class="poetry-reading literary-work">
  <p class="poem-heading">Título del poema</p>
  <p class="poem-body">Primer verso<br>
  segundo verso<br><br>
  Nueva estrofa</p>
</div>

7. Combinar poesía y prosa

Duplique template_mixto.html, cambie el título, la descripción y el contenido. Puede repetir las secciones template-section en cualquier orden. La misma página puede alternar introducciones en prosa, poemas, notas y bibliografía.

8. Actualizar el buscador

El buscador funciona con search-data.js. Para añadir manualmente una página, agregue un objeto con title, url, category y excerpt. El archivo incluido ya contiene los títulos y enlaces extraídos de los ocho documentos.

9. Accesibilidad y lectura

El menú puede abrirse con teclado y cerrarse con Escape.
La tecla / abre el buscador.
El modo oscuro y el tamaño del texto se guardan en el navegador.
El indicador superior muestra el progreso de lectura.
La página respeta la preferencia de movimiento reducido y tiene estilos de impresión.

10. Recomendación de publicación

Publique el sitio mediante HTTPS y compruebe los enlaces absolutos antiguos. Muchos enlaces del contenido apuntan todavía a literatura.us; se conservaron deliberadamente para no alterar la organización histórica del archivo.