Códigos en head y body: agregalos y personalizá tu sitio Nova

Algunos servicios externos te piden pegar un código en tu sitio: verificaciones de Google o Meta, herramientas de analítica, chats, widgets. En Medios CMS los cargás como códigos y se insertan en todas las páginas.

Es una función para personas con conocimientos técnicos: un código mal pegado puede romper cómo se ve o funciona tu sitio. Si no estás seguro, pedí ayuda.

Agregá un código

1. Entrá a Configuración › Head / Body y tocá + Agregar código.
2. Poné un Nombre para reconocerlo (es de uso interno), por ejemplo «Verificación de Search Console».
3. Pegá el código en Head (se ubica antes del cierre de la etiqueta </head>) o en Body (antes del cierre de </body>), según lo que te pida el servicio.
4. Tocá Guardar.

Activá, desactivá, editá o borrá

Cada código aparece en la lista con sus botones:

• Desactivar (pausa): el código deja de insertarse en el sitio, pero queda guardado. Se ve atenuado en la lista. Para volver a usarlo, tocá Activar (play).
• Editar (lápiz): cambiás el nombre o el código.
• Eliminar (tacho): lo borrás y deja de insertarse en el sitio.

Desactivar es útil para probar: si algo anda raro en tu sitio después de agregar un código, lo pausás y ves si se arregla.

Personalizá tu sitio con códigos listos para copiar

Si tu sitio usa el nuevo motor Nova, podés ocultar o cambiar algunos elementos pegando un código de estilos en Head. Estos códigos están pensados para las apariencias Luna y Astra.

Para usar cualquiera:

1. Entrá a Configuración › Head / Body y tocá + Agregar código.
2. Poné un nombre que te ayude a reconocerlo, por ejemplo «Ocultar fecha».
3. Copiá el código completo (con las líneas <style> y </style>) y pegalo en Head.
4. Tocá Guardar y recargá tu sitio para ver el cambio.

Podés pegar varios juntos en un mismo código o cargarlos por separado, así los desactivás de a uno cuando quieras. También funcionan en Body o en un bloque Código HTML de Diseño, pero en ese caso solo se aplican en las páginas donde está ese bloque.

Ocultar la fecha en la portada y los listados

Saca la fecha de las tarjetas de notas en la portada y en los listados de categoría.

<style>
/* Oculta la fecha en portada y listados */
.card-noticia .card-fecha{display:none !important}
</style>

Qué podés cambiar: nada, se pega tal cual.

Ocultar la fecha dentro de la nota

Saca la fecha que aparece debajo del título cuando abrís una nota.

<style>
/* Oculta la fecha dentro de la nota */
.articulo-byline .articulo-fecha{display:none !important}
</style>

Qué podés cambiar: nada, se pega tal cual.

Así se ve la nota con la fecha:

Y así queda con el código:

Ocultar el autor

Saca el nombre del autor de las tarjetas (portada y listados) y de la nota.

<style>
/* Oculta el autor en portada, listados y dentro de la nota */
.card-noticia .card-autor,
.articulo-byline .articulo-autor{display:none !important}
</style>

Qué podés cambiar: si lo querés ocultar en un solo lugar, borrá una de las dos líneas del medio. La primera es para las tarjetas y la segunda para la nota. Si borrás la segunda, borrá también la coma del final de la primera.

Cambiar el color de fondo de las secciones con Tono invertido

Cambia el color de fondo de las secciones de Diseño que tienen activado Tono invertido.

<style>
/* Cambia el fondo de las secciones con "Tono invertido" (cambiá el color en las 3 apariciones) */
section.seccion.tono-invertido,
section.seccion.tono-invertido::before{background-color:#1e5fbf !important}
section.seccion.tono-invertido::before{box-shadow:0 0 0 100vmax #1e5fbf !important}
</style>

Qué podés cambiar: reemplazá #1e5fbf por el color que quieras (código hexadecimal, rgb o nombre en inglés). Cambialo en los 3 lugares donde aparece: la sección, la línea con ::before y la sombra (box-shadow), que es la que pinta la banda de borde a borde. Si cambiás solo uno, la banda queda con dos colores.

Elegí un tono oscuro, porque el texto de esas secciones es blanco. Con colores muy oscuros o muy fuertes, algunas etiquetas de categoría pueden costar leerse, así que conviene un color que contraste bien.

Así se ve una sección con Tono invertido:

Y así queda con el código:

Ocultar la categoría

Saca la etiqueta de categoría de las tarjetas y la que está arriba del título de la nota.

<style>
/* Oculta la categoría en las tarjetas y en la nota */
.card-noticia .card-categoria,
.articulo-encabezado .articulo-categoria{display:none !important}
</style>

Qué podés cambiar: si la querés ocultar solo en las tarjetas o solo en la nota, borrá la otra línea (y la coma si queda sobrando).

Así se ven las tarjetas con la categoría:

Y así quedan con el código:

Ocultar el copete en la portada

Saca el copete (la bajada) de las tarjetas en la portada y los listados. Dentro de la nota se sigue viendo.

<style>
/* Oculta el copete (bajada) en portada y listados */
.card-noticia .card-copete{display:none !important}
</style>

Qué podés cambiar: nada, se pega tal cual.

Así se ve la tarjeta principal con el copete:

Y así queda con el código:

Si un código no hace lo que esperabas, desactivalo desde la lista y tu sitio vuelve a verse como estaba.