Helpers Redes Sociales en MVC3

En varios BLOGS, se habían anunciado para MVC3 helpers para aportar una rápida integración con las Redes sociales (Twitter, FaceBook…), Buscadores (Bing)…

 

Si ya tenemos en nuestro entorno instalada la Beta 3 de MVC, vamos a crear un nuevo proyecto de ejemplo.

 

Una vez creado, vamos a agregar un paquete a través de NUPACK, para poder incluir los Nuevos Helpers. Para ello, pulsamos con el botón derecho en el proyecto y elegimos “Add package reference”:

Seleccionaríamos “microsoft-web-helpers” y pulsamos en aceptar.

Una vez realizado, a la carpeta de referencias se habrá añadido la referencia “Microsoft.Web.Helpers.dll”. Para que funcione de manera correcta vamos a compilar el proyecto.

 

Bien una vez instalado y compilado, vamos a ir a nuestra vista por defecto para hacer unos pequeños ejemplos, que voy a poner con una vista normal (no Razor):

TWITTER Helper:

Vamos a empezar con Twitter (que me gusta más :p Mi Twitter):

Si en nuestra vista tecleamos “<%= “ o "<:”

Podremos ver los contenidos que nos va a mostrar el Intellisense. Bien si tecleemos Twitter nos va a aparecer nuestro nuevo Helper.

¿Qué métodos presenta?:

– Profile: Nos permite mostrar el contenido de nuestro perfil en Twitter. Aunque el único parámetro obligatorio es twitterUserName, os dejo una imagen con los distintos parámetros:

Como quedaría el código, de manera simple:

    <%: Twitter.Profile("jtorrecilla")%>

Cuando ejecutamos nuestra vista quedaría algo así:

– Search: El otro método disponible es el método de Búsqueda. Al igual que con el método Profile, tiene varios parámetros, pero el único obligatorio es: SearchQuery, Os dejo una imagen con el resto de parámetros.

El código quedaría así:

    <%=Twitter.Search("MVC") %>

El resultado de una búsqueda sencilla sería:

 

 FACEBOOK Helper:

Seguro que cada vez que vas a alguna web / blog te encuentras con el típico botón de “Me gusta” para publicarlo en FaceBook, pues ha llegado a MVC el Helper, que te lo permite hacer de una forma muy sencilla.

 

El único método de este Helper es “LikeButton”. Presenta varios parámetros, todos ellos opcionales, y los podeis ver aquí:

 

En código un ejemplo sencillo sería:

 <%= Facebook.LikeButton("http://geeks.ms/blogs/jtorrecilla/") %>

Y el resultado (antes y después de pulsar en Me Gusta):

 BING Helper:

Este Helper nos va a permitir incrustar el buscador de BING, en nuestras vistas con 2 sencillo métodos:

– SearchBox: El código sería muy sencillo, aunque el método puede recibir distintos parámetros, todos ellos opcionales: Url del sitio, y Tamaño de la Caja que se va a visualizar.

    <%=Bing.SearchBox() %>

Visualización Ejemplo:

– AdvancedSearchBox: Igual que el anterior con los siguientes parámetros:

 

Bueno después de la parrafada que os he soltado, solo espero que os sea de utilidad.

Un saludo.

4 comentarios sobre “Helpers Redes Sociales en MVC3”

  1. Estupendo el post, solo una pequeña pregunta

    ¿Si queremos un nivel mayor de personalización de la interfaz de twitter, por ejemplo, que otras opciones tendríamos?

  2. Hola Roberto Luis, En primer lugar me alegro que te haya gustado el Post.

    La verdad es que para personalizar la interfaz no nos da mucho jugo, nada mas que cambiar los colores(si te fijas están los parámetros: tweetsBackGroundColor,tweetsColor,tweetsLinkColor,y BackGroundShellColor).
    Si visitas http://aspnet.codeplex.com/, encontrarás el Código Fuente de la Beta de MVC3, y podrás mirar el código, que realmente es una interpretación de la API de Twitter, que quiero decir con esto, que podrías implementar una versión propia del Helper si lo deseas, dándole incluso algo más de opciones, como sería enviarle los estilos que tu desees utilizar para pintar el código.

    Un saludo.

Responder a jtorrecilla Cancelar respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *