Tags Archivesprogramación

Aprende a hacer un iframe responsive image

A todos nos ha pasado, un cliente necesista , no sabemos por qué razón, un iframe en su página web. Los sudores y lágrimas llegan cuando descubrimos que el <iframe> necesita obligatoriamente unos valores de width y height, porque sin ellos simplemente no se ve. Una vez puestos, descubrimos con más lágrimas en los ojos, que nuestro iframe no es responsive. Nuestro primer impulso sería ponerle un ancho de 100% y un alto automático, y esto funciona relativamente bien hasta que nos damos cuenta que la altura se descuajeringa. ¿la solución? Necesitamos que nuestro video no solo se adapte al ancho, sino que además mantenga el aspect ratio. Para ello deberíamos meter  el <iframe> en un <div> y añadir un ...

Continue Reading

¿Ya sabes cómo utilizar Open Graph? image

Si utilizas wordpress u otros CMS es posible que te hayas dado cuenta de que al compartir tus páginas en las redes sociales se muestra muchas más información que  cuando compartes tus paginas HTML. Esto es porque la mayoría de CMS automatizas el protocolo de meta tags de Open Graph. Estas meta etiquetas “señalan” a Facebook los elementos que queremos mostrar al compartir nuestra página en la red social.Antes de empezar a introducir estas “nuevas” meta tags tendremos que indicar el XML Namespace para Open Graph dentro de nuestro html antes del header. <!DOCTYPE html> <html    xmlns:og="http://ogp.me/ns#"    xmlns:fb="http://ogp.me/ns/fb#">         <head></head>         <body></body>    </html> Una vez hecho esto, podemos introducir nuestras meta tags de la misma manera que introducimos las meta tags tradicionales, es decir dentro ...

Continue Reading

Como crear un Child theme en wordpress image

Seguro que si llevas un tiempo metinedole mano a wordpress, habrás estado tocado sus hojas de estilo. Si ya has llegado a segunda base habrás tocado su functions.php. Y si has llegado a la tercer seguro que has modificado sus templates y quien sabe incluso algún que otro plugin. El problema de todo esto es que, como en la vida, si actualizas (la plantilla que no la vida) probablemente pierdas todas las modificaciones que has realizado. Esto se puede solucionar con un ‘child theme’. Como crear un Child theme El proceso es bastante sencillo. Lo primero que tenemos que hacer es ir a la carpeta de wordpress que contiene nuestro tema /wp-content/themes y crear una nueva carpeta con el nombre ...

Continue Reading

Imagenes siempre visibles en tu newsletter image

Uno de los mayores quebraderos de cabeza que tenemos al diseñar un newsletter es el hecho de que la inmensa mayoría de gestores de correo bloquean por defecto nuestras imagenes haciendo que la composición, que tantas vueltas hemos estado dando, quede destrozada por completo. En nuestro último diseño no queríamos que nuestro mensaje se perdiese, es más, intentamos convertir esta devilidad en una fortaleza… intentamos que el echo de que se bloqueasen nuestras imagenes fuera parte de nuestro mensaje. Decidímos crear un pixel art que representase nuestra foto que pidiese “dejanos mostrarte de lo que somos capaces” y que al aceptar el contenido remoto la imagen se transformase en nuestra foto, en la que esplicamos todas nuestras aptitudes como diseñadores. ...

Continue Reading

This is a unique website which will require a more modern browser to work!

Please upgrade today!