Un Intranet (ou un site privé) communautaire sur Internet avec Restricted Site Access et #BuddyPress

Publié le

par

Crédits Photo : Cambridge – Private by Daniel Enchev, on Flickr

Hello, si vous ne le savez pas encore, je travaille avec BuddyPress essentiellement pour des Intranets. Or comme je l’expliquais lors de ma conférence au BuddyCamp Brighton, alors qu’historiquement mon entreprise hébergeait ses sites Intranets sur un Intranet, les tendances actuelles (ex: consommation de l’information sur un mobile, cloud…) changent un peu cette histoire. Très prochainement, je vais devoir migrer un site communautaire jusqu’alors bien protégé des regards du tout public sur le World Wide Web !

Alors, il va falloir sérieusement le sécuriser (https – bien entendu) et surtout veiller à ce qu’il ne soit consulté que par les membres de mon entreprise. Or ni WordPress, ni BuddyPress ne fournissent en natif un mécanisme pour parvenir à cette restriction d’accès. D’ailleurs, selon moi, si WordPress souhaite se développer sur le secteur des Intranets, il devrait sérieusement s’intéresser à ce « use case » :).

Alors, il me semble qu’on peut, très simplement, rendre un site complètement privé en exigeant de l’utilisateur qu’il se connecte ou en entretenant une « white list » d’adresses IP. Au début j’ai pensé écrire quelques fonctions pour atteindre mon objectif et puis je suis tombé sur un plugin léger et très bien fait : Restricted Site Access.

Je l’ai téléchargé, activé, étudié et testé sur ma copie locale de l’intranet communautaire candidat à un hébergement Internet. Et je me suis aperçu qu’il faisait bien le job ! Alors je l’ai adopté. Très vite, je me suis dit : d’autres français peuvent être intéressés par ce dernier et il m’est apparu normal qu’étant donné que ce plugin n’était pas encore disponible dans notre fabuleuse langue de contribuer à sa traduction. Pour cela, comme mon ami Grégoire Noyelle vous l’explique ici : WordPress.org propose désormais un outil pour directement suggérer une traduction pour les plugins que l’équipe Polyglots modérera et validera. En plus l’équipe en question est super sympa et très réactive !

Pour vos procurer Restricted Site Access rapidement, vous pouvez utiliser l’interface d’ajout d’extensions de votre administration WordPress, vous l’identifierez très facilement, c’est le seul de son domaine dont la description est francisée !

La fiche descriptive de l’extension

Dés que vous l’aurez installé, WordPress vous proposera de récupérer la traduction de ce plugin à laquelle j’ai contribué.

L’automatisation de la mise à jour des traductions est vraiment top !

Le plugin propose différentes options pour vous aider à gérer l’accueil de vos visiteurs et éventuellement préciser les adresses ou plages d’IP qui n’auront pas besoin de s’authentifier pour accéder à votre site.

Personnalisez le comportement du plugin depuis Réglages > Lecture

Lorsqu’on utilise ce plugin sur une communauté BuddyPress, il se comportera de manière optimale pour tous les choix excepté « Leur afficher une page WordPress spécifique que vous avez créée ». En effet dans ce cas, vos pages BuddyPress seront visibles de tous. Du coup, ma deuxième contribution à ce plugin a consisté à proposer aux auteurs de Restricted Site Access un patch pour prévenir ce comportement.

Naissance du plugin BP Restricted Community

Bien entendu, ce plugin requiert BuddyPress ET Restricted Site Access 🙂

Et puis, j’ai eu besoin d’un comportement particulier pour ma communauté : autoriser l’inscription de nouveaux membres si ces derniers étaient des collaborateurs de mon entreprise. Et un bon moyen de s’en assurer est d’inspecter le domaine de l’adresse email utilisée lors de l’inscription. En gros si celle-ci est du type prenom.nom@nomentreprise.mail, alors j’autorise le visiteur à devenir membre.

