Show Menu
TEMAS×

Guía de componentes de comunidad

La guía de componentes comunitarios es una herramienta de desarrollo interactiva para el marco de componentes sociales (SCF) . Proporciona una lista de los componentes de comunidades AEM disponibles o de las funciones más complejas creadas con varios componentes.
Junto con la información básica de cada componente, la guía permite experimentar con el funcionamiento de los componentes y funciones de SCF y de cómo se pueden configurar o personalizar.
Para obtener información sobre los aspectos básicos de desarrollo relacionados con cada componente, consulte Funciones y elementos esenciales .

Introducción

La guía está pensada para utilizarse en instalaciones de desarrollo de instancias de autor (localhost:4502) y publicación (localhost:4503).
Para acceder al sitio de componentes de comunidad, vaya a
Las interacciones con los componentes de Comunidades variarán según:
  • El servidor (autor o publicación)
  • Indica si el visitante del sitio ha iniciado sesión o no
  • Si ha iniciado sesión, los privilegios asignados al miembro
  • Indica si el SRP predeterminado, JSRP , está en uso o no
Al crear, para entrar en el modo de edición, inserte editor.html o cf# como el primer segmento de ruta después del nombre del servidor:
En el modo de edición, los vínculos de una página no están activos.
Para desplazarse a una página de componentes, seleccione primero el modo de vista previa para activar los vínculos.
Con la página de componentes mostrada en el navegador, vuelva al modo de edición para abrir el cuadro de diálogo de edición del componente.
Para obtener información general sobre la creación, consulte la guía rápida de creación de páginas .
Si no está familiarizado con AEM, consulte la documentación sobre la gestión Gestión básica básica.

Página principal

La guía proporciona una lista de los componentes de SCF disponibles para la vista previa y la creación de prototipos en el lado izquierdo de la página.
Guía de componentes tal como se ve en una instancia de autor en el modo de edición:

Páginas de componentes

Seleccione un componente de la lista a lo largo del lado izquierdo de la página.
Se muestra el cuerpo principal de la guía:
  1. Título: Nombre del componente seleccionado
  2. Bibliotecas del lado del cliente: Una lista de una o varias categorías requeridas
  3. Incluible : Si el componente se puede incluir dinámicamente, el estado se puede alternar en el modo de edición de autor:
    • Si se agrega, el texto mostrado es: "Este componente se incluye mediante su nodo par."
    • Si se incluye, el texto mostrado es: "Este componente se incluye dinámicamente."
    • Si no se puede incluir, no se muestra ningún texto
  4. Componente o función de muestra: una instancia activa del componente o la función. Si un componente se modifica con los cambios realizados en las plantillas, CSS y datos proporcionados en la sección de fichas.
Después de realizar una selección desde el lado izquierdo, el componente aparecerá debajo, en lugar de al lado, de la lista de componentes cuando la ventana del navegador sea demasiado estrecha.

Interacciones de autor

Al utilizar la guía en una instancia de autor, es posible configurar un componente abriendo su cuadro de diálogo. La información para desarrolladores se proporciona en la sección Componentes y elementos esenciales de la documentación, mientras que la configuración del cuadro de diálogo se describe en la sección Componentes de comunidades para autores.
Para la guía Componentes de comunidad, algunos ajustes del cuadro de diálogo de componentes se superponen con el estado de alternancia Incluible . Para alternar entre el uso del recurso existente o un recurso incluido dinámicamente, en el modo de edición seleccione el componente y el texto inclusible y haga doble clic para abrir el cuadro de diálogo de edición:
En la ficha Plantillas :
  • Incluir el componente secundario con sling:include
    Si no se selecciona, la Guía de componentes utilizará el recurso existente en el repositorio (un nodo jcr que es un nodo secundario de un nodo par).
    • el texto mostrado es: "Este componente se incluye mediante su nodo par." Si se selecciona, la Guía de componentes utilizará sling para incluir dinámicamente un componente del resourceType del nodo secundario (recurso no existente).
    • el texto mostrado es: "Este componente se incluye dinámicamente." El valor predeterminado no está marcado.

Publicar interacciones

Al utilizar la guía en una instancia de publicación, es posible experimentar los componentes y las funciones como visitante del sitio (no ha iniciado sesión) y como miembros con varios privilegios cuando inician sesión.
Tenga en cuenta que, si el SRP se deja como predeterminado en JSRP , el UGC introducido en la instancia de publicación solo será visible durante la publicación y *no será visible desde la consola de moderación en la instancia de autor.

Bibliotecas del cliente

Las bibliotecas del lado del cliente (clientlibs) que se muestran para cada componente son aquellas a las que se debe hacer referencia cuando el componente se coloca en una página. Los clientlibs proporcionan un medio para administrar y optimizar la descarga de Javascript y CSS que se utiliza para procesar el componente en el navegador.
Para obtener más información, visite Clientlibs for Communities Components .

Suplantación

En la instancia de autor, en la que uno de ellos suele haber iniciado sesión como administrador o desarrollador, para poder ver el componente que ha iniciado sesión como otro usuario, utilice el cuadro de texto situado a la izquierda del botón Suplantar para escribir el nombre de usuario o seleccionar en la lista desplegable y, a continuación, haga clic en el botón. Haga clic en Revertir para cerrar sesión y finalizar la suplantación.
La instancia de publicación no necesita suplantar. Utilice el vínculo Inicio de sesión/Cierre de sesión para hacerse pasar por varios usuarios, como los usuarios de demostración.

Personalización

Cuando está activado, cada componente SCF está disponible para crear prototipos de posibles personalizaciones mediante la modificación temporal de la plantilla del componente, la CSS y los datos.

Activación de la personalización

Esta herramienta es de solo lectura. Ninguna de las ediciones realizadas en plantillas, CSS o datos se guarda en el repositorio.
Para experimentar rápidamente con las personalizaciones, la scg:showIde propiedad debe agregarse al nodo JCR de contenido de la página de componentes y establecerse en true.
El uso del componente comentarios como ejemplo, en la instancia de creación o publicación, ha iniciado sesión con privilegios de administrador:
  1. Navegar a CRXDE Lite
  2. Seleccione el nodo jcr:content del componente
    Por ejemplo, /content/community-components/en/comments/jcr:content
  3. Agregar una propiedad
    • Nombre scg:showIde
    • Tipo String
    • Valor true
  4. Seleccione Guardar todo
  5. Volver a cargar la página Comentarios en la guía
  6. Observe que ahora hay 3 fichas para Plantillas, CSS y Datos.

Ficha Plantillas

Seleccione la ficha Plantillas para ver las plantillas asociadas al componente.
El Editor de plantillas permite compilar y aplicar ediciones locales a la instancia de componente de muestra en la parte superior de la página sin afectar al componente en el repositorio.
La ejecución de la compilación en ediciones locales resaltará cualquier error colocando un punto en el medianil y marcando el texto en rojo.

Ficha CSS

Seleccione la ficha CSS para ver la CSS asociada al componente.
Si un componente es una composición de varios componentes, es posible que algunos CSS se incluyan en uno de los demás componentes.
El Editor de CSS permite modificar y aplicar el CSS a la instancia de componente de ejemplo en la parte superior de la página.
Se puede seleccionar una regla para resaltar las partes del DOM usando esa regla haciendo clic en junto a la regla en el medianil.

Ficha Datos

Seleccione la ficha Datos para mostrar los datos del extremo .social.json. Estos datos son editables y se aplican a la instancia de componente de ejemplo.
Los errores de sintaxis pueden marcarse en el medianil y resaltarse en el editor.