Cómo utilizar bloques de datos remotos para mostrar datos de Google Sheets en WordPress – Speckyboy

La publicación de contenido dinámico es uno de los principales puntos de venta de los sistemas de gestión de contenidos (CMS) como WordPress. El contenido puede cambiar según la entrada del usuario u otras condiciones. Esto es útil para todo, desde sitios web de comercio electrónico hasta publicaciones en línea. También existen casos de uso sencillos, incluso para sitios web de folletos.

Pero, ¿qué sucede si algunos de sus datos críticos se encuentran en otro lugar? Es posible que haya un complemento que se integre con el servicio de terceros que está utilizando. O puede crear una solución personalizada desde cero.

este bloque de datos remoto Los complementos están diseñados para facilitar la obtención de material de fuentes externas. Se integra con servicios como Airtable, Google Sheets y Shopify de forma inmediata. También existe un marco para conectarse a otros servicios a través de HTTP. Una vez conectado, puede mostrar datos a través de bloques de WordPress y personalizarlos usando patrones.

¿Cómo funciona? Probemos el complemento con un proyecto de muestra. Lo guiaremos en cada paso y veremos qué podemos lograr juntos. ¡Aquí vamos!

Proyecto de muestra: visualización de Google Sheets en WordPress

Para probar la funcionalidad del bloque de datos remoto, utilizaremos este complemento para obtener datos de una hoja de cálculo de Google. Este archivo contiene información de contacto para el directorio de empleados.

El proceso incluye instalar el complemento, conectarse a Google Cloud Platform (la parte que lleva más tiempo) y usar los bloques incluidos para mostrar el material en nuestro sitio web. todavía necesitamos Crear un patrón de bloques para diseñar nuestros datos.

Paso 1: instale el complemento del bloque de datos remoto

El primer paso es instalar la última versión del bloque de datos remoto en su sitio de WordPress:

1. Inicie sesión en su sitio de WordPress y navegue hasta Complementos > Agregar nuevo complemento.
2. buscar”bloque de datos remoto”Y busque el complemento en la lista proporcionada.
3. Instalar y activación complemento.

Volveremos a la configuración del complemento más adelante en el tutorial.

Paso 2: configurar Google Cloud Platform

Todavía tenemos trabajo por hacer antes de conectar Google Sheet a WordPress. Le mostraremos los pasos a continuación. El equipo de bloques de datos remotos también compiló un guía útil para este proceso.

2.1 Crear un proyecto en Google Cloud Platform

Primero, visite Plataforma en la nube de Google Crea un nuevo proyecto.

pista: Si necesitas ayuda, Google tiene Guía de creación de proyectos Puedes usarlo como referencia. Google le pedirá el nombre del proyecto y el recurso principal. Llamaremos a nuestro proyecto. Prueba remota de bloques de datos y deje el recurso principal en blanco.

2.2 Conéctese a Google Sheets y a la API de Google Drive

Después de crear el proyecto, debemos habilitar Hojas de cálculo de Google y Google Drive abeja. He aquí cómo:

1. Utilice el menú de la izquierda para navegar hasta API y servicios habilitados Página.
2. Hacer clic Habilitar API y servicios botón.
3. Uno a la vez, busca y agrega Hojas de cálculo de Google y Google Drive abeja.

2.3 Habilitar API de IAM

Nuestro proyecto también necesita acceso a la API de IAM porque maneja la autenticación. Hacer clic Habilitar API botón.

2.4 Establecer una cuenta de servicio de Google Cloud Platform

Después de eso, configuraremos una cuenta de servicio para el proyecto. Ir a Consola de Google Cloud sitio web.

1. Utilice el menú de la izquierda para navegar hasta cuenta de servicio Página.
2. Hacer clic Crear cuenta de servicio botón.
3. Proporcione su cuenta de servicio con Nombre luego haga clic continuar.
4. superior Permisos pantalla, seleccione dueño y haga clic continuar botón.
5. este director de escuela La pantalla puede dejar en blanco. Hacer clic completo.
6. Una vez completado, será redirigido a cuenta de servicio página donde aparecerá su nueva cuenta.

2.5 Generar credenciales JSON

1. En su cuenta de servicio, haga clic en el botón Opciones (⋮) y seleccione Administrar claves.
2. superior botón página, haga clic Agregar nueva clave botón y seleccione JSON como formato. Hacer clic crear botón.
3. Google Cloud Platform Generar JSON puede Descarga a tu dispositivo.

Importante: Tenga en cuenta la dirección de correo electrónico generada asociada con su cuenta de servicio: ¡la necesitará!

Paso 3: comparta su hoja de cálculo a través del correo electrónico de su cuenta de servicios de Google

¿Recuerda la dirección de correo electrónico que generamos anteriormente para asociarla con su cuenta de servicios de Google? Lo necesitamos aquí.

iremos a Hojas de cálculo de Google Queremos conectarnos a nuestro sitio web y Compártelo con dirección de correo electrónico.

Paso 4: copie el ID de la hoja de cálculo de Google

A continuación, encontraremos el ID de la hoja de cálculo de Google. Necesitamos este detalle para conectarlo a nuestro sitio web. El ID está en la URL de la hoja de trabajo de la siguiente manera:

https://docs.google.com/spreadsheets/d/test_spreadsheet_id/edit?gid=0#gid=0

Estamos mirando el área en negrita de arriba (test_spreadsheet_id). Copiaremos nuestra identificación y la guardaremos en algún lugar conveniente para el siguiente paso.

Paso 5: crear fuentes de datos en el bloque de datos remoto

Hemos terminado con Google y vamos a nuestro sitio web. Navegar a Configuración > Bloque de datos remoto Conéctese a nuestra hoja de cálculo de Google.

1. En la página de configuración, haga clic en Conectar nuevo botón.
2. elegir Hojas de cálculo de Google desde el menú.
3. Dale un nombre a tu fuente (elegimos Directorio de empleados).
4. Pegue el contenido del archivo JSON Generado en el paso 2.
5. Hacer clic continuar botón.

superior alcance En la pantalla, se nos pide que seleccionemos una hoja de cálculo de un menú. El nuestro está en la lista. Lo seleccionaremos y la hoja que queremos usar (Hoja1) y haremos clic continuar botón.

En la pantalla de Bloques seleccionaremos Registrar bloques automáticamente opción y haga clic ahorrar botón.

Paso 6: inserte el bloque de datos remoto en la página

Ahora es el momento de agregar el bloque de datos remoto a nuestra página.

1. El bloque de datos remoto utiliza el nombre de la fuente de datos que proporcionamos en el paso anterior. Por tanto, buscaremos “Directorio de empleados” y agregue el bloque a la página. Hay algunas opciones, pero elegiremos Directorio de empleados/bucle de hoja 1. Esta opción actualizará automáticamente los datos cuando editemos la hoja de cálculo de Google.
2. El siguiente paso es poner nuestros datos remotos en modo de bloqueo. Entonces elegiremos Seleccionar patrón y haga clic en la única opción disponible.

Tenga en cuenta que el esquema incluido no formatea los datos en una tabla ni en nada parecido a una hoja de cálculo. Está bien, porque creamos un conjunto de columnas para almacenar los datos.

Arrastre varios puntos de datos (nombre, apellido, título, extensión de archivo) a bloque de columnas Nos dio un mejor diseño. También podemos utilizar el editor de bloques para realizar más mejoras.

Todos los puntos de datos apuntan a WordPress

Obtener información de fuentes de terceros es un desafío. Esto también es necesario porque guardamos cosas en todas partes. Los bloques de datos remotos ayudan al proporcionar un marco sobre el que podemos construir.

Hay mucho potencial aquí y podemos imaginar que este complemento se expandirá en el futuro. Quizás podría usarse con más servicios listos para usar. También puede incluir más modos de bloqueo para diseñar fácilmente tipos de datos comunes.

Este complemento también puede ayudar a los propietarios de sitios web sin conocimientos técnicos. Por ejemplo, imagine actualizar la página del menú de un restaurante editando un documento de Google u otro documento basado en la nube. No tienen que tocar WordPress en absoluto. Esto eliminará su curva de aprendizaje y facilitará nuestros requisitos de soporte.

Sin embargo, esto es sólo el comienzo. Los bloques de datos remotos ya tienen muchos usos especializados y habrá muchos más en el futuro. ¡Descarga el complemento y experimenta!