From c80b1f10e599b39b438e2d0c3dcab3ce9b31bd4a Mon Sep 17 00:00:00 2001
From: luisgulo <luisgulo@gmail.com>
Date: Thu, 5 Jun 2025 00:45:08 +0200
Subject: [PATCH] Subimos README

---
 README.md | 154 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 154 insertions(+)
 create mode 100644 README.md

diff --git a/README.md b/README.md
new file mode 100644
index 0000000..59043bc
--- /dev/null
+++ b/README.md
@@ -0,0 +1,154 @@
+# Blog de Viajes Personales
+
+## Captura de ejemplo
+
+![captura](captura.png)
+
+
+## Lenguaje de Programación
+
+Un blog muy sencillo desarrollado con:
+
+* PHP
+* CSS
+* Javascript
+
+## Que necesitas para que funcione
+
+Solamente un servidor que soporte `PHP` (con el módulo/extensión `php-curl` instalado) 
+y subir el contenido del directorio `web` al raiz del servidor web.
+
+Puedes probarlo en local en tu equipo usando **Docker** ó *Podman*.
+
+### Docker/Podman
+
+Instala docker o podman en tu equipo, puedes leer como hacerlo en 
+mi blog [Docker en Debian](https://soloconlinux.org.es/instalar-docker-en-debian/)
+
+Luego solo tienes que crear la imagen en tu equipo local y usarla.
+
+Te dejo el script `crear-imagen.sh` para que sólo tengas que ejecutarlo para crear la imagen.
+
+Para **iniciar el contenedor** y ver la aplicacion ejecutándose usa el script `iniciar.sh`
+Para **detener el contenedor** simplemente usa el script `parar.sh`
+
+## Directorio Web del Blog de Viajes
+
+El directorio `web` es el raíz de la aplicación web.
+
+Dentro de este directorio `web` esta el *código PHP* de la aplicación, el *CSS* para dar formato 
+y el código *JavaScript* para poner las *chinchetas* en el mapa.
+
+
+La estructura básica es la siguiente
+
+```
+. 
+├── index.php
+├── detalle.php
+├── mapa.php
+├── favicon.ico
+├── css
+│   ├── detalle.css
+│   └── index.css
+├── js
+│   ├── leaflet.js
+│   └── mapa.js
+│
+└── destinos
+    ├── dir_destino_001
+    │   ├── curiosidades.txt
+    │   └── destino.json
+    ├── ....
+    └── dir_destino_NNN
+ 
+```
+
+### Como añadir nuevos "Destinos"
+
+
+#### Datos del Destino
+
+Simplemente debes de crear un nuevo directorio dentro de `destinos`
+
+Dentro de él deja todas las fotos que quieras (solo se verán las que tu escojas)
+Luego copia dentro de tu nuevo *destino* el fichero `destino.json` del directorio `plantillas`
+
+Deberás editar el fichero `destino.json` para incluir los datos que quieras 
+que se muestren tanto en la página principal, como en el detalle de cada destino.
+
+Formato del fichero `destino.json`:
+
+**Formato simple** (sin latitud/longitud)
+
+Usa este formato sólo si el nombre del destino es una ciudad, calle o algo que se pueda encuentrar 
+al realizar una búsqueda en los mapas on-line de OpenStreet.
+
+```
+{
+    "Destino": "Nombre del destino",
+    "Fecha_Visita": "2022-07-03",
+    "Foto_Principal": "foto-principal.jpg",
+    "Mapa": "mapa.png",
+    "Fotos": ["foto-001.png", "foto-002.jpg","foto-003.jpg"],
+    "Descripcion_Fotos": ["Descripcion Foto 1", "Descripcion Foto 2","Descripcion Foto 3"],
+    "Alojamiento": "Hotel ....",
+    "Comida": ["Plato tipico AAAAA", "Plato tipico BBBBB"],
+    "Zonas_Visitadas": ["Castillo de ...", "Pueblo de .....", "Museo de ....", "Barrio de ...."]
+}
+```
+
+Detalle de cada campo:
+
+* `Destino`: Se utiliza como texto en la foto de la pagina inicial 
+y para realizar la búsqueda en el mapa y poder poner la chincheta.
+* `Fecha_Visita`: Usala en formato Año-Mes-Día
+* `Foto_Principal`: La foto que se muestra en la página inicial y al inicio del detalle de ese destino.
+* `Mapa`: Si dispones de un mapa de la zona, del recorrido, etc. 
+* `Fotos`: Array de todas las fotos que quieres que se muestren en el carrusel de fotos.
+* `Descripcion_Fotos`: Array del texto de las fotos del carrusel. 
+Si no quieres texto en alguna de ellas simplemente escribe `""`. Las fotos y textos van *emparejadas* por la posición en el array.
+* `Alojamiento`: Escribe el texto del lugar en donde te alojaste.
+* `Comida`: Otro array con los platos tipicos que comiste.
+* `Zonas_Visitadas`: Es también un array en el que poner los lugares que visitaste.
+
+**Formato avanzado** (con latitud y longitud)
+
+Usa este formato si deseas poner un nombre *particular* al destino. 
+Deberás indicar a mano la `Latitud` y la `Longitud`:
+
+```
+{
+    "Destino": "Nombre del destino",
+    "Latitud": 42.3592683
+    "Longitud": -71.0936210,
+    "Fecha_Visita": "2022-07-03",
+    "Foto_Principal": "foto-principal.jpg",
+    "Mapa": "mapa.png",
+    "Fotos": ["foto-001.png", "foto-002.jpg","foto-003.jpg"],
+    "Descripcion_Fotos": ["Descripcion Foto 1", "Descripcion Foto 2","Descripcion Foto 3"],
+    "Alojamiento": "Hotel ....",
+    "Comida": ["Plato tipico AAAAA", "Plato tipico BBBBB"],
+    "Zonas_Visitadas": ["Castillo de ...", "Pueblo de .....", "Museo de ....", "Barrio de ...."]
+}
+```
+
+#### Curiosidades y Anecdotas
+
+Simplemente crea un fichero de texto con el nombre `curiosidades.txt` dentro del subdirectorio 
+del destino en que quieras que se muestre.
+Puedes usar texto simple o incluso darle *formato* usando etiquetas HTML dentro del fichero .txt
+
+> Nota: Para conseguir una línea en blanco, simplemente deja un espacio en blanco entre una línea y otra.
+
+#### Formato de las fotos
+
+Puedes usar cualquier formato de fotos que soporte cualquier navegador (.png, .jpg, .gif, .webp, .tiff, etc)
+
+Si quieres cambiar el tamaño de visualización de las fotos tendrás que *jugar* con los valores del CSS
+
+
+
+
+
+