Este es el quinto y último tutorial de una serie en la que te enseñamos cómo construir un bonito dashboard en el frontend para el plugin BuddyPress. Tus usuarios podrán ver y gestionar las páginas del plugin BuddyPress desde el frontend. De esta manera, podrán gestionar un sitio comunitario con BuddyPress sin tener que usar el wp-admin.
Aquí aprenderás a mostrar y gestionar los grupos de BuddyPress desde el frontend. Además, compartiremos un shortcode para añadir un botón de cerrar sesión en el menú del dashboard, y algunos enlaces para aprender a integrar este dashboard con WordPress Multisitio y WP Ultimo.
Para crear este dashboard para BuddyPress, necesitas tener el plugin BuddyPress instalado y activado en tu sitio de WordPress.
Además, necesitas instalar y activar el plugin WP Frontend Admin, que te permite mostrar cualquier página de wp-admin en el frontend para crear hermosos dashboards en el frontend y aplicaciones web basadas en cualquier plugin de WordPress.
Tú puedes probar el plugin premium en tu sitio web gratis por 7 días.
Una vez que instales y actives el plugin, tienes que seguir estos sencillos pasos para mostrar los grupos de BuddyPress en el frontend.
1- Muestra los Grupos de BuddyPress en el Frontend
Para mostrar la página de grupos de BuddyPress en el frontend, tienes al menos dos opciones.
En primer lugar, puedes mostrar la página de grupos de BuddyPress en el frontend con un solo clic:
- Ve a Grupos en wp-admin.
- Haz clic en Ver en el frontend en la barra superior de wp-admin.
La segunda opción es mostrar los grupos de BuddyPress en el frontend usando cualquier constructor de páginas de WordPress. Aquí hay algunos ejemplos:
- Elementor
- Visual Composer
- Gutenberg
- Divi
- Beaver Builder
- WP Page Builder
- Page Builder by SiteOrigin
- Oxygen
- Live Composer
- Brizy
- Etc.
Usa este shortcode para mostrar los grupos de BuddyPress en el frontend:
[vg_display_admin_page page_url="admin.php?page=bp-groups"]
Una vez que ingreses el shortcode en la página, puedes hacer clic en Vista Previa porque WP Frontend Admin solo muestra el contenido de wp-admin en modo Vista Previa, no en modo edición.
2- Selecciona la Información Básica de la Página de Grupos en el Frontend
Puedes usar el panel de opciones rápidas que aparecerá en la parte izquierda de la pantalla para configurar tu página de grupos de BuddyPress en el frontend.
Puedes empezar seleccionando esta información básica:
Título de página: Llamaremos a esta página “Grupos”.
URL slug: Pondremos “grupos-press”.
Plantilla: Seleccionaremos la plantilla Por defecto para usar la configuración de apariencia de nuestro tema.
Añadir a menú: Podemos seleccionar el menú del dashboard que estamos creando.
3- Simplifica la Página Ocultando Elementos Innecesarios
WP Frontend Admin te permite incluir los elementos esenciales solo en tus páginas en el frontend. En este caso, puedes simplificar la página de grupos de BuddyPress en el frontend ocultando cualquier elemento innecesario de la página:
- Haz clic en Ocultar elemento.
- Oculta cualquier elemento que quieras.
- Repite estos pasos con cada elemento que quieras ocultar de esta página en el frontend.
También puedes marcar la casilla Ocultar notificaciones añadidas por otros plugins o temas para evitar que los usuarios vean las notificaciones de wp-admin cuando gestionen los grupos de BuddyPress desde el frontend.
4- Edita Cualquier Texto de la Página de Grupos
Además de ocultar cualquier elemento innecesario, puedes editar cualquier texto en tus páginas de wp-admin en el frontend para hacer los textos más claros o más cortos, o para eliminar cualquier referencia a los nombres de los plugins:
- Haz clic en Editar textos.
- Cambia los textos que quieras editar.
- Haz clic en Edición terminada.
Una vez que hayas aplicado estos cambios a la página de la lista de grupos, puedes hacer clic en Guardar en el panel de Opciones Rápidas para publicar tu página.
5- Personaliza el Formulario de Edición de Grupos
Puedes hacer clic en el botón Añadir nuevo o abrir un grupo existente para personalizar el formulario de edición de grupos en el frontend.
Solo tienes que ocultar los elementos innecesarios o cambiar los textos que quieras.
Una vez configurada y publicada tu página, este es el aspecto que tendrá la lista de grupos:
Además, este es el aspecto que tendrá el formulario de edición de grupos en el frontend:
6- Permitir que Cualquier Rol de Usuario Gestione los Grupos desde el Frontend
Es importante tener en cuenta que solo los usuarios con el permiso bp_moderate podrán gestionar los grupos de BuddyPress desde el frontend.
Puedes seguir este tutorial para aprender a asignar ese permiso a cualquier rol de usuario con el plugin User Role Editor.
7- Añadir botón de “Cerrar sesión” en el menú del dashboard
Puedes añadir fácilmente un botón de cerrar sesión al dashboard de BuddyPress para que tus usuarios no necesiten nada del Escritorio normal de wp-admin.
Estos son los pasos que debes seguir:
- Ve a Apariencia > Menús.
- Edita el menú del Dashboard.
- Ve a Enlaces personalizados.
- Añade un enlace personalizado e ingresa este shortcode como URL: [vg_display_logout_url]
- En el texto del enlace puedes ingresar algo como “Cerrar sesión”.
- Guarda los cambios en el menú.
BONO: Aprende a integrar WP Frontend Admin con WordPress Multisitio y WP Ultimo
Puedes usar WP Frontend Admin para crear plataformas multisitio donde los usuarios puedan crear sitios web comunitarios usando BuddyPress. Aquí hay un tutorial sobre cómo integrar WP Frontend Admin con WordPress Multisitio.
Además, puedes monetizar tu Red Multisitio usando el plugin WP Ultimo, que te permite vender membresías en tu Red Multisitio. Aquí hay un tutorial donde puedes aprender a integrar WP Frontend Admin con WP Ultimo.
Hemos creado un curso gratuito de WP Ultimo para enseñarte cómo crear una plataforma multisitio para vender tiendas online. Puedes usar las lecciones del curso y adaptar la plataforma a BuddyPress. Puedes realizar el curso gratuito aquí.
Tú puedes probar el plugin premium en tu sitio web gratis por 7 días.