Problemas de personalización de marca que pueden surgir al actualizar a SharePoint 2013.

Artículo
03/08/2023

SE APLICA A: yes-img-13 2013 no-img-16 2016 no-img-19 2019 no-img-se Subscription Edition no-img-sop SharePoint en Microsoft 365

SharePoint 2013 presenta una nueva interfaz de usuario que es ligera, rápida y fluida. Esta interfaz de usuario se crea mediante nuevos estilos CSS, temas y páginas maestras. Para obtener esta nueva experiencia, debe actualizar a la nueva interfaz de usuario. Pero los cambios significativos que se hicieron para admitir la nueva interfaz de usuario pueden interrumpir la historia de actualizaciones para algunos escenarios en los que se usan marcas personalizadas.

En Productos de SharePoint 2010, puede haber personalizado la marca de su sitio en una de varias maneras diferentes:

Aplicando una hoja de estilos personalizada en el sitio que reemplaza los estilos predeterminados de SharePoint.
Aplicando un tema personalizado (archivo THMX) en el sitio.
Copiando y cambiando una página maestra que se incluye en SharePoint 2013.
Creando una página maestra personalizada totalmente nueva en un sitio de publicación, donde la página maestra personalizada usa estilos personalizados y los diseños de página personalizados hacen referencia a esta.

Al actualizar la colección de sitios para SharePoint 2013, estos tipos de personalizaciones no funcionarán como es debido porque los estilos CSS predeterminados, los temas y las páginas maestras han cambiado. En su lugar, debe crear su marca personalizada otra vez. Para ello, es necesario usar los nuevos estilos, temas o páginas maestras disponibles en SharePoint 2013 y, a continuación, aplicar el diseño recién creado a la colección de sitios actualizada.

Los cambios en los estilos de SharePoint predeterminados, temas y páginas maestras eran necesarios para crear una interfaz de usuario más rápida y más fluida, así como para realizar actualizaciones posteriores más predecibles.

Por esta razón, si la colección de sitios contiene información de personalización de marca, se recomienda que, antes de actualizar, primero cree una colección de sitios de evaluación donde pueda probar y volver a crear su marca personalizada en un entorno de SharePoint 2013. Para obtener más información sobre una colección de sitios de evaluación, consulte Actualización de una colección de sitios.

En las siguientes secciones se muestran los problemas de personalización de marca que pueden producirse al actualizar a SharePoint 2013.

CSS personalizado

La forma más habitual de aplicar personalización de marca a un sitio de Productos de SharePoint 2010 es crear un archivo CSS que contenga estilos que reemplacen los estilos de SharePoint predeterminados.

Para que la nueva interfaz de usuario sea más rápida y más fluida, SharePoint 2013 ha introducido cambios fundamentales en la forma de implementar CSS:

Se reduce el tamaño de los archivos CSS.
El anidamiento de los selectores CSS es limitado.
Se usa la herencia de CSS siempre que sea posible.
Las clases se definen en un solo lugar.
Las clases relacionadas se agrupan en el archivo CSS.
Los estilos insertados y la declaración !important no se usan porque no se pueden invalidar.
Los estilos usan una estructura coherente y una convención de nomenclatura.

En SharePoint 2013, los estilos usan una convención de nomenclatura y una estructura coherentes.

PARTE DE NOMENCLATURA	MS-	<CARACTERÍSTICA>:	< NOMBRE >
Explicación	Indica que se trata de una clase de Microsoft.	El nombre de la característica con la que se asocia este elemento, o "básico" si se usa como parte de la interfaz de usuario básica.	Un nombre descriptivo del elemento, como título, vínculo etc.

Debido a estos cambios en la forma en que SharePoint 2013 implementa CSS, al actualizar, no se aplicarán los estilos CSS personalizados al sitio. Para resolver este problema, debe crear primero una colección de sitios de evaluación y, a continuación, usar ese sitio como el entorno donde puede identificar los nuevos estilos de SharePoint 2013 que se deben reemplazar. Cree un archivo CSS de esos estilos y, a continuación, aplique ese CSS al sitio actualizado.

Tema personalizado

En Productos de SharePoint 2010, puede usar un programa de Office como PowerPoint 2010 para crear un archivo THMX. Después puede cargar ese archivo de tema a Productos de SharePoint 2010 y aplicar el tema al sitio.

En SharePoint 2013, se mejoró el motor de temas para que la creación de temas sea más rápida y flexible, y para que los temas se puedan actualizar fácilmente más adelante. El modelo de temas usa formato de comentario de estilo en el CSS y reemplaza las partes del CSS en función de parámetros como fuentes y combinaciones de colores que los usuarios seleccionan. Los temas en SharePoint 2013 se definen mediante archivos XML:

SPColor.xml define la paleta de colores, en la que las ranuras ahora tienen nombres semánticos para que sea más claro qué elementos de la interfaz de usuario se verán afectados cuando se cambie un valor de color. Además, los temas ahora son compatibles con la configuración de opacidad.
SPFont.xml define la combinación de fuentes y admite varios idiomas, fuentes seguras para web y fuentes web.

Pero no es posible actualizar un archivo THMX de Productos de SharePoint 2010 a SharePoint 2013. Si aplicó un tema personalizado al sitio de Productos de SharePoint 2010, al actualizar a SharePoint 2013, los archivos de tema permanecen en su lugar. Pero el tema ya no se aplica al sitio y el sitio se revierte al tema predeterminado.

Para resolver este problema, debe crear primero una colección de sitios de evaluación y, a continuación, usar las nuevas características de temas en SharePoint 2013 para volver a crear el tema. Para obtener más información acerca de los nuevos temas, vea los siguientes artículos en MSDN:

Importante

Más adelante, si desea usar la personalización de marca y si desea que la personalización de marca funcione después de las actualizaciones futuras, se recomienda usar temas para implementar el diseño. Los temas tendrán compatibilidad con las actualizaciones cuando estén disponibles las actualizaciones futuras. Si los temas no funcionan para el escenario o debe tener una personalización de marca más amplia, se recomienda usar un sitio de publicación junto con el Administrador de diseño. Pero tenga en cuenta que si invierte en la creación de páginas maestras y diseños de página personalizados, tendrá que rediseñar o actualizar los archivos de diseño durante y después de cada actualización de SharePoint.

Copiar y modificar una página maestra que se incluye con SharePoint 2013

En Productos de SharePoint 2010, una forma habitual de realizar personalizaciones secundarias en la interfaz de usuario es copiar y modificar una página maestra que se incluye con Productos de SharePoint 2010. Por ejemplo, puede cambiar la página maestra para quitar u ocultar capacidades de los usuarios.

Al actualizar un sitio de Productos de SharePoint 2010 a SharePoint 2013, se restablece la página maestra para usar la página maestra predeterminada en SharePoint 2013. Por lo tanto, después de la actualización, el sitio mostrará su marca personalizada. La página maestra personalizada que se creó en Productos de SharePoint 2010 aún reside en el sitio, pero no debe aplicarse la página maestra anterior al nuevo sitio porque el nuevo sitio no se mostrará como se esperaba.

Para admitir la nueva interfaz de usuario en SharePoint 2013, se realizaron cambios en las páginas maestras predeterminadas. Por este motivo, no se puede aplicar una página maestra creada en Productos de SharePoint 2010 a un sitio en SharePoint 2013.

Para solucionarlo, primero debería crear una colección de sitios de evaluación y, después, volver a crear la página maestra en el sitio de SharePoint 2013. Después de comprobar que la nueva página maestra funciona como se espera, mueva la página maestra a la nueva colección de sitios y aplíquela al sitio. Si los sitios son sitios de publicación, puede usar el Administrador de diseño para exportar e importar la página maestra como parte de un paquete de diseño. De lo contrario, puede mover la página maestra como parte de una solución de espacio aislado o cargando el archivo en la galería de páginas maestras.

Importante

SharePoint Foundation 2013 no es compatible con los sitios de publicación. Necesita SharePoint 2013 para usar sitios de publicación.

Página maestra personalizada en un sitio de publicación

Si desea un sitio completamente personalizado como un sitio de intranet de comunicaciones corporativas, use un sitio de publicación que tenga una página maestra completamente personalizada y diseños de página personalizados asociados con la página maestra personalizada.

Al actualizar un sitio de Productos de SharePoint 2010 a SharePoint 2013, se restablece la página maestra para usar la página maestra predeterminada en SharePoint 2013. Por lo tanto, después de la actualización, el sitio no mostrará su marca personalizada. La página maestra y los diseño de página personalizados que se crearon en Productos de SharePoint 2010 aún residen en el sitio, pero no debe aplicarse la página maestra anterior al nuevo sitio porque el nuevo sitio no se mostrará como se esperaba.

Para solucionar este problema, primero debe crear una colección de sitios de evaluación que sea un sitio de publicación y, después, volver a crear la página maestra en el sitio de SharePoint 2013. Después de comprobar que la nueva página maestra funciona como se espera, siga los pasos siguientes:

Exportar la página maestra como parte de un paquete de diseño.
Importar el paquete de diseño en la nueva colección de sitios.
Aplicar la nueva página maestra al sitio.

Marcadores de posición de contenido personalizado en una página maestra personalizada

Importante

Si su página maestra personalizada contiene un marcador de posición de contenido personalizado y los diseños de página personalizados también, es posible que un error impida que la página de inicio de su sitio se represente tras la actualización. En su lugar, después de realizar la actualización, es posible que reciba un mensaje: "error inesperado".

Para determinar si tiene este problema, puede crear una colección de sitios de evaluación que también sea un sitio de publicación y, a continuación, establecer la página maestra en la página maestra que se incluye con SharePoint 2013. Si el sitio todavía se muestra, no tiene este problema. Si el sitio no se muestra y recibe un "error inesperado" con un identificador de correlación, es probable que tenga este problema.

Para resolver este problema, realice los siguientes pasos:

Cree una colección de sitios de evaluación que sea una colección de sitios de publicación.
Cree una página maestra de SharePoint 2013.
Agregue el marcador de posición de contenido personalizado a la página principal de 2013.
Aplique la nueva página maestra al sitio.
Cree un diseño de página que no contenga el marcador de posición de contenido personalizado.

El diseño de página se asociará con la nueva página maestra que se aplicó al sitio.
Cambie todas las páginas que usan el antiguo diseño de página para usar el nuevo diseño de página.

Puede editar de forma manual cada página individualmente en el explorador y usar la opción en la cinta de opciones, o bien puede usar el modelo de objetos del lado cliente de SharePoint para actualizar las páginas mediante programación.
Elimine el diseño de página anterior que contenga el marcador de posición de contenido personalizado.