{"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-27T20:29:15","modified_gmt":"2026-05-27T20:29: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":"<article class=\"wp-block-group alignfull ethet-normalized-page ethet-editorial-page etch-page-shell--transparent has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n\n<section class=\"wp-block-group ethet-editorial-hero has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n\n<div class=\"wp-block-group ethet-editorial-inner has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n\n<p class=\"etch-label ethet-section-kicker ethet-editorial-kicker wp-block-paragraph\">Art\u00edculo<\/p>\n\n\n<h1 class=\"wp-block-heading ethet-editorial-title ethet-gradient-title\">Creaci\u00f3n de mi segundo plugin de WordPress: Scroll Video Background<\/h1>\n\n\n<p class=\"ethet-editorial-lead wp-block-paragraph\">Tras crear mi primer plugin para WordPress, Etchenet Reviews para Google Business, trabaj\u00e9 en un segundo proyecto: Scroll Video Background.<\/p>\n\n\n<p class=\"ethet-editorial-meta wp-block-paragraph\">15 de mayo de 2026<\/p>\n\n\n<div class=\"wp-block-group ethet-editorial-tags has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n\n<p class=\"ethet-editorial-tag wp-block-paragraph\">blog<\/p>\n\n<\/div>\n\n<\/div>\n\n<\/section>\n\n\n<section class=\"wp-block-group ethet-editorial-section-card ethet-editorial-card has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n\n<h2 class=\"wp-block-heading ethet-editorial-h2\">Puntos clave para recordar<\/h2>\n\n\n<p class=\"ethet-editorial-p 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<\/section>\n\n\n<section class=\"wp-block-group ethet-editorial-section-card ethet-editorial-card has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n\n<h2 class=\"wp-block-heading ethet-editorial-h2\">Un efecto visual dise\u00f1ado para sitios web de alta gama.<\/h2>\n\n\n<p class=\"ethet-editorial-p 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<p class=\"ethet-editorial-p 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<\/section>\n\n\n<section class=\"wp-block-group ethet-editorial-section-card ethet-editorial-card has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n\n<h2 class=\"wp-block-heading ethet-editorial-h2\">Un plugin dise\u00f1ado para Gutenberg.<\/h2>\n\n\n<p class=\"ethet-editorial-p 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<p class=\"ethet-editorial-p 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<\/section>\n\n\n<section class=\"wp-block-group ethet-editorial-section-card ethet-editorial-card has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n\n<h2 class=\"wp-block-heading ethet-editorial-h2\">\u00bfPor qu\u00e9 una versi\u00f3n nativa en JavaScript?<\/h2>\n\n\n<p class=\"ethet-editorial-p 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<p class=\"ethet-editorial-p 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<p class=\"ethet-editorial-p 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<\/section>\n\n\n<section class=\"wp-block-group ethet-editorial-section-card ethet-editorial-card has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n\n<h2 class=\"wp-block-heading ethet-editorial-h2\">La importancia de la preparaci\u00f3n de videos<\/h2>\n\n\n<p class=\"ethet-editorial-p 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<p class=\"ethet-editorial-p 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<\/section>\n\n\n<section class=\"wp-block-group ethet-editorial-section-card ethet-editorial-card has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n\n<h2 class=\"wp-block-heading ethet-editorial-h2\">Una herramienta para crear p\u00e1ginas m\u00e1s inmersivas.<\/h2>\n\n\n<p class=\"ethet-editorial-p 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<p class=\"ethet-editorial-p wp-block-paragraph\">Se puede utilizar para crear:<\/p>\n\n\n<ul class=\"wp-block-list etch-check-list ethet-editorial-checklist\">\n<li>una p\u00e1gina de inicio inmersiva; ;<\/li>\n<li>una p\u00e1gina de destino premium; ;<\/li>\n<li>una presentaci\u00f3n de servicio m\u00e1s din\u00e1mica; ;<\/li>\n<li>un portafolio visual; ;<\/li>\n<li>una p\u00e1gina de producto; ;<\/li>\n<li>una secci\u00f3n de narraci\u00f3n de cuentos; ;<\/li>\n<li>un fondo animado controlado por desplazamiento.<\/li>\n<\/ul>\n\n<\/section>\n\n\n<section class=\"wp-block-group ethet-editorial-section-card ethet-editorial-card has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n\n<h2 class=\"wp-block-heading ethet-editorial-h2\">Un proyecto de c\u00f3digo abierto<\/h2>\n\n\n<p class=\"ethet-editorial-p 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<\/section>\n\n\n<section class=\"wp-block-group ethet-editorial-section-card ethet-editorial-card has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n\n<h2 class=\"wp-block-heading ethet-editorial-h2\">Descubre el plugin<\/h2>\n\n\n<p class=\"ethet-editorial-p wp-block-paragraph\">La p\u00e1gina de descripci\u00f3n general del plugin est\u00e1 disponible aqu\u00ed:<\/p>\n\n\n<p class=\"ethet-editorial-p wp-block-paragraph\"><a href=\"http:\/\/localhost\/ethet\/scroll-video-background\/\" target=\"_blank\" rel=\"noopener\">Descubre el fondo de v\u00eddeo con desplazamiento<\/a><\/p>\n\n<\/section>\n\n<\/article>","protected":false},"excerpt":{"rendered":"<p>Article R\u00e9alisation de mon second plugin WordPress : Scroll Video Background Apr\u00e8s la cr\u00e9ation de mon premier plugin WordPress, Etchenet Reviews for Google Business, j&rsquo;ai travaill\u00e9 sur un second projet : Scroll Video Background. mai 15, 2026 blog \u00c0 retenir Ce nouveau plugin est actuellement en cours de validation sur WordPress.org. Il a \u00e9t\u00e9 con\u00e7u [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":7472,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_svbs_page_enabled":false,"_svbs_page_video_id":0,"_svbs_page_video_url":"","_svbs_page_overlay_color":"#020617","_svbs_page_overlay_opacity":0.45,"_svbs_page_scroll_range":0,"_svbs_page_scroll_range_desktop":0,"_svbs_page_scroll_range_tablet":0,"_svbs_page_scroll_range_mobile":0,"_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":2,"href":"https:\/\/etchenet.com\/es\/wp-json\/wp\/v2\/posts\/7471\/revisions"}],"predecessor-version":[{"id":7940,"href":"https:\/\/etchenet.com\/es\/wp-json\/wp\/v2\/posts\/7471\/revisions\/7940"}],"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}]}}