Capítulo 4 de 11

Páginas, menú y blog

Crear páginas, ordenar el menú y llevar el blog de tu web.

Aquí gobiernas la estructura de tu web: qué páginas tiene, a dónde llevan sus direcciones, cómo se enlazan entre ellas desde el menú de navegación y, si tienes blog, cómo escribes y publicas tus artículos. Todo esto vive dentro de un proyecto: entra en tu web desde Abrir Editor en el escritorio y usa los iconos de la barra vertical de la izquierda — el de la hoja (Páginas), el del libro (Blog) y el de la imagen (Medios). Los tres están disponibles tanto en modo Fácil como en modo Avanzado.

Tus páginas

Para qué sirve. Es la lista de todas las páginas de tu web: la de inicio, «quiénes somos», «contacto»… y desde aquí las creas, las editas, les cambias la dirección o las borras.

Cómo llegar. Dentro del editor, pulsa el icono de la hoja (Páginas) en la barra de la izquierda.

Qué hay en pantalla. Fíjate en las etiquetas de cada página:

• Publicada (verde) o Borrador (ámbar). Una página en borrador no la ve nadie en tu web hasta que la publiques.
• ES, EN… los idiomas en los que ya existe esa página, en un color sólido. Un idioma con el marco punteado (por ejemplo +EN) significa que todavía no la has traducido a ese idioma: pulsando ahí se abre el traductor (lo ves más abajo, en Tu web en varios idiomas).
• El icono del ojo abre la página tal como la ve un visitante; el del lápiz abre sus datos (ver El título, la dirección y los datos de una página); la papelera la borra.

Cuidado con… Borrar una página no se puede deshacer. Si esa página tenía enlaces desde el menú o desde otras páginas, esos enlaces se quedan apuntando a una dirección que ya no existe — es justo lo que detecta el apartado Páginas pendientes de crear más abajo, así que si borras algo por error, ese es el sitio donde lo notarás.

Crear una página nueva con la IA

Para qué sirve. Añadir una página a tu web sin escribir nada de código: le describes de qué trata y la IA la redacta y la maqueta.

Cómo llegar. En Páginas, pulsa el botón + de la cabecera del listado.

Qué hay en pantalla. El botón Crear simple, arriba a la derecha del diálogo, cambia a un formulario mucho más corto: solo título, dirección e idioma, sin que la IA redacte nada — la página se crea vacía y la rellenas tú luego, dentro del editor. Es el camino que usarías para una página que vas a escribir a mano o a base de indicaciones sueltas al chat más tarde.

Un ejemplo concreto. Vas a añadir una página de preguntas frecuentes: Páginas → + → Crear simple → escribes «Preguntas frecuentes» en Título (la dirección /preguntas-frecuentes se rellena sola) → Crear página. En unos segundos la ves en el listado, en borrador, lista para escribir su contenido dentro del editor o para pedírselo a la IA por chat.

Cuidado con… Si escribes un título o dirección que ya usa otra página, la plataforma debería avisarte antes de crearla — en esta ronda de pruebas ese aviso no llegó a salir al intentarlo en modo Generar con IA. Antes de crear una página nueva, mira el listado para comprobar que esa dirección no está ya en uso.

El título, la dirección y los datos de una página

Para qué sirve. Cambiar el título, la dirección (slug y ruta), el estado (publicada o borrador) y los datos de SEO — el título y la descripción que verá Google — de una página que ya existe.

Cómo llegar. En el listado de Páginas, pulsa el lápiz de la tarjeta.

Cuidado con… Cambiar el slug o la ruta de una página ya publicada cambia su dirección real: cualquier enlace externo o marcador que apuntara a la dirección antigua deja de funcionar. Para eso están las Redirecciones (más abajo): si vas a mover una página, crea antes una redirección de la dirección vieja a la nueva.

Ver solo tus borradores

Cómo llegar. En el listado de Páginas, el desplegable Todos los estados → Borradores.

Para qué sirve. Antes de publicar tu web, es la forma más rápida de ver qué te queda por terminar: todo lo que sigue en borrador es contenido que tú (o la IA) habéis creado pero que tus visitantes aún no pueden ver.

Páginas pendientes de crear

