lunes, 27 de julio de 2009

Cambios de estilos en sharepoint

En este breve artículo explicaré como cambiar algunos estilos en sharepoint en forma ordenada. En principio deben saber que existen muchas maneras de cambiar los estilos en sharepoint, principalmente Master pages, Themes y Hojas de estilos. En mi caso elijo hojas de estilos porque es la opción más sencilla para que los cambios apliquen a las páginas del sitio y a las application pages también. Lo mejor es no modificar las hojas de estilo existentes para evitar "romper" algo. La opción más limpia que encontré es una usar una hoja de estilo alternativa, la cual puede asignarse muy sencillamente vía programación:

1) Crear una hoja de estilos

En esta hoja de estilo sólo pondremos lo que queremos "modificar", lo cual hace más sencillo el trabajo. A continuación les muestro un ejemplo de hoja de estilo. Si tienen dudas para encontrar los estilos, les recomiendo que utilicen esta aplicación SharePoint Customizer

.ms-bannerContainer{ display:none; }

.ms-sitemapdirectional{ font-size:10pt; font-weight:bold; }

.ms-searchresultsareaseparator{ display:none; }

.ms-globalbreadcrumb{ padding:2px 10px 2px 18px; }

#ctl00_PlaceHolderGlobalNavigation_TopHelpLink { display:none; }

.ms-pagetitle { margin:15px 0px 4px 0px; }

.ms-titlearea { display:none; }

#ctl00_PlaceHolderPageTitleInTitleArea_ListTitle { display:none; }

#ctl00_PlaceHolderMain_ctl01_ctl02_UploadMultipleLink { display:none; }

.ms-quicklaunchheader { display:none;}

#ctl00_PlaceHolderLeftNavBar_idNavLinkRecycleBin { display:none; }

2) Asignar la hoja de estilo alternativa


En el siguiente paso modifican el evento que se ejecuta al activar una feature y en ese momento asigna la hoja de estilos alternativa:


public override void FeatureActivated(SPFeatureReceiverProperties properties)
{
SPWeb site = SPContext.Current.Web;

site.ApplyTheme("Wheat");

site.AlternateCssUrl = "/_layouts/1033/Styles/NOBLEBASE/NB.css";

site.Update();
}

public override void FeatureDeactivating(SPFeatureReceiverProperties properties)
{
SPWeb site = (SPWeb)properties.Feature.Parent;
site.ApplyTheme(string.Empty);
site.AlternateCssUrl = (string.Empty);
site.Update();
}


3) Contemplar los resultados



Con estilos:







Sin estilos:





Espero que haya sido útil. Hasta la próxima.

0 comentarios:

Publicar un comentario en la entrada