Skip to main content Scroll Top

TheGem: arregla el header y el título de tus posts

  • Home
  • UI
  • TheGem: arregla el header y el título de tus posts
Portada del artículo TheGem, header y título en los posts

Si usas TheGem con Elementor, es probable que el header de tus posts se vea distinto al del resto del sitio: una franja de otro color, el título metido debajo del menú o un menú de demo con enlaces que no son tuyos. Casi siempre las causas son tres, y se corrigen en pocos lugares.

Cómo decide TheGem qué header mostrar

TheGem aplica sus ajustes en tres niveles (TheGem):

  1. Theme Options: el ajuste global, que aplica a todas las páginas y posts.
  2. Single Pages: ajustes por tipo de contenido, por ejemplo los posts.
  3. Page Options: ajustes de cada post o página, dentro de su editor.

La regla práctica: si un post tiene el header en «Enabled» en sus Page Options, ignora lo que definiste más arriba. La propia documentación lo avisa: si tus cambios no se aplican en algunos posts, revisa que su Header esté en «Default Settings» (TheGem).

Header Builder o header integrado

TheGem ofrece dos opciones: un header integrado, que se configura desde Theme Options, y Header Builder, que te deja armar el header con Elementor o WPBakery (TheGem). Para usar uno propio en todos tus posts:

  1. En el administrador, ve a TheGem, Templates Builder, pestaña Header, y crea o importa una plantilla (TheGem).
  2. En Theme Options, entra a Single Pages, al apartado de posts, y en Menu & Header elige «Header Builder» como fuente y tu plantilla (TheGem).
  3. Si en tu versión existe un interruptor para aplicar esos ajustes de header a los posts, actívalo. Sin él, los ajustes del tipo de contenido pueden quedar sin efecto.
  4. Revisa que ningún post tenga un header propio activado en sus Page Options.

Así los posts nuevos heredan el header solos, y no tienes que configurarlos uno por uno.

Header transparente o sólido

Con la transparencia activada, el menú y el header se colocan encima de tu hero o de tu área de título, con fondo transparente (TheGem). Como flota sobre el contenido, no ocupa espacio propio. Si tu título viene de una plantilla de Elementor, su texto puede quedar justo debajo del header.

Tienes dos caminos:

  • Header transparente: agrega relleno superior a la plantilla del título, igual a la altura del header.
  • Header sólido (el que recomiendo para blogs): desactiva la transparencia. El header ocupa su propio espacio y el título queda debajo, sin ajustes extra.

La franja de otro color

TheGem permite controlar la opacidad del header (TheGem). Si el header integrado tiene opacidad media y queda sobre un título de color, el resultado es una franja deslavada, como un blanco al 50% sobre morado. Solución: opacidad en 0 si es transparente, o un header sólido.

El área de título

Las plantillas de título se crean en Templates Builder, Title Area, y se eligen luego en «Select Title Template» (TheGem). Si cambias el relleno de esa plantilla, cambia en todos los posts que la usan. Prueba siempre en escritorio, tablet y móvil: cada uno tiene su propio valor.

Lo que suele fallar

  • Plantillas importadas con contenido de demo. El widget de menú puede apuntar al menú de demo del tema, con enlaces como Demos o Shop. Cámbialo por tu propio menú. Revisa también el buscador: puede traer sugerencias de ejemplo.
  • Configurar post por post. Funciona hoy, pero los posts nuevos no heredan nada.
  • Caché. Después de cambiar ajustes, purga la caché del sitio y recarga con Ctrl+Shift+R.

Checklist

  1. Header Builder activado para el tipo de contenido, no solo para un post.
  2. Ningún post con header propio en Enabled.
  3. Transparente con relleno en el título, o sólido sin relleno extra.
  4. Menú y buscador propios, sin contenido de demo.
  5. Prueba en tres tamaños de pantalla.