domingo, 24 de octubre de 2010

Acciones personalizadas en los menús de SharePoint 2010

Pese a que a nivel de desarrollo con Visual Studio y .NET añadir nuevas acciones personalizadas a los menús de SharePoint 2010 ha cambiado muy poco respecto a la versión 2007, sí que se ha facilitado la posibilidad de crearlas sin necesidad de recurrir a la programación.

Como todos sabemos ya, la Ribbon es un excelente recurso que nos permite realizar muchas acciones con muchos menos clicks, pero ¿Cómo lo hacemos si queremos añadir nuestros propios botones personalizados a la cinta de acciones?

Mediante SharePoint Designer 2010 es realmente sencillo. Una vez hemos abierto el sitio y la biblioteca o lista donde nos interesa introducir la nueva acción personalizada, veremos que en la zona inferior derecha de la pantalla de resumen sobre la lista o biblioteca, nos aparece una sección de "Custom Actions" (Acciones personalizadas).

Al pulsar con el ratón sobre esa zona, veremos que en el SharePoint Designer automáticamente nos cambia la Ribbon, y aparece un icono de "Custom Action" (Acción Personalizada).

Al pulsar sobre él veremos los diferentes tipos de acciones personalizadas que podemos realizar:
  • List Item Menu --> Agrega la acción en el menú desplegable del ítem
  • Display Form Ribbon --> Agrega la acción en el menú de la cinta de acciones al "ver las propiedades" de un elemento de la lista o biblioteca.
  • Edit Form Ribbon -->Agrega la acción en el menú de la cinta de acciones al "editar las propiedades" de un elemento de la lista o biblioteca. 
  • New Form Ribbon --> Agrega la acción en el menú de la cinta de acciones en el formulari que nos muestra al crear un nuevo de un elemento de la lista.
  • View Ribbon --> Añade la acción en la cinta de acciones principal del item o documento.

Al seleccionar una de estas opciones, veremos que nos aparece un formulario donde podremos configurar la acción personalizada que estamos creando. A parte de ponerle un nombre y descripción, nos permitirá escoger el TIPO de acción personalizada a crear, a escoger entre:
  • Navegar a un formulario de la lista actual (Dispform, EditForm, Upload).
  • Iniciar un Workflow. Se entiende que esta es el tipo de acción más potente por la enorme flexibilidad que tenemos al crear y configurar un flujo de trabajo en SharePoint 2010, pudiendo llegar a realizar cualquier tipo de acción o secuencia de acciones que el flujo de trabajo tenga programadas. Es necesario crear el flujo previamente y asociarlo y publicarlo en la lista para poderlo seleccionar posteriormente en esta pantalla de configuración de la acción personalizada.
  • Navegar a una URL. Nos permitirá usar el botón personalizado como un enlace a otra página web (ya sea interna o externa al SharePoint)
Además, nos permitirá escoger los iconos de la imagen asociada a la acción. Según el tipo de acción que estemos configurando nos pedirá tanto el icono en 16x6 píxeles como en 32x32. Destacar que para que funcione correctamente estas imágenes deben ser subidas préviamente a una biblioteca de SharePoint. Personalmente recomiendo la de "Activos del sitio" (Site Assets) que genera automáticamente SharePoint 2010 en cada sitio que creamos (ya que está pensada precisamente para este tipo de elementos).

También el propio formulario nos permite seleccionar en qué sección de la Ribbon queremos que aparezca el botón (en caso de que estemos creando un botón para la ribbon y no un "List Item Menu"). Aunque por defecto Designer nos situa los botones en una zona determinada de cada Ribbon, en este enlace podreis ver la lista de diferentes ubicaciones que admite en cada situación para que podais hacer aparecer el botón donde más gusteis.

El siguiente parámetro del formulario es el la máscara de permisos "Rights mask", que por defecto lo deja en "EmptyMask", o lo que es lo mismo, que para pulsar el botón no se necesite ningún tipo de permiso especial. Para modificar este parámetro, podemos poner diversas máscaras separadas por puntos y comas. ¿Qué máscaras existen y cómo se invocan? Os recomiendo visitar este enlace para resolver vuestras dudas.

Por último, en el formulario de configuración de la acción personalizada, nos pedirá que introduzcamos un número de secuencia (opcional). Esto sirve por si definimos diversos botones personalizados, que podamos ordenarlos a nuestro gusto. El número más pequeño tiene prioridad. Es decir, el botón con secuencia =0 aparecerá en primer lugar, el =1 en segunda, el =2 en tercera... y así sucesivamente.


Bien, una vez tengamos definida nuestra acción personalizada, pulsamos el botón de OK y automáticamente podremos ver los resultados en nuestra lista o biblioteca de Sharepoint 2010. A continuación os muestro una pantalla de ejemplo para cada uno de los diversos tipos de acciones personalizadas que podemos crear (en todos los ejemplos he creado una acción personalizada llamada "Notify Bug" con el icono de una llama)

1.- ListItemMenu --> Botón en el desplegable de opciones del ítem o documento.

2.- Display Form Ribbon --> Botón en el formulario de "visualizar propiedades" de un ítem o documento.


3.- Edit Form Ribbon -->  Botón en el formulario de "editar propiedades" de un ítem o documento.


4.- New Form Ribbon --> Botón en el formulario de "Nuevo elemento" de un ítem de una lista


5.-View Ribbon --> Visualizar el botón personalizado en la Ribbon principal del elemento o documento


También vereis que podeis crear acciones personalizadas con SharePoint Designer 2010 en la propia sección de "Custom Actions" de la lista, con el icono "New" (Nuevo) de la sección. En este caso, al ser un botón de creación rápida, nos creará únicamente botones del tipo Menú de lista (el ejemplo número 1)


Finalmente comentar que también se pueden crear acciones personalizadas desde la propia Ribbon de las listas o bibliotecas de SharePoint, mediante la opción "Nuevo Paso Rápido" (o "New quick step" si lo tenemos en inglés) que encontraremos en la propia cinta de acciones de las librerías o listas del SharePoint, en la agrupación de "personalizar".


En este último caso, lo que hará SharePoint es abrir SharePoint Designer 2010 y dejarnos configurar una acción del tipo "View Ribbon" (ejemplo número 5), siendo obligatorio en este caso asociar un flujo de trabajo al botón (que ya esté creado o que creemos nuevo en ese momento).

Y hasta aquí el post sobre las acciones personalizadas de SharePoint 2010.

¡Un saludo y hasta el próximo post!

5 comentarios:

Anónimo dijo...

Excelente explicación. Una consulta, habrá alguna forma de utilizar la opción de navegar a una URL pero antes trasladar un parámetro? El objetivo sería poder relacionar una lista con otra, por lo que requiero enviar el id del origen.

Ignasi Tebé Tena dijo...

Gracias Anónimo, Si te refieres a incluir un parámetro en la URL, no hay ningún problema, lo introduces directamente en el campo.
Si te refieres a un parámetro variable, no existe ninguna manera de introducir variables en el campo con SharePoint Designer, por lo que en ese caso, deberías desarrollar el botón con Visual Studio y .NET.

Saludos!

Anónimo dijo...

Gracias Ignasi por tu respuesta. Otra consulta relacionada al tema. Incluí una acción rápida en el formulario predeterminado para ver el elemento. Todo iba muy bien pero personalicé el formulario con el Infopath, por lo que se genera un nuevo archivo y no hereda las acciones rápidas creadas al principio, ni tampoco es posible crearlas de nuevo. Hay alguna solución? Gracias

Rubén dijo...

Hola, Ignasi
Me ha parecido muy interesante el artículo y lo estoy poniendo en práctica. Tengo un problema al construir la URL de destino. La idea es que pinche en un elemento y la opción personalizada lo envía a una URL que se construye con un id que es uno de los campos. Pero me está dando error. La construcción sería algo así:
http://misitio/{campoID}/pagina.aspx
{campoID} representa el ID de un subsitio.

Muchas gracias y un saludo

Anónimo dijo...

Hola Ignasi,
Estoy trabajando con SharePoint 2010 y tengo un problema: agregué, en un formulario de edición, una acción personalizada que inicia un flujo de trabajo. El problema es que al hacer click en el botón de la acción NO guarda los cambios en el formulario de edición que se está trabajando. ¿Cómo vinculo la acción?, es decir cuando se preciona el botón, que confirman los datos en el formulario y se inicia el flujo de trabajo.
Saludos y gracias