Para qué sirve. Avisa quando algún enlace de tu web —normalmente del menú o del pie de página— apunta a una dirección que todavía no existe como página. Es habitual cuando el asistente plantea una web con más páginas de las que ha llegado a generar.

Cómo llegar. En Páginas, pestaña Pendientes.

Qué hay en pantalla. El botón + de cada tarjeta crea esa página ya con el brief que propone la IA como punto de partida (no la genera sola: te lleva al mismo diálogo de Crear una página nueva, con esos datos ya puestos). El aviso en ámbar del enlace roto no se puede resolver desde aquí: dice dónde está el enlace (por ejemplo, «Pie de página, línea 6») para que sepas dónde arreglarlo o creando la página que falta.

Cuidado con… Un enlace roto en el pie de página o el menú lo ve cualquier visitante que haga clic: no es un detalle técnico, es un enlace que no lleva a ningún sitio en tu web publicada.

El plan de páginas

Para qué sirve. Es el mapa que trazó la IA cuando generaste tu web: qué páginas propuso, por qué (el motivo puede ser «te lo pedí en el brief», «viene del menú» o «sugerencia de la IA») y con qué prioridad.

Cómo llegar. En Páginas, pestaña Pendientes, arriba del todo, el bloque Plan de páginas.

Qué hay en pantalla. Las páginas que ya has creado aparecen tachadas con un check verde; las que faltan, con su prioridad (Alta / Media / Baja) y un botón Ver brief para IA que despliega las notas que la IA se dejó a sí misma para cuando la generes.

Redirecciones

Para qué sirve. Cuando cambias la dirección de una página (o la borras), una redirección hace que quien visite la dirección antigua llegue igualmente a algún sitio, en vez de encontrarse con un error.

Cómo llegar. En Páginas, pestaña Redirecciones.

Un ejemplo concreto. Tenías una página en /tartas y la has renombrado a /encargos. Sin redirección, cualquiera que tuviera guardado el enlace viejo o lo encontrara en Google vería un error. Con la redirección /tartas → /encargos (Permanente), llega a la página nueva sin darse cuenta del cambio.

Cuidado con… Usa Permanente (301) solo cuando el cambio es definitivo: los buscadores memorizan las redirecciones permanentes y pueden tardar en «olvidarlas» si luego cambias de opinión.

Versiones anteriores de una página

Para qué sirve. Volver a ver —o restaurar— cómo estaba una página antes de un cambio.

Cómo llegar. Esta pantalla solo existe en modo Avanzado: activa el interruptor Avanzado de la cabecera del editor, abre Páginas y pulsa Ver historial en la página que quieras revisar (el botón no aparece en modo Fácil).

Cuidado con… En las pruebas de este manual, esta pantalla dio el mismo aviso de «no hay historial todavía» tanto si la página no tenía historial como si el historial había fallado al cargar por un error del servidor. Si esperabas ver versiones anteriores y sale este mensaje, no lo des por hecho: recarga la página del editor y vuelve a intentarlo antes de asumir que no hay nada guardado.

Tu web en varios idiomas

Para qué sirve. Si tu web tiene más de un idioma, aquí ves qué páginas están traducidas a cuáles y traduces las que falten.

Cómo llegar. En el listado de Páginas, pulsa la chapa de idiomas de una página traducida (o la que tiene el marco punteado, +EN, si le falta un idioma) para desplegar el grupo.

Un ejemplo concreto. Tu página «Dónde estamos» solo existe en español. Pulsas la chapa +EN de esa página → se abre Traducir con IA con English ya marcado → Traducir con IA. En un momento tienes la misma página en inglés, enlazada a la española como su traducción.

Cuidado con… Traducir con IA crea una página nueva a partir de la original en ese momento. Si luego cambias la versión en español, la traducción no se actualiza sola — tendrás que volver a traducir esa página, o editar la traducción a mano, para que digan lo mismo.

El menú de tu web (y por qué no hay una pantalla para editarlo)

Esto hay que decirlo con todas las letras: no existe ninguna pantalla del panel para construir o editar el menú de navegación de tu web. No la busques en Páginas, ni en Ajustes, ni en ningún sitio del modo Avanzado: no está. Es una carencia real del producto en este momento, no algo que se te haya pasado por alto.

El menú sí existe — tu web lo pinta, y el asistente lo generó al crear tu sitio — solo que se toca de dos formas, ninguna de las dos con un formulario dedicado:

Pídeselo a la IA, por chat

Es el camino normal, y el que recomendamos. Escribe en el cuadro de chat del editor lo que quieres que cambie, con las mismas palabras que usarías con una persona:

Cuanto más concreta sea la petición —qué texto quieres en el menú, entre qué otras dos entradas, a qué dirección enlaza— menos vueltas tendrás que dar después para ajustar el resultado.

El panel de Estructura de código (para quien sepa mirar)

El menú de tu web vive, por dentro, en un fichero: config/menu.php. Si sabes leer código —o quieres enseñárselo a quien lo sepa— puedes verlo (y tocarlo) directamente. Este panel no es solo para el menú: es una ventana a todos los ficheros que forman tu web, pensada para curiosos y para desarrolladores. Si nunca has programado, no la necesitas para nada del día a día: todo lo que harías aquí se puede pedir igual por chat.

Cómo llegar. En el editor, junto al cuadro de chat, hay una fila de iconos pequeños con los modos de edición (seleccionar, editar directo, dibujar…); el último de esa fila, algo separado de los demás, abre el panel de Estructura de código.

Qué hay en pantalla. Una lista de carpetas y ficheros a la izquierda — config, app/Views, app/Controllers… la misma estructura que usaría un programador — y, al elegir un fichero, su contenido en un editor de código con colores de sintaxis. Es de solo consulta salvo que sepas lo que haces: se puede editar el código a mano desde aquí, pero un error de sintaxis en un fichero como menu.php puede romper la navegación de toda tu web.

Cuidado con… No es una herramienta pensada para el cliente medio de Speaksite. Si abres este panel por curiosidad, mira; si necesitas cambiar algo, pídeselo a la IA por chat en vez de editar el código a mano — es más difícil de romper y no hace falta saber programar.

El flujo estrella: crear una página nueva y enlazarla en el menú

Aquí tienes el camino completo, de principio a fin, para el caso más habitual: se te ocurre una página que te falta y quieres que aparezca en la navegación de tu web.

1. Crea la página. Páginas → + → Crear simple → título «Preguntas frecuentes» (la dirección se rellena sola) → Crear página (pasos con captura en Crear una página nueva con la IA, más arriba).

2. Comprueba que está en tu web. Búscala en el listado para confirmar que se ha creado bien:

En este punto la página existe y se puede visitar por su dirección directa (/preguntas-frecuentes), pero todavía no aparece en el menú de navegación de tu web: nadie llegará a ella haciendo clic desde otra página.

3. Pídele a la IA que la enlace en el menú. Como no hay una pantalla de menú (lo explicado justo arriba), escribes la petición en el chat del editor: «Añade "Preguntas frecuentes" al menú de navegación, entre "Blog" y "Contacto", enlazando a /preguntas-frecuentes» — la misma petición de la captura de más arriba (El menú de tu web) — y la envías.

4. Publica. Una vez la IA confirme el cambio, publica tu web (fuera de esta área, en el botón Publicar de la cabecera del editor) para que el menú nuevo se vea de verdad en tu sitio.

Cuidado con… Si tu web es multi-idioma, el menú se traduce aparte para cada idioma: pedir el cambio en español no lo añade automáticamente al menú en inglés. Dilo explícitamente en la petición si quieres que se aplique a todos los idiomas.

El blog

Si tu web tiene blog, aquí escribes tus artículos, los organizas por categorías y controlas qué está publicado y qué sigue en borrador.

Activar el blog

Para qué sirve. Los proyectos nuevos no llevan blog por defecto: activarlo prepara todo lo necesario —su propia base de datos, la página /blog y las rutas públicas— para que puedas empezar a escribir.

Cómo llegar. Icono del libro (Blog) en la barra de la izquierda del editor. Si el blog no está activado en ese proyecto, verás la franja de activación en vez del listado de entradas.

Cuidado con… «Reversible» significa que puedes apagar el blog y volverlo a encender; no está dicho aquí si desactivarlo borra las entradas que ya hubieras escrito, así que no lo uses como forma de «archivar» tu blog sin comprobarlo antes con una entrada de prueba.

Tus entradas: borrador y publicada

Cómo llegar. Icono del libro (Blog), pestaña Posts.

Qué hay en pantalla. Igual que con las páginas, Borrador significa que solo tú la ves en el editor; Publicado, que ya está en tu web para cualquier visitante. Los filtros de arriba (estado, categoría, traducciones) funcionan igual que en el listado de páginas.

Escribir o editar una entrada

Para qué sirve. Redactar el contenido de una entrada a mano: título, dirección, extracto (el resumen que se ve en el listado del blog) y el cuerpo del artículo.

Cómo llegar. En Posts, pulsa el lápiz de una entrada (o crea una nueva con Nuevo post y elige Crear manual en vez de con IA).

Cuidado con… El contenido se escribe con etiquetas HTML básicas (<p>, por ejemplo) en vez de un editor visual de tipo «lo que ves es lo que obtienes». Si nunca has visto HTML, es más cómodo generar el artículo con la IA (siguiente apartado) y luego solo retocar el texto ya formateado.

Generar una entrada con la IA

Para qué sirve. Igual que con las páginas: le describes de qué quieres que trate el artículo y la IA lo redacta.

Cómo llegar. En Posts, botón Nuevo post → Crear con IA.

Qué hay en pantalla. La casilla Usar mi texto exacto (sin reescribir) cambia lo que hace la IA: si la marcas y pegas un texto ya escrito, la IA solo le da formato (títulos, párrafos, listas) sin cambiar ni una palabra tuya. Sin marcarla, la IA redacta el artículo a partir de lo que le cuentes en «Tema del artículo».

Un ejemplo concreto. Quieres anunciar que ya se puede encargar tarta por la web: Nuevo post → Crear con IA → título «Ya se puede encargar tarta online» → en «Tema del artículo» escribes «Anuncia que hemos abierto los encargos de tarta por la web, con dos días de antelación mínima» → tono Cercano → Generar post. En un momento tienes el artículo escrito y listo para revisar antes de publicar.

La imagen destacada

Para qué sirve. Es la foto que representa la entrada: la que se ve en el listado del blog y al compartir el enlace en redes sociales.

Cómo llegar. Dentro del editor de una entrada, en Imagen destacada, pulsa Galería para elegir una imagen ya subida al proyecto (o arrastra una nueva directamente sobre el hueco de subida).

Cuidado con… Si la entrada ya tiene una imagen destacada puesta, este selector cambia: en vez de la galería, ves directamente la imagen elegida con la opción de quitarla. La galería solo se ve mientras la entrada no tiene ninguna imagen todavía.

Categorías del blog

Para qué sirve. Agrupar tus entradas por tema, para que tus visitantes puedan filtrar el blog por lo que les interesa.

Cómo llegar. Icono del libro (Blog), pestaña Categorías.

Un ejemplo concreto. Quieres una categoría para tus recetas con pan del día: Nueva categoría → nombre «Recetas» → descripción «Qué hacer en casa con el pan del día» → Guardar. A partir de ahí, al escribir o editar cualquier entrada puedes asignarle esa categoría.

Entradas y categorías en otros idiomas

Para qué sirve. Igual que con las páginas, traducir una entrada del blog a otro idioma sin volver a escribirla desde cero.

Cómo llegar. En el listado de entradas o de categorías, botón Gestionar traducciones de un elemento.

Cuidado con… Igual que con las páginas: la traducción es una copia independiente. Si corriges la entrada original después de traducirla, la traducción no se actualiza sola.

Tus imágenes y archivos

Para qué sirve. Es la biblioteca de imágenes de tu proyecto: las subes una vez aquí y las usas donde haga falta — en una página, en la imagen destacada de una entrada, en cualquier sitio que pida una foto.

Cómo llegar. Icono de la imagen (Medios) en la barra de la izquierda del editor.

Cuidado con… Borrar una imagen desde aquí la quita de la biblioteca, no solo de donde la estuvieras usando: si esa imagen sigue puesta en alguna página o entrada del blog, esos huecos se quedan sin foto.