Category: Herramientas

DataTables https://datatables.net/

DataTables es una librería para crear tablas dinámicas apoyado por jQuery. Está pensado para crear una tabla desde una base de datos a HTML añadiendo todas las funcionalidades necesarias como filtros, paginación, ordenación…

Osea que en pocas palabras, olvídate de programar y ocuparte de tu proyecto.

Otra cosa buena que tiene esta librería es que te da la posibilidad de adaptarlo a tu proyecto si estás utilizando un framework de estilos tipo Bootstrap o jQueryUi.

Tiene una documentación muy extensa y puede que te lleve pocos minutos o varias horas en aprender como utilizarla. Pero al final valdrá la pena.

Dentro de las funcionalidades que ofrece, una de las más importantes es la de optar por utilizar distintas fuentes de datos. Puedes utilizar una librería o clase creado por tu cuenta o utilizar la clase de ejemplo ssp.class.php con la que con un par de configuraciones podrías empezar a obtener los datos y mostrarlos de la manera más sencilla.

En general, la librería merece la pena utilizarla en tu proyecto. En mi opinión, es una pasada. Hay que documentarse bastante pero con un poco de tiempo podrás tenerlo todo bajo control.

Recuerda que aprender como funciona e implementarlo siempre es mucho más fácil que crearlo de cero, a menos que te gusten los retos y quieras perder el tiempo en inventar otra vez la rueda.

He creado un ejemplo de como utilizarlo con SQL Server ya que entre los manuales no encontré ninguno.

Además, como es obvio, podrás encontrar toda la información necesaria en https://datatables.net/

Utilizar Mailtrap como Inbox para Desarrollo

Hace poco hemos tenido un problema a la hora de gestionar los correos que utilizabamos desde nuestro entorno de desarrollo. Hemos descargado datos del entorno de producción y hemos utilizado correos reales para hacer pruebas sin querer queriendo. Nuestra intención no era enviarlos, habíamos creado unas condiciones pero nos olvidamos de añadir una condición más y se hizo el envío a unos cuantos. No fueron muchos pero, ¿y si se hubiera enviado el correo a todo el mundo? Estoy seguro que a alguno más le ha pasado esto mismo, ha utilizado su entorno de desarrollo para hacer pruebas de emailing y justo coincide que los correos de prueba son correos reales.

Pues bien, para evitar esto vamos a gestionar de ahora en adelante nuestros correos con un servicio gratuito y fácil de instalar en nuestro framework, sea el framework que sea.

Hablo de Mailtrap.io qué, como su misma página dice, es un entorno para el testeo de emailing seguro para desarrolladores: «SAFE email testing for dev teams«.

Es un servidor de SMTP creado por y para desarrolladores, para testear, ver, analizar y compartir emails enviados desde el entorno de desarrollo sin tener que «espamear» a emails reales. Podemos utilizar Mailtrap desde Localhost, Stage, QA…

Tendremos la posibilidad de analizar el diseño, datos estructurados y otras opciones relacionadas con el envío de correo.

Mailtrap - Serever Smpt

 

PRECIOS

Este servicio es gratuito pero si queremos más, obviamente tendremos que pagar. Según el plan que elijas podrás obtener menos o más beneficios.

Mailtrap - Pricing

Shopify – Apps y Theme gratuitos para comenzar a vender

En shopify puedes añadir Addons o Plugins que te ayudarán a mejorar ventas, el posicionamiento y el diseño de tu página ecommerce.

1. Shopify Free Themes

Para empezar como se debe, lo primero que vamos a elegir es una plantilla. La más recomendable es la plantilla MINIMAL pero tienes otras plantillas que puedes probar en el listado de themes gratuitos que te ofrece shopify.

La plantilla MINIMAL me gusta porque contiene unos cuantos features básicos que ayudan a construir una página  web de forma muy completa:

  1. ✔ El típico Slideshow que todos necesitamos para ofrecer a primera vista nuestros productos estrella u ofertas especiales
  2. ✔ Home page video que ahora se lleva en muchísimas páginas actuales
  3. ✔ Lista de productos principales que puedes agrupar según lo necesites
  4. ✔ Menús anidados tipo Drop-down (No todas las plantillas te dejan anidar menús)
  5. ✔ Lista de logotipos de tus marcas
  6. Y mucho más…

2. Product Reviews

Si quieres obtener una valoración de tus productos necesitarás esta App oficial de Shopify:

  1. ✔ Te ayudará a que los demás clientes tengan más confianza a la hora de comprar tus productos
  2. ✔ Es SEO amigable para ayudar a aumentar el posicionamiento en Google
  3. ✔ Se puede personalizar para que quede exactamente como quieras

Shopify Product Reviews APP

3. Privy – Free email popups with exit intent

Privy te ayuda a obtener de forma amigable nuevos suscriptores a tu página:

  1. ✔ Puedes configurar los popups para que se muestre un mensaje personalizado para los usuarios que visitan tu página
  2. ✔ Es compatible con las plataformas de marketing más conocidas como Mailchimp, Bronto, Klaviyo, Soundest, Constant Contact, SendGrid, Adroll, Zapier…
  3. ✔ Configura una acción para aquellos que quieran abandonar tu web, cuando lleven un tiempo en ella o cuando hayan añadido productos en el carro de compras…

Privy for Shopify

4. Instafeed

Instafeed es para aquellos que tienen ya una cantidad de seguidores razonable en Instagram. Esto permitirá poder mostrar los últimos posts de Instagram en la página web.

  1. ✔ Añade un feed de tus posts actuales en tu página ecommerce
  2. ✔ Configura el número de imagenes que quieres mostrar y el tamaño de cada imagen para adaptarla a tu web
  3. ✔ Crearás un gancho para que tus clientes para te sigan en Instagram y mantenerlos actualizados de nuevos productos

