Subimos README
This commit is contained in:
commit
c80b1f10e5
154
README.md
Normal file
154
README.md
Normal file
@ -0,0 +1,154 @@
|
||||
# Blog de Viajes Personales
|
||||
|
||||
## Captura de ejemplo
|
||||
|
||||
|
||||
|
||||
|
||||
## 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
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user