Crea Gadgets utilizando Image Maps. - The Blog By Taina

Crea Gadgets utilizando Image Maps.

martes, julio 21, 2015



Me gusta lo fácil, rápido y sencillo, llámame floja pero así soy, y siempre ando buscando la forma mas sencillas de hacer las cosas, por ejemplo porque esperarte a que se descongelen las carnes para preparar la comida, si existe un microondas que alguien en algún momento de la historia lo invento y creo que pensó en mi, en la flojera que me da esperar, así que booomm lo meto al micro, lo descongelo y listo, si si ya se que es un ejemplo bastante absurdo pero así es, fácil, rápido y sencillo, como me gusta.

Hablemos pues de lo que te tengo hoy, hablemos de algo que te va a ahorrar vida y con vida digo tiempo, Image Mapping ! Whoa que es eso?? Ahora te explico paso a paso con imágenes.

Veras para crear este gadget de redes sociales(arriba) pensarías que necesitas un código bastante complicado, que tendrías que tocar la platilla HTML y tal vez personalizar el CSS, pero la realidad es; que es mas sencillo de lo que pareces y puedes hacer lo que se te ocurra. yo he hecho este diseño con powerpoint, pero tu puedes utilizar el que mas te guste o se te haga mas fácil, como Picmonkey 

Ya que tengas creada la imagen que utilizaras,(si gustas puedes utilizar la que yo he creado,solo con tu botón derecho del mouse dale en guardar imagen como....) vamos al primer paso.

Paso1. Vamos a Image-Maps sube la imagen que quieres agregar desde tu computadora
Paso 2. Ya que seleccionamos nuestra imagen vamos a iniciar mapping.

Paso 3. ya que esta tu imagen cargada pincha continuar(continue).
Paso 4.  Sigue exactamente los paso de la siguiente imagen desde el paso 1 hasta el 4 y la nota.
Para seleccionar el rectángulo presiona el boton derecho de tu mouse y te aparecera el cuadro de opciones, presiona creat rec(crear rectangulo) y arrastra el puntero por la primera red social, ya que la tengas seleccionada pega la URL dande te indica y asigna un nombre, presiona guardar, Tienes que repetir el mismo paso para cada red social.
Paso 5. Ya que hayas seleccionado todas las redes sociales y estén marcadas en rojo, presiona nueva mente el lado derecho de tu mouse y te aparecerá de nuevo el rectángulo esta vez presiona GET CODE(obtener código) 
Paso 6. Presiona donde dice HTML code, y en la parte de mas abajo estará el código que tienes que copiar, lo vamos a necesitar en el siguiente paso.

Paso 7. Whew ! ya mero terminamos.  Desde tu tablero ve a diseño blogger y seleccione Agregar nuevo Gadget ---- > Añadir HTML. Pegue el código que acabas de copiar . Hit guardar. LISTO!
Puede utilizar Image Mapping para cualquier cosa! para barras de navegación, iconos de redes sociales, encabezados, collages. Todo en absoluto. Es un salvador de vidas y tan fácil de usar! que lo Disfrutes!

Y ya para terminar tengo un grandeeeeeeeeeeee sorteo  en el blog con un valor de  en $249 dlls.
quedan solo 23 días para que termine, apúntate ahora, para la oportunidad de ganar un super Suero con células madre.

Bye !



DEMO
Image Map

You Might Also Like

0