En esta sección, te mostraremos cómo mostrar los informes de WooCommerce en el frontend.
Lo haremos con el plugin WP Frontend Admin.
We’ll include the WooCommerce reports page first on the dashboard because we want the users of our online store platform to see their store’s sales reports when they log-in to our front-end dashboard.
Incluiremos la página de informes de WooCommerce en primer lugar en el panel de control porque queremos que los usuarios de nuestra plataforma de tienda online vean los informes de ventas de su tienda cuando se conecten a nuestro dashboard frontend.
1- ABRIR EL WP-ADMIN DEL SITIO DEL DASHBOARD
Todas las páginas de dashboard frontend de mandos se crearán en el sitio del dashboard.
- Ir a Administrador de la red > Sitios.
- Abrir el sitio del dashboard
2- CREA UNA NUEVA PÁGINA PARA MOSTRAR LOS INFORMES DE WOOCOMMERCE EN EL FRONTEND
Una vez que estés usando el wp-admin del sitio del dashboard, ve a Páginas y crea una nueva página haciendo clic en Añadir Nueva.
Para mostrar los informes de ventas de WooCommerce en el dashboard frontend, introduce el título de la página y, a continuación, utiliza el siguiente código corto en el contenido de la página.
[vg_display_admin_page page_url="admin.php?page=wc-reports"]
Haz clic en Vista previa para editar la página en el frontend.
3- EDITA LA CONFIGURACIÓN DEL TEMA TEMPORALMENTE
WP Frontend Admin muestra el panel de configuración rápida en el lado izquierdo de la pantalla, pero el menú de cabecera izquierdo de OceanWP lo cubre.
Therefore, you need to move the header from the left to the right side so that we can see the WP Frontend Admin’s Quick Settings panel. This is a temporary change that will be reverted later on in this course.
Por lo tanto, es necesario mover la cabecera de la izquierda a la derecha para que podamos ver el panel de configuración rápida del WP Frontend Admin. Este es un cambio temporal que será revertido más adelante en este curso.
- Abre el wp-admin del sitio del dashboard en otra pestaña
- Ir a wp-admin > Apariencia > Personalizar.
- Ir a Cabecera > General.
- Scroll down and select Position: Right.
- Desplázate hacia abajo y selecciona Posición: Derecha.
- Haz clic en Publicar para aplicar este cambio temporal.
4- CONFIGURE THE PAGE WITH WP FRONTEND ADMIN
Once you move the header menu and reload the reports front-end page, you’ll see the Quick Settings panel from WP Frontend Admin to configure the page.
Una vez que mueva el menú de la cabecera y recargue la página del frontend de informes, verás el panel de configuración rápida desde el WP Frontend Admin para configurar la página.
Estas son las opciones que verás en el panel de configuración rápida:
- Título de página: Introduce el título de la página en este campo.
- URL Slug: Introduce el slug de la página en esta página
- Plantilla: Por defecto
- Añadir a este menú: Selecciona el Dashboard Menú
Después de seleccionar el título de la página, el slug, la plantilla y el menú, hay que ocultar los elementos innecesarios. Esto es realmente útil para simplificar las páginas de administración para mostrar los elementos que los usuarios realmente necesitan y ocultar los que no son esenciales.
Para ocultar elementos innecesarios:
- Haz clic en Ocultar elemento.
- Haz clic en el elemento que desea ocultar, repita la operación para cada elemento
- Es opcional. Si por alguna razón oculta algún elemento que no quería ocultar, puede revertir los cambios haciendo clic en Mostrar todos los elementos debajo del botón Ocultar elemento.
Esta es una función muy útil para simplificar fácilmente cualquier página, formulario o función para sus usuarios.
Después de ocultar todos los elementos innecesarios, puedes editar los textos de la página de administración.
¿WP Frontend Admin proporciona este editor donde puedes cambiar cualquier texto en vivo. Esto es genial porque puedes añadir explicaciones para tus usuarios, cambiar los textos de los campos de entrada, eliminar el branding de otros plugins en directo, cambiar las referencias a WooCommerce con tu propia marca, etc:
- Haz clic en Editar textos.
- Change the texts you want. Editable texts are highlighted in yellow.
- Cambie los textos que quieras. Los textos editables están resaltados en amarillo.
- Haz clic en Edición terminada
También verás estos campos:
- ¿Ocultar notificaciones añadidas por otros plugins o temas?: Puedes marcar esta casilla para que los usuarios no vean las notificaciones de los plugins o temas en tu dashboard.
- Planes de WP Ultimo requeridos: Puedes seleccionar los planes para los que la página estará disponible. Esto es útil si quieres restringir una página/característica del dashboard a un plan específico.
- Los usuarios deberían ver solo los posts creados por ellos: Por ejemplo, cuando se crean páginas de publicaciones o productos, se pueden mostrar automáticamente solo las publicaciones o productos creados por los usuarios actuales.
Por último, haz clic en Guardar para publicar la página de informes de ventas.
5- OPCIONAL. ESTABLECER LA PÁGINA DE INFORMES COMO PÁGINA DE INICIO PARA EL DASHBOARD FRONT-END
Una vez publicada la página, puedes establecerla como página de inicio, para que los usuarios vean los informes de primero cuando se conecten a tu dashboard. De este modo, siempre estarán al día sobre sus ventas, existencias, etc.
- Ir a Apariencia > Personalizar > Ajustes de la página de inicio
- Tu página de inicio muestra: Una página estática
- Página de inicio: Reportes
- Haz clic en Publicar.
AHORA HAS MOSTRADO LOS INFORMES DE WOOCOMMERCE EN EL FRONTEND
This is how you can configure the WooCommerce sales reports page to display it as a homepage on the front-end dashboard of your online store platform.
Así es como puedes configurar la página de informes de ventas de WooCommerce para que se muestre como página de inicio en el dashboard frontend de la plataforma de tu tienda online.
Así es como se verá la página en el dashboard cuando los usuarios accedan a sus propios sitios:
