{"id":24851,"date":"2019-02-01T09:59:42","date_gmt":"2019-02-01T09:59:42","guid":{"rendered":"https:\/\/www.knowband.com\/blog\/?p=24017\/"},"modified":"2021-01-12T15:17:01","modified_gmt":"2019-02-01T09:59:42","slug":"%c2%bfc%c3%b3mo-crear-m%c3%baltiples-miniaturas-mientras-se-carga-la-imagen","status":"publish","type":"post","link":"https:\/\/www.knowband.com\/blog\/es\/sin-categorizar\/%c2%bfc%c3%b3mo-crear-m%c3%baltiples-miniaturas-mientras-se-carga-la-imagen\/","title":{"rendered":"\u00bfC\u00f3mo crear m\u00faltiples miniaturas mientras se carga la imagen?"},"content":{"rendered":"<h2>Objetivos del blog.<\/h2>\n<p>Despu\u00e9s de leer este blog, podremos crear varias miniaturas mientras cargamos una imagen. En este blog podemos aprender a cambiar el tama\u00f1o del tama\u00f1o de la imagen usando c\u00f3digo.<\/p>\n<h2>Vamos a conocer las miniaturas.<\/h2>\n<p>Las miniaturas son las versiones reducidas de im\u00e1genes o videos. Las miniaturas se crean a partir de la imagen original al reducir su dimensi\u00f3n y tama\u00f1o. Al crear miniaturas podemos representar una imagen de gran tama\u00f1o con una imagen de peque\u00f1o tama\u00f1o. El sitio web, como las tiendas de comercio electr\u00f3nico en l\u00ednea, usa im\u00e1genes en miniatura en lugar de im\u00e1genes grandes para reducir el tiempo de carga de su p\u00e1gina web, lo que tambi\u00e9n hace que el sitio sea m\u00e1s r\u00e1pido. Para entender el funcionamiento de las miniaturas t\u00e9cnicamente haremos un programa simple. El requisito se ha compartido a continuaci\u00f3n:<\/p>\n<h2>Requisito<\/h2>\n<p>Entendamos el requisito primero. Digamos que tenemos un sitio web llamado Knowband que vende los m\u00f3dulos para la plataforma de comercio electr\u00f3nico como Magento, Prestashop, Opencart, etc. Muestra muchas im\u00e1genes en la p\u00e1gina de listado de m\u00f3dulos de Knowband. Las im\u00e1genes originales son de gran tama\u00f1o, por lo que aumenta directamente el tiempo de carga de la p\u00e1gina de listado para reducir el tiempo de carga de la p\u00e1gina. El sitio de Knowband utiliza im\u00e1genes en miniatura en la p\u00e1gina de listado. En este blog, podemos aprender c\u00f3mo crear m\u00faltiples miniaturas de una imagen. Consideremos un ejemplo, donde crearemos tres miniaturas como se muestra en la imagen que se muestra a continuaci\u00f3n:<\/p>\n<p><a href=\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/01\/Picture2-2.png\" target=\"_blank\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-24005 size-full\" src=\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/01\/Picture2-2.png\" alt=\"miniaturas\" width=\"1217\" height=\"562\" srcset=\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/01\/Picture2-2.png 1217w, https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/01\/Picture2-2-300x139.png 300w, https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/01\/Picture2-2-768x355.png 768w, https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/01\/Picture2-2-1024x473.png 1024w\" sizes=\"auto, (max-width: 1217px) 100vw, 1217px\" \/><\/a><\/p>\n<h2>Funci\u00f3n para crear la miniatura.<\/h2>\n<p>Entendamos la funcionalidad principal o el c\u00f3digo que es realmente responsable de crear las miniaturas. A continuaci\u00f3n se proporciona una funci\u00f3n que es responsable de crear la miniatura. Vamos a entender la funci\u00f3n como funcion\u00f3 realmente.<\/p>\n<h3>Debajo de la funci\u00f3n tenemos par\u00e1metros 4<\/h3>\n<p>El c\u00f3digo de creaci\u00f3n de varias miniaturas mientras se carga una imagen se muestra a continuaci\u00f3n:<\/p>\n<ul>\n<li><strong>$ source_path:<\/strong> Esto contiene el camino de la imagen original.<\/li>\n<li><strong>$ target_path:<\/strong> Esto contiene la ruta de acceso de la miniatura que se crear\u00e1.<\/li>\n<li><strong>$ tipo_de_archivo:<\/strong> Esto contiene la extensi\u00f3n de la imagen, por ejemplo, jpg, png, etc.<\/li>\n<li><strong>$ thumb_width:<\/strong> Es el ancho de la imagen en miniatura requerida.<\/li>\n<li><strong>$ thumb_height:<\/strong> Es la altura de la imagen en miniatura requerida.<\/li>\n<\/ul>\n<p>Esta funci\u00f3n simplemente recupera la imagen del archivo fuente y, despu\u00e9s de validar la imagen, crea la miniatura del ancho y la altura dados. As\u00ed que para crear las miniaturas de n\u00fameros &#39;n&#39; tenemos que llamar a esta funci\u00f3n &#39;n&#39; n\u00famero de veces con el ancho y la altura requeridos de la miniatura. Esta funci\u00f3n devolver\u00e1 VERDADERO si la miniatura se cre\u00f3 correctamente, de lo contrario, devolver\u00e1 FALSO.<\/p>\n<pre class=\"brush: actionscript3; gutter: true\">function create_thumbnail ($ source_path, $ target_path, $ file_type, $ thumb_width, $ thumb_height) {\/\/ Comprobando el tipo de archivo. if ($ file_type == &#39;jpeg&#39; || $ file_type == &#39;jpg&#39;) {$ source = imagecreatefromjpeg ($ source_path); } else if ($ file_type == &#39;png&#39;) {$ source = imagecreatefrompng ($ source_path); } else if ($ file_type == &#39;gif&#39;) {$ source = imagecreatefromgif ($ source_path); } \/\/ obtener el ancho de la imagen original $ width = imagesx ($ source); \/\/ obtener la altura de la imagen original $ height = imagesy ($ source); \/\/ Crear una imagen en negro del tama\u00f1o de la imagen del pulgar $ thumb_image = imagecreatetruecolor ($ thumb_width, $ thumb_height); \/\/ Copia y redimensiona parte de una imagen original y vuelve a muestrearla en la imagen del pulgar para crear una imagen de tama\u00f1o reducido de la imagen original imagen muestreada ($ thumb_image, $ source, 0, 0, 0, 0, $ thumb_width, $ thumb_height, $ width , $ altura); \/\/ crea un archivo JPEG desde la imagen dada y lo guarda en la carpeta seleccionada. if (imagejpeg ($ thumb_image, $ target_path, 90)) {\/\/ destruye las im\u00e1genes para liberar la memoria asociada con ellas imagedestroy ($ thumb_image); imagedestroy ($ source); volver VERDADERO } else {return FALSE; }}<\/pre>\n<p><a href=\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/01\/thumbnail.zip\" target=\"_blank\">Haga clic aqu\u00ed para descargar el proyecto completo.<\/a>.<\/p>\n<h2>Resumen<\/h2>\n<p>Despu\u00e9s de leer este documento, puede probar el mismo c\u00f3digo en su sistema. Despu\u00e9s de hacer lo mismo, puedes saber f\u00e1cilmente c\u00f3mo funcionan las miniaturas.<script data-cfasync=\"false\" src=\"https:\/\/tdns2.gtranslate.net\/tdn-bin\/queue.js\"><\/script><!-- Yandex.Metrika counter for GTranslate --><script data-cfasync=\"false\">(function (d, w, c) { (w[c] = w[c] || []).push(function() { try { w.yaCounter36618640 = new Ya.Metrika({ id:36618640, clickmap:true, trackLinks:true, accurateTrackBounce:true, ut:\"noindex\" }); } catch(e) { } }); var n = d.getElementsByTagName(\"script\")[0], s = d.createElement(\"script\"), f = function () { n.parentNode.insertBefore(s, n); }; s.type = \"text\/javascript\"; s.async = true; s.src = \"https:\/\/mc.yandex.ru\/metrika\/watch.js\"; if (w.opera == \"[object Opera]\") { d.addEventListener(\"DOMContentLoaded\", f, false); } else { f(); } })(document, window, \"yandex_metrika_callbacks\"); <\/script> <noscript><\/p>\n<div><img decoding=\"async\" src=\"https:\/\/mc.yandex.ru\/watch\/36618640?ut=noindex\" style=\"position:absolute; left:-9999px;\" alt=\"\" \/><\/div>\n<p><\/noscript><br \/>\n<!-- delivered by GTranslate v4.8.7 in 4ms visit https:\/\/gtranslate.io --><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Objetivos del blog. Despu\u00e9s de leer este blog, podremos crear varias miniaturas mientras cargamos una imagen. En este blog podemos aprender a cambiar el tama\u00f1o del tama\u00f1o de la imagen usando c\u00f3digo. Vamos a conocer las miniaturas. Las miniaturas son las versiones reducidas de im\u00e1genes o videos. Las miniaturas se crean a partir de la [&hellip;]<\/p>\n","protected":false},"author":19,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_kbui_enabled":"","footnotes":""},"categories":[],"tags":[8887,8889,8888,8886],"class_list":["post-24851","post","type-post","status-publish","format-standard","hentry","tag-crear-miniatura","tag-imagen-en-miniatura","tag-miniaturas-mltiples","tag-ua-del-pulgar"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.6 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>\u00bfC\u00f3mo crear m\u00faltiples miniaturas mientras se carga la imagen? - Knowband Blog | Ecommerce Modules<\/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:\/\/www.knowband.com\/blog\/es\/sin-categorizar\/\u00bfc\u00f3mo-crear-m\u00faltiples-miniaturas-mientras-se-carga-la-imagen\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"\u00bfC\u00f3mo crear m\u00faltiples miniaturas mientras se carga la imagen? - Knowband Blog | Ecommerce Modules\" \/>\n<meta property=\"og:description\" content=\"Objetivos del blog. Despu\u00e9s de leer este blog, podremos crear varias miniaturas mientras cargamos una imagen. En este blog podemos aprender a cambiar el tama\u00f1o del tama\u00f1o de la imagen usando c\u00f3digo. Vamos a conocer las miniaturas. Las miniaturas son las versiones reducidas de im\u00e1genes o videos. Las miniaturas se crean a partir de la [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.knowband.com\/blog\/es\/sin-categorizar\/\u00bfc\u00f3mo-crear-m\u00faltiples-miniaturas-mientras-se-carga-la-imagen\/\" \/>\n<meta property=\"og:site_name\" content=\"Knowband Blog | Ecommerce Modules\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/Knowband\" \/>\n<meta property=\"article:published_time\" content=\"2019-02-01T09:59:42+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/01\/Picture2-2.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1217\" \/>\n\t<meta property=\"og:image:height\" content=\"562\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Shivam Verma\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@KnowbandPlugin\" \/>\n<meta name=\"twitter:site\" content=\"@KnowbandPlugin\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Shivam Verma\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/es\\\/sin-categorizar\\\/%c2%bfc%c3%b3mo-crear-m%c3%baltiples-miniaturas-mientras-se-carga-la-imagen\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/es\\\/sin-categorizar\\\/%c2%bfc%c3%b3mo-crear-m%c3%baltiples-miniaturas-mientras-se-carga-la-imagen\\\/\"},\"author\":{\"name\":\"Shivam Verma\",\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/fr\\\/#\\\/schema\\\/person\\\/e053c57d62fceb4295302b9293e371f6\"},\"headline\":\"\u00bfC\u00f3mo crear m\u00faltiples miniaturas mientras se carga la imagen?\",\"datePublished\":\"2019-02-01T09:59:42+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/es\\\/sin-categorizar\\\/%c2%bfc%c3%b3mo-crear-m%c3%baltiples-miniaturas-mientras-se-carga-la-imagen\\\/\"},\"wordCount\":544,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/fr\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/es\\\/sin-categorizar\\\/%c2%bfc%c3%b3mo-crear-m%c3%baltiples-miniaturas-mientras-se-carga-la-imagen\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/wp-content\\\/uploads\\\/2019\\\/01\\\/Picture2-2.png\",\"keywords\":[\"crear miniatura\",\"imagen en miniatura\",\"miniaturas m\u00faltiples\",\"u\u00f1a del pulgar\"],\"inLanguage\":\"es-ES\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/es\\\/sin-categorizar\\\/%c2%bfc%c3%b3mo-crear-m%c3%baltiples-miniaturas-mientras-se-carga-la-imagen\\\/\",\"url\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/es\\\/sin-categorizar\\\/%c2%bfc%c3%b3mo-crear-m%c3%baltiples-miniaturas-mientras-se-carga-la-imagen\\\/\",\"name\":\"\u00bfC\u00f3mo crear m\u00faltiples miniaturas mientras se carga la imagen? - Knowband Blog | Ecommerce Modules\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/fr\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/es\\\/sin-categorizar\\\/%c2%bfc%c3%b3mo-crear-m%c3%baltiples-miniaturas-mientras-se-carga-la-imagen\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/es\\\/sin-categorizar\\\/%c2%bfc%c3%b3mo-crear-m%c3%baltiples-miniaturas-mientras-se-carga-la-imagen\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/wp-content\\\/uploads\\\/2019\\\/01\\\/Picture2-2.png\",\"datePublished\":\"2019-02-01T09:59:42+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/es\\\/sin-categorizar\\\/%c2%bfc%c3%b3mo-crear-m%c3%baltiples-miniaturas-mientras-se-carga-la-imagen\\\/#breadcrumb\"},\"inLanguage\":\"es-ES\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.knowband.com\\\/blog\\\/es\\\/sin-categorizar\\\/%c2%bfc%c3%b3mo-crear-m%c3%baltiples-miniaturas-mientras-se-carga-la-imagen\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"es-ES\",\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/es\\\/sin-categorizar\\\/%c2%bfc%c3%b3mo-crear-m%c3%baltiples-miniaturas-mientras-se-carga-la-imagen\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/wp-content\\\/uploads\\\/2019\\\/01\\\/Picture2-2.png\",\"contentUrl\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/wp-content\\\/uploads\\\/2019\\\/01\\\/Picture2-2.png\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/es\\\/sin-categorizar\\\/%c2%bfc%c3%b3mo-crear-m%c3%baltiples-miniaturas-mientras-se-carga-la-imagen\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/fr\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Magento un clic la caja &#8211; Manual del Usuario\",\"item\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/es\\\/manual-de-usuario\\\/magento-un-clic-la-caja-manual-del-usuario\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"\u00bfC\u00f3mo crear m\u00faltiples miniaturas mientras se carga la imagen?\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/fr\\\/#website\",\"url\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/fr\\\/\",\"name\":\"Knowband Blog | Ecommerce Modules\",\"description\":\"Magento, Prestashop, Opencart, Shopify\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/fr\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/fr\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es-ES\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/fr\\\/#organization\",\"name\":\"Knowband Blog | Ecommerce Modules\",\"url\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/fr\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es-ES\",\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/fr\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/wp-content\\\/uploads\\\/2016\\\/09\\\/cropped-knowband_logo-v2.png\",\"contentUrl\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/wp-content\\\/uploads\\\/2016\\\/09\\\/cropped-knowband_logo-v2.png\",\"width\":153,\"height\":61,\"caption\":\"Knowband Blog | Ecommerce Modules\"},\"image\":{\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/fr\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/Knowband\",\"https:\\\/\\\/x.com\\\/KnowbandPlugin\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/fr\\\/#\\\/schema\\\/person\\\/e053c57d62fceb4295302b9293e371f6\",\"name\":\"Shivam Verma\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es-ES\",\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/wp-content\\\/uploads\\\/2019\\\/02\\\/Image_for_blogShivam-150x150.jpg\",\"url\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/wp-content\\\/uploads\\\/2019\\\/02\\\/Image_for_blogShivam-150x150.jpg\",\"contentUrl\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/wp-content\\\/uploads\\\/2019\\\/02\\\/Image_for_blogShivam-150x150.jpg\",\"caption\":\"Shivam Verma\"},\"description\":\"Shivam Verma is an experienced software engineer in PHP development and Database design. His area of interest is website development. He likes to be aware of his surroundings and to learn new things by observing others. He believes that by doing this we can learn new things and can also enhance our knowledge everyday. He has started writing technical blogs with a view to help others in studying and learning new things in an easy way.\",\"url\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/es\\\/author\\\/sverma\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"\u00bfC\u00f3mo crear m\u00faltiples miniaturas mientras se carga la imagen? - Knowband Blog | Ecommerce Modules","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:\/\/www.knowband.com\/blog\/es\/sin-categorizar\/\u00bfc\u00f3mo-crear-m\u00faltiples-miniaturas-mientras-se-carga-la-imagen\/","og_locale":"es_ES","og_type":"article","og_title":"\u00bfC\u00f3mo crear m\u00faltiples miniaturas mientras se carga la imagen? - Knowband Blog | Ecommerce Modules","og_description":"Objetivos del blog. Despu\u00e9s de leer este blog, podremos crear varias miniaturas mientras cargamos una imagen. En este blog podemos aprender a cambiar el tama\u00f1o del tama\u00f1o de la imagen usando c\u00f3digo. Vamos a conocer las miniaturas. Las miniaturas son las versiones reducidas de im\u00e1genes o videos. Las miniaturas se crean a partir de la [&hellip;]","og_url":"https:\/\/www.knowband.com\/blog\/es\/sin-categorizar\/\u00bfc\u00f3mo-crear-m\u00faltiples-miniaturas-mientras-se-carga-la-imagen\/","og_site_name":"Knowband Blog | Ecommerce Modules","article_publisher":"https:\/\/www.facebook.com\/Knowband","article_published_time":"2019-02-01T09:59:42+00:00","og_image":[{"width":1217,"height":562,"url":"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/01\/Picture2-2.png","type":"image\/png"}],"author":"Shivam Verma","twitter_card":"summary_large_image","twitter_creator":"@KnowbandPlugin","twitter_site":"@KnowbandPlugin","twitter_misc":{"Written by":"Shivam Verma","Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.knowband.com\/blog\/es\/sin-categorizar\/%c2%bfc%c3%b3mo-crear-m%c3%baltiples-miniaturas-mientras-se-carga-la-imagen\/#article","isPartOf":{"@id":"https:\/\/www.knowband.com\/blog\/es\/sin-categorizar\/%c2%bfc%c3%b3mo-crear-m%c3%baltiples-miniaturas-mientras-se-carga-la-imagen\/"},"author":{"name":"Shivam Verma","@id":"https:\/\/www.knowband.com\/blog\/fr\/#\/schema\/person\/e053c57d62fceb4295302b9293e371f6"},"headline":"\u00bfC\u00f3mo crear m\u00faltiples miniaturas mientras se carga la imagen?","datePublished":"2019-02-01T09:59:42+00:00","mainEntityOfPage":{"@id":"https:\/\/www.knowband.com\/blog\/es\/sin-categorizar\/%c2%bfc%c3%b3mo-crear-m%c3%baltiples-miniaturas-mientras-se-carga-la-imagen\/"},"wordCount":544,"commentCount":0,"publisher":{"@id":"https:\/\/www.knowband.com\/blog\/fr\/#organization"},"image":{"@id":"https:\/\/www.knowband.com\/blog\/es\/sin-categorizar\/%c2%bfc%c3%b3mo-crear-m%c3%baltiples-miniaturas-mientras-se-carga-la-imagen\/#primaryimage"},"thumbnailUrl":"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/01\/Picture2-2.png","keywords":["crear miniatura","imagen en miniatura","miniaturas m\u00faltiples","u\u00f1a del pulgar"],"inLanguage":"es-ES"},{"@type":"WebPage","@id":"https:\/\/www.knowband.com\/blog\/es\/sin-categorizar\/%c2%bfc%c3%b3mo-crear-m%c3%baltiples-miniaturas-mientras-se-carga-la-imagen\/","url":"https:\/\/www.knowband.com\/blog\/es\/sin-categorizar\/%c2%bfc%c3%b3mo-crear-m%c3%baltiples-miniaturas-mientras-se-carga-la-imagen\/","name":"\u00bfC\u00f3mo crear m\u00faltiples miniaturas mientras se carga la imagen? - Knowband Blog | Ecommerce Modules","isPartOf":{"@id":"https:\/\/www.knowband.com\/blog\/fr\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.knowband.com\/blog\/es\/sin-categorizar\/%c2%bfc%c3%b3mo-crear-m%c3%baltiples-miniaturas-mientras-se-carga-la-imagen\/#primaryimage"},"image":{"@id":"https:\/\/www.knowband.com\/blog\/es\/sin-categorizar\/%c2%bfc%c3%b3mo-crear-m%c3%baltiples-miniaturas-mientras-se-carga-la-imagen\/#primaryimage"},"thumbnailUrl":"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/01\/Picture2-2.png","datePublished":"2019-02-01T09:59:42+00:00","breadcrumb":{"@id":"https:\/\/www.knowband.com\/blog\/es\/sin-categorizar\/%c2%bfc%c3%b3mo-crear-m%c3%baltiples-miniaturas-mientras-se-carga-la-imagen\/#breadcrumb"},"inLanguage":"es-ES","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.knowband.com\/blog\/es\/sin-categorizar\/%c2%bfc%c3%b3mo-crear-m%c3%baltiples-miniaturas-mientras-se-carga-la-imagen\/"]}]},{"@type":"ImageObject","inLanguage":"es-ES","@id":"https:\/\/www.knowband.com\/blog\/es\/sin-categorizar\/%c2%bfc%c3%b3mo-crear-m%c3%baltiples-miniaturas-mientras-se-carga-la-imagen\/#primaryimage","url":"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/01\/Picture2-2.png","contentUrl":"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/01\/Picture2-2.png"},{"@type":"BreadcrumbList","@id":"https:\/\/www.knowband.com\/blog\/es\/sin-categorizar\/%c2%bfc%c3%b3mo-crear-m%c3%baltiples-miniaturas-mientras-se-carga-la-imagen\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.knowband.com\/blog\/fr\/"},{"@type":"ListItem","position":2,"name":"Magento un clic la caja &#8211; Manual del Usuario","item":"https:\/\/www.knowband.com\/blog\/es\/manual-de-usuario\/magento-un-clic-la-caja-manual-del-usuario\/"},{"@type":"ListItem","position":3,"name":"\u00bfC\u00f3mo crear m\u00faltiples miniaturas mientras se carga la imagen?"}]},{"@type":"WebSite","@id":"https:\/\/www.knowband.com\/blog\/fr\/#website","url":"https:\/\/www.knowband.com\/blog\/fr\/","name":"Knowband Blog | Ecommerce Modules","description":"Magento, Prestashop, Opencart, Shopify","publisher":{"@id":"https:\/\/www.knowband.com\/blog\/fr\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.knowband.com\/blog\/fr\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es-ES"},{"@type":"Organization","@id":"https:\/\/www.knowband.com\/blog\/fr\/#organization","name":"Knowband Blog | Ecommerce Modules","url":"https:\/\/www.knowband.com\/blog\/fr\/","logo":{"@type":"ImageObject","inLanguage":"es-ES","@id":"https:\/\/www.knowband.com\/blog\/fr\/#\/schema\/logo\/image\/","url":"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2016\/09\/cropped-knowband_logo-v2.png","contentUrl":"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2016\/09\/cropped-knowband_logo-v2.png","width":153,"height":61,"caption":"Knowband Blog | Ecommerce Modules"},"image":{"@id":"https:\/\/www.knowband.com\/blog\/fr\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/Knowband","https:\/\/x.com\/KnowbandPlugin"]},{"@type":"Person","@id":"https:\/\/www.knowband.com\/blog\/fr\/#\/schema\/person\/e053c57d62fceb4295302b9293e371f6","name":"Shivam Verma","image":{"@type":"ImageObject","inLanguage":"es-ES","@id":"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/02\/Image_for_blogShivam-150x150.jpg","url":"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/02\/Image_for_blogShivam-150x150.jpg","contentUrl":"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/02\/Image_for_blogShivam-150x150.jpg","caption":"Shivam Verma"},"description":"Shivam Verma is an experienced software engineer in PHP development and Database design. His area of interest is website development. He likes to be aware of his surroundings and to learn new things by observing others. He believes that by doing this we can learn new things and can also enhance our knowledge everyday. He has started writing technical blogs with a view to help others in studying and learning new things in an easy way.","url":"https:\/\/www.knowband.com\/blog\/es\/author\/sverma\/"}]}},"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/www.knowband.com\/blog\/es\/wp-json\/wp\/v2\/posts\/24851","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.knowband.com\/blog\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.knowband.com\/blog\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.knowband.com\/blog\/es\/wp-json\/wp\/v2\/users\/19"}],"replies":[{"embeddable":true,"href":"https:\/\/www.knowband.com\/blog\/es\/wp-json\/wp\/v2\/comments?post=24851"}],"version-history":[{"count":0,"href":"https:\/\/www.knowband.com\/blog\/es\/wp-json\/wp\/v2\/posts\/24851\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.knowband.com\/blog\/es\/wp-json\/wp\/v2\/media?parent=24851"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.knowband.com\/blog\/es\/wp-json\/wp\/v2\/categories?post=24851"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.knowband.com\/blog\/es\/wp-json\/wp\/v2\/tags?post=24851"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}