Escenario:

Supongamos que tenemos un Sitio de Publicación de SharePoint 2010 en el que hemos creado diferentes variaciones correspondientes a los idiomas inglés, español, italiano y alemán. Necesitaremos mostrar los diferentes idiomas de alguna forma para que el usuario que navega por el sitio pueda seleccionar el que más le convenga.

 

Solución:

Para dar solución a esta situación, propongo la creación de un control de usuario de SharePoint con Visual Studio 2010 cuyo funcionamiento sea el siguiente.

NOTA: La razón de usar un user control es la posibilidad de insertarlo en la masterpage.

Para empezar, debemos instanciar el control de SharePoint correspondiente al DataSource de las variaciones dentro de la página .ascx correspondiente a nuestro control de usuario. 

<PublishingWebControls:VariationDataSource ID="CustomLabelMenuDataSource" LabelMenuConfiguration="1" Filter="" runat="server" />

 

Como se puede apreciar, le he asignado el ID CustomLabelMenuDataSource que nos hará falta más adelante. Además, la propiedad LabelMenuConfiguration la he establecido a 1 para que enlace con la página correspondiente en la variación seleccionada

 

Ahoa ya tenemos el DataSource que contiene el listado de variaciones del sitio y sólo necesitamos mostrarlo en pantalla. Para ello, haré uso de un ListView de asp para visualizarlo en una lista desordenada ul.

<asp:ListView ID="LanguageListView" runat="server" DataSourceID="CustomLabelMenuDataSource">

    <LayoutTemplate>

        <ul class="ulLanguages">

            <asp:PlaceHolder runat="server" ID="itemPlaceHolder"></asp:PlaceHolder>

        </ul>

    </LayoutTemplate>

    <ItemTemplate>

        <li class="liLanguage">

            <a class="aLanguage" href="<%# DataBinder.Eval(Container.DataItem, "NavigateUrl") %>">

                <%# DataBinder.Eval(Container.DataItem, "DisplayText") %>

            </a>

        </li>

    </ItemTemplate>

</asp:ListView>

 

El ListView recibe como origen de datos el control anteriormente declarado, esto se consigue estableciendo la propiedad DataSourceId con el valor CustomLabelMenuDataSource que corresponde con el ID que indicamos en el primer paso.

En el LayoutTemplate del ListView, indicamos que se va a mostrar un “ul” que contiene los items.

En el ItemTemplate, establecemos los elementos de lista “li” con que contendrán un enlace “a” que apunta a la propiedad “NavigateUrl” de cada variación y el texto mostrado será la propiedad “DisplayText” de la misma.

 

Una vez tengamos esto, sólo habrá que ponerlo bonito mediante CSS para lo que he establecido los atributos class de cada uno de los elementos.