Missphone

Lo mejor

Que la web por fin se parece a la tienda: rosa, coqueta y hecha para personalizar, igual en la portada que en la última marca. Y que el producto luce: cada cosa con su foto, su precio a la vista y, si se personaliza, el diseñador en la misma ficha.

Cómo me la encontré

La heredé funcionando y con ventas, sobre WordPress, WooCommerce y un tema comercial, pero en un estado que pedía una intervención a fondo antes que un retoque:

• La cabecera de la portada era una sola imagen, con el «Click aquí» dibujado dentro, así que no llevaba a ninguna parte.
• Buena parte del texto, en gris sobre fotos, no se leía.
• Las páginas de regalo no enlazaban a ningún producto.
• El catálogo repetía la misma ficha por cada modelo de móvil.
• La administración estaba repartida entre varias manos.

Es lo que le pasa a una web que lleva años abierta sin nadie que la cuide. De quien la montó no hablo: no sé con qué presupuesto trabajó ni qué le pidieron.

Antes y después

El «antes» es del 31 de agosto de 2026, guardado antes de tocar nada. El «después» se captura con el mismo ancho y el mismo encuadre, o no se compara.

1. La portada, en escritorio.

   Antes: una sola imagen con el botón dibujado dentro, que no llevaba a ninguna parte.

   Después: una cabecera de verdad, que dice qué es la tienda y dónde está, con dos botones (diseñar tu funda y ver los accesorios) y la nota de Google.

2. La portada, en el móvil.

   Antes: la misma imagen, encogida a 380 px hasta no poder leerse.

   Después: la foto arriba y, debajo, el titular, los dos botones y la nota, a tamaño de móvil.

3. Las categorías de la portada.

   Antes: el nombre de cada categoría montado sobre su foto, a veces encima del propio producto.

   Después: tarjetas con la foto a un lado y, al otro, el nombre y el precio desde el que empieza.

4. Una categoría, la de fundas.

   Antes: cuatro párrafos en gris sobre una foto de fundas, que no se leían.

   Después: la cabecera de color, con un titular que se lee, un botón para hacerla con tu foto y la foto enmarcada; la misma cabecera en todas las páginas.

5. Más abajo, en la portada.

   Antes: un bloque de accesorios con el texto en gris sobre una foto oscura, casi invisible.

   Después: en ese sitio, la tienda de la calle con su propio bloque, «La tienda, en Benetússer»: la dirección, la foto del local y botones para llamar y para llegar.

Las cifras

• 39 páginas puestas al nivel de la portada: 37 rehechas y 2 nuevas
• 8 productos que se diseñan y se compran en la web
• 268 fichas repetidas por modelo, fundidas en 8 productos con desplegable (252 modelos)
• 15 extensiones propias en PHP (mu-plugins)
• 14 parejas de antes y después, con el mismo lienzo

Qué hice, por fases

1. El rescate.

   Primero, recuperar el control: la administración y los avisos, a nombre de la casa; una copia de seguridad comprobada antes de tocar nada; los pagos con tarjeta y Bizum y los gastos de envío, revisados con pedidos de prueba. Y el catálogo: 268 fichas que repetían el mismo producto por cada modelo de móvil, fundidas en 8 productos con un desplegable de modelo, con cada dirección vieja redirigida (301) a su producto con el modelo ya elegido.

2. Los regalos que se diseñan en la web.

   Taza, camiseta, cojín y marco, y después alfombrillas y puzles: 8 productos con el diseñador en la propia ficha, y una extensión que impide comprarlos sin su diseño. Las 8 páginas de regalo, con foto, texto y un botón que lleva a diseñar o a comprar.

3. Las páginas, al nivel de la portada.

   37 páginas rehechas —regalo, ocasión, accesorios y las 14 marcas— y 2 nuevas, con las piezas de la portada: cabecera de color con la foto enmarcada, bandas, tarjetas y fotos. El CSS compartido, escrito una vez en bloques con nombre y no página a página. Y la portada, con una cabecera propia.

4. Los flecos.

   Un solo H1 y texto alternativo en cada página, los textos que prometían lo que la tienda no tenía, la tienda y las fichas maquetadas, la imagen al compartir la portada y una limpieza a fondo antes de la copia final.

5. La entrega.

   La web recorrida entera, de la portada al carrito, en escritorio y en móvil; una copia final verificada archivo a archivo; y la entrega en persona, en la tienda, con un documento de todo lo que decidí en su nombre para que lo revisen.

6. El lanzamiento.

   La entrada de estreno en el blog y la ficha de Google al día; una página de reparación de iPhone con sus ocho averías y sus datos estructurados; la tienda convertida en escaparate, con las categorías y los productos que se diseñan; y la temporada (Navidad, San Valentín, el Día de la Madre…) que se enciende y se apaga desde el menú, sin tocar código.

Hoy sigue en mantenimiento.

Con qué

• WordPress
• WooCommerce
• PHP (mu-plugins)
• CSS
• Fancy Product Designer
• JSON-LD (Store, FAQPage, Service)
• API REST de WordPress
• Python y Node para medir y capturar sin tocar la tienda

Cómo se trabajó

Nada se da por hecho sin medirlo en la web servida, y antes de cada cambio va su copia y su «antes» capturado. Es una tienda con pedidos y datos de clientes: no se improvisa.

Lo que no se enseña

Cuánto vende, lo que invierte en anuncios y lo que rinden, los datos de sus clientes y el panel de la tienda. Tampoco cómo está protegida. Son suyos, y no se publican ni con permiso.