{"id":7471,"date":"2026-05-15T09:53:12","date_gmt":"2026-05-15T09:53:12","guid":{"rendered":"https:\/\/etchenet.com\/?p=7471"},"modified":"2026-05-15T09:53:15","modified_gmt":"2026-05-15T09:53:15","slug":"realisation-de-mon-second-plugin-wordpress-scroll-video-background","status":"publish","type":"post","link":"https:\/\/etchenet.com\/es\/realisation-de-mon-second-plugin-wordpress-scroll-video-background\/","title":{"rendered":"Creaci\u00f3n de mi segundo plugin de WordPress: Scroll Video Background"},"content":{"rendered":"<p class=\"wp-block-paragraph\">Despu\u00e9s de crear mi primer plugin de WordPress, <strong>Rese\u00f1as de Etchenet para Google Business<\/strong>, Trabaj\u00e9 en un segundo proyecto: <strong>Fondo de v\u00eddeo desplazable<\/strong>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Este nuevo complemento se est\u00e1 validando actualmente en <strong>WordPress.org<\/strong>. Fue dise\u00f1ado para permitir la integraci\u00f3n de fondos de v\u00eddeo controlados por desplazamiento en Gutenberg, con un enfoque limpio y ligero que es compatible con los requisitos del repositorio oficial de WordPress.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Un efecto visual dise\u00f1ado para sitios web de alta gama.<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Fondo de v\u00eddeo desplazable<\/strong> Esto permite usar un video como fondo animado, cuyo avance depende del desplazamiento de la p\u00e1gina. En lugar de un simple video de reproducci\u00f3n autom\u00e1tica, el visitante controla visualmente el progreso del video al desplazarse por la p\u00e1gina.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Este tipo de efecto es particularmente adecuado para <strong>sitios premium<\/strong>, desde p\u00e1ginas de inicio inmersivas, p\u00e1ginas de destino premium, portafolios, presentaciones de servicios o p\u00e1ginas de narraci\u00f3n visual.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Un plugin dise\u00f1ado para Gutenberg.<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">El objetivo es ofrecer una soluci\u00f3n que pueda utilizarse directamente en el editor de bloques de WordPress. El plugin permite a los usuarios a\u00f1adir una secci\u00f3n con un fondo de v\u00eddeo desplazable, seleccionar un v\u00eddeo de la biblioteca multimedia de WordPress y, a continuaci\u00f3n, crear contenido de Gutenberg sobre esa secci\u00f3n.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">El plugin tambi\u00e9n proporciona un modo de fondo de v\u00eddeo global para toda la p\u00e1gina, con el fin de crear una experiencia visual continua en toda la p\u00e1gina.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">\u00bfPor qu\u00e9 una versi\u00f3n nativa en JavaScript?<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Para esta primera versi\u00f3n, eleg\u00ed un enfoque en <strong>JavaScript nativo<\/strong>, sin dependencias externas importantes como GSAP.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Esta elecci\u00f3n es importante para la compatibilidad con WordPress.org. Los plugins enviados al repositorio oficial deben cumplir con normas estrictas, especialmente en lo que respecta a bibliotecas externas, dependencias, seguridad, rendimiento y mantenibilidad del c\u00f3digo.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">El objetivo es, por lo tanto, ofrecer una base limpia, ligera y verificable que sea compatible con los est\u00e1ndares de WordPress, manteniendo al mismo tiempo una representaci\u00f3n visual avanzada.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">La importancia de la preparaci\u00f3n de videos<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Para lograr un efecto fluido, el v\u00eddeo debe estar bien preparado. Un fondo de v\u00eddeo con desplazamiento controlado funciona mejor con v\u00eddeos optimizados, ligeros y bien comprimidos, y con fotogramas clave muy pr\u00f3ximos entre s\u00ed.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">La documentaci\u00f3n del complemento explica el tipo de v\u00eddeo recomendado, los formatos preferidos, las buenas pr\u00e1cticas de compresi\u00f3n y los comandos \u00fatiles de FFmpeg para preparar correctamente los archivos de v\u00eddeo.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Una herramienta para crear p\u00e1ginas m\u00e1s inmersivas.<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">La idea detr\u00e1s de este plugin es hacer accesible un efecto visual que suele estar reservado para desarrollos personalizados o sitios web de muy alta gama.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Se puede utilizar para crear:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>una p\u00e1gina de inicio inmersiva; ;<\/li>\n\n\n\n<li>una p\u00e1gina de destino premium; ;<\/li>\n\n\n\n<li>una presentaci\u00f3n de servicio m\u00e1s din\u00e1mica; ;<\/li>\n\n\n\n<li>un portafolio visual; ;<\/li>\n\n\n\n<li>una p\u00e1gina de producto; ;<\/li>\n\n\n\n<li>una secci\u00f3n de narraci\u00f3n de cuentos; ;<\/li>\n\n\n\n<li>un fondo animado controlado por desplazamiento.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Un proyecto de c\u00f3digo abierto<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Al igual que mi primer plugin, este proyecto sigue un modelo de c\u00f3digo abierto. El plugin se publicar\u00e1 gratuitamente en WordPress.org, con la opci\u00f3n de apoyar su desarrollo, mantenimiento y futuras mejoras mediante donaciones.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Descubre el plugin<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">La p\u00e1gina de descripci\u00f3n general del plugin est\u00e1 disponible aqu\u00ed:<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><a href=\"https:\/\/etchenet.com\/scroll-video-background\/\">Descubre el fondo de v\u00eddeo con desplazamiento<\/a><\/p>","protected":false},"excerpt":{"rendered":"<p>Apr\u00e8s la cr\u00e9ation de mon premier plugin WordPress, Etchenet Reviews for Google Business, j\u2019ai travaill\u00e9 sur un second projet : Scroll Video Background. Ce nouveau plugin est actuellement en cours de validation sur WordPress.org. Il a \u00e9t\u00e9 con\u00e7u pour permettre l\u2019int\u00e9gration de fonds vid\u00e9o contr\u00f4l\u00e9s par le scroll dans Gutenberg, avec une approche propre, l\u00e9g\u00e8re [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":7472,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_crdt_document":"","ai_generated_summary":"","_svbs_page_enabled":false,"_svbs_page_video_id":0,"_svbs_page_video_url":"","_svbs_page_overlay_opacity":0.45,"_svbs_page_scroll_range":1000,"_svbs_page_start_time":0,"_svbs_page_end_time":0,"_svbs_page_mobile_behavior":"enabled","_svbs_page_z_index":0,"footnotes":""},"categories":[83],"tags":[],"class_list":["post-7471","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blog"],"_links":{"self":[{"href":"https:\/\/etchenet.com\/es\/wp-json\/wp\/v2\/posts\/7471","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/etchenet.com\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/etchenet.com\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/etchenet.com\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/etchenet.com\/es\/wp-json\/wp\/v2\/comments?post=7471"}],"version-history":[{"count":1,"href":"https:\/\/etchenet.com\/es\/wp-json\/wp\/v2\/posts\/7471\/revisions"}],"predecessor-version":[{"id":7473,"href":"https:\/\/etchenet.com\/es\/wp-json\/wp\/v2\/posts\/7471\/revisions\/7473"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/etchenet.com\/es\/wp-json\/wp\/v2\/media\/7472"}],"wp:attachment":[{"href":"https:\/\/etchenet.com\/es\/wp-json\/wp\/v2\/media?parent=7471"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/etchenet.com\/es\/wp-json\/wp\/v2\/categories?post=7471"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/etchenet.com\/es\/wp-json\/wp\/v2\/tags?post=7471"}],"curies":[{"name":"gracias","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}