Cambiar la clase del body de una página

1 min de lectura

Tutorial válido solo para tiendas CMS Portal Legado.

Los templates utilizados por los layouts de la tienda, de forma predeterminada, no cargan ninguna clase en su elemento <body>.

Vea, por ejemplo, el código del template Department.

${"base64":" ","img":{"width":1360,"height":668,"type":"jpg","mime":"image/jpeg","wUnits":"px","hUnits":"px","length":174357,"url":"https://raw.githubusercontent.com/vtexdocs/help-center-content/refs/heads/main/docs/es/tutorials/storefront/layout/cambiar-la-clase-del-body-de-una-pagina_1.jpg"}}$

Tiene un id, pero no una class.

Sin embargo, al cargar un layout que use ese template, vemos que la clase departamento fue agregada al body de la página.

${"base64":" ","img":{"width":694,"height":240,"type":"jpg","mime":"image/jpeg","wUnits":"px","hUnits":"px","length":93529,"url":"https://raw.githubusercontent.com/vtexdocs/help-center-content/refs/heads/main/docs/es/tutorials/storefront/layout/cambiar-la-clase-del-body-de-una-pagina_2.jpg"}}$

Es decir, el sistema inserta automáticamente esta clase.

Usted puede definir el valor de esta clase en el propio CMS. Para ello, siga estos pasos:

En el Admin VTEX, accede a Storefront > Layout > CMS.
Haga clic en Sites and Channels y entre en el layout cuya clase quiere cambiar.
Cambie el valor del campo Body Class.
Haga clic en el botón Save Layout.