Tutorial: Visualización de tweets en la primera página

Puede personalizar el aspecto de la primera página del Portal del desarrollador para mostrar los tweets recientes. Puede utilizar los tweets para proporcionar a los usuarios información como, por ejemplo, disponibilidad de servicio o campañas de marketing.

Antes de empezar

Debe tener un Portal del desarrollador habilitado y debe tener acceso de administrador para completar esta guía de aprendizaje. La guía de aprendizaje Creación del portal explica cómo habilitar el portal si todavía no lo ha hecho.

Acerca de esta guía de aprendizaje

En esta tarea, creará una vista, personalizará dicha vista para mostrar los tweets y, a continuación, incorporará dicha vista en la primera página del sitio del Portal del desarrollador .

Antes de empezar, la primera página tiene el aspecto siguiente: Imagen de la primera página

Esta guía de aprendizaje le guiará por los pasos siguientes:
  1. Habilitar el módulo Entidad de soporte de Twitter.
  2. Cree una entidad denominada Twitter para almacenar los tweets.
  3. Añadir elementos de soporte.
  4. Cree una vista de carrusel.
  5. Personalice la vista de carrusel.
  6. Incluir la vista de carrusel en la primera página del Portal del desarrollador.

Habilitar el módulo Media entity twitter

  1. Inicie sesión en el Portal del desarrollador como administrador.
  2. Haga clic en Ampliar > Ampliar e introduzca " media " en el campo Filtro.
  3. En la sección Medios, busque Entidad de Medios Twitter y haga clic en Activar para activar el módulo ' Media entity twitter.

    Página para habilitar el módulo twitter de la entidad multimedia

Cree una entidad denominada Twitter para almacenar los tweets

  1. Vaya a Estructura > Tipos de soporte.
  2. Haz clic en +Añadir tipo de soporte.
  3. En el campo Nombre , especifique Twitter.
  4. En la lista Fuente de medios, seleccione Twitter.

    Fuente de medios de twitter

  5. En la sección de configuración Media source, asegúrese de que el valor ' Whether to use Twitter api to fetch tweets or not ' está establecido en No.
  6. En la sección Mapeo de campos, asegúrese de que las secciones Tweet ID y Twitter user information estén configuradas como - Omitir campo -.

    página para añadir la vista de twitter

  7. Pulse Guardar.
  8. Seleccione Gestionar pantalla en la lista situada junto a Editar para el nuevo tipo de medio Twitter.
  9. En la lista Formato de Tweet URL, seleccione Incorporar a Twitter.
  10. Asegúrese de que los campos Autoría en, Autoría de y Imagen en miniatura estén en la sección Desactivado.

    Captura de pantalla de las opciones de visualización

  11. Pulse Guardar.

Añadir elementos de soporte

  1. Haz clic en Medios > +Añadir medios > Twitter.
  2. En el campo Nombre , especifique un nombre para el soporte, por ejemplo Drupal Tweet.
  3. En el campo Tweet URL, introduzca un URL, por ejemplo, https://twitter.com/drupal/status/966443708160839684.

    página para añadir twitter URL

  4. Pulse Guardar.
  5. Repita estos pasos para añadir más tweets, necesita al menos 2 para hacer una vista de carrusel.

Crear una vista de carrusel

  1. Vaya a Estructura > Vistas.
  2. Haz clic en +Añadir vista.
  3. En el campo Nombre de la vista, introduce un nombre para tu vista, por ejemplo Vista de tweets.
  4. En Ver configuración, seleccione las opciones siguientes:
    • show: Medios de comunicación
    • of type: Twitter
    • sorted by: Sin clasificar
  5. En la sección Configuración de bloques, seleccione la casilla Crear un bloque.
  6. Asegúrese de que el Formato de visualización está seleccionado como Carrusel de clics de campos.

    crear página carrusel

  7. Pulse Guardar y editar.

Personalizar la vista de carrusel

Ahora está en la página donde puede editar la vista.

  1. Si no se encuentra en la página de edición de vistas, vaya a Estructura > Vistas, busque el nombre de la vista que ha creado y haga clic en Editar.
  2. En la sección Título, haz clic en Vista de tweets e introduce <none> en el campo Title, y haz clic en Aplicar.

    para cambiar el nombre de la vista

  3. En la sección Campos, haz clic en Añadir y, a continuación, busca tweet.
  4. Seleccione la casilla Tweet URL y haga clic en Añadir y configurar campos.

    página de añadir campos

  5. En Formato, seleccione Incorporar Twitter y haga clic en Aplicar.

    página para añadir twitter embed formatter

  6. En la sección Campos, haz clic en Medios: Nombre, y haga clic en Eliminar.

    página para eliminar el nombre del medio

  7. En la sección Criterios de filtrado, haga clic en Medios: Publicado (= Verdadero), y haga clic en Eliminar.

    página para eliminar los medios publicados

  8. En la sección Formato, haz clic en Configuración junto a Carrusel de clics.
  9. En la lista Piel principal, seleccione Por defecto.
  10. En la sección Caption Fields, seleccione Media: Tweet URL y las casillas de verificación Override main optionset.
  11. En la sección Opciones superponibles, seleccione las casillas Reproducción automática y Puntos, y haga clic en Aplicar.

    para configurar los cambios de skin

  12. En la sección Página, haga clic en Elementos, establezca el campo Elementos a mostrar en 0 y, a continuación, haga clic en Aplicar.

    página de opciones del localizador

  13. Pulse Guardar.

Incluir la vista en la primera página del Portal del desarrollador

  1. Vaya a Estructura > Páginas.
  2. Busca la etiqueta welcome y haz clic en Editar.
  3. En la sección Variantes, haga clic en Paneles y, a continuación, en Contenido.
  4. Pulse Añadir nuevo bloque.
  5. En la sección Listas(Vistas), seleccione su nuevo bloque.

    añadir vista de tweet al bloque

  6. Desactive la casilla Mostrar título y haga clic en Añadir bloque.
  7. Ahora puedes reorganizar la posición de la vista de tu tweet en la portada.

    Captura de pantalla de la vista de tuits en portada

  8. Pulse Actualizar y guardar.

Qué ha hecho en esta guía de aprendizaje

Puede comprobar que la vista que ha creado aparece en la primera página de la página del sitio.

La nueva portada con el carrusel de tweet

Qué hacer a continuación

Puedes editar tu vista en cualquier momento navegando a Estructura > Vistas y seleccionando tu vista por su nombre. También puedes modificar o eliminar el diseño de la vista en la portada volviendo a la sección de diseño de tu página en Estructura > Páginas.

También puede integrar sus datos de Twitter de forma dinámica. Para obtener más información, consulte los enlaces siguientes.