- Introducción a los componentes principales
- Rutas al éxito
- Biblioteca de componentes
- Versiones de componentes principales
- Introducción
- Los componentes
- Acordeón
- Ruta de navegación
- Botón
- Carrusel
- Contenedor
- Fragmento de contenido
- Lista de fragmentos de contenido
- Descargar
- Incrustar
- Fragmento de experiencias
- Imagen
- Navegación por idiomas
- Lista
- Navegación
- Página
- Visualizador de PDF
- Barra de progreso
- Búsqueda rápida
- Separador
- Compartir en redes sociales
- Texto
- Pestañas
- Teaser
- Título
- Componentes de formulario
- Componentes (v1)
- Desarrollo de
- Desarrollo de componentes principales
- Rutas al éxito
- Tutorial para desarrolladores de WKND
- Personalización de componentes principales
- Instrucciones de los componentes
- Compatibilidad con AMP
- Configuraciones según el contexto
- Inclusión de bibliotecas de cliente
- Capa de datos del cliente de Adobe
- Tipo de archivo del proyecto AEM
Incrustar componente
El componente Integrado de componentes principales permite incrustar contenido externo en una página de contenido AEM.
Uso
El componente Core Component Embed permite al autor del contenido definir el contenido externo seleccionado para que se incruste en una página de contenido AEM. Además, existe una opción para definir el código HTML de forma libre que se va a incrustar.
- Las propiedades del componente se pueden definir en el cuadro de diálogo configurar.
- Los valores predeterminados del componente al agregarlo a una página se pueden definir en el cuadro de diálogo diseño.
Versión y compatibilidad
La versión actual del componente incrustado es v1, que se introdujo con la versión 2.7.0 de los componentes principales en septiembre de 2019 y se describe en este documento.
En la tabla siguiente se detallan todas las versiones compatibles del componente, las versiones AEM con las que son compatibles las versiones del componente y los vínculos a la documentación de versiones anteriores.
| Versión del componente | AEM 6.4 | AEM 6.5 | AEM as a Cloud Service |
|---|---|---|---|
| v1 | Compatible | Compatible | Compatible |
Para obtener más información sobre las versiones y versiones de los componentes principales, consulte el documento Versiones de componentes principales.
Salida de componente de muestra
Para experimentar el componente incrustado, así como ver ejemplos de sus opciones de configuración, así como la salida HTML y JSON, visite la Biblioteca de componentes.
Detalles técnicos
La documentación técnica más reciente sobre el componente incrustado se encuentra en GitHub.
Encontrará más detalles sobre el desarrollo de los componentes principales en la documentación para desarrolladores de los componentes principales.
Configurar cuadro de diálogo
El cuadro de diálogo de configuración permite al autor del contenido definir el recurso externo que se va a incrustar en la página. Primero elija qué tipo de recurso debe incrustarse:
Para cada tipo de incrustable, puede definir la publicidad ID. Esta opción permite controlar el identificador único del componente en el HTML y en la capa de datos.
- Si se deja en blanco, se genera automáticamente una ID única para usted y se puede encontrar inspeccionando la página resultante.
- Si se especifica un ID, es responsabilidad del autor asegurarse de que sea único.
- Cambiar el ID puede tener un impacto en el seguimiento de CSS, JS y de la capa de datos.
URL
La incrustación más sencilla es la URL. Simplemente pegue la dirección URL del recurso que desea incrustar en el campo URL. El componente intentará obtener acceso al recurso y, si uno de los procesadores puede representarlo, mostrará un mensaje de confirmación debajo del campo URL. Si no es así, el campo se marcará por error.
El componente Incrustar se envía con procesadores para los siguientes tipos de recursos:
- Recursos que cumplen con el estándar de oEmbed, incluidos el anuncio de Facebook, Instagram, SoundCloud, Twitter y YouTube
Los desarrolladores pueden agregar procesadores de URL adicionales siguiendo la documentación del desarrollador del componente incrustado.
Insertable
Las incrustaciones permiten una mayor personalización del recurso incrustado, que se puede parametrizar e incluir información adicional. Un autor puede seleccionar elementos incrustables de confianza preconfigurados y el componente se distribuye con un componente incorporado de YouTube incorporado de forma predeterminada.
El campo Incrustable define el tipo de procesador que desea utilizar. En el caso de la incrustación de YouTube, puede definir:
- ID de vídeo: ID de vídeo único de YouTube del recurso que desea incrustar
- Anchura : anchura del vídeo incrustado
- Altura : altura del vídeo incrustado
Otros elementos incrustados oferta campos similares y pueden ser definidos por un desarrollador siguiendo la documentación del desarrollador del componente incrustado.
Las incrustaciones deben habilitarse en el nivel de plantilla mediante el cuadro de diálogo Diseño para que estén disponibles para el autor de la página.
HTML
Puede agregar HTML de forma libre a la página mediante el componente Incrustar.
Las etiquetas no seguras, como las secuencias de comandos, se filtrarán del HTML introducido y no se representarán en la página resultante.
Seguridad
El código HTML que puede introducir el autor se filtra por motivos de seguridad para evitar ataques de secuencias de comandos entre sitios que podrían, por ejemplo, permitir a los autores obtener derechos administrativos.
En general, todas las secuencias de comandos y style los elementos, así como todos on* y style los atributos, se eliminarán del resultado.
Sin embargo, las reglas son más complicadas porque el componente incrustado sigue el conjunto de reglas de filtrado del marco de saneamiento HTML AntiSamy de AEM global, que se puede encontrar en /libs/cq/xssprotection/config.xml. Un desarrollador puede superponerlo para la configuración específica del proyecto, si es necesario.
Encontrará información adicional sobre seguridad en la documentación para desarrolladores de AEM para instalaciones in situ, así como AEM como instalaciones de Cloud Service.
Aunque las reglas del marco de saneamiento AntiSamy se pueden configurar superponiendo /libs/cq/xssprotection/config.xml, estos cambios afectan a todo el comportamiento de HTL y JSP y no sólo al componente principal incrustado.
Diálogo de diseño
El cuadro de diálogo de diseño permite al autor de la plantilla definir las opciones disponibles para el autor del contenido que utiliza el componente Incrustar y los valores predeterminados establecidos al colocar el componente Incrustar.
- Deshabilitar URL : desactiva la opción URL del autor del contenido cuando se selecciona
- Deshabilitar incrustables : desactiva la opción Incrustar para el autor del contenido cuando se selecciona, independientemente de los procesadores incrustables que se permiten.
- Deshabilitar HTML : desactiva la opción HTML para el autor del contenido cuando se selecciona.
- Incrustaciones permitidas: multiselección que define qué procesadores incrustables están disponibles para el autor del contenido, siempre que la opción Incrustar esté activa.