InstaFeed Shopify

Qué es Shopify - manuprieto.es

¿Qué es Shopify?

Shopify es una plataforma de comercio electrónico pensada para que pueda utilizarlo cualquier persona que quiera vender productos On-Line sin tener muchos conocimientos de diseño y páginas web. Simplemente con tener un poco de buen gusto y tener las ideas claras, puedes obtener una página con todo lo que necesitas.

Puedes elegir entre más de 100 plantillas profesionales para tiendas, o si tienes algo de conocimiento puedes crear tu propio diseño usando HTML y CCS.

Una vez entras en el sistema, éste te ofrece un sin fin de herramientas para poder diseñar y gestionar de forma sencilla pero a la vez con un potencial increíble tu propia tienda virtual.

Si no lo tienes claro tienes 14 días de prueba GRATIS

Generador de Nombre de Empresas

Utilizando solamente una palabra clave realizará una búsqueda de dominios disponibles para que puedas empezar tu empresa.

Una vez elegido el nombre puedes comenzar una prueba gratuita de 14 días. Tendrás todo lo que necesitas para comenzar a venderlo.

Tienda Online desde Facebook

Si ya te has hecho con una cantidad importante de seguidores en Facebook, puedes dar un paso adelante con Shopify.

Es fácil integrar la tienda virtual en Facebook, añadiendo solamente los productos que quieres vender por este medio, ya que la herramienta cuenta con un sistema de gestión de productos avanzada y completa.

Plantillas Shopify

Sólo se pueden añadir plantillas compatibles para esta plataforma. Puedes crear la tuya propia a partir de una gratuita, pero hay que tener mucho cuidado con lo que haces ya que a veces puedes meter la pata. Lo bueno es que el mismo sistema tiene un editor de archivos HTML / CSS y funciona de maravilla.

Lo más recomendable por experiencia propia es elegir una plantilla de pago que tenga los complementos necesarios y no te de trabajo de más a la hora de diseñar y construir el diseño de tu página web.

PLANTILLAS GRATUITAS SHOPIFY

Las plantillas gratuitas están bien para empezar, pero no son tan potentes como una de pago. Se pueden modificar lo justo y te pueden ayudar si lo que necesitas un diseño sencillo y sin muchas complicaciones. La que más me gusta de todas es la Minimal ya que tiene las opciones que todos buscamos: Slider de imagenes principales, sección de productos, sección de marcas….

Precios

Los precios varían según el caso de cada vendedor. Si eres un vededor que necesita algo rápido y sencillo, con el plan básico tienes lo que necesitas para crear una tienda virtual sin limitaciones. Mi recomendación es empezar por este plan y a medida que el negocio siga creciendo cambiar de plan y amortizar los gastos de la plataforma cada mes.

Crea una animación GIF a partir de un Vídeo

 

Si necesitamos crear un video para mostrar un “Paso a Paso” es muy sencillo utilizando una herramienta gratuita que nos proporciona ezgif.com

logo

Una vez probada es una herramienta de las que hay que guardar en «Favoritos» ya que no es nada compleja y nos va a ayudar a crear todo tipo de animaciones GIF sin tener que comprar o descargar un software especifico en nuestro PC.

Lo primero que tenemos que hacer es seleccionar que video vamos a convertir:

2016-06-27 at 10-38-13

 

Ahora hacemos clic en el botón de Upload!

El vídeo que he subido es un vídeo de 1 minuto y 17 segundos en formato .mp4 y un peso de 2mb. Ha tardado más o menos 1 minuto en subirse con una conexión de fibra optica (100mb)

Ahora lo que nos pide una vez el vídeo se ha cargado en la plataforma es un tiempo de inicio y fin . Así podremos cortar el vídeo en la sección que necesitemos:

Convert video to animated GIF

Podemos seleccionar los tiempos de inicio y fin con el Preview del vídeo que se ha cargado. Utilizando la barra de desplazamiento seleccionamos el Start Time (Tiempo de inicio) haciendo clic en el botón azúl de la derecha Use current position (Utilizar la posición actual). Así se cargará ese tiempo en la casilla de inicio. Hacemos exactamente lo mismo, desplazando un poco más adelante, para recoger el End Time (Tiempo de fin).

En mi caso he elegido cortar el vídeo para mostrar 15 segundos a partir del segundo 5 hasta 20.535, que es lo que me ha recogido al hacer clic en el botón «Use current position» para el «End time».

En Size he elegido en principio la primera opción la opción Original (up to 960px) y me ha generado un gif de un peso de 322KB. Luego he elegido el de 600xAUTO que me parecía conveniente para poder dar una calidad óptima y reducida para colgarlo en una página web y así reducir el tiempo de carga. Esta vez se ha reducido a 135KB.

Las demás opciones las he dejado en default y ahora es el momento de hacer clic en Convert to GIF!

Una vez generado se cargará el GIF generado debajo del mismo botón en la sección Output gif

Convert video to animated GIF (1)

Puedes descargarte el resultado simplemente haciendo clic derecho en la imagen GIF y descargandolo al escritorio.

Lo que hace esta herramienta perfecta es que tenemos la posibilidad de editar el GIF que se ha generado. En este ejemplo no vemos las imagenes de los iconos pero, si sabemos un poco de edición de imagenes, sabremos lo que nos ofrece los botone sde crop, resize, effects…

En este caso he utilizado la herramienta CROP para poder cortar la sección que me interesa mostrar utilizando el seleccionable habilitado y haciendo clic en Crop it!  Debajo de la misma aparecerá el resultado en la sección Cropped image:

Crop animated gif

 

A partir de aquí podemos descargar la imagen o seguir editando la animación GIF hasta obtener el resultado que deseamos.