Cinematic 3D MP3 — WordPress

Cinematic 3D MP3 — WordPress

El reproductor de música MP3 con carrusel 3D, como plugin de WordPress. Las listas se crean y se editan en el panel, con la Biblioteca de Medios, y se insertan en cualquier página o entrada con un shortcode.

Para quién: músicos, productores, estudios, sellos y webs hechas con WordPress que quieren presentar canciones propias sin tocar código.

Qué incluye

• Carrusel 3D de carátulas: portada central destacada y laterales en perspectiva. Navegación con clic o toque, arrastre, trackpad o rueda horizontal y teclado (flechas, Inicio y Fin).
• Vista «Ahora suena»: al pulsar la portada central empieza la canción y se abre un panel con título, artista, álbum, descripción, barra de progreso y controles. Al cerrarlo, la música sigue sonando en el dock.
• Dock de controles: reproducir y pausar, detener, anterior, siguiente, barra de progreso para saltar a cualquier punto, volumen y silencio, lista y aleatorio.
• Avance automático, repetición y aleatorio: al terminar una canción pasa a la siguiente; repetir toda la lista o una canción; aleatorio sin repetir hasta acabar la lista.
• Lista con buscador: busca por título, artista o álbum sin distinguir tildes ni mayúsculas.
• Portadas leídas del propio MP3 (novedad 1.1.0): si el MP3 trae carátula incrustada (ID3v2.2, 2.3 o 2.4), se muestra sola. Prioridad: portada elegida → portada del MP3 → portada de respaldo. Acepta JPEG, PNG, GIF y WebP (nunca SVG) y lee solo la etiqueta, no la canción entera. Un MP3 alojado en otro dominio solo puede leerse si ese servidor lo permite (CORS); si no, se usa la portada de respaldo.
• Columna de acciones opcional: favoritos (guardados solo en el navegador del visitante), lista, repetir y compartir.
• Errores explicados: enlace inexistente, archivo que no es audio, archivo dañado o problema de red, con la carátula marcada con ⚠.
• Controles del sistema: integra Media Session, de modo que, donde el navegador lo admite, título, artista y carátula aparecen en los controles multimedia del dispositivo.
• Varios reproductores por página: cuando uno empieza a sonar, los demás se pausan.
• Apariencia: colores de fondo, texto y acento; imagen de fondo con contraste ajustable; columna de acciones visible u oculta; portada de respaldo. Adaptado a escritorio y móvil, manejable con teclado y respeta la preferencia «reducir movimiento».
• Panel de WordPress: menú «Listas MP3». Elige cada MP3 de la Biblioteca de Medios o pega una dirección https://…/cancion.mp3; desde la Biblioteca se completan título, artista y álbum si el archivo los trae. Botón «Probar» para escuchar en el propio editor, reordenar arrastrando o con ↑ ↓ y eliminar con confirmación.
• Portadas en WordPress: al subir un MP3, WordPress extrae su carátula y el plugin la usa directamente. Cada fila indica el origen: «Portada elegida», «Portada del MP3» o «Portada predeterminada».
• Shortcode [cinematic3d_mp3 id="…"] en un bloque «Código corto»; varias listas pueden convivir en la misma página y solo suena una a la vez. Las listas en borrador solo las ven quienes pueden editarlas.
• Guardado seguro: comprobación de permisos; solo acepta MP3 de la Biblioteca o direcciones https:// terminadas en .mp3.

Qué recibes

El ZIP instalable cinematic-3d-mp3-wordpress-v1.1.0.zip, con la carpeta del plugin cinematic-3d-mp3, su guía (README.md) y cinco pistas MP3 de demostración con carátula incrustada (de uso libre) que aparecen en cada lista nueva como ejemplo.

Instalación

En WordPress, ve a Plugins → Añadir nuevo → Subir plugin, elige el ZIP y actívalo. En «Listas MP3 → Añadir lista» aparecen las cinco pistas de ejemplo: edítalas o reemplázalas, ajusta la apariencia y publica. Copia el shortcode desde la caja «Shortcode» o la tabla de listas y pégalo en un bloque «Código corto».

Requisitos y funcionamiento

WordPress 6.2 o superior y PHP 7.4 o superior. MP3 en la Biblioteca de Medios o en direcciones HTTPS que permitan su reproducción desde tu web. Probado en WordPress real con PHP 8.3 (entorno WordPress Playground) y en Brave (Chromium), en escritorio y móvil. En iOS el volumen lo controla el sistema. El indicador de barras del dock es una animación de estado, no un analizador de audio. Usa música propia o con permiso para publicarla.

Demostración: cinematicmp3.creanexo.com. Muestra la versión JavaScript del mismo reproductor; no es una instalación de WordPress.