Saltar al contenido

BuddyPress – Tutorial paso a paso

01/05/2021

Hace unos días, WordCamp me dio la oportunidad de hablar sobre mi plugin de WordPress favorito: BuddyPress. Durante mi conferencia , les presenté a nivel mundial este poderoso motor de comunidades.

Sin embargo, WordCamp también es una reunión comunitaria, y estoy feliz de haber conocido a Fabrice ( Studio Ideas WordPress ) con quien hablé mucho durante estos 2 días dedicados a los amantes de WordPress.

En particular, sugirió que publique «tutoriales» en su sitio, y es para mí la oportunidad de tomarme el tiempo para entrar en más detalles sobre BuddyPress de una manera muy operativa.

Por eso te ofrezco una serie de artículos para descubrir BuddyPress en modo tutorial paso a paso . De hecho, más que un plugin, es un conjunto de componentes modulares. Por lo tanto, es muy posible activar solo algunos de ellos para satisfacer nuestras necesidades.

 

En este primer episodio, comenzaremos creando un directorio de miembros para nuestro sitio …

@iMath

 

Episodio 1: Configurar un directorio de miembros

WordPress listo para usar

Un pequeño recordatorio de lo que nos ofrece WordPress para organizar a los miembros de nuestro blog:



WordPress permite al administrador del blog enumerar sus diversos suscriptores desde la interfaz de administración de usuarios.
También les ofrece la posibilidad de ingresar cierta cantidad de información y administrar sus elementos de conexión usando una página de perfil dentro del área de administración de WordPress.



Esto supone, por tanto, dirigir al usuario en el área de administración y, sobre todo, no le es posible enumerar el resto de miembros del blog.
Por tanto, veremos cómo BuddyPress te permite mantener estas diferentes operaciones de personalización de perfiles dentro de la portada de tu blog y darles la posibilidad de descubrir las diferentes personas que como él se han suscrito a tu blog. ¡Pero para eso, tienes que instalar BuddyPress!

 

Personaliza tu instalación de BuddyPress

Encontrará muchos tutoriales sobre la cuestión en Internet, en particular el sitio bp-fr.net que ofrece una guía de instalación completa y consejos para maximizar el éxito de este. Por tanto, abordaré este tema muy rápidamente.



De la interfaz para agregar plugins, traigo mis plugins favoritos, me encanta esta nueva característica que WordPress ha introducido recientemente.
Como se muestra en la captura de pantalla, nos centraremos en las funciones de extensión de perfil de BuddyPress en el resto de este tutorial. Una vez descargado en mi directorio de plugins, lo activo. Un primer mensaje me invita a iniciar el «Asistente de instalación».



Lo que me hace pensar que ya podemos personalizar
BuddyPress integrando la traducción al francés de este plugin. Eso es bueno, es mantenido por bp-fr.net y se puede descargar de su guía de instalación que explica cómo configurarlo para nuestro blog. Al final del procedimiento, debería tener el siguiente resultado:

Los archivos buddypress-fr_FR.mo y buddypress-fr_FR.po deben colocarse en el directorio bp-languages ​​del plugin. Continuemos con nuestra instalación para llegar a la etapa “crucial”, la de elegir los componentes a activar.



Para configurar mi directorio de miembros, solo necesito los módulos «Perfiles extendidos» e «Información de cuenta», así que desmarco todos los demás.
Una vez que se valida esta elección, dejo que
BuddyPress cree las páginas que necesita para funcionar de acuerdo con mis preferencias. Podría modificar sus títulos y slugs en cualquier momento ya que son páginas de WordPress (editables desde el área de administración de páginas).

 

Le ahorraré los últimos pasos y le invito a consultar la guía de instalación si tiene alguna duda durante estos. Para ahorrar tiempo, opto por el tema proporcionado por BuddyPress que contiene todas las plantillas y etiquetas necesarias para mostrar mi directorio de miembros.

 

Descripción general de nuestro directorio de miembros

Tada! Todo ya está en su lugar. Mi blog tiene una página que enumera los registrantes de mi sitio en la parte frontal. Una lista desplegable me permite filtrar este directorio para mostrar los miembros según su fecha de registro o en orden alfabético. También hay un motor de búsqueda a mi disposición. Fresco;)

 

Lo que es menos genial es que dos de mis miembros no tienen un gravatar. Sin embargo, BuddyPress incorpora administración de avatar interna, por lo que pueden usarla para personalizar su foto de perfil.

 

Otro beneficio vinculado a la activación del componente «Información de la cuenta» es que el usuario puede administrar sus elementos de conexión directamente desde su página de perfil, haciendo clic en la navegación «Configuración». En particular, puede cambiar su contraseña, su dirección de correo electrónico o incluso eliminar su cuenta.

Aquí betatest1 ha personalizado su avatar, personalmente me parece muy bonito 🙂

Si vamos en este punto del juego a la pestaña del perfil del miembro, la información será muy breve, en este caso solo se mostrará el nombre para mostrar del usuario. Es hora de enriquecer todo esto con nuestro componente «Perfiles extendidos».

 

Unido, dime quien eres?

Para configurar nuevos campos de perfil, el administrador del blog va a la interfaz de administración de usuarios desde su administración de WordPress. Al hacer clic en «Config. perfiles ”, accede a la interfaz de edición de campos de perfil de usuario. Lo primero que haremos será cambiar el nombre predeterminado del primer grupo de campos de perfil a «Información personal».

De hecho, es posible definir diferentes secciones de perfil sabiendo que la que ingresó “(Inicial)” se mostrará por defecto y se solicitará al registrar nuevos miembros. Volveremos a este último punto más adelante.

Una vez que hayamos editado nuestra sección de campos de perfil inicial, agregaremos un campo para que nuestros miembros indiquen la empresa para la que trabajan. Esto implica hacer clic en el botón «Agregar un nuevo campo».

Podemos especificar el título del campo, agregarle una posible descripción para explicar el tipo de datos que esperamos, luego elegir que este campo sea obligatorio, para personalizar su apariencia (en este ejemplo mantengo un campo de texto clásico); también podemos definir la visibilidad predeterminada de la información ingresada limitándola a miembros autenticados, por ejemplo; finalmente el último cartucho nos permite forzar esta visibilidad por defecto o dejar la elección a los miembros de personalizarla. Todo lo que tenemos que hacer es «Guardar» nuestro nuevo campo de perfil.

También puede agregar nuevas secciones de perfil haciendo clic en el enlace «Agregar una nueva sección de campo» que se encuentra justo al lado del título de la «Config. perfiles ”. Por diversión, creé una sección «Redes» como se muestra a continuación:

 

Si ahora, vamos a la parte frontal de la interfaz disponible para que los usuarios editen su perfil, nos encontramos con nuestra sección “Información personal” con el campo “Empresa” que se muestra por defecto y un botón nos permite mostrar las “Redes”. sección.

Por diversión, de regreso en la administración de WordPress, agrego una nueva sección que llamo Studio Ideas y que contendrá una pregunta sobre la utilidad que el miembro percibe de este fabuloso sitio;)

Esto nos permite ilustrar la configuración de un campo tipo «radio» y ver cómo se mostrará en el área de edición del perfil del miembro. Para este campo, también forcé su visibilidad a “Todos”, lo que explica que el miembro no puede modificarlo. Ahora vamos a mostrar la página de perfil público del miembro de “Studio Ideas” para ver el resultado final una vez que los campos estén completos.

 

Al no ser usuario de Studio Ideas, solo veo su página de perfil público. Solo Studio Ideas y el administrador del blog tienen acceso a las páginas de configuración de la cuenta y edición del perfil.

Ha notado los enlaces en los valores de campo. Aquí hay una característica interesante que nos permite buscar en el directorio de miembros para averiguar quién encuentra Studio Ideas «Muy útil», por ejemplo.

Gestionar nuevos registros

Sin embargo, si desde la configuración general de su blog permite el registro de nuevos miembros, BuddyPress mostrará el formulario de registro y gestionará este proceso asegurando la existencia del nuevo suscriptor. 

 

Para ello, utiliza un mecanismo de activación de cuenta. Después de enviar el formulario de registro, se envía un correo electrónico de activación a la dirección de correo electrónico proporcionada.

 

Una vez que el miembro haya hecho clic en este enlace, su cuenta será validada. En cuanto a los campos solicitados en este formulario, están los que por supuesto son imprescindibles (correo electrónico, login, contraseña), y la sección de perfil tecleada “(Inicial)” como mencionamos en nuestro capítulo anterior.

 

Fin de la primera parte

Listo ! Gracias a BuddyPress , ofrecemos a nuestros suscriptores áreas dedicadas dentro de nuestro blog que les permiten decir un poco más sobre sí mismos. También pueden buscar en el directorio para ver a otros usuarios en su sitio.

Finalmente, también es posible que conozcan a aquellos con quienes tienen puntos en común y por qué no convertirse en “Amigos”.

Siguiente episodio : El directorio de miembros evoluciona, enlazando y enviando mensajes privados .

 

Sobre el autor iMath : Amante de WordPress y BuddyPress desde 2010, me divierto creando plugins para estas dos fabulosas herramientas. Puedes encontrarme en mi sitio iMathi.eu , en Twitter o Google+ .