Cómo crear botones personalizados en la Ribbon con SharePoint Designer

Este pequeño tip le será de gran utilidad a las personas que lidian con la creación de listas, bibliotecas y flujos de trabajo en SharePoint, y que además gustan de crear una experiencia de usuario de menos clics, más rápido y sencillo. Se basará en la plataforma de SharePoint en su versión 2013. Lo que se pretende mostrar aquí se puede hacer también con Visual Studio, pero se mostrará cómo hacerlo mediante SharePoint Designer, ya que será el método más accesible para la mayoría de las personas que quieran hacer lo mencionado de una manera sencilla.
Piense en esta situación: usted debe crear una biblioteca documental llamada “Documentación”, que será usada por un grupo de usuarios que no tienen mucho conocimiento de SharePoint. El requerimiento relacionado a esa biblioteca, habla a grandes rasgos de que para un documento que exista en la biblioteca, el usuario debe tener la posibilidad de iniciar de manera manual un flujo de trabajo llamado “Flujo de prueba 1”.

documentacion

En ese momento, usted recuerda que el procedimiento para iniciar de manera manual un flujo de trabajo sobre un documento puede ser este: seleccionar el documento, darle clic en los tres puntitos, clic en los tres puntitos de la ventana que apareció, “avanzado”, y dar clic en “flujos de trabajo”.

documentodetipo

 

documentacionworkflow1

documetacionworkflow2

documentoactualizado

Como se puede ver, el proceso es algo engorroso y largo, y puede durar un periodo de tiempo significativo para el usuario llevar a cabo todo este proceso si su conexión a internet es lenta. Pero no sólo existen factores de incomodidad para realizar este proceso de este modo, sino también el riesgo de que el usuario final elija un flujo de trabajo equivocado (en caso de que la biblioteca tenga asociado más de uno) y produzca efectos indeseados en su documento.
Existen muchas formas de hacer las cosas, y en específico, varias de hacer que el usuario pueda hacer este proceso de manera más fácil, y aquí se mostrará cómo crear una acción personalizada usando SharePoint Designer para iniciar flujos de trabajo con pocos clics. Para el paso a paso, se crea un documento en la biblioteca en la que estamos trabajando.

documentacionew
Ahora abrimos el SharePoint Designer (si no lo tiene instalado, descargar el instalador desde http://www.microsoft.com/en-us/download/details.aspx?id=35491 actualmente la 2013), abrimos nuestro sitio, y seleccionamos la biblioteca sobre la que estamos trabajando. En este caso, la biblioteca se llama “Documentación”.

sharepointdesigner

En el siguiente paso, iremos a la Ribbon y seleccionaremos “Custom Action”, y luego “View Ribbon”. En este paso podemos elegir la ribbon donde se mostrará la nueva opción que crearemos, o también si queremos crearla en el “Menú contextual” de cada documento (el menú que aparece al darle en los tres puntos junto a cada documento en la biblioteca).

spdesignerviewribbon

Hecho esto, nos aparecerá una pequeña ventana que nos ayuda a configurar la nueva acción personalizada. Le ponemos un nombre a la acción (El que mostrará en la ribbon) y la descripción. En el apartado “Select the type of action” nos permite navegar hacia un formulario, una dirección web o también iniciar un flujo de trabajo determinado, que dicho sea de paso, es nuestro caso. Seleccionamos para ello “Initiate workflow” y lo escogemos de la lista.

customaction1

Bajamos un poco, y veremos el apartado “Advanced custom action options”. En esta parte, le colocamos el ícono que queremos que muestre el botón, en tamaños de 32×32 y 16×16 píxeles (Lo que se muestra con el número 7 en la imagen de abajo). En este caso, lo más sencillo es tener esas dos imágenes guardadas en nuestro sitio (en alguna biblioteca de imágenes, por ejemplo) y copiar y pegar el enlace de cada una de ellas en el espacio correspondiente en este formulario. En la parte marcada con azul, se puede definir la posición en la ribbon donde quedará el botón de la acción personalizada que estamos creando (número 8 en la imagen de abajo). Para nuestros efectos, lo dejaremos tal y como está.

customaction2

Le damos OK. Luego de unos momentos, podremos ver que nuestra acción personalizada se ha creado con éxito en el apartado “Custom actions”.

sharepointdesignercustomaction

¡Perfecto! Ahora es momento de probar nuestra acción personalizada, para comprobar que efectivamente será muchísimo más fácil para el usuario y más seguro también.
Volvemos a la biblioteca, y seleccionamos el documento sobre el que queramos correr el flujo de trabajo asignado a la acción personalizada que creamos anteriormente. Luego, en la Ribbon, en el menú “Files”, en el apartado “Manage” encontraremos nuestro botón de acción personalizada, con el ícono que le habíamos asignado. Le damos click, y dejamos que el flujo inicie.

accion-personalizada

Como veremos, el flujo inicia, mostrando la siguiente pantalla:

workingonit

Después, la pantalla desaparecerá y volveremos a nuestra biblioteca. Si refrescamos la página luego de unos momentos, veremos que el flujo ha hecho su trabajo:

biblioteca

Como hemos visto, el proceso engorroso descrito anteriormente se reduce a dos simples clics.
Usa esta simple configuración para darle un toque más elegante a tus bibliotecas, además de asegurar un mayor grado de usabilidad a los procesos en los que se pueda implementar; esto, sin olvidar que se está reduciendo el margen de que el usuario cometa errores considerablemente.

Deja un comentario