Compartir a través de


Agregar un fragmento del panel de modo de edición en SharePoint

Importante

Esta opción de extensibilidad solo está disponible para experiencias clásicas de SharePoint. No puede usar esta opción con experiencias modernas en SharePoint Online, como con los sitios de comunicación. No se recomienda seguir usando la experiencia clásica o esas técnicas de personalización de marca.

Un Panel de modo de edición es un fragmento de código que se puede usar para mostrar las instrucciones u otro contenido para autores de contenido, que vea el contenido de ese panel sólo cuando edita una página. Por el contrario, este fragmento de código también puede configurarse para mostrar su contenido sólo en modo normal (vista) en lugar de hacerlo en modo de edición.

Introducción al panel de modo de edición

En un sitio de publicación, los autores de contenido con los permisos necesarios pueden crear o editar páginas que residen en la biblioteca de páginas. Normalmente, un autor elige crear o editar una página y, a continuación, agrega contenido a los diferentes campos de página.

Como diseñador, puede agregar un Panel de modo de edición a una página maestra o un diseño de página y el contenido de dicho fragmento será visible para los autores de contenido sólo cuando elija Editar una página basada en ese diseño de página o una página asociada a esa página maestra. Por ejemplo, puede usar un Panel de modo de edición para mostrar el contenido siguiente sólo a los autores de contenido cuando la página está en modo de edición:

  • Un campo de página, como Schedule Publishing Date, que es importante para el autor del contenido, pero no a los visitantes que ven la página en el sitio activo.

  • Debe escribir una descripción del tipo de contenido en un campo de página.

  • Una nota para los autores de contenido que deben tener en cuenta el aspecto de la página para distintos canales de dispositivo.

También puede colocar vínculos a hojas de estilos diferentes en un Panel de modo de edición para que puedan usar estilo diferente para el modo de edición frente a modo de vista.

Debe agregar el Panel de modo de edición a un diseño de página cuando las notas para los autores de contenido son específicas para el tipo de contenido en el que se basa ese diseño de página. También puede agregar este fragmento de código a una página maestra cuando las notas para los autores son aplicables a todas las páginas que estará asociadas a esa página maestra: por ejemplo, si el panel incluyen instrucciones para proporcionar el contenido de un canal de dispositivo específico que utilice esa página principal.

También puede establecer un Panel de modo de edición para mostrar su contenido sólo en modo normal, en lugar de modo de edición, si tiene un escenario donde resulta útil o útiles mostrar contenido únicamente a los visitantes del sitio (pero no los autores de contenido) cuando edita una página.

Insertar un Panel de modo de edición

Al igual que todos los fragmentos de código, se agrega este fragmento de código de la Galería de fragmento de código. Para navegar a la Galería de fragmento de código, primero debe seleccionar una página maestra o un diseño de página para editar.

Para insertar un panel de modo de edición

  1. Vaya a su sitio de publicación.

  2. En la esquina superior derecha de la página, elija el engranaje Configuración y luego elija Administrador de diseño.

  3. En el Administrador de diseño, en el panel de navegación izquierdo, elija Editar páginas principales o Editar diseños de página, en función del tipo de archivo que está editando.

  4. Seleccione el nombre de la página maestra o un diseño de página que se va a agregar el fragmento de código.

  5. Para abrir la Galería de fragmentos de código, elija Fragmentos de código en la esquina superior derecha de la vista previa del lado del servidor.

  6. En la cinta de opciones, en la ficha Diseño, elija Panel de modo de edición y, a continuación, elija el modo en que desea que se muestre en el fragmento de código.

  7. En el lado derecho de la Galería de fragmentos de código, en Acerca de este componente, haga clic o seleccione los encabezados de sección para expandir o contraer los grupos de propiedades y luego configure las opciones personalizadas que quiera.

    La sección denominada importante contiene las propiedades que son más importantes para el funcionamiento de este fragmento de código determinado. Para un Panel de modo de edición, se establecerá la propiedad PageDisplayMode a Edit o Display, según el modo en que ha seleccionado en la cinta de opciones.

  8. Después de configurar las propiedades, elija Actualizar. Así se actualiza el fragmento de código HTML en el lado izquierdo de la página, para que el marcado refleje los cambios. Siempre puede elegir Restablecer para devolver todas las propiedades a sus configuraciones predeterminadas.

  9. En el lado izquierdo de la Galería de fragmentos de código, en Fragmento de código HTML, elija Copiar al Portapapeles.

  10. En su editor HTML, abra la unidad de red asignada en su equipo y luego abra el archivo HTML de la página principal o del diseño de página al que quiere agregar el fragmento de código. Para obtener más información, vea Cómo: Asignar una unidad de red a la Galería de páginas maestras de SharePoint.

  11. En el archivo HTML, pegue el fragmento de código en el lugar donde quiere que aparezca el marcado.

    Si va a agregar el Panel de modo de edición para un diseño de página, asegúrese de pegar el fragmento de código dentro de PlaceHolderMain de modo que el panel está visible para los autores de contenido en modo de edición. Puede pegar el fragmento de código inmediatamente antes de un campo de página específico, o puede poner uno o varios campos de página dentro del Panel de modo de edición.

  12. Reemplazar el objeto

    donde class="DefaultContentBlock" con su propio contenido específico, por ejemplo, con notas o instrucciones para los autores de contenido, o campos de página específicos que son útiles para los autores, pero no para los visitantes del sitio.

  13. Guarde la página y, a continuación, actualice la vista previa del lado del servidor en el Administrador de diseño para asegurarse de que el Panel de modo de edición aparece como se esperaba.

Comprender el marcado del fragmento de código

Las dos partes más importantes de un fragmento de código del Panel de modo de edición son la propiedad PageDisplayMode y la propiedad

donde class="DefaultContentBlock". La propiedad PageDisplayMode determina si el contenido del panel se muestran únicamente en modo de edición o en modo normal o visualización (es decir, siempre que la página no está en modo de edición).

Nota:

[!NOTA] Esta propiedad no aparece en el marcado a menos que cambie el valor a Display. Cuando la propiedad no aparece en el marcado, el modo predeterminado para el fragmento de código es el modo de edición.

El

donde class="DefaultContentBlock" es lo que reemplaza por su propio contenido, que puede incluir otros fragmentos de código y controles.


<div data-name="EditModePanelShowInEdit">
    <!--CS: Start Edit Mode Panel Snippet-->
    <!--SPM:<%@Register Tagprefix="Publishing" Namespace="Microsoft.SharePoint.Publishing.WebControls" Assembly="Microsoft.SharePoint.Publishing, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c"%>-->
    <!--MS:<Publishing:EditModePanel runat="server" PageDisplayMode="Display" CssClass="edit-mode-panel">-->
        <!--PS: Start of READ-ONLY PREVIEW (do not modify)--><!--PE: End of READ-ONLY PREVIEW-->
        <div class="DefaultContentBlock" style="border:medium black solid; background:yellow; color:black; margin:20px; padding:10px;">
        You should replace this div with content that renders based on your Edit Mode Panel Properties.
        </div>
        <!--PS: Start of READ-ONLY PREVIEW (do not modify)--><!--PE: End of READ-ONLY PREVIEW-->
    <!--ME:</Publishing:EditModePanel>-->
    <!--CE: End Edit Mode Panel Snippet-->
</div>

Vea también