Cómo se crea una Galeria en nuestro CMS

Por fin ya hemos habilitado la posibilidad de crear Galerias en nuestro CMS nos hemos esforzado para que sea una tarea muy sencilla y rápida para que los escritores se animen a usarlas.

Por fin ya hemos habilitado la posibilidad de crear Galerias en nuestro CMS nos hemos esforzado para que sea una tarea muy sencilla y rápida para que los escritores se animen a usarlas.

El sistema es bastante rápido teniendo en cuenta que todas las imágenes asi como sus thumbs primero se suben a nuestro servidor pero luego quedan almacenadas en Amazon S3. Toda la parte Ajax se ha programado con JQuery que se encarga de lo más dificil: subir multiples fotos, actualizar sin refrescar

Por el momento hemos permitido que se puedan subir fotos de hasta 750 k, diez veces el tamaño máximo que permitimos en las fotos en los posts (75k). En cualquier caso cualquier foto que se sube se adapta en tamaño y peso, de manera que en la web al final queda colgada una versión optimizada (la versión original de mayor calidad se almacena también por si acaso):

  • El tamaño máximo permitido es de 950 pixels de ancho y 600 de alto, cualquier foto que se suba de mayor tamaño se reduce en la versión para publicar de manera transparente para el usuario.
  • Utilizamos el formato jpeg a 90 de calidad, normalmente usamos 80 pero preferimos no ser tan tacaños y que capturas que hubieran quedado mejor publicadas en formato gif o png conserven una buena nitidez pese a estar en jpeg.

Se puede cambiar el orden de las imágenes, para ello sólo es necesario pulsar sobre la imagen y arrastrarla hacia su nueva posición.

Moviendo todas nuestras fotos a Amazon S3

Este esquema muestra como hemos hecho para pasar todas las fotos de nuestros blogs a Amazon S3.

Este esquema muestra como hemos hecho para pasar todas las fotos de nuestros blogs a Amazon S3.

Siento una enorme admiración por el proyecto AWS (Amazon Web Services)… ¿quién podía pensar que Amazon, el mayor retailer online, de repente se iba a convertir en proveedor tecnológico y buque insignia del cloud computing?

Aunque utilizo S3 desde el año pasado, cuando empezamos a volcar ahí nuestras copias de seguridad, hasta la fecha nunca nos habíamos planteado usarlo como hosting de imágenes… pero ha llegado un momento en el que las imágenes de más de cinco años de publicación en todos nuestros blogs nos han desbordado y no tiene sentido que la mayoría de los recursos del servidor se desaprovechen sirviendo archivos en lugar de sirviendo webs de manera más eficaz (al fin y al cabo como su propio nombre indica un webserver es un servidor de webs).

Para mover todas las imágenes ha habido que reprogramar varios componentes de nuestro CMS para conseguir que las imágenes se carguen en Amazon S3 en lugar de en topmadrid.com, dolcecity.com…

Me centraré en cómo ha quedado ahora el proceso:

1 – La imagen es cargada por el escritor en el CMS con CKFinder, cada escritor tiene una carpetas con sus imágenes que ellos gestionan, todo ello en enzo.es que es donde está instalado nuestro CMS.

2 – Cuando se publica el post, se realiza una copia de cada imagen en otra carpeta que hemos llamado «cache» y desde ahí se sube a Amazon S3 (utilizando el API REST de Amazon S3 y todo programado en el arcaico vbscritp… que tiene mérito)

3 – Una vez todas las imágenes están subidas se inicia el asintente para crear las thumbs para este proceso necesitamos tener la foto en el servidor donde está instalado el componente con el que las hacemos ASPjpeg, por eso el CMS revisa la carpeta de caché para ver si sigue ahí la foto y sólo en el caso de no encontrarla se la descarga de vuelta desde S3 (esto es necesario porque la carpeta caché se vacía cada noche y a veces quieres rehacer una thumb de un post que colgaste hace tiempo por lo que la foto original ya no está en la carpeta cache y hay que traerla de S3).

4 – Las thumbs se guardan en enzo.es durante el tiempo suficiente para poderlas pasar también a Amazon S3, después se borrán.

A diferencia de antes ya ninguna foto pasa a los blogs de destino, todo está o temporalmente en enzo.es o en su emplazamiento defitivo en Amazon S3 quedando todos los archivos de cada blog organizados en buckets independientes:

Aprovechando que teníamos que hacer este cambio hemos solucionado un problema que habíamos heredado de blogger:

Las imágenes de los posts en lugar de colocarlas todas en la carpeta /uploaded_images/ ahora van clasificadas por años y mes, igual que los posts.

