En este tutorial, te mostraremos cómo permitir que los usuarios puedan crear productos de WooCommerce desde el frontend.
Esto es genial porque puedes permitir que tus vendedores creen y editen productos desde el frontend, sin tener que saber cómo usar WordPress.
Así es como lucirá el formulario de productos WooCommerce en el frontend:
Puedes usar cualquier tema de WordPress o cualquier constructor de páginas para mostrar la página de productos WooCommerce en el front-end de tu sitio web.
Además, no solo puedes desplegar el formulario de productos en el fronend, sino que puedes mostrar cualquier página del escritorio de WordPress en el frontend.
Esto te permite crear dashboards personalizados y aplicaciones web basadas en plugins de WordPress.
Para esto usaremos el plugin WP Frontend Admin.
Tú puedes probar el plugin premium en tu sitio web gratis por 7 días.
Luego de instalar y activar el plugin, sigue estos pasos:
1- Mostrar el formulario de añadir productos WooCommerce en el front-end
Ve a Productos > Añadir nuevo.
Ahora necesitas hacer clic en el botón Ver en el frontend que se encuentra en la barra de administración del dashboard de WordPress.
Opcionalmente, puedes usar cualquiera de estos constructores de páginas para crear tu página front end:
- Elementor
- Visual Composer
- Gutenberg
- Divi
- Beaver Builder
- WP Page Builder
- Page Builder by SiteOrigin
- Oxygen
- Live Composer
- Brizy
- Etc.
Solo necesitas usar este shortcode para mostrar el formulario de crear producto en el frontend:
[vg_display_admin_page page_url="post-new.php?post_type=product"]
Luego, haz clic en Previsualizar para mostrar el formulario de nuevo producto en el frontend.
2- Configurar el formulario de productos WooCommerce en el frontend
Usando el panel de configuración rápida de WP Frontend Admin, puedes elegir el título, la plantilla, el slug URL y el menú de navegación de la página.
Para ocultar los elementos innecesarios simplemente haz clic en Ocultar elemento y luego haz clic en los elementos que quieras ocultar.
Por ejemplo, si no quieres que los usuarios publiquen directamente los productos, podrías eliminar el botón de “Publicar” productos desde el frontend, y solo dejar el botón de “Guardar Borrador”.
Puedes marcar la casilla de verificación “Ocultar notificaciones añadidas por otros plugins o temas” para evitar que tus usuarios vean avisos de wp-admin cuando estén usando esta página en el frontend.
También puedes cambiar los textos en tus páginas frontend, haciendo clic en el botón Editar textos. Cuando termines de cambiarle el nombre a los botones o editar las etiquetas de los campos, haz clic en Edición terminada.
Una vez que hayas terminado de configurar la página, haz clic en Guardar para publicar la página.
4- Añadir productos desde el frontend
Una vez publicada la página, tus usuarios tendrán que iniciar sesión para ver la página de añadir nuevo producto WooCommerce desde el frontend.
Ahora puedes empezar a crear productos WooCommerce desde el frontend. Tus usuarios podrán publicar productos desde el frontend, sin necesidad de usar todo el dashboard de WordPress.
Tú puedes probar el plugin premium en tu sitio web gratis por 7 días.
Preguntas importantes
1- ¿Puedo usar otros plugins para crear aplicaciones web?
Sí. Puedes mostrar cualquier página de wp-admin en el frontend, y funciona con todos los plugins de WordPress.
2- ¿El plugin es compatible con los constructores de páginas?
Sí. Puedes usarlo con otros constructores de páginas como Elementor, Visual Composer, Gutenberg, Divi, Beaver Builder, WP Page Builder, Page Builder by SiteOrigin, Oxygen, Live Composer, Brizy, y muchos otros para crear grandes sitios.
3- ¿Qué pasa si no puedo ver esta página en el frontend después de iniciar sesión?
Si no puedes ver la página después de iniciar sesión, necesitas usar uno de estos roles:
- administrator
- author
- shop_manager
- shop_accountant
- shop_worker
- shop_vendor
En caso de que no quieras asignar uno de estos roles, puedes crear un nuevo rol de usuario con el plugin User Role Editor. Este nuevo rol de usuario necesita el permiso edit_products.