Alors j’ai commencé par créer un fichier bp-custom.php pour utiliser un des filtres fournit par Restricted Site Access pour laisser s’afficher les pages d’inscription et d’activation de compte de BuddyPress. Pour information ces pages s’affichent dans le front-end du site. Or dans ce cas on voit pas mal d’éléments du site (sidebar, navigations, titres…) et ça je ne le souhaitais pas. Alors j’ai utilisé la BuddyPress Template Hierarchy pour rester dans l’ambiance de la page d’authentification de WordPress (site.url/wp-login.php). L’avantage de cette dernière est qu’aucun autre élément que le formulaire d’inscription n’est visible. Et c’est précisément à ce moment que j’ai su que le fichier bp-custom.php ne serait pas suffisant : j’avais besoin d’un plugin pour inclure mes templates particuliers et surcharger la BP Theme Compat API.

Depuis les réglages Multisite on peut lister les domaines d’email autorisés

Ensuite, je savais que je pouvais utiliser un réglage spécifique de WordPress pour limiter les domaines des emails pouvant permettre aux utilisateurs de s’inscrire. Toutefois, je me suis rendu compte que ce réglage n’était disponible que pour les configurations Multisite de WordPress ???

Mais on ne peut pas le faire depuis un WordPress classique ???

Alors je suis allé consulter le Trac du Core et suis tombé sur ce ticket déposé par mon ami Boone B. Gorges qui avait proposé une amélioration de la validation des emails. Comme mon besoin nécessite que ces fonctions de validation soient harmonisées quelque soit la configuration de WordPress, j’ai proposé un nouveau patch en ce sens en ajoutant la partie liée aux restrictions de domaines d’email.

En attendant, l’étude de ce ticket par la Core Team, j’ai intégré à mon plugin la possibilité de restreindre l’inscription à certains domaines d’email 🙂

Et hop! BP Restricted Community s’en chargera !

J’ai également dû intégrer une feuille de style spécifique ainsi qu’un soupçon de javascript pour que mon formulaire d’inscription s’intègre de manière optimale dans l’ambiance site.url/wp-login.php. Et tant que j’y étais, je me suis rappelé d’un échange avec mon ami Thierry Pigot au sujet d’une manière d’éviter les spams d’inscription. Du coup j’ai intégré un tel mécanisme : c’est plus sûr 🙂

Le formulaire d’inscription de mon site communautaire privé.

La touche finale! C’est alors que je me suis dit que la fonctionnalité WP Site Icon introduite lors de la version 4.3 de WordPress pourrait être mise à profit pour personnaliser un peu plus l’écran d’authentification de ma communauté en remplaçant notamment le logo de WordPress par celui du site de ma communauté. Pour mettre en place une icône de site, il suffit d’utiliser le customizer comme illustré ci-dessous.

Customizer : rubrique Identité du site

Il m’a suffit d’ajouter une taille d’icône qui matche avec celle utilisée par WordPress dans son écran d’authentification, d’inclure un style en ligne pour surcharger le css de cette partie et j’ai pu obtenir :

Tada !

Voilà! Il ne me reste plus qu’à vous proposer ce nouveau plugin, si toutefois vous partagez un besoin similaire au mien. A+

29 réponses à “Un Intranet (ou un site privé) communautaire sur Internet avec Restricted Site Access et #BuddyPress”

  1. Avatar de Steve
    Steve

    Merci beaucoup Imath pour ce use case tres instructif et clair.

  2. Avatar de Cédric

    Le besoin est assez spécifique et je ne l’ai pas encore rencontré moi-même, mais dans l’absolu ça peut carrément servir.
    Merci pour ce travail complet et partagé !

  3. Avatar de YesPapa
    YesPapa

    Encore une fois merci @imath ! En effet, cette fonction (un Intranet ou un site privé communautaire sur Internet) est aussi essentielle à mes yeux pour qui veut mettre en place des communautés.

    Moi, je l’aurais bien vu en natif sur BuddyPress avec la possibilité de l’activer ou pas (un peu comme ce que propose certaines solutions de réseaux sociaux d’entreprise).

    Encore merci pour le partage.

    1. Avatar de imath

      Merci pour ton commentaire @YesPapa. Moi je le verrais plutôt en natif dans WordPress comme je l’ai dit dans cet article. La raison est qu’on peut faire un Intranet sur Internet sans pour autant utiliser BuddyPress. Je ne suis pas certain que la volonté de rendre privé un site ne soit que réservé aux sites communautaires 😉

      1. Avatar de YesPapa
        YesPapa

        En effet, même un site Web classique sous wordpress peut avoir une application professionnelle avec une partie privée.

        Tu as surement raison. Il faut mieux que cette option soit incluse à wordpress.

  4. Avatar de Vincent

    Salut,

    Sinon tu as aussi la solution WP Customer Area qui a justement été conçue pour ce type de besoin : privatiser une partie du site, mettre à disposition du contenu privé de manière flexible (pour un utilisateur, plusieurs, etc.).

    WP Customer Area est sur le modèle du plugin de base gratuit auquel on peut ajouter des extensions payantes (16 actuellement : facturation, projets, listes de tâche, etc.). Tout a été fait pour que ce soit simple à mettre en place et 100% personnalisable pour les développeurs avec des centaines de « hooks ». Le tout est fabriqué avec amour en France, au pays basque (et maintenant en partie à Lyon).

    Je serais ravi de t’en parler un peu plus en détail si cela peut t’aider sur d’autres projets. Sinon le site possède déjà pas mal d’infos : http://wp-customerarea.fr

    a+

    1. Avatar de imath

      Merci pour ton commentaire. J’imagine que ce plugin est très élaboré et propose toute une panoplie de fonctionnalités. J’ai surtout recherché à expliquer comment j’ai répondu à un besoin simple: seuls les collaborateurs de l’entreprise pour laquelle je travaille peuvent accéder/s’inscrire à un site communautaire. De mon côté je n’ai pas besoin d’outil de facturation/gestion de projets, listes des tâches etc..)

  5. […] Un intranet communautaire sur interet avec Restricted site Access et BuddyPress – iMathieu […]

  6. Avatar de YesPapa
    YesPapa

    Bonsoir,

    Une petite précision : est ce que ce plugin est sensé sur tous les types de thème ? Je viens de le tester sur le thème que je travaille actuellement et j’ai toujours accès aux pages communautaires.

    Est ce normal ?

    Merci à toi.

    1. Avatar de imath

      Bonjour, selon mes tests de Restricted Access Site sur le thème de ce blog et Twentyfifteen tout fonctionne comme attendu avec BuddyPress sauf dans le cas où le choix de l’option « Afficher une page du site » est retenu. Dans ce cas tu auras besoin du plugin BP Restricted Community. En dehors de ce cas que j’ai expliqué dans l’article, vu comment le plugin est fait si ça ne fonctionne pas avec un thème ça me paraît très surprenant.

      1. Avatar de YesPapa
        YesPapa

        Salut,

        Je suis dans le cas où je veux que mes utilisateurs non connectés aillent seulement sur ma page d’accueil. J’ai bien activé Restricted Access Site et BP Restricted Community. Pour les pages classiques (de type simple ou de type events manager, idea stream), je suis bien re-dirigé vers la page d’accueil par contre pour les pages activités, membres et groupes, j’ai toujours accès au contenu. Je ne vois pas ce que j’ai loupé.

        Si tu as une idée alors je suis preneur.

        1. Avatar de YesPapa
          YesPapa

          Ok. J’ai trouvé. En fait dans mon cas les utilisateurs ne peuvent pas s’inscrire eux même. J’ai donc décocher la case « Anyone ca register ». Et dans ce cas là, les pages buddypress sont encore accessibles. Tu crois que c’est possible de les bloquer ?

          Merci à toi.

          1. Avatar de imath

            Mmm ça arrive lorsque Resticted Site Access + BP Restricted Community + l’inscription n’est pas autorisée si je comprends bien. En même temps, dans ce cas là je crois que le plus simple est de ne pas installer BP Restricted Community puisque son principal objectif est de permettre les inscriptions 🙂
            Mais je vais revérifier le plugin et le neutraliser si les inscriptions ne sont pas autorisées.

          2. Avatar de YesPapa
            YesPapa

            En effet, cela peut paraître bizarre. Dans mon cas, l’idée est de gérer une communauté avec seulement les inscriptions gérées du côté des administrateurs (sans laisser la main aux utilisateurs pour les demandes d’inscription) (pour faire encore plus la communauté et ne pas être trop pollué au quotidien par des demandes d’inscription non conformes).

            SI on peut bloquer les pages BP dans ce cas là, cela serait chouette. Comme cela, ça marche dans les deux cas.

            Merci encore de ton retour.

  7. Avatar de YesPapa
    YesPapa

    Pour info, j’avais fait un essai de créer un communauté privée en ajoutant aussi un plugin cachant certains menus pour les utilisateurs non connectés et un plugin de restriction d’accès au page pour ces mêmes utilisateurs.

    1. Avatar de imath

      @YesPapa

      Ce commit https://github.com/imath/bp-restricted-community/commit/ec459e9e2b8a2f18701d16f6e769b9965c5114f4 devrait résoudre ta difficulté avec Restricted Site Access si tu as choisis d’afficher une page spécifique aux visiteurs non autorisés. Actualise le plugin en faisant git pull ou en le re-téléchargeant.

      Comme je l’expliquai dans l’article les autres options ne posent pas de problèmes. Tu as rencontré cette difficulté car tu as désactivé les signups et jusqu’à présent mon plugin « corrigeait » la difficulté pour cette option que si les signups étaient activés (car c’était mon besoin).

  8. Avatar de YesPapa
    YesPapa

    Merci @iMath, le correctif marche bien. De cette manière tous les cas sont possibles maintenant. C’est génial.

    Encore merci de ce retour et de la prise en compte de ce cas.

  9. Avatar de Sitraka Andrinivo

    Je viens de (re)découvrir ton site et je tombe sur cet excellent article plein de ressources.
    Pour ma part, la solution que j’ai utilisé pour un cas (presque) similaire a été la mise en place d’un systeme basé sur Kerberos + un plugin fait-maison.
    Comme ça, on est sur qu’aucune personne exterieur ne voit des éléments du site.
    Si tu as des conseils ou des recommandations, je suis toujours preneur 🙂

  10. Avatar de Francoise
    Francoise

    Un petit commentaire pour remercier imath, ce plugin et juste génial.
    Dernier jour de l’année et me voila tranquille pour aller faire la fête 😉
    Génial et bravo

    1. Avatar de imath

      Merci Françoise, bonne fête 🙂

  11. […] Un Intranet (ou un site privé) communautaire sur Internet avec Restricted Site Access et #BuddyPres… […]

  12. Avatar de Grégoire Noyelle

    Hello Mathieu,
    J’avais bookmarké ton article mais je le lis en détail seulement aujourd’hui. Je risque d’avoir des projets très prochainement qui vont utilisés ton « cocktail ». Merci !

    1. Avatar de imath

      Salut Grégoire, super! A consommer sans modération 🙂

  13. Avatar de david
    david

    Bonjour Imath, comment te porte tu?
    Alors ayant mis en place un reseau social , quand je click sur un membre pour voir sa page , alors j ai accés à ces messages et ça c’est désagréable , que puise je faire?

    1. Avatar de imath

      Hello, ça va plutôt bien.

      Sinon, si en utilisant ce plugin tu parviens à afficher la page d’un membre sans être connecté au site, il y a un souci effectivement. Si tu es connecté, il est normal que tu accèdes à sa page. « Messages » de quoi s’agit-il ? Les messages privés ou le flux d’activités du membre en question ? Ensuite, n’oublies pas de tester avec un utilisateur classique si tu es l’administrateur de la communauté.

  14. Avatar de David
    David

    Ok’ merci math , alors c est les messages privés que j arrive à lire.

  15. Avatar de david
    david

    bonjour!merci Imath, effectivement le fait que je sois connecter en admin , me donnais ce privilége d’avoir accés aux messages et autres.Génial.
    tu ne donne pas de formation en la matiére sur buddypress et les plug?
    Suis partant.

    1. Avatar de imath

      yw. Voici qqchose que je ne fais pas effectivement, à méditer de mon côté 🙂

  16. Avatar de david

    slt math comment va la super forme! juste avoir une information sur ton plug Rendez vous, quand j essai de cliquer sur nouveau rendez vous ,rien ne se passe.peux tu m aider.merci