En esta lección, vamos a comenzar a crear un frontend dashboard en WordPress, desde el que los usuarios de tu plataforma gestionarán sus sitios de restaurantes.

En lugar de acceder al escritorio normal de wp-admin, los usuarios podrán acceder a una interfaz de usuario que puedes diseñar como prefieras. Solo los super-administradores podrán acceder al dashboard backend de wp-admin. Los demás serán automáticamente redirigidos al frontend dashboard.

Con WP Frontend Admin puedes mostrar cualquier página de wp-admin en el frontend, para crear hermosos dashboards y aplicaciones web usando plugins tras bambalinas.

1- Apariencia global del frontend dashboard

WP Frontend Admin te permite seleccionar algunos aspectos generales de la apariencia de tus páginas de administración cuando se ven en el frontend. Por ejemplo, puedes seleccionar la animación de carga de las páginas y asignarle un color específico.

También puedes seleccionar un esquema de colores que hará que el contenido de wp-admin se vea más limpio y elegante en el frontend.

Ve a Administrador de la red > Frontend Admin > Ajustes > Apariencia.

Selecciona los siguientes valores:

  • Ocultar la barra de administración en el frontend: Sí. Esta opción ocultará la barra superior de wp-admin cuando los usuarios vean las páginas en el frontend.
  • Estilo de animación de carga: Selecciona el que quieras. Nosotros usaremos Chase.

wp frontend dashboard ajustes de apariencia

  • Color de animación de carga: Selecciona el color que quieras. Nosotros seleccionaremos el negro.
  • Aspecto Limpio Admin: Color primario del contenido admin: Elige el color que quieras. Nosotros seleccionaremos el negro.
  • Haz clic en Guardar.

wp frontend admin apariencia frontend dashboard

2- Plantilla para crear un frontend dashboard con WordPress

Aunque puedes construir tu dashboard o escitorio frontend usando cualquier tema o constructor de páginas, en este curso usaremos una plantilla de Elementor que hará que tu dashboard se vea hermoso.

Tenemos una galería de hermosas plantillas de dashboard frontend que puedes descargar e importar usando Elementor.

En este caso, usaremos la Plantilla 18 de nuestra galería.

Estas plantillas han sido diseñadas usando los siguientes plugins:

  • Elementor
  • Elementor Header & Footer Builder

Ambos plugins deben estar activos para toda la red para que todo funcione correctamente.

Algunas de nuestras plantillas requieren que algunos elementos sean configurados antes de todo.

Por ejemplo, el menú de navegación del dashboard necesita ser creado de primero, para que la plantilla reconozca que hay menús de navegación que puedes seleccionar en Elementor.

Empieza por crear un nuevo menú de navegación al que se añadirán las páginas del dashboard a medida que se vayan creando.

WP Ultimo 1.x

Si estás utilizando WP Ultimo 1.x, ve a Sitios > Todos los sitios, y haz clic en Escritorio en el sitio que has creado para el dashboard global.

abrir sitio del frontend dashboard wordpress

WP Ultimo 2.x

Si estás utilizando WP Ultimo 2.x, ve a Administrador de la Red > WP Ultimo > Sitios, y abre el escritorio del sitio que has designado para el escritorio de administración global.

abrir sitio del frontend dashboard wordpress

Ahora ve a Apariencia > Menús y crea un nuevo menú.

wordpress crear un menu de navegacion

Ya estás listo para empezar a construir tu dashboard para gestionar restaurantes.

Puedes seguir estos pasos para importar y configurar la plantilla de Elementor:

Paso 1 – Ve a Plantillas y haz clic en Importar plantillas.

Paso 2 – Elige la plantilla de tu computadora y haz clic en Importar ahora.

Paso 3 – Haz clic en Editar con Elementor para abrir la plantilla con el Editor de Elementor.

Paso 4 – Una vez que la plantilla se abra con Elementor, selecciona el logotipo del dashboard, puedes subirlo como una imagen personalizada.

crear frontend dashboard en wordpress

Paso 5 – Abre la configuración del elemento Menú y elige el menú que has creado anteriormente.

Paso 6 – Haz clic en Actualizar para guardar los cambios en esta plantilla.

crear frontend dashboard en wordpress

Ahora que has configurado los aspectos básicos de la apariencia global de tu frontend dashboard y la plantilla que usarás, estás listo para importar la plantilla en cada página del dashboard que crearemos en futuras lecciones.

CONSEJO

Si tienes una licencia premium de WP Frontend Admin, puedes descargar la copia de seguridad completa de nuestra plataforma de restaurantes para que puedas importarla en tu red, y todo lo que se muestra en este curso ya estará configurado para ti. Te ahorrará mucho tiempo.

Nota. Necesitas WP Ultimo 2.X.

Close