En este artículo quiero mostrar paso a paso cómo desplegar una página maestra (Masterpage) personalizada en un sitio de SharePoint y aplicarla en el momento del despliegue.poster

Escenario

Tenemos un sitio de SharePoint con sus subsitios etc etc etc y queremos aplicar una página maestra personalizada para, evidentemente, tener nuestra imagen de marca. Las opciones que tenemos son:

  • Hacerlo directamente trabajando sobre el sitio con el administrador de diseños y un editor de HTML como WebMatrix o SharePoint Designer con lo que para replicar en otros sitios tendríamos que hacer una exportación del paquete de diseño, importar en en nuevo sitio e ir configurando manualmente todo lo que corresponda
  • Hacerlo desde una solución de SharePoint creada con Visual Studio con lo que tendríamos la posibilidad de tenerlo en TFS o GIT, control de las versiones, automatización de configuración en el momento de desplegar, …

 

Parece claro que si lo que queremos es tener una solución flexible que podamos replicar en otras colecciones de sitios, granjas, … la opción correcta es crear una solución de SharePoint con Visual Studio

Solución

Crear proyecto

Como he comentado, va a ser paso a paso, así que empezaremos por crear el proyecto de tipo “SharePoint 2013 – Empty project”

01-create-project

 

Esto nos creará un proyecto con la estructura estándar de una solución de SharePoint a la que debemos ir agregando los elementos necesarios.

Crear módulo

El siguiente paso será crear un módulo donde añadir la página maestra para que sea desplegada en SharePoint

02-add-module

Al crear el módulo, Visual Studio también nos creará una característica que se encargará de activarlo en nuestro sitio de SharePoint. Para el ejemplo, a esta característica le he puesto ámbito de Site Collection tal y como muestro en la imagen

feature-scope

 

Añadir página maestra al proyecto

Dentro del módulo, eliminamos el archivo “sample.txt” que nos muestra cómo funciona un módulo y añadimos nuestra página maestra personalizada, quedándonos como en la imagen

image

Especificar ruta de despliegue

Dentro del módulo, tenemos un archivo “Elements.xml” que define cómo se realizará el despliegue de cada uno de los ficheros. Como queremos desplegar nuestra página maestra y, por ser puristas, hacerlo a la carpeta donde está el resto, debemos configurarlo de la siguiente forma:

   1: <?xml version="1.0" encoding="utf-8"?> 

   2: <Elements xmlns="http://schemas.microsoft.com/sharepoint/"> 

   3:     <Module Name="MasterPages" Path="MasterPages" RootWebOnly="TRUE" Url="_catalogs/masterpage"> 

   4:         <File Url="demo.master" Type="GhostableInLibrary" IgnoreIfAlreadyExists="TRUE" /> 

   5:     </Module> 

   6: </Elements>

 

Como se puede observar, especificamos la url de despliegue de los ficheros contenidos en el módulo como “_catalogs/masterpage” y en el fichero establecemos que sea de tipo GhostableInLibrary. Con esto, ya tendríamos el despliegue de nuestra página maestra, pero… nos falta establecerla como predeterminada en nuestro sitio, así que continuemos.

 

Añadir “Event receiver”

Lo que vamos a hacer ahora es añadir un “Event receiver” que se encargue de establecer nuestra página maestra como la predeterminada de nuestro sitio y todos sus subsitios (contando desde la raíz) y, dado que para establecer nuevas páginas maestras necesitamos tener activadas las características de publicación tanto a nivel de colección de sitios como a nivel de sitio, también nos vamos a atrever a hacerlo desde código.

03-add-event-receiver

Una vez añadido el “Event receiver”, la característica nos quedará de la siguiente forma:

image

 

Editamos el fichero del “Event receiver” y añadimos los eventos “FeatureActivated” y “FeatureDeactivating” con el siguiente código

   1: public override void FeatureActivated(SPFeatureReceiverProperties properties)

   2: {

   3:     SPSite site = properties.Feature.Parent as SPSite;

   4:  

   5:     if (site != null)

   6:     {

   7:         SPWeb rootWeb = site.RootWeb;

   8:  

   9:         // Calcular la ruta relativa desde el sitio raíz.

  10:         string webPath = rootWeb.ServerRelativeUrl;

  11:         if (!webPath.EndsWith("/"))

  12:             webPath += "/";

  13:  

  14:         // Activar la característica de publicación a nivel de colección de sitios

  15:         site.Features.Add(new Guid("f6924d36-2fa8-4f0b-b16d-06b7250180fa"), true);

  16:  

  17:         // Recorrer todos los subsitios 

  18:         foreach (SPWeb web in site.AllWebs)

  19:         {

  20:             // Activar la característica de publicación en todos los sitios de la colección 

  21:             // y asignación de la nueva masterpage además del logo.

  22:             web.Features.Add(new Guid("94c94ca6-b32f-4da9-a9e3-1f3d343d7ecb"), true);

  23:             web.MasterUrl = webPath + "_catalogs/masterpage/demo.master";

  24:             web.CustomMasterUrl = webPath + "_catalogs/masterpage/demo.master";

  25:             web.SiteLogoUrl = "http://sumatutalento.com/wp-content/uploads/2014/07/Profile-Photo-4.png";

  26:             web.Update();

  27:         }

  28:     }

  29: }

  30:  

  31: public override void FeatureDeactivating(SPFeatureReceiverProperties properties)

  32: {

  33:     SPSite site = properties.Feature.Parent as SPSite;

  34:     if (site != null)

  35:     {

  36:         SPWeb rootWeb = site.RootWeb;

  37:  

  38:         // Calcular la ruta relativa desde el sitio raíz.

  39:         string webPath = rootWeb.ServerRelativeUrl;

  40:         if (!webPath.EndsWith("/"))

  41:             webPath += "/";

  42:  

  43:         // Recorrer todos los subsitios 

  44:         foreach (SPWeb web in site.AllWebs)

  45:         {

  46:             // Restaurar la masterpage Seattle 

  47:             web.MasterUrl = webPath + "_catalogs/masterpage/seattle.master";

  48:             web.CustomMasterUrl = webPath + "_catalogs/masterpage/seattle.master";

  49:             web.SiteLogoUrl = string.Empty;

  50:             web.Update();

  51:         }

  52:     }

  53: }

Como se puede observar, ambos métodos hacen algo similar y lo he comentado sobre las líneas de código con lo que hay poco que explicar, salvo la activación de las características de publicación, cuyos códigos podéis sacar de este artículo de technet y que os puede servir para activar la característica que deseéis.

 

Desplegar y probar

Ya hemos terminado de configurar y codificar todo lo necesario, así que, desplegamos el proyecto y comprobamos el sitio que como cabría de esperar, habrá cambiado de aspecto, adquiriendo el asignado en nuestra página maestra, en mi caso he modificado el logotipo, la búsqueda y el menú de navegación, eliminando el quick launch del panel izquierdo.

sharepoint-site-after

Si vais a las características de la colección de sitios podrés comprobar cómo aparece la que acabamos de desplegar activada, porque está puesto como automático aunque podéis cambiar este comportamiento.

site-collection-features

 

También tenéis disponible la selección de la página maestra desde la configuración del sitio –> página maestra puesto que hemos activado la característica de publicación-

masterpage-selection

 

Bueno, esto ha sido todo.

Os dejo el código del proyecto para que lo tengáis como referencia en este enlace

download-code