{"id":370564,"date":"2022-12-18T16:09:00","date_gmt":"2022-12-18T13:09:00","guid":{"rendered":"https:\/\/themewp.inform.click\/?p=370564"},"modified":"2023-04-30T11:59:48","modified_gmt":"2023-04-30T08:59:48","slug":"como-agregar-la-comparacion-de-productos-de-woocommerce","status":"publish","type":"post","link":"https:\/\/themewp.inform.click\/es\/como-agregar-la-comparacion-de-productos-de-woocommerce\/","title":{"rendered":"C\u00f3mo agregar la comparaci\u00f3n de productos de WooCommerce"},"content":{"rendered":"\n<p>Hoy en d\u00eda, crear sitios web de tiendas usando WordPress es muy popular y f\u00e1cil. Gracias a WooCommerce, el complemento m\u00e1s popular para crear tiendas, y muchos <a href=\"https:\/\/themewp.inform.click\/es\/5-los-mejores-temas-de-elementor-woocommerce-para-2022\/\" title=\"temas de WooCommerce\">temas de WooCommerce<\/a> f\u00e1ciles de usar, hoy en d\u00eda casi todos pueden <a href=\"https:\/\/themewp.inform.click\/es\/como-iniciar-una-tienda-en-linea-en-2022-guia-detallada\/\" title=\"crear una gran tienda muy r\u00e1pidamente\">crear una gran tienda muy r\u00e1pidamente<\/a>.<\/p>\n<p>El hecho de que esta forma de crear una tienda sea muy popular habla a favor de la creaci\u00f3n diaria de <strong>nuevos complementos que pueden contribuir a la mejora de su sitio<\/strong>. Presentar un producto nunca ha sido tan f\u00e1cil, existen innumerables formas de llamar la atenci\u00f3n de los consumidores.<\/p>\n<p>Uno de esos elementos es sin duda <a href=\"https:\/\/qodeinteractive.com\/qi-addons-for-elementor\/product-comparison\/?campaign=ProductComparison&amp;ref=1\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">la comparaci\u00f3n de productos de WooCommerce<\/a>. Se utiliza para <strong>presentar productos seleccionados comparando sus caracter\u00edsticas<\/strong>. Esta forma de presentaci\u00f3n es buena tanto para los clientes como para ti. Cuando los clientes quieren decidir sobre un producto en particular, les gusta tener una comparaci\u00f3n clara de sus opciones. Usted puede hacerlo posible f\u00e1cilmente para ellos.<\/p>\n<p>El Addon que m\u00e1s nos ha llamado la atenci\u00f3n y que nos ha resultado \u00fatil para comparar productos de tiendas, pero tambi\u00e9n para otras muchas cosas, es <a href=\"https:\/\/qodeinteractive.com\/qi-addons-for-elementor\/?campaign=ProductComparison&amp;ref=1\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Qi Addons para Elementor<\/a>. Esta herramienta tiene una versi\u00f3n gratuita con 60 widgets y una versi\u00f3n premium con 40+ m\u00e1s. <strong>Todos los widgets son extremadamente \u00fatiles y le permiten agregar elementos hermosos y pr\u00e1cticos<\/strong> a sus p\u00e1ginas con solo un par de clics. Las opciones de personalizaci\u00f3n tambi\u00e9n son incre\u00edbles, por lo que puede dise\u00f1ar f\u00e1cilmente todos los widgets para que coincidan impecablemente con el dise\u00f1o de su sitio web.<\/p>\n<p>El widget de comparaci\u00f3n de productos se utiliza para <strong>mostrar productos con sus caracter\u00edsticas esenciales en un solo lugar<\/strong> y brindar a los clientes informaci\u00f3n clara en un solo lugar.<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43d23de1a.jpg\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43d23de1a.jpg\" alt=\"C\u00f3mo agregar la comparaci\u00f3n de productos de WooCommerce\"><\/a><\/p>\n<h2>C\u00f3mo funciona el widget de comparaci\u00f3n de productos<\/h2>\n<p>Usar este widget es muy f\u00e1cil. <strong>Los datos de la tabla se recuperan directamente del propio producto, no hay complicaciones habituales relacionadas con la entrada manual<\/strong>. Todo lo que necesita hacer es <strong>elegir los productos que estar\u00e1n en la tabla y la informaci\u00f3n que los acompa\u00f1ar\u00e1<\/strong>.<\/p>\n<p>Adem\u00e1s, es importante <strong>dise\u00f1ar la tabla y el widget de comparaci\u00f3n de productos de WooCommerce le brinda muchas opciones<\/strong> para eso. Sin duda, hay un aspecto predeterminado que obtiene tan pronto como inserta el widget en la p\u00e1gina e inmediatamente ver\u00e1 c\u00f3mo algunas cosas, como las fuentes, coinciden con el aspecto de su tema. Entonces, con solo un poco de personalizaci\u00f3n, su mesa puede verse genial.<\/p>\n<p>Una vez que haya <a href=\"https:\/\/themewp.inform.click\/es\/como-agregar-productos-en-woocommerce\/\" title=\"agregado sus productos\">agregado sus productos<\/a> y la informaci\u00f3n relacionada con ellos, puede comenzar a crear una tabla de comparaci\u00f3n de productos. Esta es una vista previa de un producto creado con el complemento WooCommerce.<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43d4ad644.jpg\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43d4ad644.jpg\" alt=\"C\u00f3mo agregar la comparaci\u00f3n de productos de WooCommerce\"><\/a><\/p>\n<h2>C\u00f3mo hacer una comparaci\u00f3n de productos seleccionados<\/h2>\n<p>Una vez que ingrese a editar la p\u00e1gina deseada usando Elementor, encontrar\u00e1 el widget de Comparaci\u00f3n de productos entre los widgets disponibles. Todos los widgets de Qi tienen un aspecto distintivo e \u00edconos rojos.<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43d7b0ee8.jpg\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43d7b0ee8.jpg\" alt=\"C\u00f3mo agregar la comparaci\u00f3n de productos de WooCommerce\"><\/a><\/p>\n<p>Cuando <strong>arrastre el widget hacia un lado, notar\u00e1 que no hay una tabla, solo una notificaci\u00f3n que dice &quot;Por favor, elija los productos deseados<\/strong> &quot;. Por supuesto, primero debe agregar productos. Podr\u00e1 encontrar todas las configuraciones para este elemento en las <strong>pesta\u00f1as Contenido y Estilo<\/strong>. La pesta\u00f1a Avanzado tambi\u00e9n ofrece varios ajustes, pero pertenecen a Elementor y ya los conoces porque cada elemento los tiene, no son espec\u00edficos de este.<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43dc15eb2.jpg\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43dc15eb2.jpg\" alt=\"C\u00f3mo agregar la comparaci\u00f3n de productos de WooCommerce\"><\/a><\/p>\n<p>As\u00ed que empecemos. La pesta\u00f1a de contenido es donde <strong>determinar\u00e1 qu\u00e9 datos estar\u00e1n en su tabla de comparaci\u00f3n de productos<\/strong>. Para empezar, simplemente <strong>a\u00f1adiremos productos<\/strong>.<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43df404de.jpg\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43df404de.jpg\" alt=\"C\u00f3mo agregar la comparaci\u00f3n de productos de WooCommerce\"><\/a><\/p>\n<p>Adem\u00e1s, podemos <strong>elegir el orden en el que se colocar\u00e1n<\/strong> en la mesa los productos seleccionados, ya sea por ID, fecha, aleatorio\u2026<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43e2a9293.jpg\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43e2a9293.jpg\" alt=\"C\u00f3mo agregar la comparaci\u00f3n de productos de WooCommerce\"><\/a><\/p>\n<p><strong>Filtros para mostrar<\/strong> es una opci\u00f3n que determina <strong>qu\u00e9 datos se utilizar\u00e1n en la tabla de comparaci\u00f3n<\/strong>. Actualmente, hay 4 elementos: imagen, t\u00edtulo, precio y stock, es decir. disponibilidad.<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43e5b3cce.jpg\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43e5b3cce.jpg\" alt=\"C\u00f3mo agregar la comparaci\u00f3n de productos de WooCommerce\"><\/a><\/p>\n<p>Sin embargo, puede elegir cualquier cosa de la lista en el orden que m\u00e1s le convenga. Hemos hecho esta selecci\u00f3n para nuestra mesa:<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43ead1abe.jpg\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43ead1abe.jpg\" alt=\"C\u00f3mo agregar la comparaci\u00f3n de productos de WooCommerce\"><\/a><\/p>\n<p>Notar\u00e1 que se puede hacer clic en algunas partes, como el <strong>nombre del producto que conduce a la p\u00e1gina del producto<\/strong> y, por supuesto, &#8216;agregar al carrito&#8217;, que le permite <strong>agregar el producto al carrito<\/strong> en el acto. Naturalmente, no es necesario que el add-to-cart forme parte de tu mesa, pero en la mayor\u00eda de los casos ser\u00e1 muy \u00fatil.<\/p>\n<p><strong>La configuraci\u00f3n de los botones est\u00e1 relacionada con el bot\u00f3n Agregar al carrito<\/strong>. Estos ajustes son importantes si decide agregarlos a la tabla. Hay <strong>varios dise\u00f1os y tipos de botones disponibles<\/strong>. Tambi\u00e9n puede agregar un \u00edcono al bot\u00f3n y hacerlo a\u00fan m\u00e1s interesante. Todo depende de tus necesidades y nuestro consejo es explorar todas las opciones. No vamos a pasar por cada uno por separado porque <strong>son intuitivos y tambi\u00e9n ves todos los cambios que haces en vivo en el lado derecho de la pantalla<\/strong>, y muy f\u00e1cilmente entender\u00e1s todo por ti mismo.<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43ee88061.jpg\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43ee88061.jpg\" alt=\"C\u00f3mo agregar la comparaci\u00f3n de productos de WooCommerce\"><\/a><\/p>\n<p>Las opciones de calificaci\u00f3n est\u00e1n vinculadas a las calificaciones de la pantalla, l\u00f3gicamente, si ha elegido ser una parte integral de su pantalla. Aunque las estrellas son la forma m\u00e1s com\u00fan de mostrar una calificaci\u00f3n, no significa que no pueda seleccionar ning\u00fan otro \u00edcono. <strong>La biblioteca de iconos est\u00e1 a su disposici\u00f3n, pero tambi\u00e9n puede agregar el SVG deseado usted mismo<\/strong>.<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43f30e795.jpg\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43f30e795.jpg\" alt=\"C\u00f3mo agregar la comparaci\u00f3n de productos de WooCommerce\"><\/a><\/p>\n<p>Como dijimos, la pesta\u00f1a Contenido se usa para seleccionar los datos que se mostrar\u00e1n y ahora pasamos a la pesta\u00f1a Estilo donde podemos dise\u00f1ar cada elemento seleccionado.<\/p>\n<p><strong>Los ajustes est\u00e1n agrupados y, a primera vista, queda claro d\u00f3nde est\u00e1n los ajustes<\/strong>. Por supuesto, revise cada grupo para ver qu\u00e9 hay all\u00ed. Las opciones para elegir colores, m\u00e1rgenes, tipograf\u00eda, tama\u00f1o te sorprender\u00e1n cuando te des cuenta de cu\u00e1ntos detalles puedes ajustar.<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43f792544.jpg\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43f792544.jpg\" alt=\"C\u00f3mo agregar la comparaci\u00f3n de productos de WooCommerce\"><\/a><\/p>\n<p>No queremos repasar todas las opciones porque estamos seguros de que te resultar\u00e1 interesante explorar y jugar, solo repasaremos un par de importantes.<\/p>\n<p><strong>El estilo de imagen es una opci\u00f3n interesante y significativa<\/strong>. Sabemos por experiencia que muchas veces no todos los productos tienen una imagen destacada de las mismas dimensiones (la imagen que representa el producto y que tambi\u00e9n est\u00e1 en nuestra tabla). Entonces surge el problema de que las im\u00e1genes de la tabla se mostrar\u00e1n en diferentes dimensiones. Es por eso que <strong>las opciones Cuadrado, Apaisado, Vertical y Personalizado son importantes para nosotros, porque nos permiten configurar las im\u00e1genes para que tengan los mismos tama\u00f1os<\/strong>. Otras opciones tambi\u00e9n son interesantes y las usamos con mayor frecuencia cuando no hay grandes desviaciones en los tama\u00f1os de las im\u00e1genes destacadas.<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43fa367ec.jpg\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43fa367ec.jpg\" alt=\"C\u00f3mo agregar la comparaci\u00f3n de productos de WooCommerce\"><\/a><\/p>\n<p><strong>Las opciones de estilo del bot\u00f3n<\/strong> tambi\u00e9n son algo que necesitaremos en la mayor\u00eda de los casos para ajustar el bot\u00f3n al aspecto del tema. Aunque tiene su apariencia predeterminada y puede permanecer sin cambios, probablemente querr\u00e1 ajustarlo un poco m\u00e1s.<\/p>\n<p>Puede cambiar el fondo, toda la tipograf\u00eda de los subt\u00edtulos, organizar el relleno&#8230; Y tambi\u00e9n puede configurar c\u00f3mo se ver\u00e1 el bot\u00f3n de desplazamiento.<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43fcbf994.jpg\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43fcbf994.jpg\" alt=\"C\u00f3mo agregar la comparaci\u00f3n de productos de WooCommerce\"><\/a><\/p>\n<p><strong>Estilo de calificaci\u00f3n<\/strong>, entre otras cosas, incluye opciones para cambiar el tama\u00f1o de los \u00edconos utilizados, que pueden ser importantes para ti, pero tambi\u00e9n para el espacio entre ellos y para la estilizaci\u00f3n de las partes marcadas y no marcadas de la calificaci\u00f3n.<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e44002db75.jpg\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e44002db75.jpg\" alt=\"C\u00f3mo agregar la comparaci\u00f3n de productos de WooCommerce\"><\/a><\/p>\n<p>Y as\u00ed es como se ve cuando dejamos volar la imaginaci\u00f3n&#8230; <strong>Ver\u00e1 que el \u00faltimo producto no tiene una calificaci\u00f3n, la raz\u00f3n: nadie lo calific\u00f3 y, como puede ver, ese campo est\u00e1 vac\u00edo<\/strong>. Si le importa un campo vac\u00edo, puede reemplazar f\u00e1cilmente el campo de calificaci\u00f3n con alg\u00fan otro elemento. Por supuesto, una vez que se establece una tabla, los datos en ella se pueden cambiar&#8230;<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43d23de1a.jpg\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2022\/10\/post-301063-633e43d23de1a.jpg\" alt=\"C\u00f3mo agregar la comparaci\u00f3n de productos de WooCommerce\"><\/a><\/p>\n<h2>En conclusi\u00f3n<\/h2>\n<p>Hay muchos tipos diferentes de compradores, pero en general, a todos les gusta una tabla de comparaci\u00f3n de productos ordenada. Como puede ver, con Qi Addons, agregar la comparaci\u00f3n de productos es tan f\u00e1cil como puede ser, por lo que no hay necesidad de dudar, incluso si es un principiante completo de WordPress: puede agregar hermosas tablas de comparaci\u00f3n de productos personalizadas sin esfuerzo y sin invertir demasiado de su tiempo en ello. Una vez que comprenda cu\u00e1n simple es el funcionamiento de Qi Addons, seguramente estar\u00e1 interesado en agregar m\u00e1s elementos \u00fatiles a su tienda web, como <a href=\"https:\/\/themewp.inform.click\/es\/como-agregar-horarios-de-apertura-en-wordpress-la-forma-mas-facil\/\" title=\"el horario de apertura\">el horario de apertura<\/a>, <a href=\"https:\/\/themewp.inform.click\/es\/como-crear-un-flujo-de-pasos-usando-el-widget-de-proceso-de-elementor\/\" title=\"el widget de proceso de Elementor\">el widget de proceso de Elementor<\/a> o tal vez quiera explorar c\u00f3mo <a href=\"https:\/\/themewp.inform.click\/es\/como-resaltar-texto-en-wordpress-de-manera-facil\/\" title=\"enfatizar contenido espec\u00edfico resaltando texto\">enfatizar contenido espec\u00edfico resaltando texto<\/a>. Seguramente hay muchas maneras diferentes de hacer que su sitio web sea m\u00e1s atractivo y atractivo, sin mencionar que tambi\u00e9n es rentable.<\/p>\n<p><div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">Fuente de grabaci\u00f3n:  <a target=\"_blank\" rel=\"noopener nofollow\" href=\"\/\/wpklik.com\" class=\"external external_icon\">wpklik.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u00a1Aprenda c\u00f3mo agregar f\u00e1cilmente la comparaci\u00f3n de productos de WooCommerce a su tienda web y aumente sus ventas!<\/p>\n","protected":false},"author":1,"featured_media":263339,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[566],"tags":[849],"class_list":["post-370564","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-conceptos-basicos-de-wordpress","tag-affiai-es"],"_links":{"self":[{"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/posts\/370564","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/comments?post=370564"}],"version-history":[{"count":0,"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/posts\/370564\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/media\/263339"}],"wp:attachment":[{"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/media?parent=370564"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/categories?post=370564"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/tags?post=370564"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}