Antes de comenzar
Esta guía explica cómo editar los textos y las fotografías del sitio actual de Shiniest House desde el administrador de archivos de Hostinger. No es un editor del sitio: los cambios se hacen en Hostinger. Este manual no tiene conexión para guardar contenido en producción.
respaldo contiene el sitio anterior y no corresponde al sitio nuevo.Necesitas acceso a Hostinger y los textos o fotos aprobados. Cambia una cosa a la vez. Si un archivo se ve distinto a los ejemplos, pide ayuda antes de modificarlo.
1. Crear una copia antes de editar
- Entra a Hostinger con tu propia cuenta. Abre Sitios web → shiniesthouse.com → Administrador de archivos. Los nombres pueden variar según el idioma del panel.
- Abre
public_html. Ahí están los archivos del sitio público. - Localiza el archivo que vas a editar. Usa el menú del archivo, normalmente con clic derecho, y elige Descargar / Download.
- Guarda la copia en tu computadora dentro de una carpeta con fecha, por ejemplo
copia-antes-del-cambio. Conserva el nombre original del archivo. - Si reemplazarás una foto existente, descarga también esa foto antes de sobrescribirla.
No dejes copias .bak o archivos ZIP dentro del sitio público. Nunca incluyas contraseñas en copias destinadas a compartir.
2. Encontrar la página correcta
Los archivos de esta tabla están dentro de public_html. Cada idioma tiene su propio archivo: guardar uno no traduce ni actualiza el otro.
| Página | Inglés | Español |
|---|---|---|
| Inicio | index.html | index-es.html |
| Nosotros | about.html | about-es.html |
| Contacto | contact.html | contact-es.html |
| Limpieza recurrente | recurrent-cleaning.html | recurrent-cleaning-es.html |
| Limpieza profunda | deep-cleaning.html | deep-cleaning-es.html |
| Comercial | commercial.html | commercial-es.html |
| Mudanza | moving-in-out.html | moving-in-out-es.html |
| Posconstrucción | post-construction-cleaning.html | post-construction-cleaning-es.html |
| Solicitudes de Jobber | booking.php | reservar.php |
Los términos están en terms.html y actualmente se presentan en inglés. Su contenido debe ser aprobado antes de cambiarlo. La disponibilidad de posconstrucción está pendiente de confirmación del cliente.
3. Cambiar un texto
- Descarga la copia del archivo correspondiente.
- Ábrelo con Editar / Edit en el administrador de archivos.
- Busca una frase única del texto que ves en la web. Usa el buscador del editor o Ctrl + F.
- Cambia únicamente las palabras del contenido. Conserva las etiquetas, comillas, clases y atributos.
- Guarda, abre la página pública y comprueba el resultado.
- Repite el cambio equivalente en el archivo del otro idioma y revisa ambos.
Ejemplo real: título de About
En about.html, busca Care for your home and business. La estructura se parece a:
<h2 class="sec-title__title title-animation">Care for your home and business</h2>Cambia solo el texto entre > y <. Por ejemplo:
<h2 class="sec-title__title title-animation">A cleaner home, more time for you</h2>Este ejemplo es ilustrativo; publica únicamente textos aprobados. En español, localiza el título correspondiente en about-es.html.
<span>, <br> ni partes de una etiqueta para cambiar una frase.Caracteres especiales
Conserva la codificación UTF-8 para las tildes. En texto HTML, escribe & para mostrar «&», < para «<» y > para «>». No pegues formato desde Word: pega solo texto.
4. Cambiar una imagen
La opción más fácil de revertir es subir una imagen con nombre nuevo y cambiar su ruta. Así conservas la anterior y reduces problemas de caché.
- Prepara una foto con orientación y proporción similares a la actual. Para un fondo ancho, usa una foto horizontal. Evita texto incrustado en las fotos.
- Usa un nombre simple sin espacios ni tildes, por ejemplo
about-team-2026.webp. Guarda el archivo realmente como WebP, JPG o PNG: renombrar la extensión no convierte el formato. - En Hostinger, abre
public_html/assets/mediay usa Subir / Upload → Archivo / File. - Abre el HTML de la página y localiza la ruta de la imagen actual.
- Cambia solo la ruta y, si corresponde, la descripción
alt. Guarda y verifica los dos idiomas.
Fotografía normal
<img src="/assets/media/about-main.webp" alt="">Ejemplo con un archivo nuevo:
<img src="/assets/media/about-team-2026.webp" alt="Equipo de limpieza de Shiniest House">El alt describe una fotografía informativa para quien no puede verla. Si la imagen es puramente decorativa, puede permanecer vacío.
Imagen de fondo
<div class="main-slider-one__bg" style="background-image: url(/assets/media/home-nueva.jpg);"></div>Modifica solo lo que está dentro de url(...). No cambies el nombre de la clase: puede controlar el efecto del slider o del fondo.
Tamaño y peso
Como orientación, usa fotos de unos 1600–1920 px de ancho para fondos grandes y 1000–1400 px para fotos de contenido, conservando la proporción adecuada. Intenta mantener cada foto por debajo de 300–500 KB cuando la calidad lo permita. Estas son recomendaciones, no límites del sistema. No agrandes una foto pequeña para intentar darle más nitidez.
5. Dónde están las imágenes principales
Estas rutas corresponden a la versión preparada del sitio. Confirma la ruta en el archivo de la página antes de editar.
| Zona | Ruta | Observación |
|---|---|---|
| Logo del encabezado | /assets/media/header-logo-hd.pngVer imagen actual ↗ | Se reutiliza en varias páginas; consultar antes de sustituir. |
| About: imagen principal | /assets/media/about-main.webpVer imagen actual ↗ | También aparece en otras zonas del sitio. |
| About: imagen de detalle | /assets/media/about-detail.webpVer imagen actual ↗ | Foto secundaria de About. |
| Encabezado de About | /assets/media/footer-about.webpVer imagen actual ↗ | Fondo del encabezado interior. |
| Home: fondo de servicios | /assets/media/home-services.webpVer imagen actual ↗ | Conserva las clases y atributos del efecto de desplazamiento. |
| Home: franja de contadores | /assets/media/home-counter.webpVer imagen actual ↗ | Imagen detrás de los contadores. |
| Home: primer slide | /assets/2024/06/WhatsApp-Image-2024-06-06-at-11.13.08-AM-scaled.jpegVer imagen actual ↗ | Primer fondo del slider. |
| Home: segundo slide | /assets/2024/06/dog.jpgVer imagen actual ↗ | Segundo fondo del slider. |
| Home: tercer slide | /assets/2024/06/Home1-scaled.jpgVer imagen actual ↗ | Tercer fondo del slider. |
6. Menú, footer y datos de contacto
El menú, el footer, el teléfono y el correo están copiados en varios archivos; no hay un panel central que los cambie en todas las páginas. Si necesitas modificar un dato global, pide apoyo para actualizarlo y verificarlo en todo el sitio.
En un enlace, el texto y el destino son distintos:
<a href="mailto:contact@shiniesthouse.com">contact@shiniesthouse.com</a>Cambiar las palabras visibles no cambia el correo al que apunta el enlace. Lo mismo sucede con tel: y los botones de solicitud.
Los colores de marca son #92A48A y #D7B3A7. Las fuentes y los efectos ya están configurados; editar textos y rutas de imágenes no requiere tocar CSS ni JavaScript.
7. Jobber y agente IA
Solicitudes: booking.php y reservar.php muestran el formulario de Jobber. Los campos y pasos internos se administran desde Jobber; no se cambian editando el HTML de Shiniest. La página en español incluye una guía porque los campos nativos se muestran en inglés.
No cambies el código de integración, los identificadores ni los destinos de envío. No hagas una reserva real para probar una foto o un título. Si el formulario muestra un error, guarda una captura y avisa al administrador. Se ha observado un bloqueo de acceso desde conexiones de Nicaragua; la comprobación desde Utah está pendiente.
Agente IA: cambiar un texto del sitio no actualiza automáticamente su entrenamiento. Si cambian servicios, disponibilidad, precios, políticas o cobertura, entrega también esa información al administrador del agente para actualizarla en español e inglés.
No edites contraseñas ni configuración privada para cambiar contenido. El archivo privado del correo está separado del sitio público.
8. Revisar antes de terminar
Las casillas son una ayuda visual; no guardan cambios en el sitio ni un registro permanente.
En computadora, prueba una recarga completa con Ctrl + F5 o abre una ventana privada. Si aún ves la versión anterior, verifica que guardaste el archivo correcto. No purgues toda la caché del hosting como primer paso.
9. Volver a la versión anterior
- Detén los cambios si faltan secciones, la página queda en blanco o se rompe el diseño.
- Ubica en tu computadora la copia original de ese archivo.
- Súbela a la misma carpeta de Hostinger con el nombre original y confirma la sustitución de ese archivo.
- Si cambiaste la ruta de una foto, restaurar el HTML también restaura la ruta anterior. Si sobrescribiste la propia foto, restaura además su copia.
- Recarga y revisa inglés y español. Si el problema sigue, pide ayuda indicando página, archivo, cambio realizado y una captura.
No restaures todo el hosting para corregir una frase: empieza por el archivo concreto que cambiaste.
10. Cuándo pedir ayuda
- Cambios globales de menú, footer, logos, teléfono o correo.
- Agregar/eliminar servicios o páginas, cambiar direcciones web o traducciones de navegación.
- Modificar videos, animaciones, iconos, estilos o comportamiento móvil.
- Cambios en términos, pagos, formularios, correo autenticado o instrucciones del agente.
No necesitas editar las carpetas app, archivos .htaccess, CSS, JavaScript ni la configuración privada para sustituir una frase o una fotografía.
