{"id":271,"date":"2026-10-15T14:45:19","date_gmt":"2026-10-15T14:45:19","guid":{"rendered":"https:\/\/plugins.creanexo.com\/?post_type=product&#038;p=271"},"modified":"2026-10-31T00:31:43","modified_gmt":"2026-10-31T00:31:43","slug":"yt-cinematic-player-web","status":"publish","type":"product","link":"https:\/\/creanexo.com\/tienda\/product\/yt-cinematic-player-web\/","title":{"rendered":"YT Cinematic Player Web \u2014 JavaScript independiente"},"content":{"rendered":"<style id=\"cn-yt-producto-271\">body.single-product #main #product-271 .cn-radio-paquete-resumen a.button{font-size:14px!important;margin:0 8px 8px 0!important;padding:12px 16px!important;display:inline-block!important}body.single-product #main #product-271 .cn-radio-paquete-resumen a.button::after,body.single-product #main #product-271 .cn-radio-paquete-resumen a.button::before{content:none!important}body.single-product #main #product-271 #tab-description>h3{display:none!important}body.single-product #main #product-271 .woocommerce-product-details__short-description img{display:block!important;width:100%!important;height:auto!important;margin-top:24px!important}@media(min-width:1000px){body.single-product #main #product-271{display:flow-root!important;position:relative!important}}@media(min-width:1000px){body.single-product #main #product-271>.avada-single-product-gallery-wrapper{width:42%!important;float:left!important;padding-bottom:520px!important;box-sizing:border-box!important}}@media(min-width:1000px){body.single-product #main #product-271>.summary,body.single-product #main #product-271>.woocommerce-tabs{width:calc(58% - 32px)!important;float:right!important;clear:none!important}}@media(min-width:1000px){body.single-product #main #product-271 .woocommerce-product-gallery{anchor-name:--cn-yt-271;width:100%!important}}@media(min-width:1000px){body.single-product #main #product-271>.summary{position:static!important}}@media(min-width:1000px){body.single-product #main #product-271 .woocommerce-product-details__short-description{position:absolute!important;position-anchor:--cn-yt-271;left:anchor(left);top:calc(anchor(bottom) + 24px);width:anchor-size(width);margin:0!important}}@media(min-width:1000px){body.single-product #main #product-271>.woocommerce-tabs{margin-top:24px!important}}@media(min-width:1000px){body.single-product #main #product-271 .woocommerce-tabs .tabs{float:none!important;width:100%!important;display:flex!important}}@media(min-width:1000px){body.single-product #main #product-271 .woocommerce-tabs .panel{float:none!important;width:100%!important;padding:24px!important}}@media(min-width:1000px){body.single-product #main #product-271>:not(.avada-single-product-gallery-wrapper):not(.summary):not(.woocommerce-tabs){clear:both!important;width:100%!important}}@media(min-width:1000px){body.single-product #main #product-271>.summary{margin-left:0!important;margin-right:0!important}}@media(min-width:1000px){body.single-product #main #product-271>.avada-single-product-gallery-wrapper{margin-right:0!important;padding-bottom:580px!important}}body.single-product #main #product-271 #tab-description .post-content>h3:first-child{display:none!important}body.single-product #main #product-271 .woocommerce-tabs .panel{margin-left:0!important;margin-right:0!important;width:100%!important;box-sizing:border-box!important}body.single-product #main #product-271 .woocommerce-tabs .tabs{gap:20px!important}body.single-product #main #product-271 .woocommerce-tabs .tabs li{margin-right:0!important}<\/style>\n<details class=\"cn-producto-detalles\">\n<summary>Mostrar descripci\u00f3n<\/summary>\n<div class=\"cn-descripcion-contenido\">\n<h2>YT Cinematic Player Web \u2014 JavaScript independiente<\/h2>\n<p>El reproductor cinematogr\u00e1fico de YouTube en archivos est\u00e1ticos: sin WordPress, sin base de datos y sin librer\u00edas externas. Presenta tus videos en un carrusel 3D, \u00e1brelos en un reproductor ampliado y vuelve al carrusel al cerrar.<\/p>\n<h3>Qu\u00e9 incluye<\/h3>\n<ul>\n<li><strong>Carrusel 3D:<\/strong> portada central destacada y laterales en perspectiva; el fondo toma el color de la portada activa. Navegaci\u00f3n con clic o toque, arrastre, trackpad horizontal y teclado.<\/li>\n<li><strong>Reproductor ampliado:<\/strong> el panel crece desde la portada y carga el reproductor oficial de YouTube. Se cierra con \u00abCerrar\u00bb, Esc o un clic fuera, y el video se detiene al cerrar.<\/li>\n<li><strong>Dock de controles:<\/strong> anterior, reproducir\/pausar, siguiente, barra de progreso, volumen y silencio, lista y video al azar.<\/li>\n<li><strong>Lista con buscador:<\/strong> filtra por t\u00edtulo, descripci\u00f3n, datos breves o cr\u00e9ditos.<\/li>\n<li><strong>Columna de acciones opcional:<\/strong> favoritos (guardados en el navegador del visitante), lista, repetir y compartir.<\/li>\n<li><strong>Personalizaci\u00f3n en index.html:<\/strong> videos, t\u00edtulos, descripciones, datos breves, cr\u00e9ditos, etiqueta y portadas propias; colores de fondo, texto y acento, imagen de fondo con contraste y columna de acciones. Un comentario en el archivo explica cada campo.<\/li>\n<li>Tipograf\u00eda incluida, adaptaci\u00f3n a escritorio y m\u00f3vil, y respeto de la preferencia \u00abreducir movimiento\u00bb.<\/li>\n<\/ul>\n<h3>Entrega e instalaci\u00f3n<\/h3>\n<p>Recibes un ZIP con <code>index.html<\/code>, la carpeta <code>assets<\/code> (CSS, JavaScript y tipograf\u00eda), una gu\u00eda y un lanzador para probarlo en Windows. Para publicarlo, sube la carpeta a tu hosting con HTTPS y abre <code>index.html<\/code>. Para probarlo en tu equipo, haz doble clic en \u00abAbrir reproductor.bat\u00bb (requiere Node.js solo para esa prueba local).<\/p>\n<h3>Requisitos y funcionamiento<\/h3>\n<p>Hosting o servidor web con HTTPS y navegador actual (Chrome\/Edge 111+, Safari 16.4+, Firefox 113+). YouTube no reproduce videos en p\u00e1ginas abiertas como archivo local, por eso se incluye el lanzador. Usa el reproductor oficial de YouTube, que conserva su marca, controles y anuncios; no descarga videos ni extrae audio. Los videos privados o con inserci\u00f3n desactivada no se reproducen. La reproducci\u00f3n autom\u00e1tica depende del navegador.<\/p>\n<p>Los videos de ejemplo son pel\u00edculas abiertas de Blender Foundation y Blender Studio publicadas en YouTube.<\/p>\n<\/div>\n<\/details>\n","protected":false},"excerpt":{"rendered":"<div class=\"cn-radio-paquete-resumen\">\n<p><strong>La misma experiencia 3D, sin WordPress. Una compra. US$30.<\/strong><\/p>\n<p>Versi\u00f3n independiente en HTML, CSS y JavaScript: carrusel 3D de portadas, reproductor ampliado de YouTube, dock de controles y lista con buscador. S\u00fabela a cualquier hosting con HTTPS.<\/p>\n<p><a class=\"button\" href=\"https:\/\/creanexostudio.com\/demos\/cinematic-3d-youtube\/\" target=\"_blank\" rel=\"noopener\">\u25b6 Ver demostraci\u00f3n<\/a><\/p>\n<\/div>\n<p><img decoding=\"async\" src=\"https:\/\/creanexo.com\/tienda\/wp-content\/uploads\/2026\/10\/yt-demo-publica-1.jpg\" alt=\"P\u00e1gina de demostraci\u00f3n p\u00fablica del reproductor Cinematic 3D\" width=\"1024\" height=\"576\" class=\"alignnone size-large wp-image-287\" srcset=\"https:\/\/creanexo.com\/tienda\/wp-content\/uploads\/2026\/10\/yt-demo-publica-1-200x113.jpg 200w, https:\/\/creanexo.com\/tienda\/wp-content\/uploads\/2026\/10\/yt-demo-publica-1-300x169.jpg 300w, https:\/\/creanexo.com\/tienda\/wp-content\/uploads\/2026\/10\/yt-demo-publica-1-400x225.jpg 400w, https:\/\/creanexo.com\/tienda\/wp-content\/uploads\/2026\/10\/yt-demo-publica-1-500x281.jpg 500w, https:\/\/creanexo.com\/tienda\/wp-content\/uploads\/2026\/10\/yt-demo-publica-1-600x338.jpg 600w, https:\/\/creanexo.com\/tienda\/wp-content\/uploads\/2026\/10\/yt-demo-publica-1-700x394.jpg 700w, https:\/\/creanexo.com\/tienda\/wp-content\/uploads\/2026\/10\/yt-demo-publica-1-768x432.jpg 768w, https:\/\/creanexo.com\/tienda\/wp-content\/uploads\/2026\/10\/yt-demo-publica-1-800x450.jpg 800w, https:\/\/creanexo.com\/tienda\/wp-content\/uploads\/2026\/10\/yt-demo-publica-1.jpg 1024w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/p>\n","protected":false},"featured_media":281,"comment_status":"open","ping_status":"closed","template":"","meta":[],"product_brand":[],"product_cat":[19],"product_tag":[],"class_list":["post-271","product","type-product","status-publish","has-post-thumbnail","product_cat-reproductores-multimedia","first","instock","downloadable","virtual","purchasable","product-type-simple"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.8 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>YT Cinematic Player Web: reproductor 3D de YouTube en HTML y JavaScript<\/title>\n<meta name=\"description\" content=\"Reproductor de YouTube con carrusel 3D en HTML, CSS y JavaScript: reproductor ampliado, dock de controles y lista con buscador. Sin WordPress ni dependencias.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/creanexo.com\/tienda\/product\/yt-cinematic-player-web\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"YT Cinematic Player Web: reproductor 3D de YouTube en HTML y JavaScript\" \/>\n<meta property=\"og:description\" content=\"Reproductor de YouTube con carrusel 3D en HTML, CSS y JavaScript: reproductor ampliado, dock de controles y lista con buscador. Sin WordPress ni dependencias.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/creanexo.com\/tienda\/product\/yt-cinematic-player-web\/\" \/>\n<meta property=\"og:site_name\" content=\"Creanexo\" \/>\n<meta property=\"article:modified_time\" content=\"2026-10-31T00:31:43+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/creanexo.com\/tienda\/wp-content\/uploads\/2026\/10\/yt-web-portada.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"900\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/creanexo.com\\\/tienda\\\/product\\\/yt-cinematic-player-web\\\/\",\"url\":\"https:\\\/\\\/creanexo.com\\\/tienda\\\/product\\\/yt-cinematic-player-web\\\/\",\"name\":\"YT Cinematic Player Web: reproductor 3D de YouTube en HTML y JavaScript\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/creanexo.com\\\/tienda\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/creanexo.com\\\/tienda\\\/product\\\/yt-cinematic-player-web\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/creanexo.com\\\/tienda\\\/product\\\/yt-cinematic-player-web\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/creanexo.com\\\/tienda\\\/wp-content\\\/uploads\\\/2026\\\/10\\\/yt-web-portada.jpg\",\"datePublished\":\"2026-10-15T14:45:19+00:00\",\"dateModified\":\"2026-10-31T00:31:43+00:00\",\"description\":\"Reproductor de YouTube con carrusel 3D en HTML, CSS y JavaScript: reproductor ampliado, dock de controles y lista con buscador. Sin WordPress ni dependencias.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/creanexo.com\\\/tienda\\\/product\\\/yt-cinematic-player-web\\\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/creanexo.com\\\/tienda\\\/product\\\/yt-cinematic-player-web\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\\\/\\\/creanexo.com\\\/tienda\\\/product\\\/yt-cinematic-player-web\\\/#primaryimage\",\"url\":\"https:\\\/\\\/creanexo.com\\\/tienda\\\/wp-content\\\/uploads\\\/2026\\\/10\\\/yt-web-portada.jpg\",\"contentUrl\":\"https:\\\/\\\/creanexo.com\\\/tienda\\\/wp-content\\\/uploads\\\/2026\\\/10\\\/yt-web-portada.jpg\",\"width\":1200,\"height\":900,\"caption\":\"Portada de YT Cinematic Player Web: versi\u00f3n HTML, CSS y JavaScript, US$30\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/creanexo.com\\\/tienda\\\/product\\\/yt-cinematic-player-web\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/creanexo.com\\\/tienda\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Tienda\",\"item\":\"https:\\\/\\\/creanexo.com\\\/tienda\\\/shop\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"YT Cinematic Player Web \u2014 JavaScript independiente\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/creanexo.com\\\/tienda\\\/#website\",\"url\":\"https:\\\/\\\/creanexo.com\\\/tienda\\\/\",\"name\":\"Creanexo\",\"description\":\"Recursos digitales para tus proyectos\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/creanexo.com\\\/tienda\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"YT Cinematic Player Web: reproductor 3D de YouTube en HTML y JavaScript","description":"Reproductor de YouTube con carrusel 3D en HTML, CSS y JavaScript: reproductor ampliado, dock de controles y lista con buscador. Sin WordPress ni dependencias.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/creanexo.com\/tienda\/product\/yt-cinematic-player-web\/","og_locale":"es_ES","og_type":"article","og_title":"YT Cinematic Player Web: reproductor 3D de YouTube en HTML y JavaScript","og_description":"Reproductor de YouTube con carrusel 3D en HTML, CSS y JavaScript: reproductor ampliado, dock de controles y lista con buscador. Sin WordPress ni dependencias.","og_url":"https:\/\/creanexo.com\/tienda\/product\/yt-cinematic-player-web\/","og_site_name":"Creanexo","article_modified_time":"2026-10-31T00:31:43+00:00","og_image":[{"width":1200,"height":900,"url":"https:\/\/creanexo.com\/tienda\/wp-content\/uploads\/2026\/10\/yt-web-portada.jpg","type":"image\/jpeg"}],"twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/creanexo.com\/tienda\/product\/yt-cinematic-player-web\/","url":"https:\/\/creanexo.com\/tienda\/product\/yt-cinematic-player-web\/","name":"YT Cinematic Player Web: reproductor 3D de YouTube en HTML y JavaScript","isPartOf":{"@id":"https:\/\/creanexo.com\/tienda\/#website"},"primaryImageOfPage":{"@id":"https:\/\/creanexo.com\/tienda\/product\/yt-cinematic-player-web\/#primaryimage"},"image":{"@id":"https:\/\/creanexo.com\/tienda\/product\/yt-cinematic-player-web\/#primaryimage"},"thumbnailUrl":"https:\/\/creanexo.com\/tienda\/wp-content\/uploads\/2026\/10\/yt-web-portada.jpg","datePublished":"2026-10-15T14:45:19+00:00","dateModified":"2026-10-31T00:31:43+00:00","description":"Reproductor de YouTube con carrusel 3D en HTML, CSS y JavaScript: reproductor ampliado, dock de controles y lista con buscador. Sin WordPress ni dependencias.","breadcrumb":{"@id":"https:\/\/creanexo.com\/tienda\/product\/yt-cinematic-player-web\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/creanexo.com\/tienda\/product\/yt-cinematic-player-web\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/creanexo.com\/tienda\/product\/yt-cinematic-player-web\/#primaryimage","url":"https:\/\/creanexo.com\/tienda\/wp-content\/uploads\/2026\/10\/yt-web-portada.jpg","contentUrl":"https:\/\/creanexo.com\/tienda\/wp-content\/uploads\/2026\/10\/yt-web-portada.jpg","width":1200,"height":900,"caption":"Portada de YT Cinematic Player Web: versi\u00f3n HTML, CSS y JavaScript, US$30"},{"@type":"BreadcrumbList","@id":"https:\/\/creanexo.com\/tienda\/product\/yt-cinematic-player-web\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/creanexo.com\/tienda\/"},{"@type":"ListItem","position":2,"name":"Tienda","item":"https:\/\/creanexo.com\/tienda\/shop\/"},{"@type":"ListItem","position":3,"name":"YT Cinematic Player Web \u2014 JavaScript independiente"}]},{"@type":"WebSite","@id":"https:\/\/creanexo.com\/tienda\/#website","url":"https:\/\/creanexo.com\/tienda\/","name":"Creanexo","description":"Recursos digitales para tus proyectos","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/creanexo.com\/tienda\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"}]}},"_links":{"self":[{"href":"https:\/\/creanexo.com\/tienda\/wp-json\/wp\/v2\/product\/271","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/creanexo.com\/tienda\/wp-json\/wp\/v2\/product"}],"about":[{"href":"https:\/\/creanexo.com\/tienda\/wp-json\/wp\/v2\/types\/product"}],"replies":[{"embeddable":true,"href":"https:\/\/creanexo.com\/tienda\/wp-json\/wp\/v2\/comments?post=271"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/creanexo.com\/tienda\/wp-json\/wp\/v2\/media\/281"}],"wp:attachment":[{"href":"https:\/\/creanexo.com\/tienda\/wp-json\/wp\/v2\/media?parent=271"}],"wp:term":[{"taxonomy":"product_brand","embeddable":true,"href":"https:\/\/creanexo.com\/tienda\/wp-json\/wp\/v2\/product_brand?post=271"},{"taxonomy":"product_cat","embeddable":true,"href":"https:\/\/creanexo.com\/tienda\/wp-json\/wp\/v2\/product_cat?post=271"},{"taxonomy":"product_tag","embeddable":true,"href":"https:\/\/creanexo.com\/tienda\/wp-json\/wp\/v2\/product_tag?post=271"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}