Archivo para la Categoría "►Web Slices"

RSS Popfly WebSlice[2] -Despidiéndome de PopFly

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

image

image 

image

 

 

2.- Creamos un nuevo documento ASPX.

 

 

 

image

 

 

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.

image

 

image

 

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.

 

 

image

 

 

 

 

6.-Presionamos el botón de Embed para copiar el código que allí nos proporcionen.

 

 

 

image

 

 

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>

 
Analicemos las líneas importantes del código:
 

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.

image

9.- Guardamos la pagina con el  nombre de RSSPopfly.aspx y probamos dando clic en el icono de vista previa image

Bueno el Resultado es el siguiente:

image

10.-Para agregar el WebSlice a nuestra barra de favoritos basta con dar clic en el icono de WebSlices

image

Una vez agregado nuestro WebSlice a la barra de favoritos el trabajo final queda:

image 

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.

Anuncios

RSS Popfly WebSlice[1] -Despidiéndome de PopFly

Crearemos un lector RSS con PopFly, el cual será consultado con un WebSlice de Internet Explorer 8.

Entramos a: http://www.popfly.com 

 

image

 

1.- Creamos un Mashup

 

 

 

 

 

image

 

2.- Buscamos el cubo “RSS” y lo arrastramos al área de trabajo

 

 

 

 

 

 

image

 

3.-Damos clic en la “herramienta” para configurar el RSS

 

 

 

image

4.-Colocamos la dirección de nuestro RSS en mi caso coloco la del blog. presionamos aceptar para terminar de configurarlo

 

 

image

4.-Presionamos el icono del “foquito” y aparecerán sugerencias

image

5.-Seleccionamos el cubo “News Reader” y lo colocamos en el área de trabajo

image

6.-Unimos los cubos

image

 

 

7.- Configuramos el cubo de la siguiente forma

 

 

 

image

8.-El resultado final Sera el Siguiente:

image 

No olvidemos guardarlo 😉

image 

Con esto terminamos la primera parte de nuestro WebSlice Popfly RSS en el siguiente post crearemos el WebSlice que se unirá con el Mashup que acabamos de guardar.

-Segunda Parte: https://darkchicles.wordpress.com/2009/07/19/rss-popfly-webslice2-despidindome-de-popfly/

IE8 WebSlices y Aceleradores

En el evento “Festival de Instalación Internet Explorer 8” que se realizo en UPIICSA el día martes 16 de junio 2009, tuve la oportunidad de dar una pequeña  charla de las nuevas características de Internet Explorer 8 con el tema particular “WebSlices y Aceleradores”, comparto la pequeña presentación de Power Point:

 

WebSlices&Aceleradores.pdf

Para los compañeros que pedían mas información de como desarrollar sus propios WebSlices y Aceleradores dejo las siguientes ligas:

image Acerca de los Web Slices

image  Acerca de los Aceleradores

En el siguiente post colocare un tutorial de como realizar paso a paso el demo “Acelerador de Mercado Libre” que presente en la platica.

PD.- Gracias a todos los asistentes.

*Si deseas el .pptx mándame un correo a
darkchicles[ar]student-partners.com

Darkchicles the blog – BogIT 3er edición

Hola amigos =D ahora si, allí les va un tutorial de como votar por el blog en el concurso de Microsoft BlogIT.

SON SOLO 3 PASOS Y NO TARDAS NI UN MINUTO

¡¡NOS AYUDAS MUCHO CON TU VOTO!!

1er Paso:

Entra a la pagina web http://www.blogit.ms

image

En la parte superior encontraremos un menú damos clic en Top Bloggers

image

O bien da clic en: http://www.blogit.ms/TopBloggers.aspx 

2o Paso:

En la sección de Top Bloggers Seleccionamos la categoría de Internet WebSlices y presionamos buscar

image

buscamos el blog https://darkchicles.wordpress.com/

Damos clic en el botón de Votar

image

En la ventana emergente que aparece colocamos nuestro correo electrónico y presionamos el botón aceptar

image

image

3er Paso:

Una vez que tu registro de voto ha sido exitoso, espera unos minutos y revisa tu correo electrónico TE LLEGARA UN MAIL DE concurso@blogit.ms con el asunto Validación de tu voto en BlogIT [SI VEZ QUE NO TE LLEGA EL MAIL REVISA TU CORREO NO DESEADO]

image

El mail contiene una liga en la cual daremos clic para ASI CONFIRMAR NUESTRO VOTO

image

Una vez que aparece el  siguiente mensaje:

image

Y listo!!! SOLO ME QUEDA AGRADECER =D Enjoy!!

Web Slices Internet Explorer 8 –Concursando en BlogIT.ms-

Como comente en un post anterior  el concurso de Microsoft BlogIT ha regresado y así pues con el nuevo reglamento, ahora puedo concursar, pero he decidido cambiar de categoría, buscando un poco mas de oportunidad, AHORA ME INCRIBI EN LA CATEGORIA Internet Webslices.

Icono Web SliceEste post es para explicar un poco de que se trata esto de los Internet Web Slices.

Los Web Slices primordialmente son un complemento especialmente diseñado para Internet Explorer 8 , este complemento nos sirve para ver “pedacitos” de paginas web, ¿Que quiero decir con eso de “pedacitos”? pues tal como se entiende, tendremos una sección de nuestra pagina web favorita en la barra de favoritos de IE8, ¿Pero que no eso ya existe y se llama RSS? . Si bien maneja un concepto muy parecido, los Web Slices mejoran drásticamente el aspecto visual de como presentar los RSS.

Si me pidieran una forma fácil y sencilla de describir un Web Slices yo les diría:

Web Slice 1

Son pequeñas ventanitas “dentro de tu ventana de Internet Explorer 8" donde muestras fragmentos de tus paginas web favoritas

Web Slice 2

Creo es algo difícil de comprender al inicio, mas que nada por que no estamos acostumbrados a este tipo de cosas pero definitivamente un golpe a las mejoras dentro de IE 8.

PD: En post siguientes empezare a describir como crear nuestro propio Web Slice y publicarlo en la galería de complementos de Internet Explorer 8.

Quieres saber mas…

Web Slices directo del sitio de Internet Explorer 8
http://www.microsoft.com/spain/windows/internet-explorer/features/web-slices.aspx

Galería de complementos Web Slices México:
http://www.ieaddons.com/mx/webslices/

Excelentes posts de como crear tus Web Slices http://geeks.ms/blogs/amolleda/archive/2009/04/08/ie8-web-slices-i.aspx

http://geeks.ms/blogs/amolleda/archive/2009/04/22/ie8-web-slices-ii.aspx

http://geeks.ms/blogs/amolleda/archive/2009/04/22/ie8-web-slices-iii.aspx

Nube de etiquetas