HTML

El placeholder, los campos de selección y Contact Form 7

¿Qué es un placeholder? Para los que aún no lo tengan claro el atributo placeholder o marcador de posición se incluyó en HTML5 para añadir información adicional a la que ya proporciona la propia etiqueta (label) de los campos de texto (input) y áreas de texto (textarea) de los formularios, por ejemplo el código HTML: [crayon-5b7441cd67866710766521/] Genera este resultado: En este simple ejemplo se puede apreciar claramente la diferencia entre una etiqueta y un marcador de posición. Digamos que el placeholder es ese texto que aparece de forma predeterminada antes de comenzar a escribir en el campo y que desaparece [...]

2018-04-17T14:26:06+00:0017 de abril de 2018|Categorías: Tutoriales|Etiquetas: , , , , |Sin comentarios

Personalizando el widget suscripciones de Jetpack

Antecedentes Recientemente un cliente nos ha solicitado añadir un campo de aceptación de la política de privacidad en el widget Suscripciones al blog (Jetpack). Obviamente el widget original no permite modificar nada más allá del título, la descripción, el placeholder del campo de texto, el valor del botón de envío y el texto que se muestra al darse de alta en la suscripción. ¿Cómo lo hemos hecho? Para lograrlo hemos creado un shortcode clonado de los shortcodes originales soportados por este módulo del plugin Jetpack by WordPress.com, concretamente jetpack_subscription_form y blog_subscription_form, que hemos modificado y personalizado para añadir el código HTML y [...]

2018-03-06T20:52:22+00:006 de marzo de 2018|Categorías: Tutoriales|Etiquetas: , , , |2 Comentarios

¿Cómo añadir un extra en el pedido de WooCommerce?

Son muchas las ocasiones en las que podemos necesitar añadir un extra en el pedido, que sea seleccionable por el cliente y que añada un determinado coste al pedido. Un ejemplo muy típico de lo que os queremos enseñar hoy es el extra Envolver para regalo en el pedido, aunque en realidad las opciones de uso de este tipo de extras son prácticamente ilimitadas. Ejemplo práctico y real Hace unos meses los chicos de ComeFruta, en colaboración con los chicos de Fiiiling, nos pidieron ayuda para poner en marcha la campaña Fruta solidaria. Gracias a ella los clientes de ComeFruta [...]

2018-01-31T09:37:57+00:0017 de diciembre de 2015|Categorías: Tutoriales|Etiquetas: , , , , , |Sin comentarios

El mejor alojamiento web del mercado

Test de velocidad antes de la migración Test de velocidad después de la migración Tras muchos meses de búsqueda de un buen servicio de alojamiento web, y tras probar a no pocos aspirantes, creemos que hemos dado con el mejor alojamiento web del mercado, con la mejor relación calidad/precio posible, y, además, es 100% español. Durante esta semana pasada hemos migrado nuestro viejo VPS a un nuevo VPS optimizado para WordPress y WooCommerce al que le hemos ajustado aún más sus características para explotar al máximo su rendimiento. La suma de las características internas del nuevo [...]

2018-01-10T19:20:45+00:0024 de noviembre de 2014|Categorías: Noticias|Etiquetas: , , , , , , |Sin comentarios

Google Maps y los archivos KML

My Maps Hace un par de años os contamos en ¿Cómo insertar un mapa personalizado de Google Maps en nuestro sitio web? la forma de insertar un archivo KML en Google Maps y conseguir, de esta forma, crear un mapa personalizado en nuestro propio sitio web. Pues bien, parece ser que a partir de 2015 Google Maps ya no va a permitir utilizar la técnica descrita en la entrada, así que vamos a ver rápidamente lo que tenemos que hacer para que nuestros mapas personalizados sigan siendo funcionales a partir de la entrada del próximo año. Primer paso Lo primero [...]

2017-03-27T18:09:03+00:0017 de noviembre de 2014|Categorías: Noticias|Etiquetas: , , , |Sin comentarios

El código de seguimiento de Google Analytics y la minificación

Google Analytics no necesita presentación alguna, todo el mundo sabe que es una herramienta muy poderosa para conocer las estadísticas de visitas a nuestros sitios web. Para obtener los datos necesarios para generar las estadísticas, Google Analytics nos proporciona un código de seguimiento, realizado en JavaScript, que debemos insertar en el código HTML de todas nuestras páginas. El código de seguimiento suele tener una apariencia tal que así: [crayon-5b7441cd67c2b472522457/] Este código de seguimiento suele ser funcional siempre, pero, en caso de que el código HTML y JavaScript de nuestro sitio web sea minificado con posterioridad a su inserción, dicho código de [...]

2017-03-27T18:09:03+00:0015 de noviembre de 2014|Categorías: Tutoriales|Etiquetas: , , |Sin comentarios

¿Cómo validar correctamente los formularios de contacto de Jetpack by WordPress.com?

Continuando con la senda emprendida ayer en la entrada ¿Cómo validar correctamente los comentarios de Jetpack by WordPress.com?, seguimos validando el HTML5 del código fuente del sitio web de APG con el validador oficial de la W3C, y comprobando que cumple con los estándares oficiales marcados por la W3C. En esta ocasión nos hemos encontrado con un problema de validación que generan los formularios de contacto que el plugin para WordPress Jetpack by WordPress.com inserta en nuestras páginas y entradas. ¿El problema? El problema lo genera la hoja de estilo que acompaña a los formularios, concretamente el archivo grunion.css, al [...]

¿Cómo validar correctamente los comentarios de Jetpack by WordPress.com?

Tras darle muchas vueltas a la correcta validación del HTML5 del código fuente del sitio web de APG por el validador oficial de la W3C, y tras solventar los distintos problemas detectados, nos encontramos en un callejón sin salida para poder cumplir con los estándares web oficiales marcados por la W3C. El problema lo generaba el fantástico plugin para WordPress Jetpack by WordPress.com y su complemento de comentarios. ¿El problema? El problema lo genera el iFrame que se inserta en el archivo comments.php de nuestro tema, y más concretamente tres de sus atributos que están obsoletos en los estándares web [...]

Google recomienda el uso del diseño web sensible

Google en la última entrada publicada en su Webmaster Central Blog recomienda el uso del diseño web sensible para la construcción de sitios web optimizadas para teléfonos inteligentes (smartphones). Entre sus recomendaciones indica que sólo se debe emplear código CSS para optimizar la visualización del sitio web a los dispositivos móviles, y en el caso en el que no sea posible emplear exclusivamente CSS para ello, que se generen distintas versiones del código HTML de forma dinámica o distintas URLs para obtener los mismos resultados, tener diferentes versiones del sitio web en función del dispositivo donde se visualiza. Google incluso ha [...]

2017-12-13T15:26:55+00:0011 de junio de 2012|Categorías: Actualidad|Etiquetas: , , , |Sin comentarios

¿Y qué ocurre con el CSS3?

CSS3 Si ayer hablábamos sobre el HTML5, hoy le toca el turno a su hermano gemelo, el CSS3. En el caso del CSS3 su situación actual es complicada, ya que ninguno de los navegadores web que utilizamos, ni tan siquiera en sus últimas versiones, soportan el estándar CSS3 en su totalidad, y para hacerlo aún más complicado, cada uno de ellos posee una completa lista de alternativas al estándar que hace imposible la tarea de crear un diseño web crossbrowsing normalizado, ya que hay que utilizar infinidad de hacks para que nuestro trabajo sea correctamente (en mayor o [...]

2017-03-27T18:07:59+00:0015 de mayo de 2012|Categorías: Noticias|Etiquetas: , , , , |Sin comentarios

HTML5, ¿presente o futuro?

HTML5 Mucho se habla sobre el HTML5 y su funcionalidad en la web actual, pero ¿realmente es una buena idea utilizar HTML5 hoy?. La respuesta a esta pregunta no es fácil, en primer lugar, HTML5 viene de la mano de CSS3 y JavaScript, por un lado tanto HTML5 como CSS3 se encuentran todavía en fase de desarrollo, y al ritmo al que van las cosas, todavía tardará algún lustro en finalizarse el desarrollo completo de ambos estándares, por el otro, tal y como llevamos sufriendo desde el nacimiento de la Internet y de los primeros estándares HTML, cada navegador web [...]

2017-03-27T18:07:59+00:0014 de mayo de 2012|Categorías: Noticias|Etiquetas: , , , , , |Sin comentarios

Adobe Edge

Adobe Edge Como ya muchos sabéis, Adobe Edge viene a ser el futuro (o no ya tan futuro) sustituto de Adobe Flash para su uso en la Internet. Gracias a esta fantástica aplicación, que de momento es totalmente gratuita (aunque en esta nueva versión recién publicada se ha añadido una restricción de 95 días), y que viene incluida en el recientemente publicado Adobe Creative Cloud, es posible crear banners, animaciones, presentaciones, pequeños sitios web o todo aquello que se nos ocurra bajo HTML5, JavaScript y CSS3, en lugar de Adobe Flash, como hasta hace bien poco. Las grandes [...]

2018-01-30T13:33:29+00:0011 de mayo de 2012|Categorías: Noticias|Etiquetas: , , , , |Sin comentarios