{"id":1437,"date":"2022-10-18T10:30:00","date_gmt":"2022-10-18T15:30:00","guid":{"rendered":"http:\/\/racmanuel.dev\/?post_type=proyectos&p=1437"},"modified":"2022-10-18T10:08:46","modified_gmt":"2022-10-18T15:08:46","slug":"plugin-ar-model-viewer-for-woocommerce-en-desarrollo","status":"publish","type":"proyectos","link":"https:\/\/racmanuel.dev\/en\/proyectos\/plugin-ar-model-viewer-for-woocommerce-en-desarrollo\/","title":{"rendered":"Plugin AR Model Viewer for WooCommerce (en Desarrollo)"},"content":{"rendered":"

[model-viewer]<\/p>\n\n\n\n

\u00bfQu\u00e9 es el AR Model Viewer for WooCommerce?<\/span><\/h2>\n\n\n\n

AR Model Viewer for WooCommerce es un proyecto personal de plugin de WordPress para mostrar objetos en 3D y Realidad Aumentada en los productos de WooCommerce, \u00fatil para tiendas que venden modelos en 3D o cualquier E-Commerce que quiera destacar a\u00f1adiendo la posibilidad a sus clientes de ver sus productos en Realidad Aumentada.<\/p>\n\n\n\n

Descripci\u00f3n del Proyecto<\/span><\/h2>\n\n\n\n

La idea de este proyecto es que sea un plugin gratuito y est\u00e1 pensado publicarse en el repositorio de plugins de WordPress en cuanto se finalice el desarrollo del plugin o al menos lanzar una versi\u00f3n estable, este plugin utiliza la librer\u00eda o biblioteca de Google <model-viewer> (modelviewer.dev)<\/a> que permite mediante un componente web hacer la representaci\u00f3n de modelos 3D interactivos, opcionalmente se puede mostrar estos modelos 3D interactivos en Realidad Aumentada, esta biblioteca, permite realizarlo de manera f\u00e1cil compatible en tantos navegadores y dispositivos como sea posible.<\/p>\n\n\n\n

Adem\u00e1s, se est\u00e1 integrando el este plugin el uso de CMB2 de Custom Metaboxes 2<\/a>, un kit de herramientas para desarrolladores para crear metaboxes, campos personalizados y formularios para WordPress.<\/p>\n\n\n\n

\u00bfComo realice el plugin?<\/span><\/h2>\n\n\n\n

Este plugin sigue las recomendaciones en el Plugin Developer Handbook<\/a> oficial de WordPress<\/a>. Este plugin utiliza programaci\u00f3n orientada a objetos con WordPress y PHP. <\/p>\n\n\n\n

Para realizar el plugin utilice el famoso boilerplate de DevinVinson<\/a> que me permiti\u00f3 de una manera r\u00e1pida y sencilla, ordenar los Hooks y Actions de WordPress.<\/p>\n\n\n\n

Documentaci\u00f3n del Plugin<\/span><\/h5>\n\n\n\n

La documentaci\u00f3n del c\u00f3digo a\u00fan est\u00e1 pendiente, pero si quieres contribuir con c\u00f3digo puedes apoyarme haciendo tu Pull Request en GitHub.<\/p>\n\n\n\n

\n
Ver proyecto en GitHub<\/a><\/div>\n<\/div>\n\n\n\n

\u00bfComo funciona el plugin?<\/span><\/h2>\n\n\n\n

El plugin b\u00e1sicamente consiste en descargar el plugin del repositorio de GitHub e instalarlo como si fuera un plugin normal, al instalar el plugin nos mostrara una nueva opci\u00f3n de men\u00fa en Dashboard > Ajustes > AR Model Viewer for WooCommerce<\/strong> como lo muestra la siguiente imagen.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Si damos clic en “AR Model Viewer for WooCommerce”, nos mostrara el men\u00fa del plugin que incluye informaci\u00f3n del autor, la librer\u00eda, y algunos ajustes m\u00e1s para la visualizaci\u00f3n de Realidad Aumentada.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n
\u00bfComo cargar un modelo 3D en alg\u00fan producto de WooCommerce?<\/span><\/h5>\n\n\n\n

Despu\u00e9s de haber instalado el plugin de “AR Model Viewer for WooCommerce” al editar cualquier producto de WooCommerce podemos ver que se cre\u00f3 un Meta box que nos permite subir archivos en formato .glb para Android y .usdz para IOS, e incluso una Imagen o Poster para mostrar mientras nuestro modelo 3D carga en su totalidad, adem\u00e1s de un atributo alt=”” el cual podemos ingresar una peque\u00f1a descripci\u00f3n de nuestro modelo 3D que ayude en temas de accesibilidad.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Una vez cargados ambos archivos de nuestro modelo 3D, guardamos nuestro producto podemos ver el resultado.<\/p>\n\n\n\n

Dependiendo de los ajustes del plugin podemos mostrar el modelo en diferentes partes de nuestro proyecto, como antes de el bot\u00f3n de a\u00f1adir al carrito en las pesta\u00f1as de producto individual de WooCommerce.<\/p>\n\n\n\n

\"\"<\/figure><\/div>
\"\"<\/figure><\/div>
\"\"<\/figure><\/div>
\"\"<\/figure><\/div><\/div><\/div><\/div>\n\n\n\n

\u00bfQuieres descargar este plugin?<\/span><\/h2>\n\n\n\n

Recuerda que este plugin a\u00fan est\u00e1 en desarrollo y no hay aun una versi\u00f3n estable, pero puedes apoyar el proyecto a\u00f1adiendo una estrella al proyecto en GitHub, o haciendo tus Pull Request para la soluci\u00f3n de problemas.<\/p>\n\n\n\n

\n
Ver proyecto en GitHub<\/a><\/div>\n<\/div>\n\n\n\n
\u00bfTienes alg\u00fan Proyecto Web?<\/span><\/h5>\n\n\n\n

Si \u00bfNecesitas ayuda con alg\u00fan proyecto web? No dudes en contactarme desarrollo soluciones completas y personalizadas con WordPress y PHP, con herramientas y procesos modernos, utilizando HTML, CSS, SCSS, PHP, JavaScript, Bootstrap y m\u00e1s\u2026 Si \u00bfEst\u00e1s listo? \u00a1Env\u00edame un mensaje y hablemos de tu proyecto web!<\/p>\n\n\n\n

\n\n\n\n\n\n\n\n<\/div>\n","protected":false},"excerpt":{"rendered":"

AR Model Viewer for WooCommerce es un proyecto personal de plugin de WordPress para mostrar objetos en 3D y Realidad Aumentada en los productos de WooCommerce, \u00fatil para tiendas que venden modelos en 3D o cualquier E-Commerce que quiera destacar a\u00f1adiendo la posibilidad a sus clientes de ver sus productos en Realidad Aumentada.<\/p>","protected":false},"author":1,"featured_media":1459,"parent":0,"template":"","tipo":[10],"class_list":["post-1437","proyectos","type-proyectos","status-publish","has-post-thumbnail","hentry","tipo-plugin-para-wordpress"],"blocksy_meta":{"styles_descriptor":{"styles":{"desktop":"","tablet":"","mobile":""},"google_fonts":[],"version":6}},"acf":[],"_links":{"self":[{"href":"https:\/\/racmanuel.dev\/en\/wp-json\/wp\/v2\/proyectos\/1437","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/racmanuel.dev\/en\/wp-json\/wp\/v2\/proyectos"}],"about":[{"href":"https:\/\/racmanuel.dev\/en\/wp-json\/wp\/v2\/types\/proyectos"}],"author":[{"embeddable":true,"href":"https:\/\/racmanuel.dev\/en\/wp-json\/wp\/v2\/users\/1"}],"version-history":[{"count":14,"href":"https:\/\/racmanuel.dev\/en\/wp-json\/wp\/v2\/proyectos\/1437\/revisions"}],"predecessor-version":[{"id":1467,"href":"https:\/\/racmanuel.dev\/en\/wp-json\/wp\/v2\/proyectos\/1437\/revisions\/1467"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/racmanuel.dev\/en\/wp-json\/wp\/v2\/media\/1459"}],"wp:attachment":[{"href":"https:\/\/racmanuel.dev\/en\/wp-json\/wp\/v2\/media?parent=1437"}],"wp:term":[{"taxonomy":"tipo","embeddable":true,"href":"https:\/\/racmanuel.dev\/en\/wp-json\/wp\/v2\/tipo?post=1437"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}