Utilice las clases de página CSS
A continuación se muestra un ejemplo práctico de cómo utilizar las clases estándar de página CSS. La URL /digital/collection/[collectionId] corresponde a la página de inicio de una colección. El marcado de esta página tendrá las siguientes clases:
página de colección cdmcdm-collection-page-[collectionId]página de inicio de la colección CDM
Usted utilizaría la clase cdm-collection-page para definir una regla CSS que se aplicará a esta página de destino, así como a todas las demás páginas de nivel de colección. Usted utilizaría la clase cdm-collection-page- [collectionId] para definir las reglas CSS que deberían aplicarse únicamente a las páginas de esta colección específica. Usted usaría la clase cdm-collection-landing-page para definir las reglas de CSS que deberían aplicarse a todas las páginas de destino de la colección. Si usted quisiera definir reglas CSS que deban aplicarse a la página de destino de la colección, pero solo para una colección específica, entonces puede usar los dos nombres de clase juntos en su archivo CSS, por ejemplo:
.cdm-collection-landing-page.cdm-collection-page-p10000coll01 iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
El CSS anterior posicionaría y dimensionaría un <iframe> en la página de destino de la colección /p10000coll01.
Los nombres de clase para una página de búsqueda de colección siguen un patrón muy similar. El
/digital/collection/[collectionId]/search tendrá las siguientes clases:
página de colección cdmcdm-collection-page-[collectionId]página de búsqueda de colecciones CDM
/digital/collection/[collectionId]/id/[itemId] tendrá las siguientes clases:
página de colección cdmcdm-collection-page-[collectionId]cdm-página-de-documentocdm-item-page-[itemId]
Los múltiples niveles de nombres de clase le otorgan la flexibilidad de aplicar sus reglas CSS exactamente donde se requieren. Los nombres de clase anteriores se han definido como permanentes e inalterables, por lo que sus personalizaciones no se verán afectadas por futuras actualizaciones del código del sitio web de CONTENTdm.
Nota: Por favor, consulte los ejemplos de JavaScript y CSS para obtener ejemplos adicionales de personalización.