{"id":620,"date":"2026-10-29T22:00:32","date_gmt":"2026-10-29T22:00:32","guid":{"rendered":"https:\/\/plugins.creanexo.com\/product\/descarga-circular-animada-web-wordpress\/"},"modified":"2026-10-31T00:31:50","modified_gmt":"2026-10-31T00:31:50","slug":"descarga-circular-animada-web-wordpress","status":"publish","type":"product","link":"https:\/\/creanexo.com\/tienda\/product\/descarga-circular-animada-web-wordpress\/","title":{"rendered":"Descarga Circular Animada \u2014 WEB + WordPress"},"content":{"rendered":"<p>\/* Descarga Circular Animada: maquetaci\u00f3n est\u00e1ndar de la tienda, acotada a esta ficha por su clase propia .cn-dca-resumen (sin IDs). *\/body.single-product #main .product.type-product:has(.cn-dca-resumen) #tab-description&gt;h3,body.single-product #main .product.type-product:has(.cn-dca-resumen) #tab-description .fusion-woocommerce-tab-title,body.single-product #main .product.type-product:has(.cn-dca-resumen) #tab-description .post-content&gt;h3:first-child{display:none!important}@media (min-width:1000px){body.single-product #main .product.type-product:has(.cn-dca-resumen){display:flow-root!important}body.single-product #main .product.type-product:has(.cn-dca-resumen)&gt;.summary,body.single-product #main .product.type-product:has(.cn-dca-resumen)&gt;.summary&gt;.summary-container{display:contents!important}body.single-product #main .product.type-product:has(.cn-dca-resumen)&gt;.fusion-clearfix{display:none!important}body.single-product #main .product.type-product:has(.cn-dca-resumen)&gt;.avada-single-product-gallery-wrapper{float:left!important;width:42%!important;max-width:none!important;margin:0!important;padding:0!important;box-sizing:border-box!important}body.single-product #main .product.type-product:has(.cn-dca-resumen) .summary .woocommerce-product-details__short-description{float:left!important;clear:left!important;width:42%!important;margin:24px 0 0!important;position:static!important;top:auto!important;left:auto!important}body.single-product #main .product.type-product:has(.cn-dca-resumen) .summary-container&gt;:not(.woocommerce-product-details__short-description),body.single-product #main .product.type-product:has(.cn-dca-resumen)&gt;.woocommerce-tabs{margin-left:calc(42% + 32px)!important;float:none!important;clear:none!important;width:auto!important}body.single-product #main .product.type-product:has(.cn-dca-resumen) .summary .product_title{margin-top:0!important}body.single-product #main .product.type-product:has(.cn-dca-resumen) .summary-container&gt;:is(p.price,.avada-availability){display:block!important}body.single-product #main .product.type-product:has(.cn-dca-resumen)&gt;.woocommerce-tabs{margin-top:24px!important}body.single-product #main .product.type-product:has(.cn-dca-resumen)&gt;:is(.social-share,.related,.upsells){clear:both!important}body.single-product #main .product.type-product:has(.cn-dca-resumen) .woocommerce-tabs .tabs{float:none!important;width:100%!important;display:flex!important;gap:20px!important}body.single-product #main .product.type-product:has(.cn-dca-resumen) .woocommerce-tabs .tabs li{margin-right:0!important}body.single-product #main .product.type-product:has(.cn-dca-resumen) .woocommerce-tabs .panel{float:none!important;width:100%!important;padding:24px!important;margin-left:0!important;margin-right:0!important;box-sizing:border-box!important}}<\/p>\n<details class=\"cn-producto-detalles\">\n<summary>Mostrar descripci\u00f3n<\/summary>\n<div class=\"cn-descripcion-contenido\">\n<h2>Descarga Circular Animada \u2014 WEB + WordPress<\/h2>\n<p>Un bot\u00f3n circular de descarga con <strong>anillo de progreso animado<\/strong> y estados claros: listo, descargando, \u00e9xito y fallo. Sirve para ofrecer archivos en tu web con una presentaci\u00f3n m\u00e1s cuidada que un enlace normal. <strong>Una compra de US$5 incluye las dos versiones<\/strong>: la versi\u00f3n web independiente (HTML, CSS y JavaScript) y el plugin para WordPress. Versi\u00f3n 1.1.0.<\/p>\n<h3>C\u00f3mo funciona<\/h3>\n<ul>\n<li><strong>Progreso real, no simulado:<\/strong> el porcentaje solo se muestra cuando el archivo es del mismo dominio, el servidor indica su tama\u00f1o (Content-Length) sin compresi\u00f3n y el navegador puede leer la transferencia. En los dem\u00e1s casos (archivos de m\u00e1s de 8 MiB, sin tama\u00f1o fiable o comprimidos) la descarga la gestiona el navegador y el anillo gira sin porcentaje.<\/li>\n<li><strong>Archivos de otro dominio:<\/strong> se abren en una pesta\u00f1a nueva, sin sacar al visitante de la p\u00e1gina.<\/li>\n<li><strong>Estados claros:<\/strong> SUCCESS cuando el navegador ha recibido todos los bytes e iniciado la descarga; FAIL ante errores del servidor, respuestas incompletas o fallos de red; bot\u00f3n \u00abCancelar\u00bb durante la descarga. La p\u00e1gina no puede confirmar que el archivo qued\u00f3 guardado en disco, y as\u00ed se indica.<\/li>\n<li><strong>Sin descargas duplicadas:<\/strong> los clics repetidos durante una descarga se ignoran.<\/li>\n<li><strong>Demostraci\u00f3n de \u00e9xito y fallo:<\/strong> secuencias simuladas, marcadas como DEMO, para mostrar los estados sin transferir archivos.<\/li>\n<li><strong>Accesibilidad:<\/strong> se maneja con el teclado, el foco no se pierde, los cambios de estado se anuncian a los lectores de pantalla y respeta \u00abreducir movimiento\u00bb.<\/li>\n<li><strong>Privacidad:<\/strong> sin recursos externos, anal\u00edtica, rastreadores ni cookies propias.<\/li>\n<\/ul>\n<h3>Versi\u00f3n web (HTML, CSS y JavaScript)<\/h3>\n<p>Sin dependencias. Cargas <code>descarga-circular.css<\/code> y <code>descarga-circular.js<\/code>, copias el marcado del widget e indicas la direcci\u00f3n y el nombre del archivo con atributos <code>data-dc-*<\/code>. Incluye una API sencilla (<code>DescargaCircular.mount<\/code>, evento <code>dc:statechange<\/code>), una p\u00e1gina de demostraci\u00f3n y un ejemplo de integraci\u00f3n.<\/p>\n<h3>Plugin para WordPress<\/h3>\n<p>Dos shortcodes: <code>[descarga_circular id=\"123\"]<\/code> para descargar un archivo p\u00fablico de la Biblioteca de medios (con el texto del bot\u00f3n opcional <code>label=\"\u2026\"<\/code>) y <code>[descarga_circular_demo]<\/code> para mostrar la demostraci\u00f3n. El plugin solo acepta adjuntos p\u00fablicos guardados en la carpeta de subidas del sitio; no admite rutas ni URLs arbitrarias. Sin panel de ajustes ni configuraci\u00f3n global; los estilos y scripts solo se cargan en las p\u00e1ginas que usan los shortcodes.<\/p>\n<h3>Qu\u00e9 recibes<\/h3>\n<p>Dos archivos descargables: <code>descarga-circular-web-1.1.0.zip<\/code> (versi\u00f3n web) y <code>descarga-circular-animada-1.1.0.zip<\/code> (plugin instalable desde Plugins \u2192 A\u00f1adir nuevo \u2192 Subir plugin). Cada uno incluye sus instrucciones (LEEME.txt) y la licencia GPL-2.0-or-later.<\/p>\n<h3>Requisitos y l\u00edmites<\/h3>\n<p>Versi\u00f3n web: un servidor web o hosting (no funciona abriendo el archivo con doble clic). Plugin: WordPress 6.0 o superior y PHP 7.4 o superior. Probado en Microsoft Edge y Brave (motor Chromium); Firefox y Safari a\u00fan no se han probado. El aspecto dentro de WordPress puede variar seg\u00fan los estilos del tema. Las etiquetas de estado (READY, DOWNLOADING, SUCCESS, FAIL) est\u00e1n en ingl\u00e9s.<\/p>\n<p>Demostraci\u00f3n: <a href=\"https:\/\/creanexostudio.com\/demos\/creanexo-demo\/descarga-circular-animada\/\" target=\"_blank\" rel=\"noopener\">demo.creanexo.com\/descarga-circular-animada<\/a><\/p>\n<\/div>\n<\/details>\n","protected":false},"excerpt":{"rendered":"<div class=\"cn-dca-resumen\">\n<p><strong>Las dos versiones en una sola compra: web (HTML, CSS y JavaScript) + plugin para WordPress. US$5.<\/strong><\/p>\n<p>Un bot\u00f3n circular de descarga con anillo de progreso animado y estados claros: listo, descargando, \u00e9xito y fallo. Recibes los dos ZIP oficiales de la versi\u00f3n 1.1.0.<\/p>\n<p><a class=\"button\" href=\"https:\/\/creanexostudio.com\/demos\/creanexo-demo\/descarga-circular-animada\/\" target=\"_blank\" rel=\"noopener\">\u25b6 Ver demostraci\u00f3n<\/a><\/p>\n<p>La demo p\u00fablica muestra las secuencias de \u00e9xito y fallo (simuladas) y la descarga real de un archivo de prueba.<\/p>\n<\/div>\n","protected":false},"featured_media":617,"comment_status":"open","ping_status":"closed","template":"","meta":[],"product_brand":[],"product_cat":[26],"product_tag":[],"class_list":["post-620","product","type-product","status-publish","has-post-thumbnail","product_cat-plugins-wordpress","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>Descarga Circular Animada \u2014 WEB + WordPress - Creanexo<\/title>\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\/descarga-circular-animada-web-wordpress\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Descarga Circular Animada \u2014 WEB + WordPress - Creanexo\" \/>\n<meta property=\"og:description\" content=\"Las dos versiones en una sola compra: web (HTML, CSS y JavaScript) + plugin para WordPress. US$5.Un bot\u00f3n circular de descarga con anillo de progreso animado y estados claros: listo, descargando, \u00e9xito y fallo. Recibes los dos ZIP oficiales de la versi\u00f3n 1.1.0.\u25b6 Ver demostraci\u00f3nLa demo p\u00fablica muestra las secuencias de \u00e9xito y fallo (simuladas) y la descarga real de un archivo de prueba.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/creanexo.com\/tienda\/product\/descarga-circular-animada-web-wordpress\/\" \/>\n<meta property=\"og:site_name\" content=\"Creanexo\" \/>\n<meta property=\"article:modified_time\" content=\"2026-10-31T00:31:50+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/creanexo.com\/tienda\/wp-content\/uploads\/2026\/10\/descarga-circular-portada.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1264\" \/>\n\t<meta property=\"og:image:height\" content=\"790\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data1\" content=\"4 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/creanexo.com\\\/tienda\\\/product\\\/descarga-circular-animada-web-wordpress\\\/\",\"url\":\"https:\\\/\\\/creanexo.com\\\/tienda\\\/product\\\/descarga-circular-animada-web-wordpress\\\/\",\"name\":\"Descarga Circular Animada \u2014 WEB + WordPress - Creanexo\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/creanexo.com\\\/tienda\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/creanexo.com\\\/tienda\\\/product\\\/descarga-circular-animada-web-wordpress\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/creanexo.com\\\/tienda\\\/product\\\/descarga-circular-animada-web-wordpress\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/creanexo.com\\\/tienda\\\/wp-content\\\/uploads\\\/2026\\\/10\\\/descarga-circular-portada.jpg\",\"datePublished\":\"2026-10-29T22:00:32+00:00\",\"dateModified\":\"2026-10-31T00:31:50+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/creanexo.com\\\/tienda\\\/product\\\/descarga-circular-animada-web-wordpress\\\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/creanexo.com\\\/tienda\\\/product\\\/descarga-circular-animada-web-wordpress\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\\\/\\\/creanexo.com\\\/tienda\\\/product\\\/descarga-circular-animada-web-wordpress\\\/#primaryimage\",\"url\":\"https:\\\/\\\/creanexo.com\\\/tienda\\\/wp-content\\\/uploads\\\/2026\\\/10\\\/descarga-circular-portada.jpg\",\"contentUrl\":\"https:\\\/\\\/creanexo.com\\\/tienda\\\/wp-content\\\/uploads\\\/2026\\\/10\\\/descarga-circular-portada.jpg\",\"width\":1264,\"height\":790,\"caption\":\"Descarga Circular Animada: demostraci\u00f3n con el bot\u00f3n circular en \u00e9xito (anillo completo) y en fallo (63 %)\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/creanexo.com\\\/tienda\\\/product\\\/descarga-circular-animada-web-wordpress\\\/#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\":\"Descarga Circular Animada \u2014 WEB + WordPress\"}]},{\"@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":"Descarga Circular Animada \u2014 WEB + WordPress - Creanexo","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\/descarga-circular-animada-web-wordpress\/","og_locale":"es_ES","og_type":"article","og_title":"Descarga Circular Animada \u2014 WEB + WordPress - Creanexo","og_description":"Las dos versiones en una sola compra: web (HTML, CSS y JavaScript) + plugin para WordPress. US$5.Un bot\u00f3n circular de descarga con anillo de progreso animado y estados claros: listo, descargando, \u00e9xito y fallo. Recibes los dos ZIP oficiales de la versi\u00f3n 1.1.0.\u25b6 Ver demostraci\u00f3nLa demo p\u00fablica muestra las secuencias de \u00e9xito y fallo (simuladas) y la descarga real de un archivo de prueba.","og_url":"https:\/\/creanexo.com\/tienda\/product\/descarga-circular-animada-web-wordpress\/","og_site_name":"Creanexo","article_modified_time":"2026-10-31T00:31:50+00:00","og_image":[{"width":1264,"height":790,"url":"https:\/\/creanexo.com\/tienda\/wp-content\/uploads\/2026\/10\/descarga-circular-portada.jpg","type":"image\/jpeg"}],"twitter_card":"summary_large_image","twitter_misc":{"Tiempo de lectura":"4 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/creanexo.com\/tienda\/product\/descarga-circular-animada-web-wordpress\/","url":"https:\/\/creanexo.com\/tienda\/product\/descarga-circular-animada-web-wordpress\/","name":"Descarga Circular Animada \u2014 WEB + WordPress - Creanexo","isPartOf":{"@id":"https:\/\/creanexo.com\/tienda\/#website"},"primaryImageOfPage":{"@id":"https:\/\/creanexo.com\/tienda\/product\/descarga-circular-animada-web-wordpress\/#primaryimage"},"image":{"@id":"https:\/\/creanexo.com\/tienda\/product\/descarga-circular-animada-web-wordpress\/#primaryimage"},"thumbnailUrl":"https:\/\/creanexo.com\/tienda\/wp-content\/uploads\/2026\/10\/descarga-circular-portada.jpg","datePublished":"2026-10-29T22:00:32+00:00","dateModified":"2026-10-31T00:31:50+00:00","breadcrumb":{"@id":"https:\/\/creanexo.com\/tienda\/product\/descarga-circular-animada-web-wordpress\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/creanexo.com\/tienda\/product\/descarga-circular-animada-web-wordpress\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/creanexo.com\/tienda\/product\/descarga-circular-animada-web-wordpress\/#primaryimage","url":"https:\/\/creanexo.com\/tienda\/wp-content\/uploads\/2026\/10\/descarga-circular-portada.jpg","contentUrl":"https:\/\/creanexo.com\/tienda\/wp-content\/uploads\/2026\/10\/descarga-circular-portada.jpg","width":1264,"height":790,"caption":"Descarga Circular Animada: demostraci\u00f3n con el bot\u00f3n circular en \u00e9xito (anillo completo) y en fallo (63 %)"},{"@type":"BreadcrumbList","@id":"https:\/\/creanexo.com\/tienda\/product\/descarga-circular-animada-web-wordpress\/#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":"Descarga Circular Animada \u2014 WEB + WordPress"}]},{"@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\/620","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=620"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/creanexo.com\/tienda\/wp-json\/wp\/v2\/media\/617"}],"wp:attachment":[{"href":"https:\/\/creanexo.com\/tienda\/wp-json\/wp\/v2\/media?parent=620"}],"wp:term":[{"taxonomy":"product_brand","embeddable":true,"href":"https:\/\/creanexo.com\/tienda\/wp-json\/wp\/v2\/product_brand?post=620"},{"taxonomy":"product_cat","embeddable":true,"href":"https:\/\/creanexo.com\/tienda\/wp-json\/wp\/v2\/product_cat?post=620"},{"taxonomy":"product_tag","embeddable":true,"href":"https:\/\/creanexo.com\/tienda\/wp-json\/wp\/v2\/product_tag?post=620"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}