Oharra
Orrialde honetara sartzeak baimena behar du. Saioa hasteko edo direktorioak aldatzen saia zaitezke.
Orrialde honetara sartzeak baimena behar du. Direktorioak aldatzen saia zaitezke.
Nota
El grupo de interés comercial de Dynamics 365 Commerce ha pasado de Yammer a Viva Engage. Si no tiene acceso a la nueva comunidad de Viva Engage, rellene este formulario (https://aka.ms/JoinD365commerceVivaEngageCommunity) para agregar y mantenerse involucrado en las últimas discusiones.
En este artículo se describe cómo usar archivos de sobrescritura de hojas de estilo en cascada (CSS) en Microsoft Dynamics 365 Commerce.
Los estilos de sitio permanentes generalmente se deben manejar a través del tema de un sitio. Los temas proporcionan lo fundamental para CSS y las configuraciones de estilo para los módulos en cualquier página de su sitio. Puede crear temas mediante el kit de desarrollo de software en línea (SDK) de Dynamics 365 Commerce e implementarlos en sus sitios web a través de Microsoft Dynamics Lifecycle Services (LCS). Las capacidades de depuración de temas y las configuraciones de la interfaz del módulo en el SDK ayudan a los desarrolladores del sitio a crear paquetes de diseño del sitio personalizables y coherentes. Al implementar estos paquetes de diseño en un sitio, los autores de sitios pueden centrarse en la creación, edición y publicación de contenido en lugar del desarrollo del sitio.
Dado el ciclo de vida habitual de un tema, la dependencia de los desarrolladores para realizar cambios de estilo a través de la canalización de implementación de SDK y LCS puede ser prohibitiva en algunos escenarios. Los prototipos o las revisiones del sitio pueden parecer engorrosos si el SDK no está configurado o si no tiene tiempo para esperar una implementación de LCS.
En estos escenarios, los archivos de anulación de CSS pueden ayudar. En las herramientas de autoría de Commerce, los usuarios autenticados pueden cargar un archivo CSS, ver una vista previa y luego activarlo para anular el tema de un sitio. No necesita la carga adicional de recursos del SDK ni de la implementación de LCS. Las sobrescrituras que especifique en un archivo de sobrescritura CSS pueden ser tan pequeñas como un cambio en un único estilo de texto o tan amplias como una revisión completa de la marca.
Antes de usar los archivos de anulación de CSS, tenga en cuenta las siguientes limitaciones:
- Solo un archivo de anulación de CSS puede estar activo en un sitio a la vez. Por lo tanto, todas las anulaciones activas deben estar presentes en un único archivo de anulación.
- Aunque puede obtener una vista previa de las anulaciones en las herramientas de autoría de Commerce, no hay características de depuración dedicadas para ayudar a identificar los errores que introducen las anulaciones. En otras palabras, cuando usa archivos de anulación de CSS, no tiene el mismo conjunto de herramientas que el SDK proporciona para la validación de módulos y autoría.
Sin embargo, los archivos de anulación de CSS proporcionan una forma rápida de crear un prototipo de un diseño o implementar una revisión antes de desarrollar e implementar una actualización completa del tema.
Crear un archivo de anulación de CSS
Para crear un archivo CSS de sobrescritura, use cualquier entorno de desarrollo integrado (IDE), editor de texto o editor de código fuente. Un enfoque típico es utilizar depuradores web estándar en su navegador para identificar selectores de estilo, propiedades y valores en su sitio existente. La mayoría de los navegadores le permiten cambiar valores y obtener una vista previa en el depurador. Después de identificar los cambios que desea realizar, guárdelos en su propio archivo CSS.
Cargar un archivo de anulación de CSS
Para cargar un archivo CSS en su sitio en Commerce, siga estos pasos:
En las herramientas de creación, vaya al sitio.
En el panel de navegación de la izquierda, seleccione Diseño.
Nota
En función de la versión de las herramientas de creación de Comercio que esté usando, es posible que tenga que expandir Configuración en el panel de navegación para poder seleccionar Diseño.
En la parte superior del panel de diseño principal, seleccione la pestaña anular CSS, si aún no está seleccionada.
En Anulaciones CSS disponibles, seleccione Cargar archivo CSS. Aparecerá una ventana del Explorador de archivos.
En el Explorador de archivos, busque y seleccione un archivo CSS y luego seleccione Abrir. El archivo subido CSS ahora aparece debajo de Anulaciones CSS disponibles.
Vista previa de un archivo de anulación de CSS
Para obtener una vista previa de un archivo de sobrescritura CSS antes de activarlo en el sitio en vivo, siga estos pasos:
- En el panel de navegación de la izquierda, seleccione Diseño. En la pestaña Invalidación de CSS , en Invalidaciones CSS disponibles, busque el archivo CSS que desea obtener una vista previa.
- Al lado del nombre del archivo CSS, seleccione Vista previa del sitio.
- En el cuadro de diálogo Seleccione una URL, seleccione la URL del sitio en el que desea ver la anulación aplicada y luego seleccione Aceptar.
- Si hay varias variantes para la URL seleccionada, seleccione la variante deseada en el cuadro de diálogo Vista previa de variaciones que aparece.
Se abre una nueva pestaña o ventana del navegador, donde puede validar los sobrescribimientos de estilos contra su sitio. Luego puede compartir la URL con otros usuarios de Commerce autenticados para su revisión y comentarios.
Activar un archivo de anulación de CSS en su sitio en activo
Después de obtener una vista previa y aprobar el archivo de sobreescritura CSS, actívelo en su sitio web en vivo.
Nota
Solo puede tener un archivo CSS de sobrescritura activo en tu sitio a la vez. Si activa un nuevo archivo de invalidación, desactive el archivo de invalidación anterior. Asegúrese de que todas las sobrescrituras necesarias estén presentes en un único archivo de sobrescritura CSS.
Para activar un archivo de sustitución CSS, siga estos pasos:
- En el panel de navegación de la izquierda, seleccione Diseño. En la pestaña Invalidación de CSS , en Invalidaciones CSS disponibles, busque el archivo CSS que desea activar.
- En el nombre del archivo CSS, seleccione Activar. El archivo de anulación se activa inmediatamente en su sitio activo.
Desactivar un archivo de anulación de CSS en su sitio en activo
Para desactivar un archivo de sobreescritura CSS en tu sitio, siga estos pasos:
- En el panel de navegación de la izquierda, seleccione Diseño. En la pestaña Invalidación de CSS , en Invalidaciones CSS disponibles, busque el archivo CSS que desea desactivar.
- En el nombre del archivo CSS, seleccione Desactivar. El archivo de anulación se desactiva inmediatamente en su sitio activo.
Sugerencia
Para acceder a opciones adicionales para los archivos de anulación de CSS, seleccione los puntos suspensivos (...) al lado del nombre del archivo CSS. Las opciones Descargar, Renombrar y Reemplazar son útiles para realizar cambios rápidos en un archivo de anulación de CSS.
Recursos adicionales
Trabajar con preajustes de estilo
Agregar un aviso de derechos de autor
Agregar secuencia de comandos a páginas del sitio para admitir telemetría