Saltar al contenido principal

SEO y metadatos

Que tu sitio esté online no significa que Google lo encuentre. El SEO (Search Engine Optimization) es lo que hace la diferencia entre aparecer en los resultados o quedar invisible.

Cada página del framework tiene una sección SEO para configurarlo sin tocar código.

El nombre de tu sitio​

Antes de afinar página por página, revisa cómo se llama tu sitio: es lo que cierra el título de todas las páginas. Si tu página se llama "Inicio", la pestaña del navegador dirá Inicio - <nombre del sitio>.

Se edita en Páginas Web → Datos del sitio:

CampoDónde se ve
Nombre del sitioAl final del título de cada página, y en el pie y el menú por defecto
Título por defectoEn la portada y en cualquier página que no traiga el suyo
DescripciónLo que muestran Google y WhatsApp cuando no hay una descripción propia

El diálogo te muestra cómo se verá la pestaña mientras escribes.

Es distinto del nombre del panel

El nombre que aparece arriba a la izquierda del panel de administración se configura en Apariencia y no es el mismo: uno lo ves tú al administrar, el otro lo ven tus visitantes. Pueden coincidir, pero se cambian por separado.

Si ves un nombre que no reconoces

En instalaciones hechas a partir de otro proyecto, este dato se queda con el nombre anterior hasta que lo cambias aquí. Cambiarlo actualiza todas las páginas de inmediato, sin volver a generarlas.

Dónde configurarlo​

Al crear o editar una página en el generador, busca el acordeón "SEO y redes sociales". Se despliega y encontrarás:

Para buscadores​

  • Meta Title — el título que ve Google en los resultados y en la pestaña del navegador. Debería tener 50-60 caracteres. Ejemplo: Camisa azul de algodón - Talla M | Tu Tienda.
  • Meta Description — el resumen que aparece debajo del título en Google. 150-160 caracteres. Ejemplo: Camisa de algodón cuello Mao, disponible en varios colores. Envío gratis en compras sobre $30.000.

Para redes sociales (Open Graph)​

Cuando alguien comparte tu enlace en WhatsApp, Facebook, LinkedIn, Twitter/X, aparece una tarjeta con imagen y descripción. Estos son los datos que la controlan:

  • OG Title — título de la tarjeta (puede ser el mismo que el Meta Title).
  • OG Description — descripción de la tarjeta.
  • OG Image — imagen de la tarjeta. Tamaño recomendado: 1200×630 px. Si no la defines, se usa una por defecto (ver Apariencia).
  • OG Type — normalmente website para páginas comunes o article para artículos de blog.

Valores dinámicos con datos de la tabla​

Si tu página muestra un producto y quieres que el <title> sea el nombre del producto, puedes usar las mismas etiquetas {{campo}} en el Meta Title:

Meta Title: {{nombre}} - $" + {{precio}} + " | Mi Tienda

Así cada producto tendrá su propio título único, algo que Google valora mucho.

Lo mismo aplica para Meta Description y OG Image.

Valores por defecto​

Si no configuras nada en una página, se usan los valores por defecto que están en Configuración → Apariencia → SEO:

  • Meta Title por defecto (ej. "Mi Empresa").
  • Meta Description por defecto.
  • OG Image por defecto.

Recomendación: define buenos defaults una vez y sobreescríbelos página por página solo cuando tenga sentido.

URL amigable (slugs)​

La URL misma es un factor de SEO. Prefiere:

  • Bien: /producto/camisa-azul-algodon — descriptivo, con palabras clave.
  • Mal: /producto?id=5 — genérico, sin significado.

Para lograr URLs amigables, agrega una columna slug a tu tabla (tipo texto, único), y usa esa columna en las URLs. La configuración de rutas amigables depende del .htaccess — habla con tu equipo técnico si necesitas rutas específicas.

Sitemap XML​

El framework genera automáticamente un sitemap que lista todas tus páginas públicas y sus URLs. Está disponible en:

https://tu-sitio.com/sitemap.xml

Envíalo a Google Search Console para que Google lo procese y encuentre todas tus páginas más rápido.

robots.txt​

Un archivo robots.txt en la raíz de tu sitio le dice a los buscadores qué no indexar. Ejemplo típico:

User-agent: *
Disallow: /cms/
Disallow: /portal/
Sitemap: https://tu-sitio.com/sitemap.xml

Bloquea el CMS y los portales privados; deja el resto abierto.

Optimización de imágenes​

Además de comprimir (que el framework hace por ti), asegúrate de:

  • Poner alt descriptivo en todas las imágenes: <img src="{{foto}}" alt="{{nombre}} - vista frontal">. Google lo lee.
  • Usar el loading="lazy" en imágenes que no estén "above the fold" (visibles al cargar). Acelera la carga.

Velocidad de carga​

Google penaliza sitios lentos. Consejos:

  • Menos plugins JavaScript pesados en las páginas públicas.
  • Imágenes comprimidas.
  • Usa el sistema de caché de páginas que trae el framework (activo por defecto).

Datos estructurados (Schema.org)​

Para casos avanzados (productos con precio y stock que Google muestra directo en los resultados con estrellas), consulta con tu equipo técnico sobre agregar JSON-LD con datos Schema.org en el HTML de la página.

Verificación con Google Search Console​

Una vez publicado tu sitio:

  1. Da de alta el dominio en Google Search Console.
  2. Verifica la propiedad (con un archivo, DNS o meta tag).
  3. Envía el sitemap.
  4. En unos días verás qué páginas indexó y con qué queries te encuentran.

¿Qué sigue?​

Con estas páginas de guía y las páginas públicas activas, ya tienes el sitio funcionando. Ahora: