Sie sind auf Seite 1von 162

Contenido – Elementos Web (Webparts)

<BC_MVP>Bancolombia – Páginas modernas en SharePoint

Autor(es): Diego A. Campo


Fecha: 13 de mayo de 2019
Tabla de contenido

1. Introducción ........................................................................................................................ 5

2. Crear y usar páginas modernas en un sitio ..................................................................... 7


2.1. Agregar y publicar una página.................................................................................. 7
2.2. Personalizar el área de título y detalle de la página ................................................. 9
2.3. Ayudar a otros a buscar la página .......................................................................... 15
2.4. Editar la página ....................................................................................................... 15
2.5. Cambiar título o URL de la página .......................................................................... 16
2.6. Tipo de diseño de la página.................................................................................... 17
2.7. Comentarios de me gusta y vistas .......................................................................... 19
2.8. Guardar para más tarde .......................................................................................... 20
2.9. Enviar la página por correo electrónico .................................................................. 20
2.10. Eliminar la página .................................................................................................... 21

3. Agregar una publicación de noticias a un sitio ............................................................. 22


3.1. Agregar una publicación de noticias (post) ............................................................ 22
3.2. Agregar una publicación como un vínculo de noticias .......................................... 24
3.3. Enviar la publicación de noticias por correo electrónico ........................................ 26
3.4. Buscar publicaciones de noticias ............................................................................ 27
3.5. Quitar publicaciones de noticias ............................................................................. 27
3.6. Dónde se muestra la noticia ................................................................................... 28

4. Administración y ciclo de vida de una página moderna .............................................. 30


4.1. Ciclo de vida de página ........................................................................................... 30
4.2. Ciclo de vida de la página con aprobación de contenido ...................................... 31
4.3. ¿Quién puede editar una página? ........................................................................... 32
4.4. Buscar páginas ........................................................................................................ 32
4.5. Restaurar una versión anterior ................................................................................ 32
4.6. Proteger y desproteger páginas de la biblioteca de páginas ................................. 34
4.7. Anular la publicación de una página ...................................................................... 34

2
5. Agregar o quitar secciones y columnas de una página moderna ................................ 35
5.1. Agregar una sección con columnas a una página .................................................. 35
5.2. Cambiar una sección existente ............................................................................... 36
5.3. Agregar contenido a una columna ......................................................................... 37

6. Tamaño y escala de la imagen en páginas modernas .................................................. 38


6.1. ¿Cuáles son los tamaños de imagen óptimos? ....................................................... 38
6.2. Relación de aspecto ................................................................................................ 39
6.3. Diseños de columna ................................................................................................ 39
6.4. Diseños de elementos Web .................................................................................... 41

7. Plantillas para páginas modernas .................................................................................. 47


7.1. Usar una plantilla .................................................................................................... 47
7.2. Crear una plantilla ................................................................................................... 48
7.3. Buscar, cambiar o quitar una plantilla ..................................................................... 48

8. Usar elementos Web en páginas modernas ................................................................... 50


8.1. Elemento web: Noticias o novedades ..................................................................... 52
8.2. Elemento web: Texto ............................................................................................... 60
8.3. Elemento web: Elemento principal (Hero: banner de imágenes y vínculos) ........... 64
8.4. Elemento web: Galería de imágenes ....................................................................... 73
8.5. Elemento web: imagen............................................................................................ 76
8.6. Elemento web: Vínculos rápidos ............................................................................. 80
8.7. Elemento web: Vínculo............................................................................................ 85
8.8. Elemento web: Contenido resaltado ....................................................................... 86
8.9. Elemento web: Visor de archivos ............................................................................ 92
8.10. Elemento web: Insertar ........................................................................................... 93
8.11. Elemento web: Eventos ........................................................................................... 97
8.12. Elemento web: Temporizador de cuenta atrás .....................................................101
8.13. Elemento web: Divisor...........................................................................................103
8.14. Elemento web: Espaciador ....................................................................................104
8.15. Elemento web: Actividad del sitio .........................................................................105
8.16. Elemento web: Biblioteca de documentos............................................................106
3
8.17. Elemento web: Calendario de grupo ....................................................................108
8.18. Elemento web: Contactos .....................................................................................110
8.19. Elemento web: Documentos recientes..................................................................112
8.20. Elemento web: Conversaciones y Elementos destacados de Yammer .................114
8.21. Elemento web: El tiempo ......................................................................................120
8.22. Elemento web: Fragmento de código ...................................................................122
8.23. Elemento web: Gráfico rápido ...............................................................................123
8.24. Elemento web: Guardado para más tarde ............................................................125
8.25. Elemento web: Lista ..............................................................................................127
8.26. Elemento web: Mapas de Bing..............................................................................130
8.27. Elemento web: Markdown ....................................................................................132
8.28. Elemento web: Microsoft Forms ...........................................................................133
8.29. Elemento web: Microsoft PowerApps ...................................................................138
8.30. Elemento web: Power BI .......................................................................................140
8.31. Elemento web: Propiedades de lista .....................................................................141
8.32. Elemento web: Propiedades de página ................................................................143
8.33. Elemento web: Sitios .............................................................................................145
8.34. Elemento web: Stream ..........................................................................................148
8.35. Elemento web: Twitter ..........................................................................................150
8.36. Elemento web: Video de Office 365 ......................................................................152
8.37. Elemento web: Kindle............................................................................................153
8.38. Elemento web: YouTube .......................................................................................155
8.39. Elemento web: Fondo de sección .........................................................................157
8.40. Elemento web: Plantillas HTML .............................................................................161

4
1. Introducción

Microsoft ha “modernizado” SharePoint en la nube, su plataforma de ECM – Gestión de


Contenidos Empresariales, ofreciendo un ambiente más adecuado para sus sitios Web de
contenido, ya que su interfaz “clásica” fue agregada en 2002 y hoy, los temas de movilidad,
desempeño y nuevos componentes de interacción con los usuario e integración, han
requerido un cambio importante para Microsoft, no solo en su plataforma de SharePoint sino
también en sus otros productos de Office 365.

Aquí está uno de los sitios modernos, un sitio de Comunicación, que se usaría para publicar
información en una Intranet. No se necesitó personalización o configuración avanzada.
Hubiera sido mucho trabajo hacer que un sitio de SharePoint clásico se vea así. Además, el
sitio se adapta automáticamente a una pantalla estrecha del teléfono, manteniendo la página
legible sin desplazamiento lateral en cualquier tamaño de pantalla.

5
SharePoint moderno es una experiencia de usuario completamente nueva. Es más que un
aspecto nuevo, está diseñado desde el principio para trabajar en dispositivos móviles (Mobile
First). Las listas y librerías documentales tienen un nuevo “look” y también son adaptativas a
pantallas pequeñas (“responsive”).

El impacto total de SharePoint moderno es evidente en las páginas editables. Aquí es donde
los usuarios pueden innovar organizando “elementos web” (webparts) en una página para
mostrar solo la información que desean. Es rápido y las páginas pueden ser incrustadas en sus
diferentes productos, además de lograr páginas de alto diseño con muy bajos conocimientos;
es un ambiente realmente fácil de configurar y mucho más seguro.

Recomendación importante:

Las páginas modernas de SharePoint están diseñadas, en parte, con el concepto “Mobile first”
y por esta razón su estructura tiene particularidades como la restricción de ubicar contenido
en máximo 3 columnas, el diseño de las páginas también está basado en “secciones” o “filas”,
además, los diferentes componentes o elementos web (webparts) tiene una forma de
visualización según el tipo de columna donde se ubique. Cada componente tiene diferentes
restricciones visuales para lograr ser “adaptativo” (“responsive”) en cualquier tipo de pantalla:
computador, teléfono o Tablet.

Este nuevo concepto de páginas basadas en “responsive” o adaptativas, requiere algunas


capacitaciones para los usuarios diseñadores. Similar a “Joomla” o “WordPress”, cada
componente tiene un comportamiento y unas restricciones a nivel de dimensiones en las
imágenes o en la cantidad de registros a presentar y es importante comenzar a sacar
provecho de estos cambios para obtener de forma fácil una página con alto diseño y
directamente adaptado para dispositivos móviles.

Cambiar de una plataforma “clásica” a “moderna” puede llevar a que los usuarios quieran
repetir o copiar funcionalidades que conocían, esta práctica no es muy recomendable, ya que,
el concepto de “páginas modernas” es diferente pero su diferencia radica en mejoras tanto en
desempeño, como en su poder de “adaptación” a los diferentes dispositivos y obviamente a
su alta integración con los demás productos de Office 365. Microsoft recomienda modernizar
sus componentes de forma que se adapten a la nueva estructura de diseño que serán
explicados en este documento.

6
2. Crear y usar páginas modernas en un sitio

Usar páginas es una buena forma de compartir ideas mediante imágenes, documentos de
Excel, Word y PowerPoint, vídeos y mucho más medios. Puede crear y publicar páginas rápida
y fácilmente y tendrán un aspecto excelente en cualquier dispositivo.

Al crear una página, puede Agregar y Personalizar elementos Web y, a continuación, publicar
la página con un solo clic. Video para crear y publicar páginas modernas

2.1. Agregar y publicar una página

1. Vaya al sitio de comunicaciones o de grupo en el que desea agregar una página.


2. Vaya a la Página principal del sitio.

3. Haga clic en +Nuevo y después seleccione Página.

Como alternativa, puede ir a una página existente, hacer clic en + nuevo y seleccionar iniciar
desde una página en blanco. También puede elegir copia de esta página para crear una
página nueva que tenga los mismos elementos Web y el mismo contenido que la página
existente.

4. Elija una plantilla de página para empezar. Consulte Plantillas para páginas modernas.

7
5. Agregue un nombre de página en el área de título. Se necesita un nombre de página para
guardar la página.

Notas: Cuando se agrega un nombre de página en el área de título, SharePoint utiliza este
nombre para definir la URL de la página, por tal motivo, se sugiere agregar un nombre
basado las recomendaciones de los apartados Personalizar el área de título y Cambiar
título o URL de la página, y así aplicar las mejores prácticas en la asignación del título y la
URL de una página.

6. Agregar elementos web

Pase el “mouse” por debajo del área de título y verá una línea con un signo + del círculo,
como este:

7.

Haga clic en + para agregar contenido como texto, documentos, vídeo y mucho más. Los
elementos Web son la base de la página. Para obtener más información sobre los distintos
tipos de elementos web y cómo usarlos, consulte Usar elementos Web en páginas
modernas.

8
También puede agregar secciones y columnas a una página. Para obtener más información,
vea Agregar o quitar secciones y columnas de una página moderna.

8. Cuando haya terminado la edición, puede hacer clic en Guardar como borrador para
guardar los cambios y cerrar el modo de edición. La audiencia no verá la página hasta que la
publique. Solo los usuarios con permisos de edición en su sitio podrán verlo.
9. Cuando esté listo para que la audiencia vea la página, haga clic en publicar.

Para obtener más información sobre la publicación y el ciclo de vida de una página,
vea Administración y ciclo de vida de una página moderna.

2.2. Personalizar el área de título y detalle de la página

Puede personalizar el área de título con una imagen, una serie de cuatro diseños, texto
encima del título, la capacidad de cambiar el autor mostrado y puede mostrar u ocultar la
fecha de publicación.

• Título

Al crear una página, SharePoint utiliza el “nombre de la página” como título de la página para
ser presentado en los diferentes visores de contenido. El primer nombre que se asigna, sirve
en el momento de guardar la primera vez, para que SharePoint construya la URL de la página.

El nombre de la página, es muy importante para el motor de búsqueda, ya que sirve como
palabras claves para una búsqueda y por ello, es ideal usar entre 40 y 70 caracteres, que sea
un nombre único y corresponda al contenido de la página.

Para la URL de la página, SharePoint la construye reemplazando los espacios por guiones “-“,
es una buena práctica para definir una URL que permita ser fácil de entender por un motor de
búsqueda.

9
Lastimosamente, en el tema de tildes, símbolos o acentos especiales como la “ñ” o “$”, “%”,
etc. es ideal que no sean utilizados en el nombre de la página al crearse, se deben
inicialmente omitir para que la URL no los contenga y después de guardar la primera vez, si es
posible editar el “nombre de la página” y crear el nombre correctamente con ellos.

Ejemplo:
Nombre requerido – La “tasa de interés” ha subido 15%
Nombre de la página, al crearla: la tasa de interes ha subido 15 porciento
Nombre de la página, al editarla: La “tasa de interés” ha subido 15%

En caso de omitir esta actividad la primera vez de creación de una página, siempre es posible
la edición del “Título” y “URL” de la página, tal y como se describe en el apartado Cambiar
título o URL de la página.

10
• Agregar una imagen

Para agregar una imagen, haga clic en Agregar imagen en la barra de herramientas de
la izquierda.

Nota: Las imágenes tienen mejor aspecto si se encuentran modo “landscape” o en 16:9 o más
en relación de aspecto. Para obtener más información sobre el tamaño de la imagen, consulte
Tamaño y escala de la imagen en páginas modernas.

Además, puede establecer un punto focal para obtener la parte más importante de la imagen

en el marco. Haga clic en establecer punto focal en la barra de herramientas de la


izquierda y, dentro de la imagen, arrastre el punto focal hasta la posición que desee.

• Agregar o cambiar el autor de la página en pantalla

En el área de título, agregue un nombre, un nombre parcial o un nombre de correo


electrónico en el cuadro autor. El nombre se buscará en los perfiles de su organización y se le
presentarán sugerencias de personas. Elija el que desee y termine. Si no escribe un nombre,
no se mostrará un autor.

• Elegir un diseño

Haga clic en el botón Editar elemento Web y, en el cuadro de herramientas de la


derecha, elija el diseño que desee:

11
• Establecer la alineación

Si el cuadro de herramientas no se muestra, haga clic en el botón Editar elemento

Web y, en el cuadro de herramientas de la derecha, elija izquierda o Centro.

• Agregar texto encima del título

Puede Agregar texto en un bloque coloreado encima de su título para resaltar el título o
llamar la atención sobre algo en la página, como en el ejemplo siguiente, donde nuevo es el
texto que está encima del título. El color del bloque en el que se encuentra el texto se basa en
el tema del sitio.

Para agregar el texto que está encima del título, haga clic en el botón Editar elemento

Web y, en el cuadro de herramientas de la derecha, escriba un máximo de 40


caracteres de texto en el cuadro texto encima del título. Después, cambie la opción Mostrar
bloque de texto anterior título a sí.

• Mostrar fecha Publicada

Para mostrar la última fecha de publicación de la página en el área de título, deslice el botón
de alternancia de esta opción a sí.

12
• Ver, editar y agregar detalles de página

Puede ver y editar las propiedades de una página en el panel de detalles de la página.

Notas:

• El número de propiedades disponibles para ver y editar en una página puede variar en
función de las propiedades que el propietario del elemento o el administrador le haya
asignado. Es posible que algunas de estas propiedades sean necesarias.

Ver y editar las propiedades de página en el panel de detalles de la página

1. En la parte superior de la página, haga clic en detalles de la Página de .

2. Puede cambiar la miniatura de la página haciendo clic en el botón cambiar miniatura y


eligiendo una imagen. Las características de la imagen se pueden describir con más detalle en
el apartado Tamaño y escala de la imagen en páginas modernas.

También puede Agregar o editar la descripción de la página escribiendo en el espacio de la


sección Descripción.

Notas:

• La miniatura y la descripción se usan en lugares como resultados de la búsqueda y


noticias de SharePoint y por ello, son altamente relevantes, SharePoint autocompleta esta
información con base en la página la primera vez que se guarda, pero es ideal que el
usuario realice cambios en ambos campos, ya que son realmente importantes para
agilizar la búsqueda.
• La descripción es ideal que tenga varias palabras claves y que logre expresar de forma
única el contenido que se tiene en la página y la información que el usuario puede
encontrar allí.
• Como campo adicional, se tienen Palabras Claves, este campo al igual que la descripción,
el título y la URL, son piezas claves para el motor de búsqueda y su agilidad para que la
página aparezca en los primeros lugares según la búsqueda del usuario. Es ideal que las
palabras claves sean realmente dicientes sobre el contenido y además agreguen
SINONIMOS sobre formas diferentes como el usuario se puede referir al contenido.

13
3. Haga clic en el valor de la propiedad que desea editar debajo del nombre de la propiedad,
escriba el nuevo valor y, a continuación, presione entrar en el teclado. Para modificar más de
una propiedad a la vez, haga clic en Editar todo, modifique las propiedades que desee
cambiar y, a continuación, haga clic en Guardar.

Para ver información adicional sobre una página (como la fecha de última modificación), haga
clic en más detalles en la parte inferior del panel.

14
2.3. Ayudar a otros a buscar la página

La primera vez que publiques tu página, se te pedirá que ayudes a otras personas a encontrar
tu página. Si desea hacerlo más adelante, puede hacer clic en promover en la parte superior
de la página después de publicar la página.

Puede usar una o varias de las siguientes opciones:

• Agregar página a la navegación: agrega un vínculo a la página, usando el título de la


página, a la navegación de la izquierda o superior depende del tipo de sitio.
• Publicar como noticias en este sitio: agrega una publicación de noticias a la Página
principal del sitio. Para obtener más información sobre las noticias, vea Agregar una
publicación de noticias a un sitio.
• Correo electrónico: le permite enviar un correo electrónico con una vista previa de la página
y un mensaje opcional a los destinatarios seleccionados.
• Copiar dirección: se muestra la dirección de la página para que pueda copiarla y enviarla a
otras personas.

2.4. Editar la página

Para realizar cambios en la página, siga estos pasos:

15
1. Vaya al sitio donde está la página.
2. En el lado izquierdo o superior.

Si no ve las páginas en el lado izquierdo o superior, haga clic en contenidos del


sitio desde configuración en la esquina superior derecha y, a continuación, en el lado
izquierdo de la página contenidos del sitio, haga clic en páginas.

3. Haga clic en Editar en la parte superior derecha.

Al hacer clic en editar la página está desprotegida para usted. Siempre que la página esté
abierta para su edición o desprotegida, nadie más podrá editarla. La página está "bloqueada"
hasta que se guarden o descarten los cambios o hasta que se publique la página. Una
excepción es que, si la página no tiene actividad durante 5 minutos, la sesión de edición
terminará y la página se "desbloqueará".

4. Realice los cambios y, a continuación, seleccione Guardar como borrador para guardar los
cambios y cerrar el modo de edición. Si está listo para que los usuarios vean los cambios,
haga clic en volver a publicar. Para obtener más información sobre la publicación y el ciclo
de vida de una página, vea Administración y ciclo de vida de una página moderna .

Notas: Se necesitan permisos específicos para editar y cambiar el nombre de las páginas. Si
no puede cambiar el nombre de una página, póngase en contacto con el administrador del
sitio para asegurarse de que tiene permiso para eliminar elementos. Si no puede editar una
página, asegúrese de que tiene el permiso examinar información de usuario.

2.5. Cambiar título o URL de la página

1. Vaya al sitio donde está la página.


2. En la navegación de la izquierda o superior, haga clic en páginas.

16
Si no ve las páginas en el lado izquierdo o superior, haga clic en contenidos del
sitio desde configuración en la esquina superior derecha y, a continuación, en el lado
izquierdo de la página contenidos del sitio, haga clic en páginas.

3. Seleccione la página y, a continuación, haga clic en el botón Abrir el panel de detalle a


la derecha de la página seleccionada.

4. Dar clic en el valor que tiene el dato “Nombre” o “Título” y editarlo.

El nombre de la página, es muy importante para el motor de búsqueda, ya que sirve como
palabras claves para una búsqueda y por ello, es ideal usar entre 40 y 70 caracteres, y que sea
un nombre único y que corresponda al contenido de la página.

La mejor recomendación para la URL es reemplazar los espacios por guiones “-“, ésta es una
buena práctica para definir una URL que permita ser fácil de entender por un motor de
búsqueda.

Lastimosamente, en el tema de tildes, símbolos o acentos especiales como los de la “ñ” o “$”,
“%”, es ideal que no sean utilizados en la URL.

Ejemplo:
Nombre requerido – La “tasa de interés” ha subido 15%
URL: la-tasa-de-interes-ha-subido-15-porciento
Nombre de la página: La “tasa de interés” ha subido 15%
2.6. Tipo de diseño de la página

Para las páginas modernas diferentes a páginas de “publicaciones de noticias” y a la página


inicial del sitio, se tiene un botón en modo edición y permite realizar cambios en el tipo de
diseño de página. Esta funcionalidad es ideal para cambiar el encabezado de una página a
nivel de diseño.
17
Este botón aparece cuando se edita la página (no aplica para noticias o página inicial del
sitio), se puede visualizar el botón en la parte inferior derecha, dar clic y luego presionar la
opción “Cambiar tipo de diseño”

Presione “Guardar” para cambiar el tipo de diseño, en cualquier momento podrá volver a
cambiar el tipo de diseño.

Diseño: Página Básica – La página de tipo básica, corresponde a la página que contiene el
encabezado superior llamado “Área de título” y que permite definir directamente sobre el
contenido, una imagen de encabezado, un título, un autor, etc.

Diseño: Página Home – La página de tipo “home”, corresponde a la página que NO


contiene el encabezado superior, por lo tanto, sirve como páginas de contenido de estilo
“home” donde no se requiere visualizar en el contenido un título, un banner, un autor o una
fecha de publicación. Este tipo de diseño es similar a la página inicial del sitio.

18
2.7. Comentarios de me gusta y vistas

Las personas que vean la página pueden dejar comentarios y me gusta al final de la página.
También puede ver cuántas vistas tiene la página. Mantenga el “mouse” sobre me gusta para
ver a algunas de las personas que le han gustado a la página. Haga clic en me gusta y verá
una lista de todas las personas que le han gustado a su página.

Si no desea tener esta información en la página, debe desactivar los comentarios, opción que
se encuentra al final del contenido de la página:

Los comentarios solo pueden ser desactivados después de la primera vez que se ha
publicado la página. Al editar una página publicada puede ir a la parte inferior del contenido y
presionar el botón para “Desactivar”.

19
2.8. Guardar para más tarde

Las personas que vean la página pueden encontrarla más fácilmente más adelante usando la
opción Guardar para más tarde en la parte inferior de la página. Una vez que se hace clic en
guardar para más tarde, se guarda para más tarde y el icono asociado se rellena.

Cuando se hace clic en Guardar para más tarde, se muestra una lista de elementos
guardados recientemente. Puede hacer clic en Ver todos los elementos guardados para
ver la lista completa de elementos guardados.

2.9. Enviar la página por correo electrónico

Cuando use esta característica, puede enviar un correo electrónico con un vínculo, una vista
previa de miniatura, una descripción y un mensaje opcional a una o más personas.

20
Nota: Los contactos con los que comparta el vínculo deben tener los permisos adecuados
para poder ver la página.

1. En la parte superior de la página, haga clic en enviar por correo electrónico.


2. Escriba el nombre de las personas a las que desea enviar en el cuadro para: y agregue un
mensaje si lo desea.
3. Haga clic en Enviar.

2.10. Eliminar la página

5. Vaya al sitio donde está la página.


6. En la navegación de la izquierda o superior, haga clic en páginas.

Si no ve las páginas en el lado izquierdo o superior, haga clic en contenidos del


sitio desde configuración en la esquina superior derecha y, a continuación, en el lado
izquierdo de la página contenidos del sitio, haga clic en páginas.

7. Seleccione la página y, a continuación, haga clic en los puntos suspensivos (...) a la derecha de
la página seleccionada.

8. Haga clic en Eliminar.

21
3. Agregar una publicación de noticias a un sitio

La publicación de noticias está basada en páginas de sitio, por lo cual, todas las características
explicadas en el apartado anterior aplican para la funcionalidad de este tipo de páginas,
especialmente a nivel de las secciones y columnas, y el uso de elementos web. Es importante
conocer previamente la forma de Crear y usar páginas modernas en un sitio

3.1. Agregar una publicación de noticias (post)

1. Puede crear mensajes o publicaciones de noticias desde la Página principal de SharePoint o


desde el elemento Web noticias de cualquier página publicada:

• En la Página principal de SharePoint, haga clic en + crear publicación de noticias en


la parte superior de la página. Después, elija el sitio en el que desea publicar la
publicación de noticias.

O bien

• En una página publicada que tiene un elemento Web noticias, haga clic en +
Agregar en el elemento Web noticias para empezar a crear la publicación.

22
2. Empiece por agregar un nombre que sirva como titular. Puede usar la barra de herramientas
de imagen de la izquierda para agregar o cambiar una imagen.

Notas: Cuando se agrega un nombre de página en el área de título, SharePoint utiliza este
nombre para definir la URL de la página, por tal motivo, se sugiere agregar un nombre
basado las recomendaciones de los apartados Personalizar el área de título y Cambiar
título o URL de la página, y así aplicar las mejores prácticas en la asignación del título y la
URL de una página.

3. Haga clic en + para agregar elementos Web, como texto, imágenes, vídeos y mucho
más. Obtenga información sobre Usar elementos Web en páginas modernas

4. Cuando haya terminado la creación de la página, haga clic en Publicar en la esquina superior
derecha y verá que el artículo aparece en la sección de noticias como el artículo más reciente.

Nota: Los últimos artículos se muestran en orden cronológico desde el más reciente al más
antiguo en función de su fecha de publicación inicial (la edición de un artículo no cambiará su
orden). Obtenga más información sobre Agregar una publicación de noticias a un sitio.

23
3.2. Agregar una publicación como un vínculo de noticias

Puede Agregar un vínculo a contenido de su sitio o de otro sitio web con el vínculo noticias.
El contenido vinculado aparecerá como publicación de noticias.

1. Vaya al sitio con noticias donde quiera agregar la publicación. En la Página principal, haga clic
en + nuevo y, a continuación, haga clic en vínculo a noticias.

Si está en otra página y no ve el vínculo de noticias como una opción de menú, agregue un
elemento Web de noticias a la página en primer lugar y, a continuación, haga clic en +
Agregar en noticias.

2. En el campo vínculo, pegue la dirección web en un elemento de noticias existente. Verá


varios campos más.

3. En el campo imagen de título, agregue un título que se mostrará para el elemento de noticias
en la Página principal. Este campo es obligatorio.

24
4. Haga clic en Agregar miniatura o cambiar para agregar o cambiar una imagen en miniatura
opcional. Puede elegir uno de los siguientes orígenes de la imagen:

o Recientes Imágenes devuelve imágenes que ha usado o agregado recientemente al sitio de


SharePoint.
o La búsqueda en Internet hace una búsqueda de Bing de imágenes en la web en una
selección de categorías. Puede establecer filtros de tamaño (pequeñas, medianas, grandes, x-
grandes o todas), diseño (cuadrado, ancho, alto o todo), o Creative Commons o todas las
imágenes.
o Onedrive le muestra la carpeta de onedrive asociada al sitio en el que puede navegar y
seleccionar imágenes.
o Sitio ofrece bibliotecas de documentos en el sitio de SharePoint donde puede seleccionar las
imágenes que desea usar.
o Cargar abre una ventana donde puede seleccionar una imagen del equipo local.
o Desde un vínculo proporciona un archivado para pegar en un vínculo a una imagen en
OneDrive para la empresa o en su sitio de SharePoint. No puede vincular a imágenes de otros
sitios o de la Web.

Haga clic en abrir para usar una imagen seleccionada.

5. Agregue o edite la descripción en el campo Descripción. Esto es opcional.

25
6. Haga clic en publicar para agregar el vínculo a la Página principal.

3.3. Enviar la publicación de noticias por correo electrónico

Cuando use esta característica, puede enviar un correo electrónico con un vínculo, una vista
previa de miniatura, una descripción y un mensaje opcional a una o más personas.

Nota: Los contactos con los que comparta el vínculo deben tener los permisos adecuados
para poder ver la página.

• En la parte superior de la página de publicación de noticias, haga clic en enviar por correo
electrónico.
• Escriba el nombre de las personas a las que desea enviar en el cuadro para: y agregue un
mensaje si lo desea.
• Haga clic en Enviar.

26
3.4. Buscar publicaciones de noticias

Las publicaciones de noticias se guardan en la biblioteca de páginas de un sitio.

3.5. Quitar publicaciones de noticias

1. Haga clic en ver todo.


2. Haga clic en Administrar publicaciones.
3. Busque la página que desea quitar.
4. Haga clic en los puntos suspensivos (...) a la derecha de la página y después haga clic
en Eliminar.

• En la navegación de la izquierda o superior, haga clic en páginas.

Si no ve las páginas en el lado izquierdo o superior, haga clic en contenidos del


sitio desde configuración en la esquina superior derecha y, a continuación, en el lado
izquierdo de la página contenidos del sitio, haga clic en páginas.

• Haga clic en los puntos suspensivos (...) y, a continuación, haga clic en eliminar.
• En el cuadro de diálogo de confirmación, haga clic en eliminar.

27
3.6. Dónde se muestra la noticia

Las noticias se muestran en la Página principal de SharePoint, en sitios de grupo, sitios de


comunicación, sitios de concentrador (hubsites) y en la aplicación móvil. Incluso recibirás una
notificación en tu dispositivo móvil cuando se publiquen noticias. También puede elegir
mostrar noticias en un canal de Teams.

Notificaciones en dispositivos móviles

Cuando alguien de su esfera cerrada de trabajo publique un artículo de noticias importante y


relevante en un sitio en el que esté activo, recibirá una notificación en el dispositivo móvil
"desde SharePoint" dentro de la bandeja de notificaciones del dispositivo. Al hacer clic en una
notificación, se le trae directamente a la aplicación móvil de SharePoint para ver el artículo de
noticias y todo su contenido enriquecido e interactivo de datos.

28
Noticias de la organización

Las noticias pueden provenir de muchos sitios diferentes. pero puede haber un sitio "oficial" o
"corporativo" para las noticias de la organización. Las noticias de estos sitios se distinguen
por un bloque de color en el título como una indicación visual y se intercalan en todas las
publicaciones que se muestran para los usuarios de la Página principal de SharePoint en
Office 365. En la siguiente imagen se muestran noticias de la Página principal de SharePoint,
donde noticias @contoso es el sitio de noticias de la organización.

29
4. Administración y ciclo de vida de una página moderna

Las páginas modernas de SharePoint le ofrecen muchas de las mismas funciones que
proporcionan las páginas de los sitios de publicación clásicos. Una vez después de Crear y
usar páginas modernas en un sitio, se puede editar, guardar, publicar y compartir. Una
página también se puede eliminar o restaurar a una versión diferente. También puede
configurar un flujo de aprobación de contenido.

4.1. Ciclo de vida de página

Crear: El ciclo de vida de una página comienza con su creación. La


primera vez que crea una página, se encuentra en un estado de borrador "local", lo que
significa que nadie más puede verla aún.

Guardar como borrador: Al guardar y cerrar esta página, se protege


como una versión secundaria y se convierte en un borrador "compartido". Esto significa que
cualquier persona con permisos de edición (o propietarios de sitios) puede verlo y editarlo.

Editar: Para editar la página, haga clic en el botón Editar y la página ya está
desprotegida para usted. Siempre que la página esté abierta para su edición o
desprotegida, nadie más podrá editarla. La página está "bloqueada" hasta que se guarden o
desaparezcan los cambios o hasta que se publique la página. Una excepción es que si la
página no tiene actividad durante 5 minutos, la sesión de edición terminará y la página se
"desbloqueará".

Descartar cambios: Al descartar los cambios, la página vuelve a su estado


anterior. Es equivalente a "Deshacer desprotección".

Publicar: Cuando se publica una página haciendo clic en el botón publicar, se


protege como una versión "principal" y se muestra "en vivo", lo que significa que cualquier
persona que pueda ver su sitio puede ver la página.

Volver a publicar: Cuando se edita una página que se publicó


anteriormente, el botón volver a publicar protege la página como la siguiente versión

30
"principal" y los cambios van "en vivo", lo que significa que cualquier persona que pueda ver
su sitio puede ver la nueva versión modificada.

4.2. Ciclo de vida de la página con aprobación de contenido

El ciclo de vida de una página con la aprobación de contenido activada es ligeramente


diferente, ya que una página debe ser aprobada por alguien antes de que se pueda publicar.
Los aprobadores deben ser propietarios del sitio o personas con permisos de control total o
de edición para el sitio.

A continuación, se muestran fases adicionales para la publicación de páginas cuando la


aprobación de contenido está activada con el flujo. Aquí no se incluyen pasos para los flujos
de aprobación que requieren varios aprobadores o para los flujos de aprobación
personalizados.

Enviar para aprobación: Cuando la página está lista para


publicarse, el autor de la página envía la página para su aprobación.

Aprobación pendiente: Hasta que se apruebe una página, permanecerá en estado


pendiente.

Revisar aprobaciones: La persona (s) designada como aprobadores


recibirá una notificación y verá un botón Revisar aprobaciones donde puede ver la
página. Los aprobadores no pueden editar el contenido; solo pueden aprobar o rechazar o
contenido. Pueden enviar comentarios junto con la notificación que recibe el autor de la
página.

Publicar: Cuando se aprueba una página, se publica y se protege como una


versión "principal" y se muestra como "en vivo", lo que significa que cualquier persona que
pueda ver su sitio puede ver la página.

La manera recomendada de usar la aprobación de contenido en las páginas modernas es usar


el flujo de Microsoft.

31
4.3. ¿Quién puede editar una página?

Cualquier persona a la que haya dado permisos de edición para poder editar una página. En
un sitio de comunicaciones o de grupo, agregar alguien al grupo de sitio de grupo, esta
persona tendrá permisos de edición de forma predeterminada. En un sitio de comunicación,
solo los propietarios de sitios y aquellos que haya dado permisos de edición pueden editar.

Al hacer clic en Editar en una página, la página se desprotege, lo que significa que nadie más
puede editarla, a menos que guarde y cierre la página, deseche cambios o publique la página.
Cada una de estas acciones vuelve a compaginar la página.

Cuando alguien desprotege una página por error, o se olvida de guardar y cerrar, descartar
cambios o publicar, la página se guardará y cerrará automáticamente después de 5 minutos
de inactividad.

Dos personas no pueden editar la misma página al mismo tiempo. Si una persona tiene
una página abierta para editarla y otra persona intenta editar la página, se muestra un
mensaje en el que se muestra que la página está siendo editada por otra persona. Puede
solicitar a la persona que tiene la página abierta para que la edite "suelte" la página
guardando y cerrando, descartando los cambios o publicando. Una excepción es que, si la
página no tiene actividad durante 5 minutos, el tiempo de espera de la sesión de edición se
cerrará automáticamente y la página se "desbloqueará".

El propietario de un sitio tiene una opción adicional para invalidar la desprotección de la


persona que está editando la página.

4.4. Buscar páginas

Las páginas se almacenan en la biblioteca de páginas, a la que se puede acceder haciendo clic
en páginas en la navegación. Si páginas no se muestra en la navegación, puede ir
a configuración del sitio , a continuación, contenido del sitio, y buscar páginas del sitio.

4.5. Restaurar una versión anterior

1. Vaya a la biblioteca de páginas.


2. Haga clic con el botón secundario del “mouse” en el espacio entre el nombre de la página y la
fecha y, después, haga clic en historial de versiones en el menú. Es posible que tenga que
desplazarse por el menú para ver el historial de versiones.

32
Si no ve historial de versiones, haga clic en los puntos suspensivos (...) en el cuadro de
diálogo y, a continuación, haga clic en historial de versiones.

Verá una lista de versiones del archivo.

3. En el cuadro de diálogo historial de versiones, mantenga el puntero al lado de la versión


que desee y haga clic en la flecha hacia abajo en el lado derecho para obtener una lista de
opciones.

Haga clic en Restaurar.

4. Haga clic en Aceptar para restaurar la versión actual como la más reciente.

Nota: SharePoint no quita la versión anterior que acaba de restaurar, crea una copia y la
convierte en la última versión.

33
4.6. Proteger y desproteger páginas de la biblioteca de páginas

Le recomendamos que use los comandos Editar, guardar y cerrar, descartar


cambios y publicar de la página para administrar la protección de las páginas. Sin embargo,
puede proteger y desproteger manualmente las páginas con los mismos pasos que usaría en
cualquier biblioteca de documentos.

4.7. Anular la publicación de una página

Si ya no desea que otras personas vean la página o que se encuentre en las búsquedas,
puede anular la publicación:

• Vaya a la biblioteca de páginas


• Seleccione la página en la que desea anular la publicación.
• Haga clic en ... y, a continuación, haga clic en más.
• Haga clic en anular la publicación.

Esto vuelve a colocar la página en un estado de borrador. Sin embargo, la página seguirá
apareciendo en los resultados de búsqueda. Si no desea que esto suceda, quite los permisos
de la página. para ello, vaya a la biblioteca páginas, haga clic en ..., haga clic en más y, a
continuación, haga clic en propiedades. En la parte superior, haga clic en compartido con. A
continuación, haga clic en dejar de compartir.

34
5. Agregar o quitar secciones y columnas de una página moderna

Puede Agregar columnas a secciones dentro de páginas modernas de SharePoint. Para


mostrar el contenido en paralelo, puede Agregar hasta tres columnas a cada sección. Si está
trabajando en una página que forma parte de un sitio de comunicación, puede crear una
columna que abarque toda la página (incluidos sus bordes), agregando una columna de
ancho completo. También puede apilar varias secciones con un número variable de columnas.

5.1. Agregar una sección con columnas a una página

1. Vaya a la página donde desea agregar columnas.


2. Si ya no está en modo de edición, haga clic en Editar en la parte superior derecha de la
página.
3. Mueva el “mouse” por debajo del área de título de la página al extremo izquierdo o por
encima o por debajo de un elemento Web existente al extremo izquierdo de la página y verá
una línea con un círculo +, como este con una información sobre herramientas que
indica Agregar una nueva sección:

4. Haga clic en .
5. En diseño de sección, seleccione el número de columnas que desee, o bien, si está en una
página que forma parte de un sitio de comunicación, puede seleccionar una columna de
ancho completo para que abarque toda la página (incluidos sus bordes).

35
Nota: La columna de ancho completo no está disponible en las páginas que forman parte de
los sitios de grupo. Solo está disponible en las páginas que forman parte de sitios de
comunicación.

5.2. Cambiar una sección existente

Nota: Si tiene contenido en dos o más columnas y, a continuación, reduce el número de


columnas, el contenido de la columna derecha se desplazará a la siguiente columna de la
izquierda. Si se reduce a una columna, el contenido de las columnas segunda o tercera se
moverá a la parte inferior de la primera columna.

1. Vaya a la página donde desea cambiar una sección.


2. Si ya no está en modo de edición, haga clic en Editar en la parte superior derecha de la
página.
3. Cada sección de una página se marca con una línea de puntos. En la sección a la que desea
agregar columnas, haga clic en Editar sección en el lado izquierdo de la página.

4. En el cuadro de herramientas de la sección de la derecha, elija el número y el tipo de


columnas que desea, y si desea destacar la sección o hacer que la página sea más atractiva,
elija un color de fondo para la sección. Los colores disponibles se basan en el tema del sitio.
Para usar otros colores como “Fondo de sección”, utilice el Elemento web: Fondo de
sección.

36
Notas: El color de fondo de la sección se muestra en la mayoría de los elementos Web, como
en el elemento Web de texto que se muestra a continuación (a la izquierda). Otros elementos
Web mantienen el fondo de la página en lugar de la sección. Por motivos de accesibilidad, los
elementos Web lista, biblioteca de documentos y gráfico rápido siempre mantendrán el
fondo de la página (un ejemplo es el elemento web gráfico rápido a continuación). Los
elementos Web que eventualmente permitirán que el fondo de la sección se muestre, pero no
hoy, son: actividad del sitio, conversaciones de Yammer, aspectos destacados de Yammer,
propiedades de lista, propiedades de página, calendario de grupo, noticias de Bing y
aplicaciones de Power de Microsoft. Para obtener los mejores resultados, se recomienda no
usar un color de fondo de sección para las secciones que contengan estos elementos Web.

5.3. Agregar contenido a una columna

1. Si ya no está en modo de edición, haga clic en Editar en la parte superior derecha de la


página.
2. Vaya a la columna en la que desea agregar contenido.
3. Mantenga el “mouse” sobre la columna y haga clic en .
4. Seleccione el elemento Web que desea agregar a la columna y, a continuación, agregue el
contenido al elemento Web. Obtenga información sobre Usar elementos Web en páginas
modernas

37
6. Tamaño y escala de la imagen en páginas modernas

Las páginas modernas y los elementos Web están diseñados para que respondan
completamente en todos los dispositivos, lo que significa que las imágenes que se usan en
los elementos Web se escalarán de forma diferente según dónde se muestren, qué diseño se
usa y el dispositivo en el que se visualizan. Por ejemplo, las páginas modernas están
diseñadas para tener una apariencia excelente en dispositivos móviles y la escala automática
de imágenes ayuda a crear esa atractiva experiencia.

6.1. ¿Cuáles son los tamaños de imagen óptimos?

Debido al diseño de página con capacidad de respuesta, no hay un alto o ancho específico en
píxeles que garanticen que una imagen mantendrá una forma específica en todos los
dispositivos y diseños. Las imágenes se recortan automáticamente para mostrar el mejor
resultado posible en una variedad de dispositivos y diseños. Sin embargo, hay algunas
directrices que pueden ayudarte a asegurarte de que tus imágenes tengan un aspecto
estupendo en las páginas.

Buscar los mejores tamaños de imagen para la página depende de estos factores:

• Relación de aspecto: la relación entre el alto y el ancho de las imágenes


• Diseño de columna: el tipo y el número de columnas de la página
• Diseño del elemento Web: el diseño que elija para el elemento Web en el que se usa la
imagen.

38
6.2. Relación de aspecto

Una relación de aspecto es la relación entre el ancho y el alto de las imágenes. Normalmente
se expresan como dos números, como 3:2, 4:3 o 16:9. El ancho es siempre el primer número.
Como ejemplo, una proporción de 16:9 podría ser de 1600 píxeles de ancho por 900 píxeles
de alto. O bien, puede ser 1920 x 1080, 1280 x 720, o cualquier otra combinación de ancho y
alto que pueda calcularse para igualar 16:9. Puede encontrar cálculos de relación de aspecto
en línea y en algunas herramientas de edición de fotografías para ayudarle a determinar las
relaciones de aspecto de las imágenes.

En la mayoría de los casos, las imágenes de los elementos Web modernos funcionan mejor en
todos los diseños y dispositivos cuando tienen una relación de aspecto de 16:9 o 4:3, según el
diseño.

6.3. Diseños de columna

Se puede disponer de una página con secciones que incluyan distintos tipos de columna y
diseños, como columnas de ancho completo, una columna, dos columnas, tres columnas, una
tercera columna a la izquierda y una tercera columna hacia la derecha.

Una regla general para las imágenes que se espera que rellenen el ancho de una columna es
que son al menos tan anchas como la columna en la que se colocan. Por ejemplo, una imagen
de un elemento Web imagen en una columna debe tener al menos 1204 píxeles de ancho. A
continuación, se muestran las pautas de ancho para cada uno de los diseños de columna:

39
Diseño Ancho en píxeles
Columna de ancho completo 1920
Una columna 1204
Dos columnas 586 por columna
Tres columnas 380 por columna
Una tercera columna hacia la 380 para la columna izquierda; 792 para la columna
izquierda derecha
Una tercera columna derecha 792 para la columna izquierda; 380 para la columna
derecha

Debido a la naturaleza de capacidad de respuesta de las páginas, las imágenes de las


columnas de ancho completo siempre se mostrarán a la anchura completa de la pantalla con
un alto automático basado en el tamaño de la pantalla.

El alto de las imágenes colocadas dentro de otras plantillas de columna dependerá de la


relación de aspecto. Estas son las directrices de alto y ancho para las relaciones de aspecto
16:9 y 4:3 (redondeadas hacia arriba o hacia abajo al píxel más cercano). Esto resulta útil para
mantener las imágenes a un ancho y alto que se ajustan adecuadamente a los dispositivos
móviles, por ejemplo.

RELACIÓN DE 16 x 9 4x3
ASPECTO
Una columna 1204 x 677 1204 x 903
Dos columnas 586 x 330 586 x 439
Tres columnas 380 x 214 380 x 285
Una tercera 380 x 446 para la columna 380 x 594 para la columna
columna hacia la izquierda; 792 x 446 para la izquierda; 792 x 594 para la
izquierda columna derecha columna derecha
Una tercera 792 x 446 para la columna 792 x 594 para la columna
columna derecha izquierda; 380 x 446 para la izquierda; 380 x 594 para la
columna derecha columna derecha

40
6.4. Diseños de elementos Web

Los diseños de los elementos Web que use también afectarán a la escala de las imágenes. En
los ejemplos siguientes se muestran diferentes elementos Web y sus diseños dentro de una
columna, así como las relaciones de aspecto que se usan en cada uno.

Considere esta imagen que tiene una relación de aspecto original de 16:9:

A continuación, se muestran algunos ejemplos de esta imagen que se muestra en un diseño


de página de una columna, en diferentes diseños y elementos Web.

Elemento Las siguientes relaciones de aspecto para los diseños de mosaicos y capas son:
web:
Elemento • Mosaicos: el alto del elemento Web se escala para seguir una relación de aspecto de 8:3
principal
y las imágenes dentro del elemento Web escalan a una relación de aspecto de 4:3.
(Hero:
• Capas: una capa individual escala hasta una relación de aspecto de 8:3, y las imágenes
banner de
imágenes y dentro de cada capa escalan a una relación de aspecto cercana a 16:9.
vínculos) • En dispositivos móviles, se usa un diseño de carrusel en 16:9.

Este es un ejemplo de una imagen que se muestra en el diseño capas (parte superior) y
diseño de mosaicos (abajo)

41
Elemento 16:9 es la relación de aspecto de los diseños de carrusel, tira de fotografías y tarjetas.
web:
Contenido Este es un ejemplo de una imagen que se muestra en el diseño de tira de película (arriba)
resaltado
y diseño de tarjetas (parte inferior).

42
Elemento Las imágenes se expandirán al ancho de la sección que contiene el elemento Web. Tiene
web: la opción de cambiar la relación de aspecto o el recorte de mano libre con la barra de
imagen herramientas de imagen.

Este es un ejemplo que muestra las marcas de recorte de imagen (líneas azules) en 4:3

Elemento Las siguientes relaciones de aspecto se usan en diferentes diseños:


web:
Galería de • El diseño de ladrillos respeta la relación de aspecto de todas las imágenes que se
imágenes
muestran: 16:9, 1:1, 4:3, etc.
• Mosaicos, tarjetas: 4:3

Este es un ejemplo de una imagen que se muestra en el diseño de mosaicos (superior) y


el diseño de ladrillos (abajo)

43
Elemento Según el diseño, las imágenes del elemento Web noticias pueden ser 4:3, 16:9 o 21:9.
web: Este es un ejemplo de imágenes en una historia superior y un diseño de carrusel.
Noticias o
novedades

44
Personaliza Las imágenes tienen mejor aspecto si se encuentran en el entorno o en 16:9 o más en
r el área de relación de aspecto y cuando tienen al menos 1 MB de tamaño. Además, asegúrese de
título establecer un punto focal para mantener la parte más importante de la imagen en la
vista, sobre todo cuando la imagen se use en miniaturas, diseños de noticias y resultados
de búsqueda.

Ejemplo (imagen original 16:9) con punto focal establecido en el altavoz.

Miniatura Las miniaturas de página se muestran en lugares como resultados de búsqueda,


de página resultados de contenido resaltado, publicaciones de noticias y mucho más. De forma
predeterminada, la miniatura proviene del área de título de la página o del elemento
Web que se encuentra en el primer orden de la página (por ejemplo, en la parte superior
izquierda de un diseño de página). Puede reemplazar el valor predeterminado y cambiar
la miniatura de la página. Al hacerlo, es mejor usar una imagen con una relación de
aspecto 16:9.

Ejemplo (imagen original 16:9)

45
Elemento El elemento Web vínculos rápidos tiene seis diseños diferentes. Estas son las
web: proporciones de aspecto recomendadas:
Vínculos
rápidos
• Tira de película, cuadrícula, botón: 16:9
• Compacto, lista, mosaicos: 1:1, 4:3

Este es un ejemplo de una imagen que se muestra en un diseño compacto (parte


superior) y un diseño de tira de película (abajo)

Sugerencias: Al agregar una imagen a un área de título de página o a un elemento Web de


un héroe, también es mejor establecer el punto focal en el área de la imagen que desea que
se muestre siempre.

46
7. Plantillas para páginas modernas

Ha creado una página fantástica y desea que esté disponible para otros usuarios como punto
de partida para sus páginas. O bien, tiene que crear una página, pero no está seguro de
dónde comenzar. Una plantilla de página puede ser la manera de ir.

Notas: Debe ser un propietario del sitio o un administrador de SharePoint para agregar
páginas y plantillas. Si es un propietario de un sitio, pero no puede agregar una página, es
posible que el administrador haya desactivado esa funcionalidad.

A continuación, se explica cómo funciona una plantilla de página: una vez que haya creado
una plantilla, otras personas podrán elegirla de la galería de plantillas y usarla como punto de
partida para sus propias páginas. Una vez que se crea la página, pueden hacer los cambios
que deseen en la página sin que ello afecte a la plantilla desde la que comenzaron. De forma
similar, si la plantilla de página se modifica o cambia más adelante, no afectará a una página
que ya se haya creado a partir de esa plantilla.

7.1. Usar una plantilla

1. Haga clic en nuevo en la parte superior de un sitio o página existentes y


elija página o publicación de noticias.
2. Elija la plantilla desde la que quiere empezar. Si desea empezar una página desde cero, haga
clic en blanco.

3. Agregue el contenido. También puede realizar cambios como agregar o quitar elementos
Web, mover elementos Web, etc. Los cambios que realice no afectarán a la plantilla con la

47
que ha empezado. Para obtener más información sobre la creación de páginas y el uso de
elementos Web, vea Crear y usar páginas modernas en un sitio.
4. Cuando haya terminado, guarde la página haciendo clic en Guardar como borrador.
5. Cuando esté listo para que la página sea visible para todos los usuarios que tengan acceso a
su sitio, haga clic en publicar o publicar noticias (para publicaciones de noticias).

7.2. Crear una plantilla

1. Cree o abra una publicación de noticias o una página que desee usar como base para la
plantilla. Agregue o cambie los elementos Web y el contenido que desea incluir en la plantilla,
como lo haría en cualquier página nueva. Para obtener más información sobre la creación de
páginas y el uso de elementos Web. vea Crear y usar páginas modernas en un sitio y Usar
elementos Web en páginas modernas.
2. Cuando la página tenga el aspecto que desee, haga clic en la flecha abajo situada junto
a Guardar en la parte superior de la página y haga clic en Guardar como plantilla.

Notas: Una forma alternativa de crear una plantilla es ir a una página publicada que desee
usar como base para la plantilla, hacer clic en el botón promocionar y, a continuación, hacer
clic en Guardar como plantilla de página.

Las páginas de plantilla no se publican; solo se pueden publicar las páginas creadas a partir
de las plantillas.

7.3. Buscar, cambiar o quitar una plantilla

Buscar plantillas

Las plantillas de página son copias de páginas almacenadas en un estado de borrador en la


carpeta plantillas de la biblioteca de páginas. Las páginas de plantilla no se publican; solo se
pueden publicar las páginas creadas a partir de las plantillas.

Una forma fácil de llegar a la carpeta plantillas es:

1. Haga clic en nuevo en la parte superior de un sitio o página existentes.


2. En la parte inferior de la galería de plantillas que se abre, haga clic en Ver carpeta de
plantillas.

48
Editar una plantilla

Para editar una plantilla, puede abrirla desde la carpeta plantillas en la biblioteca
de páginas y hacer clic en Editar.

Eliminar una plantilla

Para eliminar una plantilla, selecciónela de la carpeta plantillas en la biblioteca de páginas,


haga clic con el botón secundario en la plantilla y haga clic en eliminar.

49
8. Usar elementos Web en páginas modernas

Al Crear y usar páginas modernas en un sitio, se agregan y personalizan elementos Web, que
son los bloques de creación de la página. Puede Agregar texto, imágenes, archivos, vídeo,
contenido dinámico y mucho más con los elementos Web que se indican en este documento.

Agregar un elemento web

1. Vaya a la página en la que desea agregar un elemento Web.


2. Si no ve la página del sitio que desea, haga clic en contenidos del sitio en la barra de inicio
rápido, en la lista de contenido, haga clic en páginas del sitio y, a continuación, haga clic en
la página que desee.
3. Si la página no está en modo de edición, haga clic en Editar en la parte superior derecha de
la página.
4. Pase el “mouse” por encima o por debajo de un elemento web para ver una línea con un + en
un círculo, como este:

5. Haga clic en + y verá una lista de elementos Web para elegir. Para encontrar fácilmente el
elemento Web que está buscando, empiece a escribir en el cuadro de búsqueda.

50
O bien, haga clic en expandir para mostrar una vista más grande de los elementos Web
por categoría. También puede ordenar los elementos Web en esta vista.

Mover o quitar un elemento Web

1. Si la página no está en modo de edición, haga clic en Editar en la parte superior derecha de
la página.
2. Mantenga el “mouse” sobre el elemento Web que desea mover o quitar y verá una pequeña
barra de herramientas a la izquierda del elemento Web.

Para mover el elemento Web, haga clic en el botón mover elemento Web y arrastre el
elemento Web hasta donde desee que aparezca en la página.

Para quitar el elemento Web, haga clic en el botón Eliminar elemento Web .

51
Microsoft ha ofrecido un sitio Web donde se pueden visualizar diferentes diseños credos bajo
la experiencia moderna que pueden servir de inspiración para la construcción de sitios dentro
de SharePoint en Office 365.

Páginas para sitios de comunicaciones, sitios de equipos de trabajo, intranets o sitios


concentradores (hubsites)

https://sharepointlookbook.azurewebsites.net/

Elementos Web disponibles

A continuación, se muestra una lista de elementos Web que puede usar en una página:

8.1. Elemento web: Noticias o novedades

1. Si la página aún no está en modo de edición, haga clic en Editar en la parte superior derecha
de la página.
2. Pase el “mouse” por encima o por debajo de un elemento web para ver una línea con un + en
un círculo, como este:

3. Haga clic en .
4. En el cuadro búsqueda de elementos Web, escriba novedades para buscar y seleccionar el
elemento Web noticias rápidamente.

52
5. Haga clic en el botón Editar a la izquierda del elemento Web para abrir el panel de
propiedades y establecer opciones como la fuente de noticias, el diseño, la organización y el
filtrado.

Fuentes de noticias

Al trabajar con un elemento Web de noticias, puede especificar el origen de las publicaciones
de noticias. Las publicaciones de noticias pueden provenir del sitio en el que se encuentra al
usar el elemento Web (este sitio), un sitio de concentrador al que pertenece el sitio actual
(todos los sitios del Hub) o uno o más sitios individuales (seleccionar sitios). Otra opción es
elegir recomendado para el usuario actual, que mostrará las publicaciones de lugares como
los sitios a los que pertenece el usuario actual, los sitios visitados con frecuencia y otras
novedades de Office Delve.

1. Si no está en modo de edición, haga clic en Editar en la parte superior derecha de la página.

2. Haga clic en Editar elemento Web en el lado izquierdo del elemento Web noticias.
3. Elija este sitio, seleccione sitios o recomendado para el usuario actual. Si su sitio está
conectado a un sitio del concentrador, verá una opción adicional para todos los sitios del
concentrador.

Al hacer clic en seleccionar sitios, puede buscar el sitio que desea agregar, o seleccionar uno
o varios sitios de sitios asociados con este concentrador, sitios frecuentes o sitios
recientes.

53
Noticias de la organización

Las noticias pueden provenir de muchos sitios diferentes. pero puede haber un sitio "oficial" o
"autoritativo" para las noticias de la organización. Las noticias de estos sitios se distinguen
por un bloque de color en el título como una indicación visual y se intercalan en todas las
publicaciones que se muestran para los usuarios de la Página principal de SharePoint en
Office 365. En la siguiente imagen se muestran noticias de la Página principal de SharePoint,
donde noticias @contoso es el sitio de noticias de la organización.

54
Diseños de noticias

Puede elegir entre diferentes diseños para las noticias. El diseño predeterminado dependerá
de si el sitio es un sitio de grupo, un sitio de comunicación o parte de un sitio de
concentrador.

En un sitio de grupo, el diseño predeterminado de las noticias se denomina Artículo


principal. Incluye un gran espacio de imagen y tres historias adicionales.

El diseño Lista muestra las noticias en una sola columna.

En un sitio de comunicación, el diseño predeterminado se denomina En paralelo y es una


lista de dos columnas de historias.

55
En un sitio concentrador, el diseño predeterminado de las noticias se denomina Noticias del
concentrador, que incluye las columnas de historias con miniaturas e información, además
de una barra lateral de titulares de historias adicionales.

Un diseño adicional es carrusel, que muestra un gran número de elementos visuales y


permite a los usuarios desplazarse por las historias con los botones atrás y siguiente, o los
iconos de paginación. También puede elegir desplazarse automáticamente por las imágenes
del carrusel.

56
Para cambiar el diseño:

1. Si no está en modo de edición, haga clic en Editar en la parte superior derecha de la página.

2. Haga clic en Editar elemento Web en el lado izquierdo del elemento Web noticias.
3. Si desea ocultar el comando título y ver todo en la parte superior del elemento Web, cambie
el botón de alternancia a desactivado en Mostrar título y comandos.
4. Seleccione el diseño que quiera.

5. Para los diseños de lista y carrusel, puede usar el control deslizante para seleccionar
el número de elementos de noticias que desea mostrar. Para el diseño carrusel, puede
elegir desplazarse automáticamente por los elementos de noticias deslizando el botón de
alternancia para activado.
6. Puede mostrar u ocultar una vista compacta (una vista sin imágenes que ocupa menos
espacio) para el diseño de la lista, o mostrar u ocultar una vista compacta en otros diseños
cuando se trata de anchos estrechos (como una ventana estrecha o en una vista móvil)
deslizando el botón de alternancia para Mostrar vista compacta o Mostrar vista compacta
en ancho estrecho en activado o desactivado.

57
Filtrar

Puede filtrar las publicaciones que desea mostrar por título, agregados o modificados
recientemente, creados por, y propiedades de Página.

Organización

Puede poner las publicaciones en el orden en que desea que aparezcan en la página. Puede
pensarlo como las publicaciones de noticias "ancladas" en la posición que desee.

1. En organizar, haga clic en seleccionar noticias para organizar.

58
2. En el panel grande que aparece, arrastre las noticias recientes de la izquierda a la posición
numerada que desee a la derecha. Si no ve las noticias que desea seleccionar, use el cuadro
de búsqueda para encontrarla.

Cualquier posición numerada en la que no arrastre las historias se mantendrá en automático,


lo que significa que el elemento Web noticias mostrará las historias en esas posiciones en el
orden de la fecha de publicación.

Si desea reordenar las historias después de arrastrarlas a la posición, seleccione el elemento y


use el teclado CTRL + flecha arriba y CTRL + flecha abajo.

3. Cuando haya terminado, haga clic en la X de la parte superior derecha para cerrar el panel.

59
8.2. Elemento web: Texto

Use el elemento web de texto para agregar los párrafos a la página. Opciones de formato
como estilos, viñetas, las sangrías, resaltar, y los vínculos están disponibles.

Para usar el elemento web de texto, haga lo siguiente:

1. En la página, pasar el mouse encima o debajo de un sitio web parte y verá una línea con un
círculo con +, similar a esta:

2. Haga clic en + y, a continuación, elija el texto de la lista de elementos web.


3. Haga clic dentro del cuadro y se mostrará la barra de herramientas Formato.

4. Escriba el texto y darle formato con la barra de herramientas Formato. Para abrir o cerrar el
panel de formato de tabla y el texto, haga clic en los puntos suspensivos (...) en el lado
derecho de la barra de herramientas.

60
En el panel formato, puede hacer todo lo que puede hacer en la barra de herramientas más:

o Deshacer y rehacer cambios


o Borrar formato del texto seleccionado
o Elegir entre 10 tamaños de fuente disponibles
o Cambiar el color de fuente mediante estándar o colores del tema (cambiar colores de tema
para reflejar el tema del sitio)
o Agregar un color de resaltado
o Utilice tachado
o Usar subíndice y superíndice
o Puedo aumentar o disminuir sangría
o Puedo insertar una tabla y elija estilos de tabla y alineación

Insertar un hipervínculo

1. Haga clic en hipervínculo en la barra de herramientas o en el texto y el panel de


formato de tabla, o use CTRL + K. Si selecciona una palabra antes de hacer clic, se usa como
una palabra clave para buscar páginas.

61
2. En el cuadro de diálogo Insertar vínculo, escriba la dirección del vínculo en el
cuadro dirección y el texto que desea vincular en el cuadro de texto para mostrar.

Opcionalmente, si desea establecer un vínculo a una página en el sitio, puede buscar


mediante el cuadro de búsqueda y, a continuación, seleccione la página en la lista de
resultados.

3. Cuando haya terminado, haga clic en Guardar.

Insertar una tabla

1. Haga clic en el botón Insertar tabla en el texto y el panel de formato de tabla. Se inserta una
tabla simple de 3 columnas y 3 filas.

Puede dar formato al texto de la tabla utilizando el formato de herramientas disponibles en la


barra de herramientas o en el texto y el panel de formato de tabla de texto.

Seleccionar un estilo de tabla

Puede elegir un estilo de tabla simple o un estilo de tabla con temas. Los estilos de tabla con
temas (que se muestra en la segunda fila) reflejan el color de tema utilizado en su sitio. De
izquierda a derecha, se muestran los estilos de tabla:
62
o Sin formato
o Encabezado sutil (encabezado tiene un borde inferior)
o Encabezado (fila de encabezado tiene sólido de color e invertir fuente)
o Las filas alternas (fila de encabezado tiene inverso fuente y color sólido y las filas alternas
sombreadas)
o Encabezado de columna (fila de encabezado tiene un color sólido y fuente inversa, primera
columna y filas alternas están sombreadas)

Insertar y eliminar filas y columnas

Agregar o quitar filas o columnas o eliminar toda la tabla haciendo clic en los botones
apropiados en el texto y el panel de formato de tabla. También puede usar la tecla Tab para
desplazarse dentro de la tabla y agregar filas. De izquierda a derecha, las opciones son:

o Insertar fila encima


o Insertar fila abajo
o Insertar columna a la izquierda
o Insertar columna a la derecha
o Eliminar la fila seleccionada
o Eliminar la columna seleccionada
o Eliminar toda la tabla

Establecer la alineación de tabla

Puede usar los botones de alineación de la tabla para colocar la tabla completa en el espacio
del elemento web. Puede alinear la tabla a la izquierda, centro o derecha.

63
8.3. Elemento web: Elemento principal (Hero: banner de imágenes y vínculos)

Ofrece el foco y el interés visual para tu página con el elemento Web de Elemento
principal o “hero”. Puede mostrar hasta cinco elementos en el elemento Web de
“Hero” y usar imágenes atractivas, texto y vínculos para llamar la atención sobre cada
uno. El elemento web Imagen prominente se incluye de forma predeterminada en
sitios de comunicación, pero también se puede agregar el elemento web Imagen
prominente a otras páginas.

El elemento Web de Hero en sitios de comunicación: Mosaicos y Capas

Al crear un sitio de comunicación, el elemento Web de Elemento principal o “Hero” se incluye


de forma predeterminada en la página. Se ha rellenado con imágenes, texto y vínculos
predeterminados para mostrar sus propias imágenes, texto, páginas, vínculos o documentos.

Cuando selecciona Mosaicos para el tipo de sitio de comunicación que desea, el héroe
predeterminado es un diseño en mosaico con cinco mosaicos (que puede cambiar de uno a
cinco):

Cuando selecciona capas para el tipo de sitio de comunicación que desea, el “hero”
predeterminado es un diseño vertical con tres capas (que puede cambiar de una a cinco
capas):

64
Puede cambiar el diseño del elemento Web de la imagen principal de una cuadrícula a una

vertical mediante el botón Editar elemento Web y puede cambiar los vínculos, las

imágenes y el texto de cada mosaico o capa con el botón editar detalles para cada
mosaico o capa.

65
1. botón Editar elemento Web

2. botón Editar detalles

Cambiar el diseño del elemento Web de Elemento principal o “Hero”

Mire este vídeo para ver cómo se hace o siga los pasos que se indican debajo del vídeo.

Video para cambiar diseño

1. Si aún no está en el modo de edición de la página, haga clic en Editar en la parte superior
derecha de la página.

2. Haga clic en el botón Editar elemento Web a la izquierda y seleccione el tipo de


diseño que desee: puede seleccionar hasta 5 mosaicos (como el de un sitio de temas) o hasta
5 capas.

66
Cambiar la imagen, el texto y los vínculos de cada mosaico o capa

Mire este vídeo para ver cómo se hace o siga los pasos que se indican debajo del vídeo.

Video para cambiar imagen, texto y vínculos

1. Si aún no está en el modo de edición de la página, haga clic en Editar en la parte superior
derecha de la página.

2. Haga clic en editar detalles en la parte inferior derecha del mosaico o la capa que
desee cambiar.
3. En el cuadro de herramientas, haga clic en cambiar y, a continuación, elija una ubicación
desde la que obtener el vínculo:

• Recientes: Si ha abierto recientemente imágenes, páginas o documentos, los


encontrará en la lista.
• Búsqueda web: puede buscar imágenes de Bing que usen la licencia creativa común.
Usted es el responsable de revisar las licencias de una imagen antes de insertarla en la
página. SharePoint Online.

67
• Onedrive: puede obtener un vínculo a un documento o una imagen que haya
almacenado en OneDrive. SharePoint Online.
• Sitio: puede obtener un vínculo a un documento, una imagen o una página de un sitio
que especifique.
• Cargar: puede cargar un documento o una imagen desde un dispositivo personal.
• Desde un vínculo: escriba un vínculo para la página, documento o imagen de
OneDrive para la empresa o SharePoint Online.

4. Seleccione la imagen, la página o el documento y haga clic en abrir.


5. En el cuadro de herramientas, en imagen, seleccione solo imágenes o
colores personalizados (solo está disponible el color para el diseño mosaicos y el color
corresponde al color del tema del sitio).

La opción selección automática selecciona automáticamente una imagen de la página o


documento con el que se está vinculando, si está disponible.

6. Escriba el texto alternativo de la imagen.


7. En Opciones:

• Puede mostrar una llamada a vínculo de acción cambiando el botón de alternancia a sí.
Después, agrega la llamada al texto de acción (por ejemplo, "más información"). El
vínculo llamar a la acción está disponible para cada capa en un diseño superpuesto, pero
solo para el azulejo más grande en un diseño en mosaico.
• En el caso de un diseño superpuesto, también puede mostrar un título de tema para cada
capa cambiando el encabezado de título de tema a sí. Después, agregue el texto del
encabezadode su tema.

Cambiar el punto focal de una imagen

En SharePoint Online, puede cambiar el punto focal en una imagen seleccionada en el


elemento Web de Hero para obtener la parte más importante de la imagen en el marco.

1. Si aún no está en el modo de edición de la página, haga clic en Editar en la parte superior
derecha de la página.

2. Haga clic en establecer punto focal en la barra de herramientas de la parte inferior de


la imagen principal que desee cambiar.

68
3. Arrastre el punto focal hasta el lugar de la imagen que desee.

Reordenar mosaicos o capas

Puede reordenar mosaicos o capas moviéndolos a la posición que desee.

1. Si aún no está en el modo de edición de la página, haga clic en Editar en la parte superior
derecha de la página.
2. Haga clic y mantenga presionado el botón mover elemento y, a continuación, arrastre el
mosaico o la capa donde desee.

Colocar el elemento Web de Elemento principal o “Hero” en una columna

El elemento Web de Hero está diseñado para ocupar todo el ancho de la página. Si prefiere
que el elemento Web de Hero no ocupara todo el ancho, puedes agregarlo a una columna
que no sea de ancho completo.

Mire este vídeo para ver cómo se hace o siga los pasos que se indican debajo del vídeo.

Video para colocar el elemento web en una columna

1. Si no está en modo de edición, haga clic en Editar en la parte superior derecha de la página.
2. Mantenga el mouse sobre el elemento Web del héroe y haga clic en el signo + situado en el
círculo a la izquierda del elemento Web.
3. En diseño de sección, seleccione una columna.

69
4. En el lado izquierdo del elemento Web, use el botón mover elemento Web para arrastrar el
elemento Web Hero a la columna que acaba de agregar.

Agregar un elemento Web de Elemento principal o “Hero” vacío a una página

Puede Agregar un elemento Web de Hero a una página de un sitio de grupo o un sitio
de comunicación. Para ello:

1. Si aún no está en el modo de edición de la página, haga clic en Editar en la parte superior
derecha de la página.
2. En la página, mueva el mouse por encima o por debajo de un elemento Web existente y verá
una línea con un +de círculo, como este:

70
Haga clic en + y, a continuación, elija el elemento Web de Hero.

3. Haga clic en el botón Editar del elemento Web y seleccione el tipo de diseño que
desea: se puede usar una cuadrícula de 1 a 5 mosaicos o de 1 a 5 capas verticales.
4. Haga clic en seleccionar vínculo para cada mosaico que desee cambiar.
5. Para cada mosaico, en el cuadro de herramientas, haga clic en seleccionar y, a continuación,
elija una ubicación desde la que obtener el vínculo:

• Recientes: Si ha abierto recientemente imágenes, páginas o documentos, los encontrará


en la lista.
• Búsqueda web: puede buscar imágenes de Bing que usen la licencia creativa común.
Usted es el responsable de revisar las licencias de una imagen antes de insertarla en la
página. SharePoint Online.
• Onedrive: puede obtener un vínculo a un documento o una imagen que haya
almacenado en OneDrive. SharePoint Online.
• Sitio: puede obtener un vínculo a un documento, una imagen o una página de un sitio
que especifique.
• Cargar: puede cargar un documento o una imagen desde un dispositivo personal.
• Desde un vínculo: escriba un vínculo para la página, documento o imagen de OneDrive
para la empresa o SharePoint Online.

6. Seleccione la imagen, la página o el documento y haga clic en abrir.


7. En el cuadro de herramientas, en imagen, seleccione solo una imagen o color personalizado.
La opción selección automática selecciona automáticamente una imagen de la página o
documento con el que se está vinculando, si está disponible. El color solo está disponible
para el diseño mosaicos y el color corresponde al color del tema del sitio.
8. Escriba el texto alternativo de la imagen.
9. En Opciones:

71
o Puede mostrar una llamada a vínculo de acción cambiando el botón de alternancia a sí.
Después, agrega la llamada al texto de acción (por ejemplo, "más información"). El vínculo
llamar a la acción está disponible para cada capa en un diseño superpuesto, pero solo para el
azulejo más grande en un diseño en mosaico.
o En el caso de un diseño superpuesto, también puede mostrar un título de tema para cada
capa cambiando el encabezado de título de tema a sí. Después, agregue el texto del
encabezado de su tema.
o

Escala de la imagen en el elemento Web de Elemento principal o “Hero”

Para elegir imágenes de tamaño óptimo para el elemento Web de Hero, tenga en cuenta lo
siguiente:

• El elemento Web está diseñado para ajustar el ancho de la pantalla en un diseño de sangrado
completo.
• En el diseño mosaicos, el alto del elemento Web se escala para seguir una relación de
aspecto de 8:3 y las imágenes dentro del elemento Web escalan a una relación de aspecto de
4:3.
• En el diseño capas, una capa individual escala a una relación de aspecto de 8:3, y las
imágenes dentro de cada capa escalan a una relación de aspecto cercana a 9:16.

72
8.4. Elemento web: Galería de imágenes

Use el elemento web Galería de imágenes para compartir colecciones de imágenes en una
página. Seleccione las imágenes con el selector de archivos o arrástrelas al elemento Web.

Agregar el elemento Web Galería de imágenes

1. Si no está en modo de edición, haga clic en Editar en la parte superior derecha de la página.
2. Mantenga el mouse por encima o por debajo de un elemento Web existente o debajo de la
región del título, haga clic en y, después, seleccione el elemento Web Galería de
imágenes.
3. Haga clic en Agregar un título para escribir un título para la galería de imágenes.

4. Haga clic en el botón Editar elemento Web para especificar el diseño.

Con el diseño Cuadrícula, puede elegir una relación de aspecto (1:1, 16:9 o 4:3), y puede
arrastrar y colocar imágenes dentro del elemento Web para reordenarlas.

73
Con el diseño carrusel, puede establecer si se desplazará automáticamente por las imágenes
y la velocidad a la que va a pasar. No puede reordenar imágenes en este diseño.

Con el diseño de Ladrillo, puede mostrar varias imágenes de varios tamaños,


automáticamente "superpuestas" en un patrón como el de una pared de ladrillos.

74
Seleccionar imágenes individuales

1. Arrastre las imágenes al elemento Web o haga clic en + Agregar.


2. Elija una imagen reciente o obtenga una imagen de su sitio, equipo o vínculo.
3. Haga clic en abrir para agregar las imágenes que ha seleccionado.
4. Para cada imagen, puede incluir un título, una descripción y texto alternativo haciendo clic en

el botón Editar de cada imagen.


5. Para agregar más imágenes, arrastre y coloque las imágenes en la página o haga clic en +
Agregar para seleccionar imágenes adicionales.

75
8.5. Elemento web: imagen

1. Si no está en modo de edición, haga clic en Editar en la parte superior derecha de la página.
2. Mantenga el mouse por encima o por debajo de un elemento Web existente o debajo de la
región del título, haga clic en y, después, seleccione el elemento Web imagen.
3. Elija una imagen reciente u obtenga una imagen de una búsqueda web, su sitio, su equipo o
un vínculo.

Nota: La búsqueda web usa imágenes de Bing que usan la licencia creativa común. Usted es
el responsable de revisar las licencias de una imagen antes de insertarla en la página.

4. Haga clic en abrir o Agregar imagen (dependiendo de la procedencia de la imagen).


5. De manera opcional, escriba un título debajo de la imagen en el elemento Web.

6. Haga clic en Editar elemento web (a la izquierda) para cambiar la imagen, agregar un
vínculo a la imagen, agregar texto sobre la imagen y agregar o cambiar texto alternativo (para
las personas que usan lectores de pantalla).

76
Texto alternativo automático Al insertar una imagen, se genera automáticamente texto
alternativo (para usuarios con lectores de pantalla). En muchos casos, el texto se guarda
automáticamente con la imagen, a menos que lo cambie o lo quite. En los casos en los que el
nivel de confianza del texto alternativo para la imagen no es alto, verá una alerta en la imagen
que le permite revisar y cambiar o mantener el texto alternativo.

Recortar la imagen

Puede recortar una imagen sin usar una relación de aspecto preconfigurada.

1. Si no está en modo de edición, haga clic en Editar en la parte superior derecha de la página.
2. Haga clic en la imagen que desea cambiar. Se mostrará la barra de herramientas para editar
imágenes.

1. relación de aspecto

2. recortar con relación libre

3. deshacer

4. restablecer

5. vista previa (guardar)

77
Recortar con relación de aspecto

Recortar con la relación de aspecto le permite decidir la proporción de ancho y alto de la


imagen. El área resaltada en azul de la imagen siguiente muestra una selección de relación de
aspecto de 1:1 (cuadrado).

1. Haga clic en el botón relación de aspecto .

Se abrirá una barra de herramientas adicional con opciones para diferentes relaciones de
aspecto.

Seleccione la relación de aspecto que desee. 16:9 es la opción de relación de aspecto más a la
izquierda, seguida de 3:2, 4:3 y 1:1. Verá un cuadro de vista previa para mostrarle cómo se
recortará la imagen. Puede mover el cuadro de recorte dentro de la imagen para cambiar el
área recortada.

También puede girar el cuadro de recorte para cambiar el modo en que se muestra la
orientación de la relación de aspecto haciendo clic en el botón girar cuadro de

recortar .

2. Cuando haya terminado, haga clic en Guardar .

78
Recortar manualmente

1. Haga clic en el botón recortar con proporción libre para recortar sin usar la relación de
aspecto. A continuación, arrastre uno de los cuadros de cada lado de la imagen para que la
imagen sea más estrecha, más ancha, más alta o más corta.

2. Cuando haya terminado, haga clic en Guardar .

Deshacer o restablecer

Use el botón Deshacer para deshacer la última acción. Use el botón

restablecer para deshacer todos los cambios que haya realizado a la vez, devolviendo la
imagen al estado en que se encontraba desde la última vez que guardó.

79
8.6. Elemento web: Vínculos rápidos

Vínculos rápidos, puede "anclar" elementos a la página para facilitar el acceso.

Agregar el elemento web de vínculos rápidos

1. Si la página no está en modo de edición, haga clic en Editar en la parte superior derecha de
la página.
2. Pase el mouse por encima o por debajo de un elemento web para ver una línea con un + en
un círculo, como este:

3. Haga clic en y, a continuación, seleccione el elemento web vínculos rápidos.


4. Escriba el título de vínculos rápidos para agregar su propio título.

80
5. Haga clic en el botón de Editar elemento web para establecer las opciones:

6. Seleccione un diseño y elija si desea mostrar una imagen deslizando el botón de


alternancia Mostrar imagen de diseño en Sí o No. El tamaño de la imagen que elija debe
dependen de en qué diseño que use.

Aquí es una comparación de los diseños de:

Compacto

El diseño compacto está diseñado para mostrar iconos en 48 x 48px.

81
El diseño de tira de imágenes está diseñado para mostrar las imágenes que en 212 a 286px
de ancho, con una relación de aspecto de 9/16 donde alto es 9 y ancho es 16.

7. Cuadrícula

8. Botón

82
9. Lista

10. Mosaicos

Agregar vínculos

1. Haga clic en + Agregar.


2. Elija una ubicación desde la que se va a obtener el vínculo:

• Recientes: si ha abierto recientemente imágenes, páginas o documentos encontrarlas


incluido aquí.
• OneDrive: puede obtener un vínculo de un documento o la imagen que haya almacenado
en OneDrive. Esta opción está disponible en SharePoint Online, pero no 2019 de servidor
de SharePoint.
• Sitio: puede obtener un vínculo para un documento, una imagen o una página de un sitio
que especifique.
• Cargar: puede cargar un documento o una imagen desde un dispositivo personal.
• Desde un vínculo: escriba un vínculo de la página, un documento o una imagen de
OneDrive para la empresa o SharePoint Online.
83
3. Seleccione la imagen, la página o el documento y haga clic en Abrir.
4. En el cuadro de la derecha, puede agregar o cambiar el título, cambiar la imagen y agregar
texto alternativo.

Editar vínculos

1. Si la página no está en modo de edición, haga clic en Editar en la parte superior derecha de
la página.
2. Haga clic en el lápiz de Editar elemento en el elemento que desea editar. Se abrirá el cuadro
de herramientas donde puede cambiar el vínculo, la imagen, el título y el texto alternativo.

Para quitar vínculos, haga clic en la X en el elemento.

Para reordenar los vínculos, arrastrar y colocar elementos a nuevas posiciones con el

botón mover. También puede reorganizar vínculos con Ctrl + izquierda o Ctrl + teclas
de flecha derecha.

Nota: No puede reordenar vínculos en el diseño de tira de imágenes.

84
8.7. Elemento web: Vínculo

Use el elemento web vínculo para agregar un vínculo, junto con su vista previa, a una página
interna o externa, el vídeo, la imagen o el documento.

Agregar un vínculo

1. Si no está en modo de edición ya, haga clic en Editar en la parte superior derecha de la
página.
2. Pasar el mouse encima o por debajo de un elemento web existente o en el área de título,
haga clic en y, a continuación, seleccione el elemento web vínculo.
3. Pegue el vínculo a la página, el vídeo, la imagen o el documento. El texto del vínculo, además
de una vista previa del elemento se mostrará en la página si está disponible. Para quitar el
texto del vínculo o la vista previa, haga clic en la x situada junto a él.

85
8.8. Elemento web: Contenido resaltado

Use este elemento Web para mostrar dinámicamente el contenido de una biblioteca de
documentos, un sitio, una colección de sitios o todos los sitios. De forma predeterminada,
este elemento Web muestra los documentos más recientes. Si no tiene ningún documento
o página en su sitio, primero tendrá que crearlos o cargarlos.

¿Cómo funciona?

1. Agregar el elemento Web contenido resaltado: empiece con agregar el elemento Web a la
página.
2. Elija contenido: elija la ubicación de origen (como un sitio o una biblioteca de documentos) y
el tipo de contenido para mostrar (como documentos o páginas).
3. Filtrar y ordenar: establezca filtros para restringir el contenido que se va a mostrar (como los
documentos modificados por el usuario actual) y un criterio de ordenación.
4. Seleccione un diseño: Elija entre los diseños tarjetas, lista, carrusel o tira de película.

Agregar el elemento Web contenido resaltado a una página

1. Si no está en modo de edición, haga clic en Editar en la parte superior derecha de la página.

86
2. Mantenga el mouse por encima o por debajo de un elemento Web existente o debajo de la
región del título, haga clic en y, a continuación, seleccione el elemento
Web contenido resaltado.

Una vez que el elemento Web se encuentra en la página, puede cambiar el título escribiendo
sobre los documentos más recientes de los títulos predeterminados.

3. Haga clic en el botón Editar y seleccione las opciones.

Elegir el contenido

Una vez que haya agregado el elemento Web y vea el panel de propiedades del elemento
Web, haga lo siguiente:

1. En SharePoint Online, en la lista desplegable de origen, seleccione dónde desea mostrar el


contenido: este sitio, una biblioteca de documentos en este sitio, esta colección de
sitios, la biblioteca de páginas de este sitio, seleccione sitios. o todos los sitios. Si su sitio
está conectado a un sitio del concentrador, también tendrá la opción de seleccionar todos
los sitios del concentrador.

87
Al hacer clic en seleccionar sitios, puede buscar el sitio que desea agregar o seleccionar uno
o varios sitios de sitios frecuentes o de sitios recientes.

Las opciones son este sitio, una biblioteca de documentos de este sitio, esta colección de
sitios y todos los sitios.

Nota: Si va a usar varios filtros, vea cómo funcionan de manera conjunta en la sección usar
varios filtros a continuación.

2. En el menú desplegable tipo, seleccione el tipo de contenido que desea mostrar. El tipo de
contenido disponible dependerá del origen.

Si desea mostrar tipos de contenido adicionales, haga clic en + Agregar tipo de contenido.

Filtrar y ordenar

Una vez que haya seleccionado el origen de contenido y el tipo, puede establecer las
opciones de filtrado y ordenación para acotar y organizar el contenido.

88
1. En la lista desplegable Filtrar, seleccione el elemento por el que desea filtrar y, a continuación,
escriba los detalles específicos para el filtro. Los filtros disponibles dependerán del tipo de
contenido.

• Título incluye las palabras Escriba las palabras de búsqueda de los títulos que desea
buscar.
• El contenido incluye las palabras Escriba las palabras de búsqueda para el contenido
que desea buscar.
• Agregado recientemente Especifique el período de tiempo desde que se agregó un
elemento (como hoy, ayer, antes de esta semana, etc.).
• Cambiado recientemente Especifique el período de tiempo desde que se modificó un
elemento (como hoy, ayer, antes de esta semana, etc.).
• Creado por Escriba un nombre de usuario si elige usuario seleccionado. En caso
contrario, use el usuario actual, que filtrará los elementos creados por quien esté viendo
la página en ese momento.
• Modificado por Escriba un nombre de usuario si elige usuario seleccionado. En caso
contrario, use el usuario actual, que filtrará los elementos creados por quien esté viendo
la página en ese momento.
• Propiedad administrada Esta opción está disponible para todas las opciones de origen
excepto la biblioteca de documentos. Las propiedades administradas pueden ser
integradas o personalizadas, pero se deben poder buscar. Escriba una palabra para
restringir la lista de propiedades que se pueden buscar, seleccione una propiedad de la
lista desplegable y escriba los criterios.

2. En la lista desplegable ordenar por, elija la opción que desee. El valor predeterminado es
el más reciente.

Usar varios filtros

Usar varios filtros es una excelente manera de restringir los resultados de contenido. Cuando
use varios filtros, los resultados se basarán en o en operaciones de filtros del mismo tipo, y
operaciones de filtros de diferentes tipos. Por ejemplo, si selecciona dos filtros: título incluye
el estado de la palabra y título incluye el proyecto de Word, el resultado será todos los
archivos que contengan la palabra "estado" o "proyecto". Por otro lado, si selecciona filtros de
diferentes tipos, los resultados se basarán en y en operaciones. Por ejemplo, si selecciona dos
filtros: título incluye el estado de la palabra y creado por Nuria, entonces solo obtendrá los
archivos que tienen el estado en el título y que también creará Nuria. Si selecciona varios
filtros de diferentes tipos, los resultados se basarán en agrupados o en operaciones para
todos los filtros del mismo tipo, y operaciones para filtros de diferentes tipos, como se
muestra aquí:

89
90
Elegir el diseño

Elija tarjetas, lista, tira de imágenes o carrusel, escriba el número de elementos que desea
mostrar y si quiere que se muestre el elemento Web cuando no se encuentren elementos.

Nota: Si está familiarizado con las versiones anteriores de SharePoint, el contenido resaltado
es la versión más reciente y simplificada del elemento Web de búsqueda de contenido.

91
8.9. Elemento web: Visor de archivos

Use el elemento Web visor de archivos para insertar un archivo en la página. Entre los tipos
de archivo que puede insertar se incluyen Excel, Word, PowerPoint, Visio, archivos PDF,
modelos 3D y mucho más.

Agregar un archivo

1. Si no está en modo de edición, haga clic en Editar en la parte superior derecha de la página.
2. Mantenga el mouse por encima o por debajo de un elemento Web existente o debajo de la
región del título, haga clic en y, a continuación, seleccione el elemento Web visor de
archivos.
3. Elija un archivo reciente, o examinar, cargue o use un vínculo para insertar el archivo que
desee.
4. De manera opcional, puede Agregar una descripción en el elemento Web.
5. Para establecer opciones adicionales (dependiendo de la disponibilidad del tipo de archivo),

haga clic en Editar elemento Web .

Sugerencias:

• Los archivos de imagen no se admiten en el elemento Web visor de archivos. Sin embargo, si
desea insertar una imagen en la página, puede usar el Elemento web: imagen.
• Puede conectar el elemento Web visor de archivos a un elemento Web Biblioteca de
documentos y mostrar archivos dinámicamente en función de lo que un usuario seleccione en
el elemento Web Biblioteca de documentos.

92
8.10. Elemento web: Insertar

Puede mostrar contenido en la página de SharePoint desde sitios que permiten la


incrustación (como los mapas de YouTube o Bing, por ejemplo). Para muchos sitios, puede
usar la dirección web del sitio para el código de contenido o de inserción que proporciona el
sitio.

Mostrar contenido con una dirección de página web

Puede insertar contenido de algunos sitios web copiando y pegando la dirección web del sitio
para el contenido en el elemento Web insertar.

1. Copie el vínculo del contenido embebido que desea usar. Para ello, vaya al sitio con el
contenido que desea insertar. En algún lugar cerca del contenido, normalmente verás un
botón o un vínculo para compartir. Haga clic en él y copie la dirección de vínculo
proporcionada.

2. En la página de SharePoint, asegúrese de que está en el modo de edición. Si no es así, haga


clic en Editar en la parte superior derecha de la página.
3. Si aún no tiene un elemento Web incrustado en la página, mueva el mouse por encima o por
debajo de un elemento Web existente o debajo de la región del título, haga clic en y, a
continuación, seleccione el elemento Web Insertar </> de la lista.
4. En el panel de propiedades de la derecha, pegue la dirección del sitio web que ha copiado
anteriormente en el cuadro dirección del sitio web o código para insertar.

Notas:

93
• Si no ve el panel de propiedades, haga clic en Editar elemento Web a la izquierda del
elemento Web.
• Los vínculos a contenido solo funcionan para sitios web que proporcionan un servicio
específico para insertar contenido mediante vínculos. Si un vínculo no funciona para el
contenido que desea insertar, pruebe a usar el código para insertar.

Mostrar contenido mediante código para insertar

El código para insertar es una lista de instrucciones específicas de un sitio web que describen
cómo mostrar ese contenido en otra página. Muchos sitios ofrecen códigos para insertar en
sus páginas que puede copiar y pegar. Normalmente verás un botón denominado código
para Insertar o </>. De este modo, se abre un cuadro de texto que contiene algún código.

Por ejemplo, haga clic en el botón compartir de un vídeo de Vimeo para ver el código para
insertar en el cuadro de diálogo compartir.

Para usar el código para insertar, haga lo siguiente:

1. Copie el código para insertar (si está disponible) del contenido que desea usar. Para ello, vaya
al sitio con el contenido que desea insertar. En algún lugar cerca del contenido, normalmente
verás un botón o vínculo para compartir, o un botón etiquetado como código para
insertar o </>. Esto abrirá un cuadro de texto que contiene algo de código, similar a la
imagen del sitio de Vimeo arriba.

2. Si aún no tiene un elemento Web incrustado en la página, haga clic en el en el área en


la que desea insertar el vídeo y seleccione el elemento Web Insertar </> de la lista.
94
3. En el panel de propiedades de la derecha, pegue el código para insertar en el
cuadro dirección del sitio web o código para insertar.

Notas: Si no ve el panel de propiedades, haga clic en Editar elemento Web a la


izquierda del elemento Web.

Mostrar contenido dinámico conectándose a otro elemento Web

Con el elemento Web embebido, puede escribir vínculos o código para insertar que usen
variables, lo que le permitirá mostrar una amplia variedad de elementos según el tipo de
selección de su visor de página. Por ejemplo, puede mostrar una imagen en función de lo que
un usuario seleccione en una lista de direcciones URL de imagen.

Para obtener información y ejemplos, vea Mostrar un vídeo, una imagen o una ubicación en
función de lo que un usuario seleccione en un elemento Web de lista (Conecte un elemento
Web incrustado a un elemento Web de lista).

95
Solución de problemas

Estos son los motivos más comunes por los que la incrustación puede no funcionar:

• El código para insertar debe estar basado en iframe (es decir, comienza y termina con
etiquetas <iframe>). No se admite el código para insertar que usa etiquetas <script>.
• Solo se pueden incrustar sitios Web seguros. Asegúrese de que la dirección URL del sitio web
comienza con HTTPS.
• No todos los sitios web permiten que sus páginas se incrusten, por lo que es posible que no
pueda incrustarlas, incluso cuando son seguras y usan código para insertar basado en iframe.
Si tiene problemas, consulte el sitio web para ver si permite la incrustación.
• Los administradores de la colección de sitios pueden controlar si los usuarios pueden insertar
contenido desde sitios web externos. Si no permiten a los colaboradores insertar contenido,
es posible que vea un mensaje de error que dice "no se permite la incrustación de contenido
de este sitio web". Consulte el administrador o el artículo de la ayuda permitir o restringir la
posibilidad de insertar contenido en páginas de SharePoint.

96
8.11. Elemento web: Eventos

Permite mostrar rápidamente los próximos eventos en la página.

Agregar el elemento Web eventos

1. Si no está en modo de edición, haga clic en Editar en la parte superior derecha de la página.
2. Mantenga el mouse por encima o por debajo de un elemento Web existente o debajo de la
región del título, haga clic en y, a continuación, seleccione el elemento Web eventos.

3. Haga clic en Editar elemento Web a la izquierda para establecer las opciones del
elemento Web.
4. Seleccione un origen para los eventos: lista de eventos en este sitio, este sitio,
esta colección de sitios, seleccione sitios o todos los sitios. Si su sitio está conectado a un
sitio del concentrador, también tendrá la opción de seleccionar todos los sitios del
Hub o seleccionar sitios del concentrador.

97
Notas:

• Al hacer clic en seleccionar sitios, puede buscar el sitio que desea agregar o seleccionar
uno o varios sitios de sitios frecuentes o de sitios recientes.
• Lista de eventos: si hay más de una lista de eventos en el sitio, puede seleccionar la que
desee. Si no tiene una lista existente, el elemento Web eventos creará una lista de
eventos vacía, con la configuración predeterminada de una lista de calendarios.

5. Si la lista tiene categorías, puede seleccionar una para filtrar los eventos que se muestran.
6. Seleccione un intervalo de fechas según el cual desea filtrar los eventos en la lista
desplegable intervalo de fechas. Puede elegir todos los eventos futuros (el valor
predeterminado), esta semana, próximas dos semanas, este mes o este trimestre.
7. Seleccione un diseño: tira de película o compacta.

Agregar un evento

En una página publicada, puede empezar a agregar eventos.

Nota: Puede agregar eventos en una página guardada o publicada, pero no en una página
que esté en modo de edición.

1. Haga clic en Agregar evento.


2. Asigne un nombre al evento en la parte superior de la página. De manera opcional, puede
Agregar una imagen al área de título haciendo clic en el botón Agregar imagen en la
esquina superior izquierda.

98
99
3. Elija fecha y hora en la sección Cuándo.
4. En la sección dónde, escriba una ubicación o una dirección. Si tu ubicación es reconocida,
tienes la opción de agregar un mapa.
5. En la sección vínculo, puede introducir un vínculo a la reunión en línea, si tiene una. Ponga el
vínculo en el cuadro Dirección y, a continuación, agregue un nombre para mostrar. Si no
tiene una reunión en línea y no escribe nada, esta sección no aparecerá en el evento.
6. Elija una categoría (como reunión, horas de trabajo, empresa, días festivos, etc.) Si desea que
el evento se muestre cuando se filtre por esa categoría. Para agregar tu propia categoría, solo
tienes que escribirla en el espacio.
7. Proporcione una descripción en el área acerca de este evento.
8. Si tienes personas que deseas resaltar para este evento (como contactos, invitados especiales
o oradores), puedes agregar sus nombres debajo de la descripción del evento. Solo se
pueden agregar usuarios de su organización.
9. Cuando haya terminado, haga clic en Guardar.

Una vez que haya guardado el evento, puede editarlo haciendo clic en el evento de la página
y, a continuación, hacer clic en Editar en la parte superior derecha de la página del evento.

100
8.12. Elemento web: Temporizador de cuenta atrás

Permite mostrar un recuento hacia abajo (o recuento) a un evento. Puede “Agregar un título”,
establecer el formato de fecha, agregar una descripción y un botón llamar a la acción con un
vínculo.

Agregar el elemento Web del temporizador de la cuenta atrás

1. Vaya a la página en la que desea agregar el elemento Web del temporizador de la cuenta
atrás.
2. Si la página aún no está en modo de edición, haga clic en Editar en la parte superior derecha
de la página.

Pase el mouse por encima o por debajo de un elemento web para ver una línea con un + en
un círculo, como este:

3. Haga clic en +y, a continuación, seleccione temporizador de cuenta regresiva en la lista de


elementos Web.

4. Haga clic en Editar elemento Web en el lado izquierdo.


101
5. En el cuadro de herramientas de propiedades de la derecha, escriba la información que desee
mostrar y elija las opciones que desee.

Al agregar una imagen, también puede elegir un nivel de color y opacidad superpuesto para
ayudarle a facilitar la legibilidad del texto.

6. Cuando esté listo para hacer visible la página, haga clic en publicar en la parte superior
derecha de la página.

102
8.13. Elemento web: Divisor

Con el elemento web de divisor, puede agregar una línea horizontal entre otros elementos
web como ayuda para dividir la página y que sea más fácil de leer.

Agregar el elemento web de división

1. Si no está en modo de edición ya, haga clic en Editar en la parte superior derecha de la
página.
2. Pasar el mouse encima o por debajo de un elemento web existente o en el área de título,
haga clic en y, a continuación, seleccione el elemento web de división.

Eliminar el elemento web de división

1. Si no está en modo de edición ya, haga clic en Editar en la parte superior derecha de la
página.
2. Pasar el mouse sobre el elemento web de división y, a continuación, haga clic en el
botón Eliminar elemento web, a la izquierda del elemento web.

103
8.14. Elemento web: Espaciador

El separador web parte le proporciona que control sobre la cantidad de espacio vertical se
muestra entre elementos web.

Agregar el elemento web de separador

1. Si no está en modo de edición ya, haga clic en Editar en la parte superior derecha de la
página.
2. Pasar el mouse encima o por debajo de un elemento web existente o en el área de título,
haga clic en y, a continuación, seleccione el elemento web de separador.
3. Arrastre la barra gris arriba o abajo para espacio vertical; Arrastre los cuadros de esquina o
alejar para espacio horizontal. O bien, use las y teclas de dirección para cambiar el tamaño.

104
8.15. Elemento web: Actividad del sitio

Este elemento web muestra automáticamente la actividad reciente en su sitio, como archivos
cargados, los cambios realizados, listas y bibliotecas creadas y así sucesivamente. Agregar el
elemento web y, a continuación, la última actividad se introduce automáticamente.

Agregar el elemento web de actividad de sitio a la página

1. Si no está en modo de edición ya, haga clic en Editar en la parte superior derecha de la
página.
2. Pasar el mouse encima o por debajo de un elemento web existente o en el área de título,
haga clic en y, a continuación, seleccione el elemento de la actividad del sitio web.
3. Para cambiar el número de elementos que se muestran en la página, haga clic en Editar

elemento web a la izquierda y escriba un número en el cuadro de herramientas


en Mostrar estos elementos a la vez. A continuación, haga clic en Aplicar.

105
8.16. Elemento web: Biblioteca de documentos

Al usar el elemento web de biblioteca de documentos, puede mostrar una vista específica de
la biblioteca o incluso una carpeta dentro de la biblioteca. Los usuarios con los permisos
adecuados pueden agregar, ver o editar archivos directamente desde el elemento web. Los
usuarios también pueden anclar un documento en la parte superior de los archivos de
biblioteca, descargar, eliminar y cambiar el nombre o pueden ir a la biblioteca de documentos
completa haciendo clic en Ver todo. Además, se muestran carpetas anidadas creadas en la
lista de origen y archivos se pueden mostrar en una vista de detalles o vista de mosaicos
y formato de columna.

Agregar una biblioteca de documentos a una página

1. Si desea una vista personalizada de la biblioteca que aparezca en la página, cree la vista.
2. Vaya a la página donde desea agregar la biblioteca.
3. Si la página no está en modo de edición, haga clic en Editar en la parte superior derecha de
la página.

Pase el mouse por encima o por debajo de un elemento web para ver una línea con un + en
un círculo, como este:

106
4. Haga clic en + y, a continuación, seleccione la Biblioteca de documentos de la lista de
elementos web.
5. Seleccione la biblioteca de documentos que desea colocar en la página.

6. Haga clic en Editar elemento web a la izquierda para cambiar la biblioteca de


documentos, la vista de la biblioteca y el tamaño. También puede mostrar una carpeta
específica en la biblioteca, escriba el nombre de carpeta (utilizar un "o" para separar los
nombres de carpetas anidadas):

7. Cuando haya terminado, haga clic en Aplicar.


8. Cuando esté listo, haga clic en Publicar en la parte superior derecha de la página.

107
8.17. Elemento web: Calendario de grupo

El elemento web de calendario de grupo le permite poner un derecho del calendario de


grupo de Office 365 en la página para que sea fácilmente visible para los lectores.

Agregar un calendario de grupo

1. Si no está en modo de edición ya, haga clic en Editar en la parte superior derecha de la
página.
2. Pasar el mouse encima o por debajo de un elemento web existente o en el área de título,
haga clic en y, a continuación, seleccione el elemento web calendario de grupo.
3. Haga clic en Agregar calendario de grupo.

4. En el cuadro de herramientas, seleccione el grupo que tiene el calendario que desea colocar
en la página.
108
5. Use el control deslizante para indicar el número de eventos (hasta 10) que desea mostrar en
la página.

109
8.18. Elemento web: Contactos

¿Quién es el equipo? ¿Qué son responsable? ¿Cómo puedo contacto ellos? Es fácil responder
a estas preguntas para que los lectores con el elemento web de contactos. Puede mostrar las
fotos, información de contacto y más de las personas de su organización.

1. Si la página no está en modo de edición, haga clic en Editar en la parte superior derecha de
la página.

Pasar el “mouse” por encima o por debajo de un elemento web existente y verá una línea con
un círculo con +, similar a esta:

2. Haga clic en + y, a continuación, seleccione contactos en la lista de elementos web.


3. Puede cambiar el título del elemento web haciendo clic en el texto que dice perfiles de
personas y escribiendo sobre él.

4. En el cuadro, escriba un nombre o un nombre parcial. Se mostrará una lista de resultados


coincidentes y que puede elegir a la persona que desee. A continuación, haga clic en Agregar
perfil.
5. Continúe escribiendo nombres y seleccionar perfiles hasta que haya terminado.

Mostrar tarjetas compact o descriptivas

Puede mostrar más o menos información seleccionando el tipo de tarjeta para mostrar.
"Compacta" tarjetas muestran una imagen (si está disponible) y el nombre de la persona o la
dirección de correo electrónico, como se muestra en la imagen anterior. El diseño
"descriptivo" muestra una imagen, nombre o correo electrónico, título (si está disponible) y
un vínculo opcional y descripción, como se muestra en la imagen siguiente.

110
Para cambiar el tipo de tarjeta:

1. Si la página no está en modo de edición, haga clic en Editar en la parte superior derecha de
la página.
2. Mantenga el mouse sobre el elemento web de personas existente y haga clic en Editar

elemento web .
3. En el cuadro de la derecha, seleccione compacta o descriptiva.

Reordenar contactos

Para reordenar los perfiles de personas, arrastre y coloque cada uno a la posición que desee

mediante el botón mover.

También puede reordenar personas mediante Ctrl + izquierda o Ctrl + teclas de flecha
derecha.

111
8.19. Elemento web: Documentos recientes

Este elemento Web muestra los documentos más recientes a los que ha tenido acceso el
usuario actual de la página.

Agregar el elemento Web documentos recientes

1. Vaya a la página donde desea agregar el elemento Web documentos recientes.


2. Si la página no está ya en modo de edición, haga clic en Editar en la parte superior derecha
de la página.
3. Pase el mouse por encima o por debajo de un elemento web para ver una línea con un + en
un círculo, como este:

4. Haga clic en + y, a continuación, seleccione documentos recientes de la lista de elementos


Web.

5. Haga clic en Editar elemento Web en el lado izquierdo para abrir el panel de
propiedades y cambiar el número máximo de documentos que desea mostrar en la página.

112
6. Cuando esté listo, haga clic en publicar en la parte superior derecha de la página.

113
8.20. Elemento web: Conversaciones y Elementos destacados de Yammer

Conversaciones de Yammer y Elementos destacados de Yammer se pueden usar para mejorar


la colaboración en la página moderna de SharePoint Online.

A continuación, se explica cómo elegir qué usar:

¿Cuándo usarla? Función Limitaciones


Elemento Web conversaciones de Para los usuarios de la • No puede seleccionar
Yammer página: una conversación
específica para mostrar.
Use esto cuando quiera que los • Muestra las • Solo funciona en páginas
usuarios participen en las conversaciones de un modernas.
conversaciones de Yammer sin salir grupo específico de
de la página de SharePoint. Yammer, un tema
específico o todas las
conversaciones en las que
ha participado una
persona determinada.
• Los participantes pueden
ver toda la conversación y
responder desde la
página de SharePoint sin
necesidad de abrir
Yammer.
• Los participantes pueden
iniciar nuevas
conversaciones desde
SharePoint.

Para los autores de


páginas:

• Elija lo que desea mostrar


en función de la
búsqueda.
• Elija cuántas
conversaciones se
muestran: 4, 8 o 12.
• Hereda el tema de la

114
página.

Elemento Web de resaltado de Para los usuarios de la • Los usuarios solo pueden
Yammer página: ver el primer mensaje de
una conversación. Para
Use esto si es el único elemento • Ver el mensaje más responder, el usuario
Web de Yammer que está reciente en la parte debe hacer clic en un
disponible para usted o para superior o en las vínculo para abrir
proporcionar una breve conversaciones más Yammer.
introducción a las conversaciones recientes de un grupo. • No puede mostrar todas
activas y un portal dirigido a • Ver el mensaje más las conversaciones de un
grupos o conversaciones reciente en tema o todos los temas
específicas en Yammer. conversaciones en los que participa un
específicas. usuario, y no puede
mostrar su fuente de
inicio.
• Para especificar una
conversación, necesita la
dirección URL de la
conversación.
• Solo funciona en páginas
modernas.

Fuente de Yammer de un Para los usuarios de la • No es compatible con los


elemento Web de resaltado de página: usuarios que usan un
Yammer dispositivo móvil para ver
• Muestra mensajes y la página o que tienen
Use esta opción solo si el elemento respuestas en las deshabilitadas las
Web conversaciones de Yammer conversaciones. cookies de terceros.
aún no está disponible y quiere • Muestra muchos tipos de • No hereda el tema de la
que los usuarios puedan participar fuentes de Yammer. página de SharePoint.
en conversaciones de Yammer sin • Para configurar esto,
salir de SharePoint. debe usar Yammer para
buscar la dirección web
del grupo, la persona o el
tema específico o de la
fuente de inicio de
Yammer.
• Es posible que los
usuarios tengan que
iniciar sesión en Yammer

115
aunque ya hayan iniciado
sesión en Office 365.

Fuente de Yammer incrustada en Para los usuarios de la • No es compatible con los


un elemento Web editor de página: usuarios que usan un
contenido dispositivo móvil para ver
• Muestra mensajes y la página o que tienen
Use esta solo para las páginas de respuestas en las deshabilitadas las
sitio clásicas. conversaciones. cookies de terceros.
• Muestra muchos tipos de • No hereda el tema de la
fuentes de Yammer. página de SharePoint.
• Para configurar esto,
debe usar Yammer para
buscar la dirección web
del grupo, la persona o el
tema específico o de la
fuente de inicio de
Yammer.
• Es posible que los
usuarios tengan que
iniciar sesión en Yammer
aunque ya hayan iniciado
sesión en Office 365.

Agregar un elemento Web conversaciones de Yammer a una página moderna de


SharePoint Online

1. Si no está en modo de edición, haga clic en Editar en la parte superior derecha de la página.
2. Mantenga el mouse por encima o por debajo de un elemento Web existente o debajo de la
región del título, haga clic en , busque Yammery, a continuación, seleccione el elemento
Web conversaciones .
3. En Seleccionar origende la conversación, seleccione una de las siguientes opciones:
o Grupo: muestra las conversaciones más recientes publicadas en el grupo seleccionado.
o Usuario: muestra las conversaciones más recientes en las que participó el usuario.
o Tema: muestra las conversaciones más recientes etiquetadas con este tema.
o Fuente: muestra las conversaciones más recientes que se muestran para el usuario en
Yammer cuando hacen clic en el botón Inicio.
4. En Buscar un origen, escriba el nombre del grupo, usuario o tema.

116
5. En número de conversaciones para mostrar, seleccione 4, 6 u 8, en función de la cantidad
de espacio que quiere que tenga este elemento Web en la página.

Una vez publicada la página, los usuarios pueden responder y seguir la conversación desde la
página.

Agregar un elemento Web de resaltado de Yammer a una página moderna de


SharePoint Online

1. Si no está en modo de edición, haga clic en Editar en la parte superior derecha de la página.
2. Mantenga el mouse por encima o por debajo de un elemento Web existente o debajo de la
región del título, haga clic en , busque Yammer y, a continuación, seleccione el icono de
Yammer etiquetado como Yammer o resaltado.
3. Si va a agregar el elemento Web de Yammer a un sitio que tiene un grupo de Yammer
asociado, el grupo de Yammer se detectará y se agregará automáticamente. En caso
contrario, haga clic en Agregar un grupo y use la barra de búsqueda para buscar un grupo.

4. Seleccione una de las siguientes opciones de conversación:


o Conversaciones principales: las conversaciones más atractivas del grupo.
o Conversaciones más recientes: las conversaciones más recientes del grupo que son nuevas
para el lector.
o Solo las conversaciones que elija: esta opción requiere que vaya a Yammer para obtener las
direcciones URL para un máximo de cuatro conversaciones que desee mostrar.

117
Una vez publicada la página, los usuarios pueden:

• Cree un mensaje nuevo en el grupo haciendo clic en publicar en Yammer.


• Haga clic en la publicación para ir a ella en el grupo de Yammer
• Haga clic en Ver más en la parte superior derecha del elemento Web para ir a todas las
publicaciones de ese grupo de Yammer.
• Como la publicación.
• Agregue un comentario debajo de la publicación. Los comentarios solo se muestran en la
página y no se agregan a la conversación de Yammer.

Usar una fuente de Yammer insertada en el elemento Web de resaltado de


Yammer

Nota: No se recomienda usar este método en SharePoint Online, ya que no heredará el tema
de la página de SharePoint, la fuente no funcionará en dispositivos móviles y se les pedirá a
los usuarios que inicien sesión de nuevo para ver el contenido.

Una fuente de Yammer insertada se puede usar para ver una fuente de ejecución de un
grupo, una persona o un tema. También puede gustar, responder o ver una conversación
específica.

1. Si no está en modo de edición, haga clic en Editar en la parte superior derecha de la página.
2. Mantenga el mouse por encima o por debajo de un elemento Web existente o debajo de la
región del título, haga clic en , busque Yammer y, a continuación, seleccione el icono de
Yammer etiquetado como Yammer o resaltado.
3. Haga clic en usar la versión clásica de las conversaciones.
4. En el cuadro Dirección, si se ha seleccionado previamente un grupo, su dirección URL se
muestra en el campo dirección web. Si no se ha seleccionado ninguna, o si prefiere mostrar
una fuente diferente, debe pegarla en la dirección web del grupo de Yammer, la persona, el
tema o la fuente de información que desee usar. También puede hacer clic en Mostrar
tamaño para establecer el tamaño de la pantalla de la fuente como pequeño, mediano o
grande.

118
Preguntas frecuentes

P: ¿pueden los usuarios externos de Yammer usar el elemento Web de Yammer?

R: No. Los usuarios externos de cualquier tipo verán un mensaje de error independientemente
de si es elegible o no para ver el grupo en Yammer.

Problemas conocidos con el elemento Web conversaciones

En un dispositivo Mac o iOS, si usa el explorador Safari o la aplicación móvil SharePoint iOS, al
mirar un mensaje que debería tener una imagen, verá "lo sentimos, hay un problema con este
archivo".

Para solucionar este problema y ver la imagen:

• Si está usando Safari, en la página de configuración de Safari, deshabilite impedir el


seguimiento entre sitios. Esto permite mostrar las imágenes en el elemento Web de
SharePoint.
• Si está viendo páginas de SharePoint en la aplicación de SharePoint iOS, pulse el error y la
imagen se abrirá en la aplicación de Yammer si está instalada en el dispositivo o en el
explorador.

119
8.21. Elemento web: El tiempo

El elemento Web de Meteorología permite mostrar el tiempo actual en la página.

Agregar el elemento Web de Meteorología a una página

1. Vaya a la página donde desea agregar el elemento Web de información meteorológica.


2. Si ya no está en modo de edición, haga clic en Editar en la parte superior derecha de la
página.
3. Mueva el mouse por encima o por debajo de un elemento Web existente o por debajo de la
zona del título, haga clic en y, después, seleccione el elemento Web de Meteorología.
4. Empiece a escribir una ubicación en el cuadro Agregar una ubicación. Después, elija la
ubicación en la lista desplegable.

5. Para cambiar las unidades de temperatura predeterminadas, haga clic en el botón Editar

elemento Web y, en el cuadro de herramientas de la derecha, seleccione ° f o ° c.

120
6. Esta opción establece las unidades de temperatura predeterminadas para todos los usuarios.
Sin embargo, los usuarios pueden cambiar las unidades de temperatura para sus propias
vistas.
7.

Cambiar unidades de temperatura en una página publicada

Cualquier visor de una página publicada puede cambiar las unidades de temperatura entre
los ° f y ° c para su propia vista. Cambiar esta configuración no afecta a las vistas de otros
usuarios.

• En una página publicada con la parte meteorológica, haga clic en el indicador unidades de
clima inmediatamente después de la temperatura. Para volver a cambiarlo, solo tiene que
hacer clic de nuevo.

121
8.22. Elemento web: Fragmento de código

El elemento Web de fragmento de código le permite mostrar el código fácilmente como texto
en su página para que otros lo usen o lo conozcan. Puedes seleccionar el lenguaje de código
y un tema oscuro o claro. La sintaxis de elementos Web incluso Autocorrección.

Agregar el elemento Web fragmento de código

1. Vaya a la página donde desea agregar el elemento Web fragmento de código.


2. Si la página no está ya en modo de edición, haga clic en Editar en la parte superior derecha
de la página.

Pase el mouse por encima o por debajo de un elemento web para ver una línea con un + en
un círculo, como este:

3. Haga clic en + y, a continuación, seleccione fragmento de código en la lista de elementos


Web.
4. En la barra de herramientas, seleccione el idioma, si desea líneas numeradas y un tema claro o
oscuro.

5. Haga clic en Editar elemento Web en el lado izquierdo para activar o desactivar el
ajuste de línea.
6. Cuando esté listo, haga clic en publicar en la parte superior derecha de la página.

122
8.23. Elemento web: Gráfico rápido

Use el elemento web gráfico rápido para agregar gráficos simples y básicos a la página.
Escriba sus puntos de datos u obtenga datos de una lista, agregue etiquetas y seleccione el
tipo de gráfico: columna o circular, y publicar.

Agregar el elemento web gráfico rápido

1. Si ya no está en modo de edición, haga clic en Editar en la parte superior derecha de la


página.
2. Mueva el mouse por encima o por debajo de un elemento Web existente o por debajo de la
zona del título, haga clic en y, después, seleccione el elemento Web gráfico rápido.
3. Para agregar un título, haga clic en el gráfico. Verá un cursor intermitente en el que puede
escribir el texto del título.

4. Haga clic en Editar elemento Web configurar las opciones del gráfico rápido.
5. En el cuadro de herramientas de la derecha, elija un tipo de gráfico.
6. En la sección datos, elija escribir datos manualmente u obtener datos de una lista de
SharePoint existente.

Escribir datos manualmente: seleccione la opción escribir datos y, a continuación, agregue


una etiqueta y un valor numérico para cada punto de datos. Haga clic en + Agregar para
crear puntos de datos adicionales hasta un máximo de 12 puntos de datos.

Obtener datos de una lista de SharePoint: seleccione la opción para obtener datos de una
lista de SharePoint en este sitio y, a continuación, seleccione la lista.

123
7. En diseño, puede agregar opcionalmente etiquetas para el eje horizontal (x) y el eje vertical
(y) para los gráficos de columnas.

124
8.24. Elemento web: Guardado para más tarde

Este elemento Web muestra las páginas que han sido guardadas para más tarde, se basa en
las páginas que ha tenido acceso el usuario actual.

Agregar el elemento Web guardado para más tarde

7. Vaya a la página donde desea agregar el elemento Web guardado para más tarde.
8. Si la página no está ya en modo de edición, haga clic en Editar en la parte superior derecha
de la página.
9. Pase el “mouse” por encima o por debajo de un elemento web para ver una línea con un + en
un círculo, como este:

10. Haga clic en + y, a continuación, seleccione guardado para más tarde de la lista de
elementos Web.

11. Haga clic en Editar elemento Web en el lado izquierdo para abrir el panel de
propiedades y cambiar el número máximo de elementos que desea mostrar en la página.

12. Origen, puede decidir si presenta todos los elementos guardados o solo los elementos
guardados de este sitio.

125
13. Cuando esté listo, haga clic en publicar en la parte superior derecha de la página.

126
8.25. Elemento web: Lista

Permite mostrar una lista de su sitio en una página y personalizarla con su propio título, vista
o incluso tamaño.

Los tipos de listas que puede usar son listas personalizadas, listas de anuncios, listas de
contactos y listas de seguimiento de problemas.

Los usuarios pueden ver, filtrar, ordenar y agrupar la lista, o ir a la página de lista haciendo clic
en ver todo. Además, las columnas con formato, los grupos anidados y la vista de atención se
pueden mostrar en el elemento Web.

Agregar una lista a una página

1. Asegúrese de que la lista que desea está disponible en el sitio en el que se encuentra la
página.
2. Si desea que una vista personalizada de la lista aparezca en la página, cree la vista.
3. Vaya a la página en la que desea agregar la lista.
4. Si la página aún no está en modo de edición, haga clic en Editar en la parte superior derecha
de la página.

127
Pase el mouse por encima o por debajo de un elemento web para ver una línea con un + en
un círculo, como este:

5. Haga clic en +y, a continuación, seleccione lista en la lista de elementos Web.


6. Seleccione la lista que desea colocar en la página.

7. Haga clic en Editar elemento Web en el lado izquierdo para cambiar el título, la lista, la
vista de la lista y el tamaño:

128
Para SharePoint Server 2019, cambie el título seleccionando y escribiendo un nuevo título, en
lugar de usar editar elemento Web.

Agregar nuevos elementos

• En SharePoint Online, puede agregar nuevos elementos haciendo clic en + nuevo en la parte
superior de la lista.

Ordenar, filtrar y agrupar la lista en el elemento Web

En SharePoint Online, puede agregar elementos Web, ordenar, filtrar y agrupar.

1. Haga clic en la flecha abajo situada junto al título de la columna que desea ordenar, filtrar o
agrupar.
2. Seleccione la acción que desea realizar.

129
8.26. Elemento web: Mapas de Bing

Use el elemento web de mapas de Bing para agregar un mapa a la página. Simplemente
escriba una dirección o un nombre bien conocido y aparecerá el mapa. Puede elegir un tipo
de asignación diferente, como guía o aérea. También puede cambiar el nivel de zoom o
asigne un nombre descriptivo a su pin de mapa.

Agregar un mapa de Bing

1. Si no está en modo de edición ya, haga clic en Editar en la parte superior derecha de la
página.
2. Pasar el mouse encima o por debajo de un elemento web existente o en el área de título,
haga clic en y, a continuación, seleccione el elemento web de mapas de Bing.
3. Haga clic en Agregar un título para introducir un título para el mapa.

4. Escriba la dirección en el cuadro de búsqueda y haga clic en .


5. Seleccionar carretera, aéreo o Streetside vista para elegir la vista predeterminada de la
asignación. Para la vista aérea, también puede elegir si desea mostrar etiquetas para todas las
ciudades, calles, etcétera o no.

Nota: En algunas ubicaciones, no se admite la vista de streetside.

6. Para cambiar el nivel de zoom del mapa, haga clic en + o - en la esquina superior izquierda
de la asignación.
130
7. En el cuadro de herramientas de la derecha, elija si no desea mostrar una etiqueta de pin en
su mapa. Si Sí, escriba el texto que desee que aparezca en el cuadro etiqueta de Pin.
También puede cambiar el texto de la dirección que aparece en el mapa en el
cuadro dirección para mostrar.

131
8.27. Elemento web: Markdown

Markdown le permite agregar texto a la página y darle formato con el lenguaje Markdown.

Agregar el elemento Web de Markdown

1. Vaya a la página donde desea agregar el elemento Web de Markdown.


2. Si la página aún no está en modo de edición, haga clic en Editar en la parte superior derecha
de la página.

Pase el mouse por encima o por debajo de un elemento web para ver una línea con un + en
un círculo, como este:

3. Haga clic en +y, a continuación, busque y seleccione Markdown en la lista de elementos


Web.
4. Comienza a introducir tu código de descuento.

Sugerencia: Haga clic en la editar lápiz, en el lado izquierdo del elemento Web, para
ver una referencia de la sintaxis de Markdown.

5. En la barra de herramientas, puede:

• Use los botones negrita, cursiva y tachado para dar formato al texto rápidamente. Para
obtener más tipos de formato, escriba la sintaxis de Markdown adecuada.
• Use el botón vínculo para crear vínculos a otras páginas.
• Seleccione un tema claro u oscuro para la ventana de código.
• Mostrar u ocultar una vista previa.

6. Cuando esté listo, haga clic en publicar en la parte superior derecha de la página.

132
8.28. Elemento web: Microsoft Forms

Con el elemento web Microsoft Forms, puede agregar un formulario o resultados de


formulario a su página de SharePoint Online.

1. Pase el mouse por encima o por debajo de un elemento web para ver una línea con un + en
un círculo, como este:

2. Haga clic en + para ver una lista de los elementos web que elegir. Haga clic en el elemento
web Microsoft Forms.

133
¿Desea agregar un formulario nuevo o existente para recopilar respuestas?

Formulario nuevo

1. Haga clic en Agregar nuevo formulario.

2. En el panel de la derecha, proporcione un nombre para el nuevo formulario.

3. Haga clic en Crear.

4. Microsoft Forms se abrirá en una pestaña nueva.

5. Cuando haya terminado de crear el formulario, vuelva a su página de SharePoint Online.


Asegúrese de que la opción Recopilar respuestas esté seleccionada y, a continuación, haga
clic en Aceptar para actualizar y ver el contenido más actualizado.

Nota: La dirección web del formulario que acaba de crear se rellenará en el campo Dirección
web del formulario.

134
Formulario existente

1. Haga clic en Agregar formulario existente.

2. Si desea compartir uno de sus propios formularios, vaya a https://forms.office.com y abra el


formulario que desea compartir en su página de SharePoint Online.

3. Copie la dirección web de la barra de direcciones del explorador.

Nota: En Microsoft Forms, también puede ir a la pestaña Compartir. En Enviar y recopilar


respuestas, haga clic en el botón Copiar para copiar la dirección web del formulario.

4. Vuelva a su página de SharePoint Online. En el campo Dirección web del formulario, pegue
la dirección web del formulario.

Sugerencia: Haga clic en Ctrl + V para pegar la dirección web.


Nota: También puede pegar una dirección web que alguien haya compartido con su usuario
en el campo Dirección web del formulario.

5. Asegúrese de que la opción Recopilar respuestas esté seleccionada y, a continuación, haga


clic en Aceptar para actualizar la página y ver el formulario.

135
Editar el formulario

1. En su página de SharePoint Online, mantenga el puntero a la izquierda del elemento web


Forms y haga clic en el icono Editar elemento web.
2. En el panel de la derecha, haga clic en Editar formulario actual para realizar cambios en el
formulario.

Mostrar los resultados del formulario

Una vez que haya recopilado las respuestas, podrá ver los resultados.

1. En el panel de la derecha, seleccione Mostrar los resultados del formulario.

Nota: En Dirección web del formulario, el siguiente mensaje está activado de forma
predeterminada: Se creará una dirección web. Cualquier persona que la tenga puede ver
un resumen de las respuestas. Microsoft Forms generará una dirección web para compartir
el resultado de la encuesta. Puede compartir la dirección web con cualquier persona para que
vean el resumen de las respuestas de esta encuesta.

Nota: Solo los propietarios y/o copropietarios del formulario pueden generar la dirección
web para compartir.

136
2. Haga clic en Aceptar.

Ahora puede ver un resumen de las respuestas en SharePoint Online.

137
8.29. Elemento web: Microsoft PowerApps

PowerApps es un servicio que le permite crear aplicaciones empresariales que se ejecutan en


un explorador o en un teléfono o una tableta, y no se requiere ninguna experiencia de
codificación. Una vez que haya creado o personalizado una aplicación con el servicio, puede
agregarla a su página de SharePoint con el elemento Web de PowerApps. Solo tienes que
escribir la dirección Web de la aplicación o el identificador de la aplicación y, a continuación,
cambiar el tamaño de la aplicación para ajustarla a la página.

Agregar el elemento Web de PowerApps

1. Mueva el mouse por encima o por debajo de un elemento Web existente o por debajo de la
zona de título, haga clic en y, después, seleccione el elemento Web PowerApps.
2. Haga clic en Agregar una aplicación.

3. En el panel de propiedades de la derecha, escriba el vínculo Web de PowerApps o el ID. de


aplicación en el cuadro de identificador o vínculo Web de la aplicación. Si no conoces el
vínculo o el identificador, consulta encontrar el vínculo Web o el identificador de la aplicación.

4. Si el tamaño predeterminado de la aplicación es demasiado pequeño o no se ajusta a la


página, puedes cambiar el tamaño de la aplicación arrastrando el botón cambiar tamaño en la
parte inferior derecha del elemento Web.

138
Notas:

• Agregar la aplicación a una página no concede automáticamente permisos a los usuarios


para usar la aplicación. para ver la aplicación, se debe conceder acceso a los usuarios. Para
obtener información sobre cómo compartir aplicaciones con usuarios o grupos de
seguridad específicos, o con toda la organización, consulta compartir una aplicación en
PowerApps.
• PowerApps están diseñados para trabajar mejor con tamaños fijos. Por motivos de diseño
de página, las aplicaciones que usan una orientación vertical se ajustan normalmente en
un diseño de una tercera o de tres columnas. Las aplicaciones que usan una orientación
horizontal suelen ajustarse bien en un diseño de una columna.
• El elemento Web de PowerApps (vista previa) de SharePoint Online aún no admite
lectores de pantalla ni la navegación mediante teclado.

Buscar el vínculo Web o el identificador de la aplicación

1. Vaya a http://powerapps.com e inicie sesión si es necesario.


2. Seleccione aplicaciones en la navegación izquierda.
3. Busque y seleccione la aplicación que quiera usar.
4. En la pestaña detalles, busque el vínculo o el ID. de Web.

139
8.30. Elemento web: Power BI

El elemento web de informes de Power BI le permite incrustar fácilmente un informe de


Power BI interactivo en la página. Los informes incrustados son totalmente seguros para que
puedan crear fácilmente portales internos seguros.

Agregar el elemento web de Power BI

Para obtener información sobre cómo usar el elemento web de Power BI, vea incrustar con el
elemento web de informes de SharePoint Online en el sitio de la documentación de Power BI.

Notas:

• Editores de informe de Power BI deben tener una licencia de Power BI Pro. Los usuarios que
ven el informe deben tener al menos una licencia de Power BI gratuita si el informe se
implementa en una capacidad de Power BI Premium. Si el informe no se ha implementado en
la capacidad de Power BI Premium, los usuarios que ven el informe también tendrán una
licencia de Power BI Pro. Si no tiene una licencia de Power BI, tendrá que se inscriban Power
BI o iniciar una prueba gratuita de Power BI.
• Incrustar un informe en SharePoint Online no da automáticamente los usuarios permiso para
ver el informe, incluso si los usuarios tienen permisos para ver la página. Los permisos para
ver el informe se establecen en el servicio de Power BI. Para obtener más información,
consulte conceder acceso a los informes en incrustar con el elemento web de informes en
SharePoint Online.
• El elemento web de Power BI (preview) para SharePoint Online no admite aún los lectores de
pantalla o navegación mediante el teclado.

140
8.31. Elemento web: Propiedades de lista

Permite conectarse a un elemento Web de lista en la misma página y mostrar dinámicamente


propiedades de la lista en la página. Para obtener más información sobre formas de conectar
elementos Web para Mostrar datos dinámicos, vea conectar elementos Web en SharePoint
Online.

En el ejemplo siguiente, un elemento Web de lista (superior) contiene una lista de oficinas
regionales. Cuando el usuario selecciona un elemento de la lista, el elemento Web de
propiedades de lista (abajo) solo muestra el nombre de la oficina y los datos de ventas.

Para ello, realice lo siguiente:

1. Si aún no tiene la lista a la que desea conectarse, cree la lista y Agregue las columnas que
desee mostrar en la página.
2. Vaya a la página en la que desea agregar la conexión de la lista.
3. Si la página aún no está en modo de edición, haga clic en Editar en la parte superior derecha
de la página.

Pase el mouse por encima o por debajo de un elemento web para ver una línea con un + en
un círculo, como este:

141
4. Haga clic en +y, a continuación, seleccione lista en la lista de elementos Web. Seleccione la
lista que desea usar.
5. Agregue el elemento Web propiedades de lista en la misma página.

6. En el elemento Web de propiedades de lista, haga clic en Editar elemento Web en el


lado izquierdo.
7. Haga clic en los puntos suspensivos (...) en la parte superior derecha del panel de
propiedades y, a continuación, haga clic en conectar con el origen.

8. En conectar con el origen, seleccione la lista que desea usar de la lista desplegable.
9. En Mostrar, seleccione lo que desea que el usuario vea en la página.
10. En campos para mostrar, active las casillas situadas junto a las columnas de las que desea
mostrar valores.

11. Haga clic en Guardar como borrador en la parte superior de la página.


12. Pruebe su conexión seleccionando un elemento de la lista que ha elegido. Debería ver el valor
que especificó en el elemento Web propiedades de lista.
13. Cuando esté listo para que la audiencia vea la página, haga clic en publicar en la parte
superior derecha de la página.

142
8.32. Elemento web: Propiedades de página

Las propiedades son detalles que proporcionan información y ayuda para describir la página,
como el título, la fecha, el tipo de contenido o las propiedades personalizadas que se
establecen al agregar columnas a la biblioteca de páginas.

Puedes agregar propiedades de la página a la página para proporcionar a los usuarios más
información.

Agregar el elemento Web propiedades de página

1. Vaya a la página donde desea agregar el elemento Web propiedades de página.


2. Si ya no está en modo de edición, haga clic en Editar en la parte superior derecha de la
página.
3. Mueva el mouse por encima o por debajo de un elemento Web existente o por debajo de la
zona del título, haga clic en y, después, seleccione el elemento Web propiedades de
página.
4. Haga clic en Agregar propiedades.

O bien, haga clic en el botón Editar elemento Web a la izquierda del elemento Web.

143
5. Haga clic en + Agregar en el panel de propiedades de la derecha y elija la propiedad que
desea mostrar en el cuadro de lista desplegable propiedad.

Repita este paso para agregar más propiedades.

Para quitar la propiedad, haga clic en quitar debajo de la propiedad.

144
8.33. Elemento web: Sitios

El elemento web sitios le permite mostrar automáticamente los sitios asociados a un sitio
concentrador “hubsite” (cuando se usa un sitio concentrador) o los sitios recientes de un
usuario actual (que son los mismos que los que se muestran en la Página principal de
SharePoint del usuario). Si tiene sitios específicos que desea mostrar, tiene la opción de
seleccionarlos en lugar de mostrarlos automáticamente.

Cuando se muestren sitios en el elemento Web, cada uno de ellos incluirá el nombre del sitio,
un vínculo al sitio y la última actividad del sitio. Las últimas actualizaciones y vistas de usuario
son ejemplos de actividad del sitio.

Agregar el elemento web sitios a una página

1. Vaya a la página donde desea agregar el elemento Web.


2. Si ya no está en modo de edición, haga clic en Editar en la parte superior derecha de la
página.
3. Mueva el mouse por encima o por debajo de un elemento Web existente o por debajo de la
zona del título y haga clic en .
4. En el cuadro de herramientas del elemento Web, use el cuadro de búsqueda para
buscar sitios. A continuación, seleccione el elemento Web sitios.

Cuando usa un sitio de concentrador, el elemento web mostrará automáticamente los sitios
asociados al sitio concentrador del que forma parte la página. Si no lo desea, puede
seleccionar sitios específicos o los sitios frecuentes del usuario actual en su lugar.

145
Elegir qué sitios desea mostrar

1. Haga clic en Editar elemento Web a la izquierda del elemento Web para abrir el
cuadro de herramientas sitios.
2. Siga uno de estos procedimientos:
o Para seleccionar sitios específicos para mostrar, haga clic en seleccionar sitios y, a
continuación, busque el sitio que desea agregar, o seleccione uno o varios sitios de sitios
asociados con este concentrador, sitios frecuentes o sitios recientes. A continuación,
seleccione las casillas de verificación de los sitios que desea mostrar.
o Para mostrar los sitios automáticamente, haga clic en todos los sitios en el Hub (solo cuando
esté usando un sitio concentrador) o en sitios frecuentes para el usuario actual (que
muestra los mismos sitios que los de la Página principal de SharePoint del usuario).

Cambiar el diseño

1. Si ya no está en modo de edición, haga clic en Editar en la parte superior derecha de la


página.

2. Haga clic en Editar elemento Web para abrir el cuadro de herramientas sitios.
3. En diseño, seleccione tira de imágenes, tarjetas o compactas. Tenga en cuenta que solo
puede reordenar los sitios en el diseño tarjetas.

146
Reordenar sitios

1. Si ya no está en modo de edición, haga clic en Editar en la parte superior derecha de la


página.

2. Haga clic en Editar elemento Web para abrir el cuadro de herramientas sitios.
3. En diseño, seleccione tarjetas. Solo puede reordenar los elementos del diseño tarjetas.
4. En el elemento Web de la página, arrastre y coloque los sitios en el orden que desee.

147
8.34. Elemento web: Stream

El elemento Web Stream o “secuencia” mostrará un canal o vídeo de flujo en la página


publicada. Además, los vídeos también se mostrarán directamente en la aplicación móvil de
SharePoint para iOS y la aplicación móvil de SharePoint para Android.

Microsoft Stream es un nuevo servicio de vídeo que usa la potencia del vídeo empresarial
inteligente para permitir el uso compartido del conocimiento, una comunicación más fácil y
conectividad en un entorno empresarial seguro. Microsoft Stream es el sucesor de Office 365
vídeo; sin embargo, los dos servicios coexisten durante el período de transición. Ambas están
integradas en los servicios multimedia de Azure y usan la misma tecnología de flujo de vídeo,
lo que permite la reproducción a escala en cualquier dispositivo. Para obtener más
información sobre cómo funciona Stream, vea el sitio web de Microsoft Stream.

Agregar un vídeo de Stream

1. Si ya no está en modo de edición, haga clic en Editar en la parte superior derecha de la


página.
2. Mueva el mouse por encima o por debajo de un elemento Web existente o por debajo de la
zona de título, haga clic en y, a continuación, seleccione el elemento Web secuencia.
3. Haga clic en Agregar vídeo o canal.

4. En el cuadro de herramientas de la derecha, seleccione el origen (un único vídeo o canal),


pegue el vídeo o la dirección del canal.
5. Opcionalmente, puede establecer un punto de partida para un vídeo o, para un canal, puede
elegir ordenar los vídeos por fecha publicada, tendencias, les gustan o vistas.

148
6. Cuando esté listo, guarde y publique la página para que otros usuarios puedan verla.

149
8.35. Elemento web: Twitter

Con el elemento Web de Twitter, puede mostrar tweets que sean relevantes para usted o su
público directamente en la página.

Notas:

• Si no ve este elemento Web en el cuadro de herramientas del elemento Web, es posible


que el administrador lo haya deshabilitado.

Agregar el elemento Web de Twitter

1. Vaya a la página donde desea agregar el elemento Web de Twitter.


2. Si ya no está en modo de edición, haga clic en Editar en la parte superior derecha de la
página.
3. Mueva el mouse por encima o por debajo de un elemento Web existente o por debajo de la
zona de título, haga clic en y, después, seleccione el elemento Web de Twitter.

150
Mostrar tweets de un usuario

1. En el cuadro Agregar un nombre de usuario de Twitter o un vínculo a un tweet o una


colección, escriba la dirección web o el nombre de usuario de Twitter para los tweets que
desea obtener. Por ejemplo:

Tweets desde una fuente de usuario

@microsoft

2. Un solo tweet de un usuario

https://twitter.com/SharePoint/status/950761587236728832

Mostrar tweets de una colección

Obtener resultados de una colección

Puede mostrar los resultados de una colección de tweets que ajustar y gestione.

1. Si aún no tiene una colección, puede crear una mediante TweetDeck para obtener
instrucciones, ver características de TweetDeck avanzadas y desplazarse hacia abajo hasta la
sección sobre colecciones.
2. Una vez que haya creado la colección, haga clic en el icono de filtro en la parte superior de la
colección para obtener acceso al menú y, a continuación, haga clic en compartir y ver en
Twitter.com.
3. Desde Twitter, copie la dirección Web de la colección. Debe tener un aspecto similar al
siguiente:

https://twitter.com/Contoso/timelines/951928001880408064

4. En el panel de propiedades del elemento Web de Twitter de su página de SharePoint, pegue


el vínculo de la colección en el cuadro Agregar un nombre de usuario de Twitter o un
vínculo a un tweet o una colección. Por ejemplo:

Establecer las opciones de presentación

• En Mostrar como, seleccione lista o cuadrícula.


• Activar o desactivar mostrar los bordes del encabezado y de la presentación.
• Establecer el color del tema en oscuro o claro.
• Escriba el número máximo de agudos que desea mostrar en el cuadro muestra de
máximo de tweets.

151
8.36. Elemento web: Video de Office 365

Use esta opción para mostrar un vídeo directamente en la página de portal de Office 365
Video de su organización.

Nota: Vídeo de Office 365 se reemplazará por Stream de Microsoft. Para obtener más
información sobre los planes de transición para los clientes de Vídeo de Office 365 actuales,
consulte migrar a la secuencia de vídeo de Office 365. Una vez haya iniciado mediante
secuencia, puede usar el elemento web de secuencia.

Agregar un vídeo de Office 365

1. Si no está en modo de edición ya, haga clic en Editar en la parte superior derecha de la
página.
2. Pasar el mouse encima o por debajo de un elemento web existente o en el área de título,
haga clic en y, a continuación, seleccione el elemento web de Office 365 Video.
3. Haga clic en Agregar vídeo.

4. En el cuadro de la derecha, haga clic en Ir al portal de video de su organización para


encontrar el vídeo que desee y, a continuación, pegue el vínculo para el vídeo en el cuadro.

152
8.37. Elemento web: Kindle

¿Tiene un libro que quiera recomendar o promocionar en la página? Puede compartir


fácilmente una vista previa de un libro Kindle mediante el elemento web vista instantánea
Instant Kindle. Para usar este elemento Web, tendrás que obtener el código para insertar del
libro del que quieres obtener una vista previa. Para obtener información sobre cómo hacerlo,
consulta el sitio de Kindle Instant Preview.

Notas:

• Si no ve este elemento Web en el cuadro de herramientas del elemento Web, es posible


que el administrador lo haya deshabilitado.

Agregar el elemento web vista instantánea Kindle

1. Si ya no está en modo de edición, haga clic en Editar en la parte superior derecha de la


página.
2. Mueva el mouse por encima o por debajo de un elemento Web existente o por debajo de la
zona del título, haga clic en y, después, seleccione el elemento Web de la vista
instantánea de Kindle.
3. Haga clic en Agregar vista previa.
4. En el cuadro de herramientas de la derecha, escriba el código para insertar. Puedes encontrar
el código para insertar siguiendo las instrucciones del sitio de Kindle Instant Preview.

153
5. Establezca las opciones que desee:
o Tamaño de vista previa
o Mostrar el contenido del libro (en su lugar o en una pestaña nueva)
o Mostrar el botón comprar
o Mostrar botón compartir
o ID. de asociación (opcional): agregue esto si forma parte del programa de asociados de
Amazon.

154
8.38. Elemento web: YouTube

Permite insertar vídeos de YouTube directamente en la página.

Notas:

• Si no ve este elemento Web en el cuadro de herramientas del elemento Web, es posible


que el administrador lo haya deshabilitado.

Agregar un vídeo de YouTube

1. Si ya no está en modo de edición, haga clic en Editar en la parte superior derecha de la


página.
2. Mueva el mouse por encima o por debajo de un elemento Web existente o por debajo de la
zona de título, haga clic en y, después, seleccione el elemento Web de YouTube.
3. Haga clic en Agregar vídeo.
4. En el cuadro de herramientas de la derecha, pegue el vínculo o el código para insertar el
vídeo que desea mostrar en el cuadro de Agregar un vídeo desde YouTube pegando su
vínculo o el código para insertar a continuación. Para buscar la dirección o el código para
insertar, vea Insertar vídeos y listas de reproducción en el sitio de YouTube.

155
5. Escriba la hora de inicio del vídeo en hora de inicio y Active o desactive las opciones
disponibles.
6. Especifique una hora de inicio si desea que el vídeo se inicie en un momento que no sea el
principio.
7. Activar o desactivar las opciones para:
o Mostrar vídeos sugeridos al final
o Mostrar controles de reproductor
o Mostrar título de vídeo
o Modo mejorado de privacidad: cuando esta opción está activada, YouTube no almacena
información sobre los visitantes a menos que reproduzca el vídeo.

156
8.39. Elemento web: Fondo de sección

Este elemento Web que permite ampliar la funcionalidad que traen las páginas modernas
para el “fondo de sección” de las secciones, el usuario puede definir para el fondo de
secciones otros colores por fuera del tema sitio o puede seleccionar una imagen de fondo.

Agregar el elemento Web fondo de sección

1. Vaya a la página donde desea agregar el elemento Web fondo de sección.


2. Si la página no está ya en modo de edición, haga clic en Editar en la parte superior derecha
de la página.
3. Pase el “mouse” por encima o por debajo de un elemento web para ver una línea con un + en
un círculo, como este:

157
4. Haga clic en + y, a continuación, seleccione fondo de sección de la lista de elementos Web.

Notas:

• El fondo de sección aplica solo para la sección donde se encuentre agregado el elemento
web.
• No se deben agregar más de un elemento web de fondo de sección por cada sección,
para evitar errores.
• Este control depende en gran medida de los cambios o definiciones que Microsoft tiene
sobre el nombramiento interno de las secciones.
• Los colores de contraste de la letra en los elementos web de la sección dependen siempre
del color de fondo de sección original de la sección.

5. Haga clic en Editar elemento Web en el lado izquierdo para abrir el panel de
propiedades y cambiar el número máximo de elementos que desea mostrar en la página.

6. Color de fondo de sección, puede decidir solo utilizar como fondo de sección un color
determinado, para ello, debe seleccionar el botón en forma de paleta de colores y mover el
círculo que se visualiza en la gama de colores, o ingresarlo manualmente.

158
7. Imagen de fondo de sección, puede decidir solo utilizar como fondo de sección una imagen
determinada, para ello, debe ingresar la URL de la imagen, las imágenes deben estar ubicadas
en algún sitio de SharePoint, no se permiten imágenes externas.

Notas:

• Se sugiere no usar imágenes que contengan texto o elementos que requieran


posicionamiento sobre la imagen de fondo, porque esta imagen no se ajusta de forma
coordinada sobre las pantallas móviles.

Opacidad: permite agregar un filtro oscuro sobre la imagen para permitir que el contenido se
visualice mejor. Si se selecciona un color, el filtro tomará ese color como capa de opacidad
sobre la imagen.

Repetir: permite cambiar la secuencia en que se visualiza la imagen, si se repite


verticalmente, horizontalmente o nunca se repite.

Posición: sirve para cuando la pantalla se reduce, como en una versión móvil y define la
posición o foco central donde la imagen se mantiene fija y las otras secciones se reducen.

Tamaño: permite expandir la imagen o sostener la imagen real sobre el contenido.

159
8. Si desea puede seleccionar al mismo tiempo, color e imagen de fondo de sección y por medio
del parámetro “Opacidad” puede realizar un tipo de filtro visual sobre la imagen para generar
otro tipo de diseño.

9. Cuando esté listo, haga clic en publicar en la parte superior derecha de la página.

160
8.40. Elemento web: Plantillas HTML

Este elemento Web presenta una plantilla HTML creada previamente por un equipo de
diseño. Las plantillas son visualizaciones reutilizables y son almacenadas en el “Catálogo de
Apps”, el mismo sitio donde están guardadas las diferentes “apps” de la organización.

Agregar el elemento Web plantillas HTML

1. Vaya a la página donde desea agregar el elemento Web guardado para más tarde.
2. Si la página no está ya en modo de edición, haga clic en Editar en la parte superior derecha
de la página.
3. Pase el “mouse” por encima o por debajo de un elemento web para ver una línea con un + en
un círculo, como este:

4. Haga clic en + y, a continuación, seleccione plantillas HTML de la lista de elementos Web.

5. Haga clic en Editar elemento Web en el lado izquierdo para abrir el panel de
propiedades y cambiar la ruta de la plantilla HTML.

6. La ruta de la plantilla HTML se completa por medio de la URL donde se encuentra ubicada la
plantilla HTML (.htm o .html).

161
Notas:

• La plantilla debe estar ubicada en el “Catálogo de Apps” de la organización.


• Generalmente el equipo de diseño tiene diferentes plantillas creadas allí, y por medio de
una lista de ellas, tú puedes decidir cuál se desea agregar en el contenido del sitio,
utilizando la URL y asignándola en este campo.

7. Cuando esté listo, haga clic en publicar en la parte superior derecha de la página.

162

Das könnte Ihnen auch gefallen