CMS (anteriormente Administrador de contenidos): mostrar el contenido de una colección en una página normal

6 min de lectura
En este tutorial, aprenderás a crear una página personalizada para mostrar el contenido de una colección. Te mostraremos cómo diseñar los elementos de la página, crear una colección y conectarla a estos elementos mediante un conjunto de datos. Por último, probaremos la página en modo Vista previa y publicaremos el sitio para que los visitantes de tu sitio puedan ver tus datos.
Nota:
En este tutorial, creamos una página estática para mostrar el contenido de una colección. También puedes configurar páginas dinámicas de ítem que crean automáticamente páginas para cada ítem de tu colección. 

Paso 1 | Crea una colección

Una colección es donde almacenas el contenido que necesitas para tu sitio o donde recopilas la información enviada por los visitantes. Cuando creas una colección, también debes definir sus permisos. Esto te permite controlar lo que los visitantes pueden hacer con el contenido de tu colección. Aquí, estamos agregando una colección vacía que almacenará el contenido que deseas mostrar a los visitantes.

Para crear una categoría:

  1. Ve a CMS en el panel de control de tu sitio.
  2. Haz clic en Crear colección.
  3. Ingresa un nombre para tu colección. 
  4. Elige cuántos elementos quieres en la colección:
    • Un solo ítem: una colección puede tener un solo ítem que contenga muchos campos, como texto, imágenes, video y URL. Este tipo es más adecuado para contenido no repetible, como una página "acerca de".
    • Varios ítems (predeterminado): una colección con varios ítems almacena mucho más contenido y puede aparecer en un elemento, como un repetidor o una tabla. Este tipo es adecuado para listados de propiedades inmobiliarias, portafolios, recetas y más. Obtén más información sobre la diferencia entre las colecciones con un solo ítem y de varios ítems.
  5. Haz clic en Crear.

Paso 2 | Configura la colección

Agrega un campo para cada información que deseas que vean los visitantes y luego ingresa el contenido.

Para configurar una colección:

  1. Ve a CMS en el panel de control de tu sitio.
  2. Haz clic en la categoría correspondiente.
  3. Haz clic en Administrar campos y luego en + Agregar campo para agregar un campo a la colección. 
  4. Configura el campo para que coincida con la información que quieres que vean los visitantes. Asegúrate de seleccionar el tipo de campo correcto para que coincida con el contenido del campo.
  5. Define el campo para cada uno de los elementos de página planificados.
  6. Ingresa contenido en la colección.

Paso 3 | Diseña la página

La página debe incluir elementos que permitan a los visitantes ver la información que deseas mostrar. 

Para empezar:

  1. Ve al menú Agregar elementos y selecciona el grupo que contiene un tipo de elemento que coincida con el tipo de campo de la colección.
  2. Arrastra elementos a la página para diseñar y organizarla. Puedes seleccionar elementos como texto e imagen.

Paso 4 | Configura los elementos

Una vez que agregas elementos a la página, puedes configurar cómo se ve cada elemento en su panel de ajustes correspondiente.

Para configurar elementos:

  1. Selecciona un elemento de la página, haz clic en el icono Opciones y utiliza las opciones para configurarlo.
  2. Repite esto para cada uno de los elementos de la página.
Ahora tendrás que conectar los elementos a la colección. Usaremos un conjunto de datos para hacer esto, que cubriremos en los próximos pasos.

Paso 5 | Agrega y configura un conjunto de datos

Un conjunto de datos conecta los elementos a la colección. Cuando agregas un conjunto de datos, deberás decidir a qué colección deseas conectarlo, si deseas que los visitantes puedan leer o escribir en la colección, y más.

Para agregar un conjunto de datos a la página:

  1. Ve a CMS en el editor:
    • Editor de Wix: haz clic en CMS  a la izquierda del editor.
    • Editor X: haz clic en CMS  en la parte superior del Editor X.
  2. Haz clic en Agregar elementos.
  3. Haz clic en Conjunto de datos. Se agrega un conjunto de datos a tu página.
  4. Selecciona el conjunto de datos y luego Ajustes. Se abre el panel Ajustes del conjunto de datos.
  5. En Conectar una colección, selecciona la colección.
  6. Selecciona Solo lectura para el Modo.
  7. De manera opcional, puedes configurar la posibilidad de filtrar y ordenar el conjunto de datos.
  8. Cierra el panel.

Paso 6 | Conecta los elementos de la página

Una vez que tengas el conjunto de datos configurado, puedes conectarle los elementos. Debes ir a cada uno de los elementos de tu página y conectarlos al mismo conjunto de datos. Cada vez que conectas un elemento, también defines a qué campo de la colección debe conectarse su valor. Algunos elementos contienen más de una propiedad que se puede conectar a diferentes campos.

Para conectar los elementos:

  1. Selecciona un elemento y haz clic en su botón Conectar a datos .
  2. Selecciona el campo de la colección donde se almacena la información.
  3. Repite esto para cada uno de los elementos de la página.
En el siguiente paso, crearemos los botones Anterior y Siguiente para navegar por los elementos en el conjunto de datos.

Paso 7 | Crea los botones Anterior y Siguiente

Ahora que todos los elementos están conectados a la misma colección a través del mismo conjunto de datos, debes permitir que los visitantes naveguen por la información. Para ello, agrega dos botones a tu página, conéctalos al mismo conjunto de datos que los otros elementos y define sus acciones de clic.

Para crear botones de Anterior y Siguiente:

  1. Agrega dos botones a la página y cambia sus textos a Anterior y Siguiente.
  2. Haz clic en sus botones Conectar a datos .
  3. En el panel Botón de conexión, selecciona el conjunto de datos.
  4. En La acción del clic se conecta a, selecciona el Ítem anterior para el primer botón y el Siguiente ítem para el segundo botón.

Paso 8 | Prueba la página

Ahora puedes probar tu página en el modo Vista previa. El contenido que veas provendrá de tu base de datos Sandbox, que solo es visible en el modo Vista previa. Más información sobre Sandbox.

Para probar tu página:

  1. Haz clic en Vista previa.
  2. Haz clic en los botones Siguiente y Anterior.
  3. Haz clic en Volver al editor.

Paso 9 | Publica el sitio

Nota:
Este paso solo se aplica cuando tienes habilitado Sandbox. Más información sobre Sandbox.
Ahora es el momento de publicar el sitio para que los visitantes puedan ver el contenido.

Al publicar tu sitio, se crea una versión vacía de la colección con todos los campos de la colección Sandbox. El contenido que verán los visitantes en la versión publicada de tu sitio se guarda en la colección online, a la que puedes acceder a través del Administrador de contenidos. 

Una vez que publiques tu sitio para crear una colección online, puedes agregar los datos a la colección online manualmente o sincronizar el contenido de la colección Sandbox.

Para configurar una colección online:

  1. En el editor, haz clic en Publicar para publicar tu sitio.
  2. Ve a CMS en el editor:
    • Editor de Wix: haz clic en CMS  a la izquierda del editor.
    • Editor X: haz clic en CMS  en la parte superior del Editor X.
  3. Haz clic en Colecciones.
  4. Selecciona la colección requerida.
  5. Elige cómo rellenar la colección online:
    • Para agregar manualmente datos a la colección online:
      • Haz clic en Colección online e ingresa el contenido.
    • Para sincronizar el contenido de tu colección Sandbox:
      • Haz clic en Colección Sandbox.
      • Haz clic en Sincronizar contenido
      • Selecciona la opción de sincronización que desees.
      • Haz clic en Sincronizar.
      • Haz clic en Sincronizar nuevamente para confirmar.

Paso 10 | Mira el contenido online

Una vez que publiques tu sitio, el contenido estará disponible para los visitantes. Cuando lleguen a tu página, verán el contenido de tu colección online.

Siguientes pasos

Puedes agregar más funciones a tu página.

¿Te ha sido útil?

|