Por su parte las thumbs, para no tenerlas todas juntas como antes en la carpeta /img_thumbs/ se van distribuyendo de manera automática en carpetas de 100 en 100, con lo que evitamos los problemas de la situación anterior: tener carpetas con más de 30.000 imágenes y creciendo que sólo para conseguir listar sus archivos ya era todo un reto.

Sólo nos falta un último empujón para que las galerías entren en el nuevo circuito de S3 y con eso la «migración» estará completa. Los beneficios del cambio son claros, como se puede leer en este post de Amit Agarwal mover todas tus imágenes a Amazon S3 descarga enormemente de trabajo a tu servidor:

En servidores donde corremos aplicaciones hemos comprobado que algunos procesos se ejecutan ahora muchísimo más rápido, tenemos por ejemplo un cron que llama a una página a las 20:00 y que solía terminar cerca de las 22:20… ahora el mismo proceso termina a las 21:45 lo que supone más de media hora de diferencia.

 

Wunda's World, una historia en Internet…

Os voy a contar a todos un pequeña historia, de esas que surgen todos los días en Internet. Espero que os guste…ser indulgentes porque es la primera que cuento utilizando las galerías de nuestro cms

Os voy a contar a todos un pequeña historia, de esas que surgen todos los días en Internet. Espero que os guste…ser indulgentes porque es la primera que cuento utilizando las galerías de nuestro cms

Esta historia comienza con un tweet de Kirai, aunque no conozco personalmente a Héctor García me cae bien desde que lo ví en la tele en uno de esos programas de «Españoles por el mundo«… me pareció un tío muy normal y no una BlogStar como por alguna razón me lo imaginaba antes.

pulsa sobre la imagen para avanzar…

Rescatando Feedpics para nuestro CMS

Hace casi tres años creamos Feedpics a partir de un experimento de CompareBlogs: básicamente un crawler leía los feeds, capturaba las imágenes y creaba thumbs que enlazaban a los posts.

Hace casi tres años creamos Feedpics a partir de un experimento de CompareBlogs: básicamente un crawler leía los feeds, capturaba las imágenes y creaba thumbs que enlazaban a los posts.

Sigo pensando que es una idea muy potente y que hoy gracias al Cloud Computing podría desarrollarse de nuevo sin los problemas de escalabilidad que nos obligaron a discontinuarlo en su momento.

Con el lanzamiento de DolceCity Marcas hemos recuperado parte del código de Feedpics y lo hemos integrado en nuestro CMS, por lo que ya podemos incluir rellijas de este estilo en nuestros post (estático) o insertarlas en las plantillas de cualquier blog (dinámico).

Para poder hacer esto último, utilizamos Javascript como hacen en CrunchBase con su Widget. Me gusta mucho esta forma de incluir el contenido porque no permite generar todas las rejillas de imágenes en una única página y luego llamar a esa página desde todos los blogs, si en algún momento tenemos que arreglar algo sólo lo tenemos que hacer desde un sitio.

El resultado es muy atractivo (menú de la derecha):

 

Como con Feedpics las URL se pueden parametrizar indicando los blogs de los que obtener contenido, el número de imagenes en la horizontal, en la vertical…etc. Si alguien quiere saber como está hecho no le costará mucho averiguarlo husmeando en código fuente.

Entradas relacionadas

Capturando pantallazos de webs para obtener thumbs
Gracias al API de bluga.net se pueden obtener pantallazos de cualquier web, incluidas las desarrolladas en Flash, a partir de las cuales obtener con facilidad los logos de los establecimientos….
Thumbs en condiciones: como en Gmail y Facebook
Había algo de nuestro CMS que me llevaba asqueando desde hace bastante tiempo: la generación de thumbs… asi que hemos mejorado el sistema, aquí explico cómo funciona y cómo está programado….

Listado de IPs de bots, crawlers, spiders y demás…

Lista actualizada de direcciones IP de los robots que indexan nuestras webs habitualmente.

Lista actualizada de direcciones IP de los robots que indexan nuestras webs habitualmente.

En mi post Programando un contador de impresiones que excluya a los bots me recomendaba Alberto en los comentarios que compartiera mi listado de IPs de bots, crawlers, spiders y demás

Para quien le pueda interesar un volcado de este listado de IP se actualizará regularmente en la siguiente dirección:

http://www.fernandoplaza.com/apps/bots/iplist.txt

Los casi 800 bots que tenemos ya fichados están ordenados por el UserAgent para que el listado sea más sencillo de revisar. La estructura del txt no os costará averiguarla por si queréis importar su contenido con cierta frecuencia (para que el fichero no pese mucho el UserAgent está limitado a 100 caracteres).

Espero que os resulte útil.