jquery

Martes, 09 d octubre d 2012.

Implementación avanzada de Custom Tags en Google Tag Manager

El otro día os presentaba un resumen sobre las posibilidades de Google Tag Manager, una novedosa herramineta que va por buen camino pero de la que os comentaba que hay cosas que por defecto son un poco limitadas. Los tags, tal y como son presentados son elementos estáticos que se sirven mediante una lógica muy conseguida pero no "pueden" adaptarse a las peculariedades de las webs y permanecen como meros tags estáticos.

Según mi modo de verlo tenemos dos formas de usar la herramienta: Como simple lanzador de tags estáticos - o como plataforma Javascript que se dedique a provocar distintos comportamientos en distintas situaciones. La primera está perfectamente resuelta con las opciones que nos dan, pero la segunda, si bien resulta posible, requiere de conocer un poco mejor el código con el que se mueve la herramienta...

A eso vamos hoy, a ver algunos ejemplos de implementación avanzada que llevo unos días probando y que espero que os ahorren alguna horilla de pruebas o al menos os den alguna idea de lo que puede y lo que no puede hacerse con GTM.

[...]

¿Te interesa? Sigue leyendo...

1 Comentario, leeló

Temas Relacionados: analitica web jquery tutoriales

Autor:

Viernes, 05 d octubre d 2012.

Google Tag Manager: La herramienta perfecta para proveedores de marketing

Hace unos pocos días Google sacó un nuevo producto que si bien solo está pegando fuerte en el mundillo de la Analítica web la verdad es que está suficientemente bien resuelto como para cambiar a la larga, la forma de trabajar de la inmesa mayoría de los que nos dedicamos al maketing online: Google Tag Manager.

La verdad es que a mi profesionalmente es un producto que me fastidia bastante pues viene a ofrecer de forma simple y gratuita y para todo el mundo un añadido de comodidad que yo ya estaba ofreciendo a los clientes con mayores dificultades para cambiar sus webs: la posibilidad de incluir un único Tag Javascript en las webs y con el gestionar toda nuestra actividad de marketing basada en Tags o cambios temporales en la web.

Es decir, la idea es que yo incluyo Google Tag Manager en mi web y a partir de ahí ya puedo gestionar sin problemas todos mis tags de Google Analytics (básico o configurado a medida), Omniture, Adwords, DobleClick, Afiliados de todo Tipo, Testings A/B, Añadidos de promos especiales a la web e incluso, si nos ponemos, bloques de publicidad.

¿Aportará esto nueva información a nuestra web? No, en absoluto, esta herramienta no sirve para eso, lo único que hace es poner a tu disposición un administrador externo que en base a ese único Tag de Google Tag Manager provoca todos los subtags que queramos en base a un sistema de reglas bastante bien pensado.

Veamos un poco cómo es ese sistema...

[...]

¿Te interesa? Sigue leyendo...

12 Comentarios, leelos

Temas Relacionados: analitica web jquery tutoriales

Autor:

Martes, 20 d diciembre d 2011.

Ejemplo de Facebook Graph API con Javascript SDK, pero aun más sencillo (Actualizado con Login por OAuth 2.0)

Nota:

Desde el 13 de diciembre de 2011, Facebook ha cambiado su SDK javascript haciendo que muchas aplicaciones de Facebook por javascript dejen de funcionar. Los cambios se refieren a la forma en la que conseguir hacer el login en facebook (que ahora pasan a hacerse por OAuth 2.0).

Este script para ayudar a hacer la conexión más fácilmente ha sido modificado y vuelve a funcionar correctamente, ahora con la nueva conexión y la nueva forma de comprobar los permisos del usuario.

Si ya usabas este código javascript para tu página, simplemente vuelve a descargar el archivo simpleFacebookGraph.js y reemplaza el de tu web.

Hace unos días comentaba la aparición de Facebook Graph API (tambien llamada Facebook OpenGraph) en la que se pone a disposición de todos los desarrolladores la posibilidad de incluir el Javascript SDK para conectarse a Facebook con javascript. Comentaba también que había algunas cosas de este SDK que no acababan de gustarme...

He estado trabajando en un pequeño script por encima de Javascript SDK y quería publicar aquí el resultado. No se trata de una gran aportación, simplemente de un script que ya haga por si solo las funciones más corrientes que podemos querer de Facebook Graph Api y nos permita incluirlas en nuestros sites sin preocuparnos demasiado por el fondo que hay detrás.

[...]

¿Te interesa? Sigue leyendo...

118 Comentarios, leelos

Temas Relacionados: jquery programacion

Autor:

Martes, 08 d febrero d 2011.

Jquery 1.5: ¡Merece la pena! (pero solo un poco)

Hace solo unas semanas que ha salido del horno la ultima versión de jquery, el que es para muchos (me incluyo) el mejor framework javascript que existe.

La nueva versión trae muchas cosas por las que tiene sentido no volver a empezar un proyecto con la 1.4 pero tampoco es suficiente como para cambiar la librería en un proyecto que ya funciona.

[...]

¿Te interesa? Sigue leyendo...

Comenta este artículo

Temas Relacionados: jquery programacion

Autor:

Miércoles, 03 d noviembre d 2010.

Tutorial de YQL con Jquery

Hace ya mucho tiempo que me debía una revisión de la gran API de YQL, un sistema amigable montado por yahoo y destinado a rescatar mediante peticiones muy parecidas a las queries de cualquier sistema SQL muchas de las informaciones más comunes que solemos necesitar en nuestros desarrollos web actuales: Rss, Twiiter, Facebook, Flickr, Búsquedas, etc...

Después de probarlo puedo decir que se trata de una API muy cómoda y versatil, que aglutina y simplifca multitud de servicios web. Además dispone de un gran añadido que hará las delicias de cualquier amante de javascript: devuelve las peticiones tanto en XML como en jsonp. Recordemos que este último nos permite hacer el famoso ajax crossdomain y por lo tanto nos va a permitir mostrar en nuestras web todos estos datos solo usando javascript.

[...]

¿Te interesa? Sigue leyendo...

4 Comentarios, leelos

Temas Relacionados: jquery programacion tutoriales

Autor:

Lunes, 27 d septiembre d 2010.

Crear tu propio slider con jquery paso a paso

Como otras veces simplemente dejar el apunte del código necesario para hacer algo bastante común en las webs actuales: Un slider.

