# Pages

Las Pages (o páginas) son lo que te permite crear una estructura para tu sitio, donde puedes añadir contenido no estructurado y personalizar las rutas de donde se muestra ese contenido.

The index page for all the pages in your site

Para editar una página, debes hacer click en el ícono de edición () o en el nombre de la página para ir a la vista de edición.

En la vista de edición, encuentras una barra superior con acciones, una grilla central y una barra lateral con pestañas.

En la barra superior, encuentras distintas acciones e información:

Título: Se encuentra en la parte superior izquierda, e indica el nombre de la página que estás modificando. A la derecha el nombre, encontrarás el estado actual de la página. Esos pueden ser "Borrador", "En revisión", "Aprobado", "Cambios pendientes", "Publicado". Para aprender más sobre estos estados, puedes revisar la sección de Versionado y Revisión en Equipo.

Fecha de publicación: Si es que la página ha sido publicada, se indicará la fecha de la última publicación.

Vista previa : Este ícono te permite abrir una pestaña nueva con el modo Vista Previa para poder visualizar los cambios que se han hecho en la página sin necesidad de publicarla.

Atención

Puedes previsualizar las páginas como usuario sin sesión o usuario con sesión de Modyo. Para esto, es recomendable iniciar o cerrar la sesión de Modyo en el sitio antes de entrar al modo vista previa, dado que si se inicia o cierra sesión dentro del modo vista previa, podrías encontrarte con errores de seguridad del tipo x-frame-options o mixed-content, dependiendo de la configuración de dominios personalizados y SSL del sitio

Diferencias : Al hacer click en el ícono de diferencias, irás a la vista de diferencias de la página que te permite seleccionar dos versiones a comparar, permitiendo ejecutar las acciones reestablecer y rollback

Tip

Si tu página está en estado "Borrador" no aparece el icono de diferencias, dado que no hay nada con que comparar la versión editable actual. Para aprender más sobre las diferencias y respaldos, revisa la sección de versionado

Actividad : Al hacer click en este ícono, se despliega una barra lateral que te muestra la actividad asociada a la página, como las modificaciones, publicaciones y comentarios. En la parte inferior de esta barra, puedes escribir comentarios asociados. En caso de que la página esté en revisión, todos quienes estén asignados como revisores recibirán una notificación con el comentario.

Otras acciones :

  • Archivar : Si una página no se encuentra publicada, esta acción te permite archivarla. Cuando una página se encuentra archivada, por defecto no aparece en el índice de página y permite mantener la estructura del sitio limpia.
  • Duplicar : Esta acción te permite copiar la versión editable de la página en la que estás. La versión copiada queda en estado "Borrador".

Atención

Una vez terminada la acción de copiado, te dirige a la nueva página, por lo que es importante guardar todos los cambios antes de usar esta acción, de lo contrario podrías perder información importante.

# Crear una página

Para crear una nueva página, sigue estos pasos:

  1. Dentro del menú principal de Modyo Platform, expande Channels, y haz click en Sitios.
  2. Selecciona el sitio que desees agregar una nueva página.
  3. Haz click en Pages.
  4. Haz click en + Nueva Página.
  5. Selecciona el tipo de página (Widget o Content) que quieres crear.
  6. Llena el Nombre del Layout, la Ruta, de ser necesario selecciona el layout padre, y presiona Crear.
  7. Personaliza la página dependiendo del tipo: agregando o editando widgets para Página de Widget o editando el Index y Show para Página de Contenido.
  8. Una vez terminado, haz click en Publicar.

Para conocer los tipos de widgets que puedes agregar, ve Widgets

Para conocer más acerca de páginas de contenido, ve Página de Contenido

Acción principal: Es el botón verde en la parte superior derecha. Este botón puede tomar distintas formas:

  • Guardar: Te permite guardar los cambios que has hecho en la página.
  • Enviar a revisión: Si está habilitada la revisión en equipo, entonces si no hay cambios que guardar, esta acción te permitirá enviar a revisión la página y asignar revisores.
  • Publicar: Si la página está aprobada, puedes ir a la vista de publicación conjunta haciendo uso de esta acción.

Tip

  • Si una página tiene un padre, solo la puedes publicar si es que éste se encuentra publicado.
  • Si una página tiene hijos, solo puedes despublicarla si todos estos se encuentran despublicados.
  • Si una página tiene hijos, solo puedes archivarla si todos estos se encuentran archivados.

Acciones secundarias:

  • Forzar publicación: Si es que eres administrador del sitio, entonces puedes ver y usar esta opción que te permite publicar la página en cualquier momento, incluso saltándote la revisión en equipo.
  • Despublicar: Si es que la página está publicada, entonces ves esta acción que te permite despublicar la página.
The page builder screen

La grilla central es el lugar donde puedes posicionar tus widgets. Puedes mover los widgets de un lado a otro haciendo uso de la funcionalidad drag-and-drop arrastrándolos desde el ícono .

En la sección lateral derecha encontrarás tres pestañas:

  • Añadir widgets: Te permite seleccionar dentro de un listado de widgets para añadirlos a la grilla.
  • Editar widget: Te permite cambiar distintas propiedades y filtros para cada uno de los widgets.
  • Propiedades: Te permite modificar el nombre, excerpt, ruta, padre, privacidad, grilla de la página y meta tags.

# Página de widget

Aquí puedes personalizar tu página usando widgets preestablecidos de la siguiente lista:

  • HTML: Te permite ingresar código HTML y CSS sin validaciones. No te permitirá ingresar código Javascript.
  • Texto enriquecido: Te permitirá hacer uso de un editor de texto enriquecido, en el que puedes darle formato al texto y cambiar entre la vista de código y texto enriquecido.

Atención

El widget de texto enriquecido cuenta con un formateador automático, por lo que el código que escribas en la vista de código puede verse afectado.

  • Listado de contenido: Muestra listados de contenido haciendo uso de filtros por espacio, tipo, idioma, tags, y categoría. Para modificar como se ven estos widgets, debes hacerlo en la sección de Widgets en Templates.
  • Contenido destacado: Muestra un listado de entradas como imágenes "hero" en un carrusel.
  • Personalizado: Encontrarás un listado de todos los widgets que has creado y publicado en el widget builder.

Una vez seleccionado un widget en la sección central, el foco pasará a la pestaña lateral, donde podrás encontrar distintas opciones de configuración del widget y en caso de seleccionar un widget personalizado, encontrarás un link para ir directamente a su vista de edición en widget builder y el listado de variables que el widget está usando. Si quieres sobrescribir el valor de una variable en particular para esa instancia del widget en esa página, debes seleccionar el checkbox a la izquierda de la variable y cambiar el valor que toma.

# Propiedades

En esta pestaña encontrarás opciones propiedades comunes de todas las páginas:

  • Nombre
  • Padre
  • Ruta
  • Extracto
  • Grilla
  • Privacidad
  • Meta tags personalizados

Atención

Modyo cuenta con rutas reservadas para las página, por lo que no podrás usarlos como rutas de tus páginas personalizadas:

  • 404
  • 422
  • 500
  • admin
  • auth
  • crossdomain
  • dist
  • forms
  • javascript
  • login
  • logout
  • manifest
  • ping
  • preview
  • profile
  • robots
  • search
  • serviceworker
  • session
  • site_logout
  • sitemap
  • stylesheets
  • uploads
  • widget_manager

# Páginas de Contenido

Despliega las entradas de tus tipos de contenido desde una sola página usando páginas de contenido.

# Requisitos previos

Para poder mostrar contenido en un sitio, debes cumplir con ciertas condiciones:

  • Contar con un espacio con al menos un idioma (el mismo del sitio) y con por lo menos un Tipo de contenido. Para más información, ve a Crear un Espacio y Crear un Tipo
  • Contar con entradas publicadas en el idioma del sitio. Para más información, ve Entradas y Localización

Tip

Para conocer más acerca de como crear una vista de contenido personalizada, vea Creación de una Vista de Contenido.

Tip

Puedes usar el nombre que desees para las vistas, sin importar a que tipo o espacio lo quieras asociar. Siempre debes tener en consideración que las entradas solo se mostrarán si tienen una versión publicada en el idioma del sitio en el que estás creando estas vistas.

Estas páginas están compuestas por dos secciones Index y Show.

# Index

La página índice que contiene el listado de todas las entradas del tipo de contenido. Aquí podrás seleccionar las siguientes opciones:

# Edit

  • Habilitar Índice de Entradas: Deshabilitado por default. La ruta que toma es el nombre que se le dio a la página cuando fue creado. Si se deshabilita esta opción, solo las páginas de Show serán accesibles y si se intenta acceder se les mostrará un error 404.
  • Layout: La plantilla Layout que va a cargar para el Index.
  • Custom Meta Tag: Agrega custom meta tags para optimizar el SEO del índice. Este meta tag solo será cargado para el Index, no para el Show. También puedes utilizar Liquid para cargar meta tags dinámicos.

# Show

La pestaña en donde defines como van a lucir las entradas dinámicas. Aquí podrás seleccionar las siguientes opciones:

# Edit:

  • Layout: La plantilla Layout que va a cargar para el Show.
  • Custom Meta Tag: Agrega custom meta tags para optimizar el SEO del show. Este meta tag solo será cargado para el Show, no para el Index. También puedes utilizar Liquid para cargar meta tags dinámicos.

Un ejemplo básico de código Liquid+HTML que puedes usar en Show es:

<div>
  <h1 class="title">{{ entry.name }}</h1>
  <time>{{ entry.published_at | format_date }}</time>
  <span class="url">
    <a href="{{request.url}}">{{request.url}}</a>
    </span>
</div>

<div>
  <div class="description">
    {{ entry.description }}
  </div>
</div>

Este snippet toma entry.name, entry.published_at, request.url, y entry.description para generar una página dinámica dependiendo de la entrada que selecciones.

Tip

Para aprender más sobre cómo usar Liquid, dirígete a Liquid markup

Para aprender que campos puedes utilizar con el drop entry, ve Drops de Content

# Propiedades

Muestra el tipo de contenido y el espacio al cual pertenece esta página. A demás tendrás opciones para cambiar el nombre, la página padre, la ruta, y un extracto.

Tip

En el caso de que el custom domain esté habilitado, para encontrar la forma de la URL debes ir a Configuración del Sitio > Dominios.

En caso de que no se encuentre habilitado, la URL será de la forma account_url/site_host.

El extracto se agrega como parte de los meta tags para mejorar el SEO. Esto es posible tanto para todos los tipos de páginas y Plantillas. Dentro del <head> se agrega un tag:

<meta name="description" content="{{ page.excerpt }}"/>

# Delegación de rutas

Habilita la delegación de rutas para permitir el control absoluto de las sub-rutas de la página a través del router de JavaScript.

# Privacidad

Si habilitas la privacidad en una página, entonces se requerirá una sesión para poder ver esta página. Junto a la privacidad, también puedes asociar Segmentos, de tal manera que solo los usuarios que pertenezcan a esos segmentos podrán acceder a esta página. Quienes no sean parte del grupo de segmentos seleccionados, serán redirigidos a la página anterior o al home del sitio.

# Meta tags

En esta sección podrás añadir meta tags a las páginas y modificar el valor de los meta tags existentes, para enriquecer el SEO de la página. Con los tags añadidos a las página, podrás decidir si usar el valor por defecto, sobrescribir el valor disponible para el tag, o eliminar el tag de la página.

Tip

Debes tener en cuenta que para que los meta tags tengan efecto en tu página, debes publicar los cambios.

Para acceder al listado de meta tags de la página, debes usar el drop de Liquid {{ page.meta_tags }}. Te recomendamos ver el ejemplo en la sección SEO del Template builder.

Tip

Si quieres añadir un meta tag común para todos los pages en una sola acción, dirígete a la configuración del sitio, sección SEO.

Last Updated: 17/5/2022,