Este post es continuación del post RSS Popfly WebSlice[1] -Despidiéndome de PopFly. Para continuar con nuestro proyecto usaremos Expression Web 2.0.
1.-Abrimos Expression Web y creamos un nuevo Sitio Web Vacio
2.- Creamos un nuevo documento ASPX.
3.-Una vez preparado nuestro sitio y documento ASPX tendremos que ir a http://www.popfly.com/ , iniciar sesión y ver nuestros proyectos
.
.
4.- Buscamos el proyecto WebSlice Popfly RSS y damos clic en el titulo.
5.-Dentro de la pantalla del Mashup en la parte inferior derecha encontraremos un botón que dice Share lo presionamos para poder compartir nuestro mashup. Si lo deseamos podemos subir una preview del mashup.
6.-Presionamos el botón de Embed para copiar el código que allí nos proporcionen.
7.-El código copiado nos servirá para llamar al mashup desde nuestra pagina ASPX
(*Se modificara el tamaño del iframe del mashup para que quepa en el WebSlice )
.
8.-Regresamos a Expression Web y en la pagina ASPX colocamos el siguiente código:
1: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2: <%@ Page Language="C#" %>
3: <html dir="ltr" xmlns="http://www.w3.org/1999/xhtml">
4: <head runat="server">
5: <meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
6: <title>Page RSS Popfly WebSlice</title>
7: </head>
8: <body>
9: <div id="topten"class="hslice">
10: <h6 class="entry-title" style="display:none">RSS Popfly WebSlice</h6>
11: <div class="entry-content">
12: <iframe style='width:283px; height:215px;' src='http://www.popfly.com/users/darkchicles/WebSlice%20Popfly%20RSS.small' frameborder='no' allowtransparency='true'></iframe>
13: </div>
14: <a href="RSSPopfly.aspx" rel="entry-content"></a>
15: </div>
16: </body>
17: </html>
En la linea 9: decimos que el contenido del div pertenece a un WebSlice [class=”hslice”]
En la linea 10: Colocamos el nombre de nuestro WebSlice, tiene el [style display:none] para que no se muestre en la pagina
En la linea 11: Empieza el contenido de nuestro WebSlice
En la linea 12: Pegamos el código de nuestro Mashup de PopFly
En la linea 13: Se cierra la etiqueta div (de la linea 11) indicando que es el fin del contenido de nuestro WebSlice
En la linea 14: Esta línea hace la magia “llamándose a si misma la pagina”. Para que quede mas claro, la pagina se debe llamar RSSPopfly.aspx en este ejemplo.
9.- Guardamos la pagina con el nombre de RSSPopfly.aspx y probamos dando clic en el icono de vista previa 
Bueno el Resultado es el siguiente:
10.-Para agregar el WebSlice a nuestra barra de favoritos basta con dar clic en el icono de WebSlices
Una vez agregado nuestro WebSlice a la barra de favoritos el trabajo final queda:
Si desean el código fuente o tienen alguna duda, manden un correo a: darkchicles[ar]student-partners[dot]com
*Recuerden que esto es Exclusivo de Internet Explorer 8, ;), si no lo tienen bájenlo
*También recuerden que PopFly Cierra definitivamente el 24 de agosto, por lo que este post quedara inservible XD~ pero quedara como un homenaje póstumo.
darkchicles.com 