Tutorial: Cambiar los modos de presentación en una página de elementos Web

Artículo
10/22/2014

Actualización: noviembre 2007

En este tutorial se ilustran dos métodos de cambiar los modos de presentación en una página de elementos Web ASP.NET y se muestra cómo se desplaza un usuario entre los modos de presentación de página. Durante este tutorial aprenderá a:

Crear un control de usuario personalizado que le permita cambiar los modos de presentación en una página Web que contiene controles de elementos Web.
Cambiar entre los distintos modos de presentación en una página de elementos Web.

Para obtener más información acerca de los modos de presentación y cuándo utilizarlos, vea Modos de presentación de las páginas de elementos Web.

Requisitos previos

Para poder completar este tutorial, necesitará:

Servicios de Internet Information Server (IIS) instalados y configurados en el equipo que alojará el sitio. Para obtener información detallada acerca de la instalación y configuración de IIS, consulte la documentación de la Ayuda de IIS incluida con la instalación o la documentación de IIS en línea en el sitio de Microsoft TechNet (Internet Information Services 6.0 Technical Resources).
Un sitio Web de ASP.NET que pueda identificar a usuarios individuales. Si ya tiene este tipo de sitio configurado, puede utilizarlo como punto de partida para este tutorial. De lo contrario, para obtener información acerca de cómo crear un directorio o sitio virtual, vea Cómo: Crear y configurar directorios virtuales en IIS 5.0 y 6.0.
Una base de datos y un proveedor de personalización configurados. La personalización de elementos Web está habilitada de manera predeterminada y utiliza el proveedor de personalización de SQL (SqlPersonalizationProvider) con SQL Server Express (SSE) para almacenar datos de personalización. En este tutorial se utiliza SSE y el proveedor de SQL predeterminado. Si tiene SSE instalado, no se necesita ninguna configuración. SSE está disponible con Microsoft Visual Studio 2005 como una parte opcional de la instalación o como una descarga gratuita desde Microsoft.com. Para utilizar una de las versiones completas de SQL Server, debe instalar y configurar una base de datos de servicios de aplicaciones ASP.NET, y configurar el proveedor de personalización de SQL para conectarse a esa base de datos. Para obtener información detallada, vea Crear y configurar la base de datos de servicios de la aplicación para SQL Server. También puede crear y configurar un proveedor personalizado que se utilizará con otras bases de datos que no sean de SQL o con otras soluciones de almacenamiento. Para obtener información detallada y ejemplos de código, vea Implementar un proveedor de suscripciones.
Un control de elementos Web personalizado derivado de la clase WebPart, de forma que pueda agregarlo al catálogo en la página de elementos Web. Para obtener un ejemplo de un control WebPart personalizado y cómo hacer referencia al mismo en una página, vea el ejemplo de código del control TextDisplayWebPart en la documentación de la clase WebPartDisplayMode.

Crear un control de usuario para cambiar los modos de presentación

En esta sección creará un control de usuario que se puede agregar a cualquier página que contenga controles de elementos Web, de forma que los usuarios puedan cambiar fácilmente entre los distintos modos de presentación de páginas.

Para crear un control de usuario para cambiar los modos de presentación

En un editor de texto, cree un archivo nuevo.
En la parte superior del archivo, agregue una declaración de control, como se muestra en el ejemplo de código siguiente.
```
<%@ control language="vb" classname="DisplayModeMenuVB"%>
```
```
<%@ control language="C#" classname="DisplayModeMenuCS"%>
```

Bajo la declaración de control, agregue el contenido de marcado siguiente a la página. Este marcado crea la interfaz de usuario para el control, que consta de tres partes principales:

Un control de lista desplegable (un elemento <asp:dropdownlist>) que permite a los usuarios cambiar los modos de presentación.
Un hipervínculo (un elemento <asp:linkbutton>) que permite a un usuario restablecer los datos de personalización específicos del usuario en la página, haciendo que la página vuelva a tener la apariencia y el diseño predeterminados que tenía antes de las modificaciones realizadas por el usuario.
Un par de controles de botones de opción (dos elementos <asp:radiobutton>) que permiten a los usuarios cambiar entre el ámbito de personalización de usuario y compartido (el ámbito de usuario es el predeterminado). Cuando el usuario actual personaliza la página, el ámbito de personalización determina qué intervalo de usuarios podrán ver los efectos de la personalización.

El código debe ser similar al siguiente bloque de código.

<div>
  <asp:Panel ID="Panel1"  
    Borderwidth="1" 
    Width="230" 
    BackColor="lightgray"
    Font-Names="Verdana, Arial, Sans Serif" >
    <asp:Label ID="Label1"  
      Text="&nbsp;Display Mode" 
      Font-Bold="true"
      Font-Size="8"
      Width="120" 
      AssociatedControlID="DisplayModeDropdown"/>
    <asp:DropDownList ID="DisplayModeDropdown"   
      AutoPostBack="true" 
      Width="120"
      OnSelectedIndexChanged="DisplayModeDropdown_SelectedIndexChanged" />
    <asp:LinkButton ID="LinkButton1" 
      Text="Reset User State" 
      ToolTip="Reset the current user's personalization data for the page."
      Font-Size="8" 
      OnClick="LinkButton1_Click" />
    <asp:Panel ID="Panel2"  
      GroupingText="Personalization Scope"
      Font-Bold="true"
      Font-Size="8" 
      Visible="false" >
      <asp:RadioButton ID="RadioButton1"  
        Text="User" 
        AutoPostBack="true"
        GroupName="Scope" OnCheckedChanged="RadioButton1_CheckedChanged" />
      <asp:RadioButton ID="RadioButton2"  
        Text="Shared" 
        AutoPostBack="true"
        GroupName="Scope" 
        OnCheckedChanged="RadioButton2_CheckedChanged" />
    </asp:Panel>
  </asp:Panel>
</div>

<div>
  <asp:Panel ID="Panel1"  
    Borderwidth="1" 
    Width="230" 
    BackColor="lightgray"
    Font-Names="Verdana, Arial, Sans Serif" >
    <asp:Label ID="Label1"  
      Text="&nbsp;Display Mode" 
      Font-Bold="true"
      Font-Size="8"
      Width="120" 
      AssociatedControlID="DisplayModeDropdown"/>
    <asp:DropDownList ID="DisplayModeDropdown"   
      AutoPostBack="true" 
      Width="120"
      OnSelectedIndexChanged="DisplayModeDropdown_SelectedIndexChanged" />
    <asp:LinkButton ID="LinkButton1" 
      Text="Reset User State" 
      ToolTip="Reset the current user's personalization data for the page."
      Font-Size="8" 
      OnClick="LinkButton1_Click" />
    <asp:Panel ID="Panel2"  
      GroupingText="Personalization Scope"
      Font-Bold="true"
      Font-Size="8" 
      Visible="false" >
      <asp:RadioButton ID="RadioButton1"  
        Text="User" 
        AutoPostBack="true"
        GroupName="Scope" OnCheckedChanged="RadioButton1_CheckedChanged" />
      <asp:RadioButton ID="RadioButton2"  
        Text="Shared" 
        AutoPostBack="true"
        GroupName="Scope" 
        OnCheckedChanged="RadioButton2_CheckedChanged" />
    </asp:Panel>
  </asp:Panel>
</div>

Asigne al archivo el nombre DisplaymodemenuCS.ascx o DisplaymodemenuVB.ascx (dependiendo del lenguaje que esté utilizando para el ejemplo) y guárdelo en la carpeta del directorio virtual o el sitio Web que utilice para este tutorial.

Para agregar funciones de modo de presentación al control de usuario

En el archivo de código fuente del control de usuario, agregue un par de etiquetas <script> justo encima de la etiqueta <div> de apertura de la página y agregue un atributo dentro de la etiqueta <script> de apertura.

Agregue a la sección <script> código que permita a los usuarios cambiar los modos de presentación de la página, restablecer los datos de personalización de la página, y cambiar entre el ámbito de personalización de usuario y compartido.

Hay que tener en cuenta varios aspectos en el bloque de código siguiente:

En el método InitComplete, el código determina qué modos de presentación hay disponibles actualmente en la página y llena el control de lista desplegable con modos de presentación. El código también determina si el usuario actual puede entrar en el ámbito de personalización compartido de la página y selecciona el control de botón de opción adecuado.
El método DisplayModeDropdown_SelectedIndexChanged cambia realmente el modo de presentación de la página, utilizando el control WebPartManager y el modo seleccionado por el usuario.
El método LinkButton1_Click restablece el estado de personalización de la página, lo que significa que todos los datos de personalización del usuario para la página se eliminan del almacén de datos de personalización, y la página vuelve a su estado predeterminado.
Los métodos RadioButton1_CheckChanged y RadioButton2_CheckChanged cambian el ámbito de personalización a usuario o a compartido.

<script >
  ' Use a field to reference the current WebPartManager.
  Dim _manager As WebPartManager

  Sub Page_Init(ByVal sender As Object, ByVal e As EventArgs)
    AddHandler Page.InitComplete, AddressOf InitComplete
  End Sub

  Sub InitComplete(ByVal sender As Object, ByVal e As System.EventArgs)
    _manager = WebPartManager.GetCurrentWebPartManager(Page)

    Dim browseModeName As String = WebPartManager.BrowseDisplayMode.Name

    ' Fill the dropdown with the names of supported display modes.
    Dim mode As WebPartDisplayMode
    For Each mode In _manager.SupportedDisplayModes
      Dim modeName As String = mode.Name
      ' Make sure a mode is enabled before adding it.
      If mode.IsEnabled(_manager) Then
        Dim item As New ListItem(modeName, modeName)
        DisplayModeDropdown.Items.Add(item)
      End If
    Next mode

    ' If shared scope is allowed for this user, display the scope-switching
    ' UI and select the appropriate radio button for the current user scope.
    If _manager.Personalization.CanEnterSharedScope Then
      Panel2.Visible = True
      If _manager.Personalization.Scope = PersonalizationScope.User Then
        RadioButton1.Checked = True
      Else
        RadioButton2.Checked = True
      End If
    End If

  End Sub

  ' Change the page to the selected display mode.
  Sub DisplayModeDropdown_SelectedIndexChanged(ByVal sender As Object, _
    ByVal e As EventArgs)

    Dim selectedMode As String = DisplayModeDropdown.SelectedValue   
    Dim mode As WebPartDisplayMode = _
      _manager.SupportedDisplayModes(selectedMode)
    If Not (mode Is Nothing) Then
      _manager.DisplayMode = mode
    End If

  End Sub

  ' Set the selected item equal to the current display mode.
  Sub Page_PreRender(ByVal sender As Object, ByVal e As EventArgs)
    Dim items As ListItemCollection = DisplayModeDropdown.Items
    Dim selectedIndex As Integer = _
      items.IndexOf(items.FindByText(_manager.DisplayMode.Name))
    DisplayModeDropdown.SelectedIndex = selectedIndex

  End Sub

  ' Reset all of a user's personalization data for the page.
  Protected Sub LinkButton1_Click(ByVal sender As Object, _
    ByVal e As EventArgs)

    _manager.Personalization.ResetPersonalizationState()

  End Sub

  ' If not in User personalization scope, toggle into it.
  Protected Sub RadioButton1_CheckedChanged(ByVal sender As Object, _
    ByVal e As EventArgs)

    If _manager.Personalization.Scope = PersonalizationScope.Shared Then
      _manager.Personalization.ToggleScope()
    End If

  End Sub

  ' If not in Shared scope, and if user is allowed, toggle the scope.
  Protected Sub RadioButton2_CheckedChanged(ByVal sender As Object, _
    ByVal e As EventArgs)

    If _manager.Personalization.CanEnterSharedScope AndAlso _
      _manager.Personalization.Scope = PersonalizationScope.User Then
      _manager.Personalization.ToggleScope()
    End If

  End Sub

</script>

<script >

 // Use a field to reference the current WebPartManager.
  WebPartManager _manager;

  void Page_Init(object sender, EventArgs e)
  {
    Page.InitComplete += new EventHandler(InitComplete);
  }  

  void InitComplete(object sender, System.EventArgs e)
  {
    _manager = WebPartManager.GetCurrentWebPartManager(Page);

    String browseModeName = WebPartManager.BrowseDisplayMode.Name;

    // Fill the dropdown with the names of supported display modes.
    foreach (WebPartDisplayMode mode in _manager.SupportedDisplayModes)
    {
      String modeName = mode.Name;
      // Make sure a mode is enabled before adding it.
      if (mode.IsEnabled(_manager))
      {
        ListItem item = new ListItem(modeName, modeName);
        DisplayModeDropdown.Items.Add(item);
      }
    }

    // If shared scope is allowed for this user, display the scope-switching
    // UI and select the appropriate radio button for the current user scope.
    if (_manager.Personalization.CanEnterSharedScope)
    {
      Panel2.Visible = true;
      if (_manager.Personalization.Scope == PersonalizationScope.User)
        RadioButton1.Checked = true;
      else
        RadioButton2.Checked = true;
    }

  }

  // Change the page to the selected display mode.
  void DisplayModeDropdown_SelectedIndexChanged(object sender, EventArgs e)
  {
    String selectedMode = DisplayModeDropdown.SelectedValue;

    WebPartDisplayMode mode = _manager.SupportedDisplayModes[selectedMode];
    if (mode != null)
      _manager.DisplayMode = mode;
  }

  // Set the selected item equal to the current display mode.
  void Page_PreRender(object sender, EventArgs e)
  {
    ListItemCollection items = DisplayModeDropdown.Items;
    int selectedIndex = 
      items.IndexOf(items.FindByText(_manager.DisplayMode.Name));
    DisplayModeDropdown.SelectedIndex = selectedIndex;
  }

  // Reset all of a user's personalization data for the page.
  protected void LinkButton1_Click(object sender, EventArgs e)
  {
    _manager.Personalization.ResetPersonalizationState();
  }

  // If not in User personalization scope, toggle into it.
  protected void RadioButton1_CheckedChanged(object sender, EventArgs e)
  {
    if (_manager.Personalization.Scope == PersonalizationScope.Shared)
      _manager.Personalization.ToggleScope();
  }

  // If not in Shared scope, and if user is allowed, toggle the scope.
  protected void RadioButton2_CheckedChanged(object sender, EventArgs e)
  {
    if (_manager.Personalization.CanEnterSharedScope && 
        _manager.Personalization.Scope == PersonalizationScope.User)
      _manager.Personalization.ToggleScope();
  }
</script>

Guarde y cierre el archivo.

Crear una página Web para alojar el control de modos de presentación

Ahora que ha creado un control de usuario para cambiar los modos de presentación, puede crear una página Web para alojar el control. En esta sección creará una página Web que aloja el control de usuario, y que también contiene zonas de elementos Web y otros controles de servidor para proporcionar funcionalidad de elementos Web.

Para crear una página Web que puede cambiar los modos de presentación

Como indican los requisitos previos para este estado del tutorial, necesita un control WebPart compilado personalizado. En este tutorial se utiliza el control personalizado denominado TextDisplayWebPart, que está disponible en el tema de información general de la clase WebPartDisplayMode. El ensamblado compilado debe denominarse TextDisplayWebPartCS.dll o TextDisplayWebPartVB.dll, dependiendo del lenguaje que utilice. Coloque el ensamblado compilado para el control personalizado en un subdirectorio denominado bin del sitio Web.

Nota de seguridad:
El control tiene un cuadro de texto que acepta datos del usuario, lo que puede resultar una amenaza para la seguridad. Los datos proporcionados por el usuario en una página Web pueden contener secuencias de comandos del cliente malintencionadas. De manera predeterminada, las páginas Web de ASP.NET validan la entrada del usuario para asegurarse de que ésta no contiene ninguna secuencia de comandos o elemento HTML. Siempre que esta validación esté habilitada, no tendrá que comprobar explícitamente si algún usuario está insertando secuencias de comandos o elementos HTML. Para obtener más información, vea Información general sobre los ataques mediante secuencias de comandos.

El control tiene un cuadro de texto que acepta datos del usuario, lo que puede resultar una amenaza para la seguridad. Los datos proporcionados por el usuario en una página Web pueden contener secuencias de comandos del cliente malintencionadas. De manera predeterminada, las páginas Web de ASP.NET validan la entrada del usuario para asegurarse de que ésta no contiene ninguna secuencia de comandos o elemento HTML. Siempre que esta validación esté habilitada, no tendrá que comprobar explícitamente si algún usuario está insertando secuencias de comandos o elementos HTML. Para obtener más información, vea Información general sobre los ataques mediante secuencias de comandos.

En un editor de texto, cree un archivo nuevo.

En la parte superior del archivo, agregue una declaración de página y dos directivas register. Una directiva register es para el control de usuario; la otra es para el control WebPart compilado personalizado que está utilizando para este tutorial. Tenga en cuenta que el atributo Assembly de la directiva debe hacer referencia al nombre del archivo de ensamblado para el control personalizado, sin la extensión.

<%@ page language="VB" %>
<%@ register TagPrefix="uc1" 
  TagName="DisplayModeMenuVB" 
  Src="DisplayModeMenuVB.ascx" %>
<%@ register tagprefix="aspSample" 
  Namespace="Samples.AspNet.VB.Controls" 
  Assembly="TextDisplayWebPartVB"%>

<%@ page language="C#" %>
<%@ register TagPrefix="uc1" 
  TagName="DisplayModeMenuCS" 
  Src="DisplayModeMenuCS.ascx" %>
<%@ register tagprefix="aspSample" 
  Namespace="Samples.AspNet.CS.Controls" 
  Assembly="TextDisplayWebPartCS"%>

Bajo las directivas register, agregue el bloque de código siguiente, que le permite cambiar manualmente la página al modo de catálogo.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script >
Sub Button1_Click(Byval sender As Object, _
                  ByVal e As EventArgs)
  WebPartManager1.DisplayMode = WebPartManager.CatalogDisplayMode
End Sub
</script>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script >
void Button1_Click(object sender, EventArgs e)
{
  WebPartManager1.DisplayMode = WebPartManager.CatalogDisplayMode;
}
</script>

Después del bloque de código, agregue el marcado siguiente al archivo. Este ejemplo de código contiene diversas funciones que son necesarias en una página de elementos Web, incluyendo un elemento <asp:webpartmanager>, zonas de elementos Web correspondientes a los posibles modos de presentación de la página y varios controles. Para obtener más información al respecto, vea Tutorial: Crear una página de elementos Web.

El código para el resto de la página debe ser similar al bloque de código siguiente.

<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" >
  <title>Web Parts Display Modes</title>
</head>
<body>
  <form id="Form2" >
    <asp:webpartmanager id="WebPartManager1"  />
    <uc1:DisplayModeMenuVB ID="DisplayModeMenu1"  />
    <asp:webpartzone
      id="WebPartZone1"
       BackImageUrl="~/MyImage.gif">
        <zonetemplate>
          <asp:Calendar 
            ID="Calendar1" 
            Runat="server" 
            Title="My Calendar" />
        </zonetemplate>
    </asp:webpartzone>
    <asp:WebPartZone ID="WebPartZone2" Runat="server">
    </asp:WebPartZone>
    <asp:EditorZone ID="editzone1" Runat="server">
      <ZoneTemplate>
        <asp:AppearanceEditorPart 
          ID="appearanceeditor1" 
          Runat="server" />
        <asp:LayoutEditorPart 
          ID="LayoutEditorPart1" 
          Runat="server" />
      </ZoneTemplate>
    </asp:EditorZone>
    <asp:CatalogZone ID="catalogzone1" Runat="server">
      <ZoneTemplate>
        <asp:DeclarativeCatalogPart 
          ID="declarativepart1" 
          Runat="server">
          <WebPartsTemplate>
          <aspSample:TextDisplayWebPart 

            id="textwebpart" 
            title = "Text Content WebPart"/>  
          </WebPartsTemplate>
        </asp:DeclarativeCatalogPart>
      </ZoneTemplate>
    </asp:CatalogZone>
    <br />
    <asp:button
      id="button1"

      text="Catalog Mode"
      OnClick="Button1_Click"
    />
  </form>
</body>
</html>

<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" >
  <title>Web Parts Display Modes</title>
</head>
<body>
  <form id="Form2" >
    <asp:webpartmanager id="WebPartManager1"  />
    <uc1:DisplayModeMenuCS ID="DisplayModeMenu1"  />
    <asp:webpartzone
      id="WebPartZone1"
       BackImageUrl="~/MyImage.gif">
        <zonetemplate>
          <asp:Calendar 
            ID="Calendar1" 
            Runat="server" 
            Title="My Calendar" />
        </zonetemplate>
    </asp:webpartzone>
    <asp:WebPartZone ID="WebPartZone2" Runat="server">
    </asp:WebPartZone>
    <asp:EditorZone ID="editzone1" Runat="server">
      <ZoneTemplate>
        <asp:AppearanceEditorPart 
          ID="appearanceeditor1" 
          Runat="server" />
        <asp:LayoutEditorPart 
          ID="LayoutEditorPart1" 
          Runat="server" />
      </ZoneTemplate>
    </asp:EditorZone>
    <asp:CatalogZone ID="catalogzone1" Runat="server">
      <ZoneTemplate>
        <asp:DeclarativeCatalogPart 
          ID="declarativepart1" 
          Runat="server">
          <WebPartsTemplate>
          <aspSample:TextDisplayWebPart 

            id="textwebpart" 
            title = "Text Content WebPart" AllowClose="true"/>  
          </WebPartsTemplate>
        </asp:DeclarativeCatalogPart>
      </ZoneTemplate>
    </asp:CatalogZone>
    <br />
    <asp:button
      id="button1"

      text="Catalog Mode"
      OnClick="Button1_Click"
    />
  </form>
</body>
</html>

Asigne el nombre Displaymodes.aspx al archivo y guárdelo en el directorio del sitio Web.

Cambiar los modos de presentación en una página Web

Ya ha creado todo lo necesario para ejecutar una página Web que contiene controles de elementos Web y que puede cambiar entre los diversos modos de presentación de páginas. En esta sección cargará la página y utilizará el control de usuario para cambiar la página a los distintos modos de presentación.

Para probar la página y cambiar los modos de presentación

Cargue la página en un explorador. La página debe ser similar a la captura de pantalla siguiente.

Página con un control para cambiar de modo de presentación

Haga clic en el control de lista desplegable Modo de presentación y observe los distintos modos de presentación que están disponibles en la página. Como la página contiene un control WebPartZone, un control EditorZone y un control CatalogZone, los modos de presentación correspondientes aparecen en la lista desplegable para cada uno de estos tipos de zonas, así como el modo de presentación Examinar predeterminado.

Nota:
La página puede contener también un control ConnectionsZone, lo que le permitiría crear conexiones entre los controles y agregar un modo de presentación de conexión a la lista desplegable, pero las conexiones quedan fuera del ámbito de este tutorial.

Seleccione el modo Catálogo en la lista desplegable. Aparecerá la interfaz de usuario del modo de catálogo y el control TextDisplayWebPart debe ser visible en el catálogo, estando disponible para agregarlo a la página. Haga clic en el botón Cerrar para devolver la página al modo de exploración.
Como forma alternativa de cambiar a un modo de presentación, sin necesidad del control de usuario, haga clic en el botón Modo de catálogo situado cerca de la parte inferior de la página. El código para este cambio aparece en el método Button1_Click de la página Web. La página cambiará al modo de catálogo.
Active la casilla de verificación situada junto al control personalizado en el catálogo y haga clic en el botón Agregar para agregarlo a la página.
Haga clic en Cerrar para devolver la página al modo de exploración. Observe que el control agregado aparece ahora en la página.
En el control de lista desplegable Modo de presentación, seleccione Modificar. La página cambiará al modo de edición. Los títulos de las zonas se hacen visibles y aparece un botón de menú de verbos similar a un triángulo pequeño en la barra de título de cada control de servidor que reside en una WebPartZone. El menú de verbos proporciona distintas acciones que un usuario puede aplicar a un control.
Haga clic en el menú de verbos en el control TextDisplayWebPart. Aparecerá un menú desplegable.
En el menú de verbos, haga clic en la opción Modificar. Aparecerá la interfaz de usuario especial de edición, que se declara dentro del elemento <asp:editorzone>. Con estos controles puede cambiar el diseño y la apariencia del control personalizado.
Utilice la interfaz de usuario de edición para cambiar el título del control personalizado. Después, haga clic en Aplicar para aplicar los cambios.
Sitúe el puntero del mouse en la barra de título del control personalizado. Haga clic en la barra de título y arrastre el control de WebPartZone1 a WebPartZone2.
Utilice el control de lista desplegable Modo de presentación para devolver la página al modo de exploración. La página debe ser similar a la captura de pantalla siguiente.

Página después de hacer cambios en distintos modos de presentación

Vea también

Compartir a través de