Existen gran cantidad de plugins de jquery para hacer sliders (aunque yo suelo recomendar el plugin Easy Slider por su sencillez y cantidad de opciones. Si lo único que quieres es disponer de un slider en tu web mejor usa uno de estos plugins. Si en cambio, lo que quieres es un código sencillo con el que empezar a hacer realmente un slider a tu medida -para ahorrarte lineas de javascript innecesario o porque tienes una necesidad que ningún plugin te da- espero que con el siguiente ejemplo puedas ahorrarte algunos minutos u horas de trabajo...

[...]

¿Te interesa? Sigue leyendo...

10 Comentarios, leelos

Temas Relacionados: jquery tutoriales

Autor:

Martes, 07 d septiembre d 2010.

Plugin jquery para incluir el muro de una página de Facebook en tu web

El otro día descubrí que Facebook graph api no solo te permite hacer consultas fácilmente mediante json, sino que implementa jsonp (json con padding) para hacerlas. Esto significa básicamente que se pueden hacer consultas fácilmente a Facebook mediante Javascript. Esto tiene una limitación y es que para que nuestra consulta sea realmente simple tenemos que solicitar solo información pública. Es decir, no vamos a identificarnos, por lo que olvidémonos de usuarios, amigos, etc... Básicamente podremos acceder a la información de páginas de Facebook (y usuarios que lo tengan todo abierto).

Empecé por hacer un pequeño objeto en javascript literal que haga la mayor parte del trabajo, pero al final me he animado un poco más y he terminado por crear un plugin de jquery que nos permita incluir el Feed de una página. Además le añadi un filtro para poder mostrar todos los mensajes del feed o solo los que la propia página ha escrito ya que para integrar en una web me parece mucho más interesante lo segundo.

[...]

¿Te interesa? Sigue leyendo...

22 Comentarios, leelos

Temas Relacionados: jquery programacion

Autor:

Miércoles, 04 d agosto d 2010.

Efecto para mapas de google maps.

Hace tiempo que no escribo ninguna entrada con alguna idea desarrollada con jquery. Así que hoy voy a dejar escrita una. Se trata de un sencillo efecto para añadir a mapas estáticos de Google maps un efecto que permita ver mejor pequeños mapas con bastante zoom al clickar en los mismos.

Para quien no conozca los mapas estáticos de google maps puede visitar la API de Google Static Maps. Se trata de una sencilla api para llamar a los mapas como imágenes estáticas. A mi, particularmente me gusta mucho puesto que me ahorra tener que cargar todas las librerías javascript de google maps en páginas que no necesitan tanto.

[...]

¿Te interesa? Sigue leyendo...

Comenta este artículo

Temas Relacionados: jquery programacion

Autor:

Domingo, 20 d junio d 2010.

Usando Ext.js y Jquery a la vez

Ext.js es una completísima librería javascript destinada a crear entornos de aplicaciones webs complejos. Solo echando un vistazo a los ejemplos de su página ya nos hacemos una idea de lo que podemos conseguir con ella. A mi personalmente me parece ideal para crear entornos de administración complejos y dotarlos de una usabilidad decente.

El problema de Ext.js es que es una librería con una documentación un poco pobre -comparada con otros- y a mi gusto su uso es algo lento e incomodo comparado con jQuery. Por lo tanto, para mi solo tiene sentido usarla como un cargador de widgets complejos (que no es poco). Por suerte, Ext.js puede llamarse utilizando como base al propio Jquery. No es su uso por defecto, pero es totalmente funcional en este modo, lo que nos permite usarlo sin llegar nuestra página de varias librerías no relacionadas. Veamos como conseguir esa integración.

[...]

¿Te interesa? Sigue leyendo...

9 Comentarios, leelos

Temas Relacionados: jquery tutoriales

Autor:

Martes, 15 d junio d 2010.

16 plugins jquery para formularios

Mientras termino de escribir un par de posts que no acabo de darles forma os dejo otra recopilación de plugins jquery interesantes. En este caso unos cuantos dedicados a la gestión de formularios, esos elementos que tan importantes son para interaccionar con el usuario y a los que muchas veces no se les presta toda la atención que merecen. Espero que os sirva a algunos os sirvan en vuestras futuras webs y administradores:

- Jquery Ui. Sin duda tengo que empezar por mencionar la espectacular librería de efectos de "Jquery User Interface". Ante los efectos más típicos no lo dudes, úsala. Te evitarás sorpresas y quebraderos de cabeza: ventanas modales, acordeones, elementos 'arrastrables', autocompletados, pestañas, etc. Todo muy bien pensado y totalmente crossBrowser.

- Really Simple Validation (RSV). Seguimos con el que es con diferencia el sistema de validación de formularios más cómodo que existe para jquery. Una implementación lógica y sencilla unida a una estupenda documentación y la posibilidad de crear nuestras propias reglas de validación hacen que pocas veces necesites algo más.

- jwysiwyg, es el editor de textos enriquecidos basado en jquery. Sin duda no es el mejor editor de este tipo y no puede pretender rivalizar con cKEditor o con TinyMCE (muy recomendados ambos), pero el hecho de estar basado en jQuery hace que para adaptaciones muy personales el trabajo se simplifique. Para otros casos mejor usar uno de los 2 anteriormente mencionados que aun sin ser plugins de jquery son muy versátiles y están bien documentados.

- JqTransform, es un plugin que por si solo es capaz de dar estilos originales a tus formularios. Solo con usarlo puedes marcar la diferencia sin preocuparte demasiado de hacer un formulario a medida.

- Jquery Form, es un plugin jquery destinado a facilitarnos -muchísimo- la vida cuando tenemos la necesidad de enviar formularios usando ajax. El plugin recoge todos los campos dentro de una etiqueta 'form' los ordena y los envía por post o get en la llamada ajax.

- También tenemos que tener en cuenta otros 3 recursos gráficos que pueden sacarnos de algún apuro: filestyle, para dar tu propio estilo a los botones de selección de ficheros, selectlist para hacer lo mismo con los 'combos' creados con la etiqueta 'select' y jConfirmAction para cambiar un poco las alertas de confirmación.

- textBoxList, nos permite crear tags en un único elemento input de texto de una forma muy gráfica y amigable que nos recuerda a la forma de añadir amigos en Facebook.

- wdContextMenu, nos permitirá de una forma muy sencilla crear nuestros propios menús de acciones con el botón derecho del mouse. Ideal para cuando un administrador empieza a ser bastante complejo.

- En el otro extremo, para los administradores sencillos, tenemos a Masked input plugin que nos permite indicar una mascara en cualquier elemento input de texto en los formularios. De esta forma obligar a los usuarios a escribir siempre algunos campos (fechas, horas, etc.) resulta mucho más sencillo. Por otro lado, este sistema resulta poco usable para usuarios normales por lo que yo no lo aconsejaría fuera de administradores.

- imgAreaSelect, puede ser un tremendo aliado para cuando desarrollemos aplicaciones destinadas a cortar imágenes. Con él, la parte del formulario destinada a seleccionar la imagen se vuelve realmente sencilla.

- date Range Picker, es a día de hoy, el único seleccionador de rangos de fechas usable y fácil de implementar que conozco. Muy recomendado para herramientas de reporting en las que constantemente tengamos que ir seleccionando rangos de fechas concretos.

- Ajax MultiFile Upload, es una pequeña ayuda para subir varios archivos emulando el comportamiento de Ajax (un efecto parecido a lo que hace Gmail para subir nuestros adjuntos).

- Tablesorter, también puede ayudarnos mucho en administradores sencillos en los que tengamos que mostrar en una única página todos nuestros datos. Simplemente incluyendo este plugin haremos que estos sean bastante manejables (ordenables, paginados, etc.).

- Por último no puedo acabar sin mencionar a Ext.js, un completo y complejo entorno destinado a crear herramientas y administradores online con gran cantidad de funcionalidades ya creadas por defecto. Si bien, podemos usarlo como una extensión de jquery este producto (porque no vamos a llamarlo plugin) también puede aplicarse por si solo con su propia API.

Espero que no los conocieseis todos y alguno de estos plugins os permitan mejorar aunque sea un poco vuestros formularios y administradores.

[...]

¿Te interesa? Sigue leyendo...

Comenta este artículo

Temas Relacionados: jquery

Autor: