Editar el contenido y las páginas estáticas del sitio web

Usa el contenido de la página de inicio, el pie de página y las páginas estáticas para dar a los clientes la información que necesitan: mensajes de bienvenida, promociones, datos de contacto, enlaces sociales, páginas legales, ayuda, preguntas frecuentes y contenido sobre nosotros. Estas áreas pueden admitir HTML; haz los cambios deliberadamente y revisa el resultado visible para los clientes antes de continuar.

Crea una copia de respaldo antes de editar el contenido

Antes de cambiar HTML o contenido en vista de código, copia todo el contenido actual. Guarda la copia en una ubicación recuperable, edita solo el texto, enlace, imagen o elemento previsto y, después de guardar, revisa el diseño resultante, los enlaces y las vistas de escritorio y móvil.

Antes de cambiar el contenido

1. Confirma que estás editando el sitio web previsto.
2. Copia el código completo actual de la página de inicio o el pie de página a un respaldo, por ejemplo, homepage-backup-date o footer-backup-date.
3. Evita eliminar secciones grandes del marcado o cambiar elementos que no entiendas.
4. Haz un cambio pequeño, guárdalo mediante el flujo aprobado e inspecciona el resultado.

Edita el contenido de la página de inicio

Abre My Products, luego selecciona Ordering Website y Homepage Content.

Abre Code View cuando necesites editar el HTML o CSS de la página de inicio.

Selecciona la parte específica del código que quieres actualizar. Algunos cambios comunes son mensajes de bienvenida, promociones, imágenes, botones y enlaces.

Elige Accept para confirmar el cambio de contenido y luego Save para aplicarlo.

Abre My Website y revisa el cambio en el sitio web que ven los clientes.

Las siguientes vistas muestran el mismo flujo de trabajo para la página de inicio en un diseño posterior del editor. Al comparar los controles disponibles en el sitio seleccionado, consérvalas junto al paso correspondiente.

Edita el contenido del pie de página

El pie de página suele contener información de apoyo, como datos de contacto, enlaces sociales, páginas legales, enlaces de navegación y texto de derechos de autor. Abre Footer Content desde el panel principal y luego usa Code View cuando necesites editar el marcado del pie de página.

Selecciona la sección de código que quieres actualizar, elige Accept, guarda el cambio y abre My Website para confirmar que el pie de página se muestre correctamente.

Ejemplo de plantilla de pie de página

Adapta este ejemplo al negocio en vez de copiarlo sin revisar los enlaces y datos de contacto:

<div class="footer" style="text-align:center;padding:30px;">
  <p>© 2026 Your Business Name</p>
  <p>
    <a href="/about-us">About Us</a> |
    <a href="/privacy-policy">Privacy Policy</a> |
    <a href="/terms-and-conditions">Terms &amp; Conditions</a>
  </p>
  <p>
    <a href="https://facebook.com">Facebook</a> |
    <a href="https://instagram.com">Instagram</a>
  </p>
  <p>Contact us: email@example.com</p>
</div>

Agrega una imagen al contenido de inicio

1. Abre Design y luego Home Content.
2. Selecciona el icono de imagen en la barra de herramientas del editor.
3. Elige una imagen de los archivos locales y súbela.

Copia la URL de imagen generada después de subirla.

Usa esa URL en la sección prevista del contenido o CSS. Por ejemplo:

.hero {
  background: url('IMAGE_URL_HERE') no-repeat center center/cover;
}

Reemplaza IMAGE_URL_HERE con la URL de la imagen subida y revisa el resultado en los tamaños de pantalla correspondientes.

Crea y administra páginas estáticas

Las páginas estáticas sirven para información que no cambia con frecuencia, como la política de privacidad, términos y condiciones, ayuda con un pedido, una guía para hacer pedidos o preguntas frecuentes. Puedes editar una página existente o crear una desde el área CMS cuando ese control esté disponible para el sitio seleccionado.

Abre el administrador de páginas estáticas

Si el editor del sitio web muestra la ruta, agrega /pages a la URL del editor y presiona Enter. Por ejemplo:

https://your-dashboard-url/pages

Esto abre el administrador Static Pages que aparece en estas capturas.

Otra ruta disponible es Settings → CMS → CMS. Selecciónala para ver la lista de páginas estáticas que ya se crearon en el proyecto.

Edita una página estática existente

Selecciona la página que quieres editar. El editor puede mostrar estos campos:

• Nombre de página
• Slug (URL de la página)
• SEO title
• SEO description
• SEO image
• Contenido de página

Usa el editor de contenido para agregar o editar texto, imágenes, encabezados, enlaces y HTML cuando sea necesario. Selecciona Accept para guardar mediante el editor y luego verifica la página resultante.

Crea una página estática nueva

En el administrador Static Pages, selecciona Add new static page o Add Page.

Ingresa el nombre de página, slug, SEO title, SEO description y el contenido que requiera el editor. Después de guardar, agrega un enlace intencional desde el contenido de inicio o del pie de página cuando los clientes necesiten encontrarla.

Por ejemplo:

<a href="/about-us">About Us</a>
<a href="/privacy-policy">Privacy Policy</a>
<a href="/terms-and-conditions">Terms &amp; Conditions</a>

Usa con cuidado la asistencia de IA

Si usas una herramienta de IA para modificar HTML, pídele lo mínimo necesario y revisa cada cambio antes de guardar. Por ejemplo:

• Cambiar texto: “Edit this HTML code and change the title to: Welcome to Our Restaurant.”
• Agregar un botón: “Add a button that links to our contact page. The button text should say: Contact Us.”
• Mejorar el diseño: “Improve this HTML section to make it centered and more modern.”

El código generado por IA puede quitar marcado necesario, cambiar enlaces o crear una salida inaccesible. Conserva el respaldo, compara el resultado generado con el original y pruébalo antes de publicar.

Soluciona problemas comunes

El diseño aparece roto

Es posible que se haya eliminado o cambiado una etiqueta HTML. Restaura el respaldo y repite el cambio seguro más pequeño.

<div>
  content
</div>

Los enlaces no funcionan

Confirma que la ruta sea correcta y comience con la barra prevista cuando sea un enlace relativo al sitio:

<a href="/about-us">About Us</a>

Los cambios no aparecen

Actualiza la página, borra la caché del navegador si corresponde, vuelve a abrir el sitio web y confirma que se guardaron la página correcta y el sitio seleccionado.

Lista final de comprobación

• Conserva una copia de respaldo antes de editar.
• Haz cambios pequeños y revisables.
• Revisa el HTML y el código generado por IA antes de guardar.
• Comprueba el diseño, los enlaces y el resultado en escritorio y móvil.
• Mantén actualizados y fáciles de encontrar para los clientes el contenido de inicio, el pie de página y las páginas estáticas.

Guías relacionadas: Administrar Ordering Website · Configurar los ajustes de Ordering Website