Cómo llevar un metafield de Shopify a la ficha publicada y a su JSON-LD

Rellenas el material de una camiseta en un metafield, guardas, abres la ficha y no está. O está en la ficha y no en el JSON-LD. Las dos cosas son normales en Shopify, porque un dato guardado y un dato publicado viven en sitios distintos: el primero en el panel, el segundo en el HTML que envía tu tienda. Esta guía sigue un valor de un metafield de producto desde su definición hasta el código fuente de la ficha de producto, con las reglas tal como las escribe Shopify, y en cada paso te dice cómo comprobar que ha pasado.

Por dónde pasa un dato, y dónde se pierde

El valor de un metafield de producto recorre cuatro tramos antes de que lo lea una persona o un rastreador:

Los tres primeros deciden si el dato se ve; el cuarto, si va dentro de los datos estructurados. Son independientes: un dato puede verse sin estar en el marcado, y estar en el marcado sin verse, que es justo lo que Google pide evitar: no marques contenido que los lectores de la página no ven.⁠^{[1]Google Search Central. General structured data guidelines}

Paso 1: comprueba la definición y el valor

Un metafield tiene un identificador, que es el espacio de nombres más la clave (custom.material, por ejemplo), un valor y un tipo, que dice qué clase de dato es y cómo se interpreta. Antes del metafield se crea su definición, que es la que da la validación, el editor en el panel y el control de acceso. Shopify ofrece además definiciones estándar para casos comunes, como los ingredientes o las instrucciones de cuidado.⁠^{[2]Shopify.dev. About metafields}

Abre la definición en los ajustes de datos personalizados del panel y apunta tres cosas exactas: el espacio de nombres, la clave y el tipo. Las vas a necesitar en los pasos 3 y 6. Después abre el producto y mira que ese metafield tiene valor: un producto sin valor no imprime nada, por bien conectado que esté.

El espacio de nombres también dice de quién es el dato. Los que crea el comercio usan espacios no reservados, como custom; los de una aplicación van en su espacio reservado, $app, y los de Shopify suelen empezar por shopify--.⁠^{[2]Shopify.dev. About metafields} Si el valor lo escribió una aplicación en su espacio, mira primero si es ella quien lo publica: eso es el paso 4.

Un ajuste que no tienes que tocar: el acceso de la definición a la Storefront API. Shopify dice que ese permiso es para los escaparates headless y personalizados, y que no afecta a las plantillas Liquid: desde Liquid, los metafields son siempre accesibles.⁠^{[2]Shopify.dev. About metafields} Ábrelo solo si tu escaparate es headless.

Paso 2: averigua qué plantilla y qué tema pintan la ficha

Cuando editas una plantilla, el cambio llega a todas las páginas que usan esa plantilla, y solo a ellas.⁠^{[3]Centro de ayuda de Shopify. Templates} Un producto puede tener asignada una plantilla alternativa en lugar de la de producto por defecto: se elige en el propio producto, en el desplegable de plantilla del tema (Theme template en el panel en inglés).⁠^{[3]Centro de ayuda de Shopify. Templates} Esas plantillas se guardan con el nombre product.<sufijo>.json, y puedes ver cualquier producto con una de ellas añadiendo ?view=<sufijo> a su URL.⁠^{[4]Shopify.dev. Alternate templates} Si tocas el código, el objeto template de Liquid devuelve el sufijo de la plantilla que se está usando, o nil si es la de por defecto.⁠^{[5]Shopify.dev. Liquid objects: template}

Mira también qué tema estás editando. Las plantillas JSON son archivos del tema que guardan qué secciones se pintan y con qué ajustes,⁠^{[6]Shopify.dev. JSON templates} así que una conexión hecha en una copia del tema no está en el tema publicado hasta que publiques esa copia.

Antes de seguir, ten claras dos respuestas: qué plantilla usa la ficha que quieres arreglar y si el tema que tienes abierto es el publicado.

Paso 3: conecta el metafield en la plantilla

Hay dos caminos, y el tipo de tu tema decide cuál tienes.

Con una fuente dinámica, desde el editor de temas. Una fuente dinámica conecta un ajuste de una sección o de un bloque con un dato de la tienda, como un atributo del producto o el valor de un metafield.⁠^{[7]Shopify.dev. Dynamic data sources} Hace falta un tema que admita plantillas JSON.⁠^{[8]Centro de ayuda de Shopify. Sections and blocks: use metafields and metaobjects with dynamic sources} Los temas Online Store 2.0 las tienen; los antiguos, que Shopify llama vintage, no.⁠^{[9]Centro de ayuda de Shopify. Theme architecture versions} Para saber cuál tienes, Shopify propone abrir el editor del tema, ir a la plantilla de producto por defecto y mirar si debajo de la lista de secciones aparece el botón para añadir una sección: si aparece, el tema admite secciones en todas las páginas.⁠^{[9]Centro de ayuda de Shopify. Theme architecture versions}

Los pasos, según Shopify: abre el editor del tema, elige la plantilla donde está la sección o el bloque, pulsa el botón de fuente dinámica del ajuste que quieres rellenar, elige el metafield y guarda.⁠^{[8]Centro de ayuda de Shopify. Sections and blocks: use metafields and metaobjects with dynamic sources} Su ejemplo es una tienda de velas que añade un bloque de texto a la sección principal de la plantilla de producto y lo conecta al metafield del tiempo de combustión. Cuando el icono de conexión muestra un +, puedes añadir hasta 20 metafields en una misma plantilla, de uno en uno.⁠^{[10]Centro de ayuda de Shopify. Displaying metafields on your online store}

No todos los metafields encajan en todos los ajustes. Esta es la compatibilidad que publica Shopify, resumida:⁠^{[7]Shopify.dev. Dynamic data sources}

Dos consecuencias prácticas. Un texto de varias líneas no entra en un ajuste de texto simple: necesita uno de texto enriquecido (richtext). Y lo que no está en la tabla, como un booleano o un JSON, no se conecta desde el editor: para los tipos que el editor no admite, Shopify remite a editar el código del tema.⁠^{[7]Shopify.dev. Dynamic data sources}⁠^{[8]Centro de ayuda de Shopify. Sections and blocks: use metafields and metaobjects with dynamic sources}

Con Liquid, en el código del tema. Es el camino de los temas vintage, de los tipos sin ajuste compatible y de quien quiere controlar el HTML exacto. Shopify avisa de que edites el código del tema solo si tienes experiencia programando.⁠^{[10]Centro de ayuda de Shopify. Displaying metafields on your online store} En Liquid, un metafield se lee con product.metafields.namespace.key, y su propiedad value devuelve el dato con el formato de su tipo: una cadena para el texto, un número para los números, un objeto de medida para el peso.⁠^{[11]Shopify.dev. Liquid objects: metafield} Un ejemplo ficticio, para la sección de producto:

{% if product.metafields.custom.material %}
  <p class="material">Material: {{ product.metafields.custom.material.value }}</p>
{% endif %}

Tres detalles de la referencia de Liquid que ahorran una tarde. Si la clave de tu metafield es size, first o last, léela con corchetes (product.metafields.custom["size"]): con punto, si el metafield no existe, Liquid aplica el filtro del mismo nombre y size devuelve cuántos metafields hay en vez de nada. Los tipos antiguos integer, json_string y string no tienen estas propiedades ni admiten los filtros de metafields.⁠^{[11]Shopify.dev. Liquid objects: metafield} Y si no quieres escribir el HTML a mano, el filtro metafield_tag genera un elemento distinto según el tipo, como un <time> para una fecha.⁠^{[12]Shopify.dev. Liquid filters: metafield_tag}

Por cualquiera de los dos caminos, Liquid se resuelve en el servidor: Shopify recomienda pintar el contenido inicial con Liquid y HTML, de modo que el servidor responde con el HTML completo y el navegador lo muestra en cuanto lo recibe.⁠^{[13]Shopify.dev. Render essential content in Liquid and HTML, not JavaScript} Es renderizado del lado del servidor, y por eso un valor impreso así está en el código fuente que descarga cualquier rastreador.

Paso 4: si el dato lo publica una aplicación, enciende su app embed

Una aplicación entra en tu tema de tres maneras: como app block, que colocas en una sección; como app embed, que añade código sin un sitio fijo en la página; o inyectando código directamente en el tema.⁠^{[14]Centro de ayuda de Shopify. Extend your theme with apps} De los dos tipos de bloque, el que va a la cabecera de la página es el app embed: Shopify inserta los app embeds antes del cierre de </head> o de </body>, y después de instalar la aplicación vienen desactivados: se activan en el editor de temas, en la configuración del tema, apartado «App embeds».⁠^{[15]Shopify.dev. Configure theme app extensions}

Al activarlo, fíjate en dos cosas que la ayuda de Shopify deja por escrito. Si vendes en varios mercados y no eliges ninguno en el desplegable del editor, el cambio se aplica a la configuración por defecto de la tienda. Y si cambias el tema publicado, las aplicaciones que activaste en el anterior no estarán activas en el nuevo: hay que volver a encenderlas.⁠^{[14]Centro de ayuda de Shopify. Extend your theme with apps} Los app embeds funcionan con cualquier versión de tema;⁠^{[14]Centro de ayuda de Shopify. Extend your theme with apps} los app blocks, solo con temas compatibles.⁠^{[14]Centro de ayuda de Shopify. Extend your theme with apps}

Si prefieres comprobarlo en el código del tema: un app embed se añade a config/settings_data.json la primera vez que se activa, y si después se desactiva, sigue ahí con "disabled": true.⁠^{[15]Shopify.dev. Configure theme app extensions}

Paso 5: averigua de dónde sale tu JSON-LD

El marcado Product de una ficha de Shopify puede salir de varios sitios, y conviene saber de cuál antes de preguntarse por qué no lleva tu metafield:

• El tema. En los dos temas de Shopify cuyo código leímos en GitHub el 7 de octubre de 2026, el marcado de producto lo escribe la sección de producto con una sola línea: product | structured_data en main-product.liquid de Dawn y closest.product | structured_data en product-information.liquid de Horizon.⁠^{[16]Shopify, repositorio en GitHub. Dawn: sections/main-product.liquid}⁠^{[17]Shopify, repositorio en GitHub. Horizon: sections/product-information.liquid}
• Una aplicación, con un app embed en el head⁠^{[15]Shopify.dev. Configure theme app extensions} o con código que ha inyectado en el tema.⁠^{[14]Centro de ayuda de Shopify. Extend your theme with apps}
• JavaScript, después de cargar la página. Google avisa de que el marcado Product generado así puede hacer que los rastreos de Shopping sean menos frecuentes y menos fiables, un problema para el precio y la disponibilidad.⁠^{[18]Google Search Central. Generate structured data with JavaScript}

El filtro structured_data convierte el producto en un Product de Schema.org si no tiene variantes y en un ProductGroup si tiene una o más. El ejemplo de su documentación incluye la marca, la categoría, la descripción, la imagen, el nombre, la oferta y la URL, y la documentación no menciona los metafields en ningún momento.⁠^{[19]Shopify.dev. Liquid filters: structured_data} Así que no des por hecho que tu metafield de material va dentro: lo que lo demuestra es el bloque publicado, y lo miras en el paso 6.

Si quieres el dato dentro del marcado, alguien tiene que escribirlo: tu tema, en Liquid, o una aplicación. En Schema.org, material es una propiedad de Product para el material del que está hecho algo, como cuero, lana, algodón o papel.⁠^{[20]Schema.org. material} Un fragmento ficticio de un marcado escrito a mano, no un marcado completo, porque le faltan la oferta, las imágenes y lo demás:

<script type="application/ld+json">
  {
    "@context": "https://schema.org",
    "@type": "Product",
    "name": {{ product.title | json }},
    "material": {{ product.metafields.custom.material.value | json }}
  }
</script>

El filtro json pone las comillas y escapa las que haya dentro del valor,⁠^{[21]Shopify.dev. Liquid filters: json} así que una comilla en el texto del metafield no rompe el bloque. Dos condiciones antes de copiarlo. Si tu tema ya pinta su propio Product con structured_data, un segundo bloque como este describe el mismo producto dos veces; cómo se relacionan dos nodos lo explica la entrada sobre el @id en JSON-LD. Y el material tiene que verse también en la ficha, con el bloque del paso 3: Google pide que no marques contenido que el lector no ve.⁠^{[1]Google Search Central. General structured data guidelines}

Paso 6: compruébalo en el HTML publicado

Abre la URL pública de la ficha, no la vista previa del editor, que enseña el tema que tienes abierto. Si el producto usa una plantilla alternativa, es esa URL la que cuenta (paso 2). Pide el código fuente, con «Ver código fuente de la página» o view-source: delante de la URL, no el inspector, que enseña la página después de ejecutar JavaScript. Para guardar una copia y compararla después vale una línea en la terminal, como curl -s -o ficha.html https://tu-tienda.example/products/ejemplo (la URL es ficticia). Busca en ese código:

1. El valor literal del metafield. Si aparece, viaja en el HTML que envía el servidor. Si solo lo ves en la página y no aquí, lo ha puesto JavaScript.
2. application/ld+json. Cuenta cuántos bloques hay y qué @type declara cada uno.
3. Tu valor dentro de esos bloques. Si lo buscabas en el marcado y no está, vuelve al paso 5.
4. El código de la aplicación, si la hay, antes de </head> o de </body>.⁠^{[15]Shopify.dev. Configure theme app extensions}

Repite la comprobación cada vez que cambies de tema, de plantilla o de aplicación, y cuando otra herramienta escriba en el mismo metafield, que es el caso de la sobrescritura de campos. Para ver lo que pinta el renderizador de Google, los pasos están en qué ve un rastreador de IA en tu tienda; para revisar el marcado en sí, en auditar los datos estructurados de una ficha. Y conviene no confundir las dos cosas: validar el marcado no es lo mismo que verificar que se publica, que es lo que hace la verificación de publicación.

Lo que hemos probado

Probado en: tienda, tema y versión, fecha.

Los límites, tal cual: una tienda, un tema y una fecha. Los temas cambian de versión, y lo que hace un tema concreto no dice lo que hacen los demás.

Para seguir

La ruta de publicación por plataforma ordena el resto de términos, y la guía del widget a la página publicada hace este mismo recorrido en BigCommerce.

Clione sigue en Shopify el camino de los pasos 4 y 5: escribe sus señales en metafields y las pinta con dos app embeds, «Clione SEO», con el grafo JSON-LD en el head, y «Clione FAQ», con el acordeón de preguntas en el body, que se activan desde su panel con un clic. Su nodo Product lleva un @id estable y se coloca junto al del tema en lugar de duplicarlo. Y después hace el paso 6 por ti: lee la ficha publicada y te dice, señal por señal, qué se publicó y qué no se pudo leer en la tienda.