Plugin Lueira Embed: referencia técnica

Referencia técnica del plugin "Lueira Embed" para WordPress: parámetros completos del shortcode, módulo de alquiler, estructura de URLs, personalización CSS, atributos sandbox, requisitos y changelog.

En esta página
  1. Características del plugin Lueira Embed
  2. Instalación manual del plugin (sin pasar por el modal)
  3. Configuración avanzada del plugin
  4. Shortcode generado según el tipo de producto
  5. Parámetros del shortcode
  6. Ejemplos de shortcode con parámetros adicionales
  7. Estructura de las URLs
  8. Personalización con CSS
  9. Clases CSS disponibles
  10. Compatibilidad
  11. Seguridad: atributos sandbox del iframe
  12. Requisitos del plugin
  13. Historial de versiones

Esta guía es la referencia técnica del plugin "Lueira Embed" para WordPress. Está pensada para personas con conocimientos de WordPress o HTML que quieran ir más allá del modal "Código de inserción": personalizar el botón, aplicar clases CSS, consultar todos los parámetros del shortcode o entender la estructura de las URLs.
​

👉 Si solo necesitas insertar un producto rápidamente, mejor empieza por la guía visual: Cómo insertar tus actividades de Lueira en tu web Wordpress.
​

Características del plugin Lueira Embed

  • Integración sencilla: inserta productos de Lueira mediante un Shortcode sin necesidad de conocimientos técnicos.

  • Diseño adaptable: el modal se ajusta automáticamente a cualquier dispositivo.

  • Accesible y seguro: cumple con los estándares ARIA y usa un iframe protegido (sandboxed).

  • Personalizable: permite modificar el texto del botón y aplicar estilos propios.

  • Configuración simple: incluye opciones de idioma y ajustes desde el panel de WordPress.

Instalación manual del plugin (sin pasar por el modal)

  1. Sube los archivos a la carpeta /wp-content/plugins/lueira/

  2. Activa el plugin desde el menú Plugins en tu panel de WordPress.

  3. (Opcional) Accede a Ajustes > Lueira Embed para configurar la URL de tu centro en Lueira.

Configuración avanzada del plugin

Accede a Ajustes > Lueira Embed en el panel de WordPress para configurar:

Shortcode generado según el tipo de producto

El modal "Código de inserción" del admin genera un shortcode adaptado al tipo de producto. Estas son las formas exactas que produce:

Tipo de producto

Shortcode generado

Embed URL del iframe

Clase grupal

[lueira id="{id}" module="school" product_type="group"]

{host}/embed/school/group/{id}

Clase privada

[lueira id="{id}" module="school" product_type="private"]

{host}/embed/school/private/{id}

Pack de clases grupales

[lueira id="{id}" module="school" product_type="group-package"]

{host}/embed/school/group-package/{id}

Producto de alquiler

[lueira id="{id}" module="rent"]

{host}/embed/rent/product/{id}

Pack de alquiler (bundle)

[lueira id="{id}" module="rent" product_type="bundle"]

{host}/embed/rent/bundle/{id}

⚠️ Caso especial — productos de alquiler individuales: el shortcode generado no incluye el parámetro product_type. El plugin asume product por defecto cuando se usa module="rent" sin tipo explícito. Solo los packs de alquiler (bundles) llevan product_type="bundle".
​

Parámetros del shortcode

El modal solo expone los parámetros obligatorios. Si quieres personalizar más (texto del botón, idioma, clases CSS), edita el shortcode después de copiarlo añadiendo los parámetros opcionales:

Parámetro

Obligatorio

Default

Descripción

id

Sí

-

El ID del producto que se va a insertar

module

Sí

-

"school" (clases / packs de clases) o "rent" (alquiler / packs de alquiler)

product_type

Depende

"product" si module="rent"

"private", "group", "group-package" para school; "bundle" para packs de alquiler. Para productos de alquiler individuales se puede omitir.

lang

No

"es"

Código de idioma para mostrar el contenido localizado. El modal no añade este parámetro; tienes que ponerlo tú a mano si lo necesitas.

button_text

No

"View activity"

Texto que se mostrará en el botón del shortcode

class

No

-

Clases CSS adicionales para el botón

Ejemplos de shortcode con parámetros adicionales

Clase privada con texto de botón personalizado:

[lueira id="456" module="school" product_type="private" button_text="View Activity"]

Pack de clases grupales con clase CSS propia e idioma forzado a español:

[lueira id="789" module="school" product_type="group-package" lang="es" class="btn-primary" button_text="View Activity"]

Estructura de las URLs

URLs que genera el modal "Código de inserción" (pestaña iFrame):

El modal del admin genera URLs sin prefijo de idioma. El formato es:

{host_url}/embed/{module}/{product_type}/{activity_id}

Excepción: para productos de alquiler individuales el segmento del tipo es literal product, así: {host_url}/embed/rent/product/{id}.

​

URLs que genera el plugin de WordPress a partir del shortcode:

El plugin construye URLs con el siguiente formato, añadiendo el segmento de idioma si lo defines:

{host_url}/{lang}/embed/{module}/{product_type}/{activity_id}

Ejemplos:

Personalización con CSS

El plugin incluye estilos CSS predeterminados para el modal y el botón. Puedes personalizar su apariencia de las siguientes formas:

  • Añadiendo clases CSS personalizadas mediante el parámetro class del shortcode.

  • Sobrescribiendo los estilos del plugin desde tu tema de WordPress.

  • Modificando directamente el archivo modal.css incluido en el plugin.

Clases CSS disponibles

Clase

Elemento

.lueira-embed-button-wrapper

Contenedor del botón

.lueira-embed-trigger

Botón que activa el modal

.lueira-embed

Contenedor principal del modal

.lueira-embed__backdrop

Fondo o superposición del modal

.lueira-embed__dialog

Cuadro de diálogo del modal

.lueira-embed__close

Botón para cerrar el modal

Compatibilidad

  • Navegadores modernos: Chrome, Firefox, Safari y Edge.

  • Diseño adaptable a móviles (responsive).

  • Cumplimiento de accesibilidad con atributos ARIA.

Seguridad: atributos sandbox del iframe

El iframe incrustado por el plugin incluye los siguientes atributos de seguridad sandbox:

  • allow-same-origin

  • allow-scripts

  • allow-popups

  • allow-forms

  • allow-top-navigation-by-user-activation

Requisitos del plugin

  • WordPress 5.0 o superior

  • PHP 7.4 o superior

Historial de versiones

Versión 1.0.0

  • Implementación del shortcode con modal superpuesto

  • Página de configuración en el administrador

  • Diseño responsive

  • Soporte multidioma

  • Iframe con sandbox de seguridad

​

Si tienes dudas sobre cómo configurar los iframes en tu web, ¡no dudes en contactarnos!