Aide pour statut de connexion user

WordPress :6.7
Statut : non résolu

Ce sujet contient 0 réponse, 1 participant et a été mis à jour pour la dernière fois par mumu87, le il y a 1 mois.

Affichage de 1 message (sur 1 au total)

Auteur

Messages
23 mai 2025 à 10 h 26 min #2489165
mumu87
Participant

Initié WordPress
34 contributions
Bonjour,

Ma configuration WP actuelle
- Version de PHP/MySQL :
- Thème utilisé :
- Extensions en place : Elementor
- Nom de l’hébergeur :
- Adresse du site :
Problème(s) rencontré(s) :

Bonjour

J’aimerais faire apparaitre sur l’image de l’utilisateur une petite « capsule » en fonction de sont statut de connexion. (comme image en PJ)

-J’ai récupérer le css de l’élément de l’image afin de la rendre arrondie et jusque là tout vas bien, j’ai insérer ceci :
```
.elementor-5732 .elementor-element.elementor-element-104080f img {
    position: relative;
    border-radius: 50%; /* Makes the image circular */
    overflow: hidden; /* Ensures the image fits within the border radius */
    
    display: flex; /* Center the image */
    justify-content: center; /* Center the image horizontally */
    align-items: center; /* Center the image vertically */
}
```
Ensuite pour ajouter la petite capsule de couleur en fonction du statut du connexion de l’user, en dessous j’ai ajouté ce code (mais qui ne fonctionne pas)
```
.elementor-5732 .elementor-element.elementor-element-104080f img .after  {
position: absolute;
  bottom: 14px;
  right: 14px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 2px solid white;
}

/* Statuts possibles */
.online {
  background-color: #4CAF50; /* Vert */
}

.offline {
  background-color: #9E9E9E; /* Gris */
}

.away {
  background-color: #FFC107; /* Jaune */
}

.busy {
  background-color: #F44336; /* Rouge */
}
```
Si quelqu’un pouvait m’aider, car j’ai pas du retranscrire correctement à la step 2, ce serais très gentil.

Vous en remerciant par avance.

Belle journée

Fichiers joints :
Vous devez être connecté pour voir les fichiers joints.
Auteur

Messages