Avatars ronds sur le profil, la toolbar et les mps | Phpbb2

2 participants

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Avatars ronds sur le profil, la toolbar et les mps | Phpbb2

Message par Mat Mar 2 Jan 2018 - 21:28

Bonjour Clin d'oeil,

Je voudrais avoir sur mon forum les avatars ronds, j'ai déjà placé un code pour les avoir ronds sur la page d'accueil et sur les catégories ^^


Mais je voudrais aussi les avoir sur les profils (profil simple), sur les mps et sur l'avatar dans la toolbar (voir capture) :
Avatars ronds sur le profil, la toolbar et les mps | Phpbb2 Captur16

Merci d'avance et bonne année à tous Visage souriant!
Mat

Mat
Membre habitué

Masculin
Messages : 1562
Inscrit(e) le : 05/09/2015

http://www.dixily.fr
Mat a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Avatars ronds sur le profil, la toolbar et les mps | Phpbb2

Message par _Ayno Mar 2 Jan 2018 - 23:24

Bonjour,

essayez d'ajouter le même code sur la balise :
Code:
#fa_usermenu img {
}
_Ayno

_Ayno
***

Messages : 127
Inscrit(e) le : 29/10/2017

http://second-monde.probb.fr
_Ayno a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avatars ronds sur le profil, la toolbar et les mps | Phpbb2

Message par Mat Mer 3 Jan 2018 - 10:28

Merci Visage souriant
Ça fonctionne pour l'avatar du menu Visage souriant!
Plus que sur les profils (profil simple) et sur les mps Clin d'oeil!
Mat

Mat
Membre habitué

Masculin
Messages : 1562
Inscrit(e) le : 05/09/2015

http://www.dixily.fr
Mat a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Avatars ronds sur le profil, la toolbar et les mps | Phpbb2

Message par _Ayno Mer 3 Jan 2018 - 22:13

Re,

voilà pour les mp normalement
Code:
.postprofile dt > a:first-child > img, .postprofile dt > img:first-child
_Ayno

_Ayno
***

Messages : 127
Inscrit(e) le : 29/10/2017

http://second-monde.probb.fr
_Ayno a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avatars ronds sur le profil, la toolbar et les mps | Phpbb2

Message par Mat Mer 3 Jan 2018 - 23:17

Parfait merci ^^
Et ça donne quoi le CSS complet pour les mps Visage souriant?
J'arrive pas à le faire fonctionner Visage souriant
Mat

Mat
Membre habitué

Masculin
Messages : 1562
Inscrit(e) le : 05/09/2015

http://www.dixily.fr
Mat a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Avatars ronds sur le profil, la toolbar et les mps | Phpbb2

Message par _Ayno Mer 3 Jan 2018 - 23:40

Re,
Code:
.postprofile dt > a:first-child > img, .postprofile dt > img:first-child {
  border-radius: 100px; /*Coins arrondis*/
    object-fit: cover; /*non déformation de l'image*/
    width: 100px; /*redimensionnement pour uniformisation*/
    max-height: 100px; /*hauteur max*/
    border-style: solid; /*bord*/
    border-color: #FFFFFF; /*couleur du bord*/
    padding: 2px; /*écartement du bord à l'image*/
    border: 2px; /*taille du bord*/
  }

attention les coins arrondis doivent être lié par la même valeur pour faire un avatar rond
_Ayno

_Ayno
***

Messages : 127
Inscrit(e) le : 29/10/2017

http://second-monde.probb.fr
_Ayno a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avatars ronds sur le profil, la toolbar et les mps | Phpbb2

Message par Mat Jeu 4 Jan 2018 - 13:29

Merci, mais ça ne fonctionne pas ^^
Mat

Mat
Membre habitué

Masculin
Messages : 1562
Inscrit(e) le : 05/09/2015

http://www.dixily.fr
Mat a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Avatars ronds sur le profil, la toolbar et les mps | Phpbb2

Message par _Ayno Jeu 4 Jan 2018 - 13:53

c'est bien ce résultat là que vous cherchez?
Avatars ronds sur le profil, la toolbar et les mps | Phpbb2 Captur19
_Ayno

_Ayno
***

Messages : 127
Inscrit(e) le : 29/10/2017

http://second-monde.probb.fr
_Ayno a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avatars ronds sur le profil, la toolbar et les mps | Phpbb2

Message par Mat Jeu 4 Jan 2018 - 13:59

Pas tout à fait, je veux juste avoir les avatars ronds sans cadre ^^
Donc juste un :
Code:
border-radius: 150px;

Mais je n'arrive pas à trouver l'ID des images Visage souriant!
Mat

Mat
Membre habitué

Masculin
Messages : 1562
Inscrit(e) le : 05/09/2015

http://www.dixily.fr
Mat a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avatars ronds sur le profil, la toolbar et les mps | Phpbb2

Message par _Ayno Jeu 4 Jan 2018 - 14:27

Bonjour,
sur mon phpbb3 cette balise fonctionne parfaitement :
Code:
.postprofile dt > a:first-child > img, .postprofile dt > img:first-child {
 border-radius: 150px;
 width: 150px;
 height: 150px;
 object-fit: cover;
}
_Ayno

_Ayno
***

Messages : 127
Inscrit(e) le : 29/10/2017

http://second-monde.probb.fr
_Ayno a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avatars ronds sur le profil, la toolbar et les mps | Phpbb2

Message par Mat Jeu 4 Jan 2018 - 15:20

Ah oui, mais je ne suis pas sur PhpBB 3 Visage souriant!
Mat

Mat
Membre habitué

Masculin
Messages : 1562
Inscrit(e) le : 05/09/2015

http://www.dixily.fr
Mat a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avatars ronds sur le profil, la toolbar et les mps | Phpbb2

Message par Mat Ven 5 Jan 2018 - 16:20

Et un up Wink
Mat

Mat
Membre habitué

Masculin
Messages : 1562
Inscrit(e) le : 05/09/2015

http://www.dixily.fr
Mat a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avatars ronds sur le profil, la toolbar et les mps | Phpbb2

Message par _Ayno Ven 5 Jan 2018 - 19:19

Re,

avec google chrome ou firefox; faites clique droit sur l'image dans le profil -> inspecter et voyez la balise utilisée.
_Ayno

_Ayno
***

Messages : 127
Inscrit(e) le : 29/10/2017

http://second-monde.probb.fr
_Ayno a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avatars ronds sur le profil, la toolbar et les mps | Phpbb2

Message par Mat Dim 7 Jan 2018 - 15:03

Oui, mais ils n'ont pas d'ID Visage souriant
Mat

Mat
Membre habitué

Masculin
Messages : 1562
Inscrit(e) le : 05/09/2015

http://www.dixily.fr
Mat a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avatars ronds sur le profil, la toolbar et les mps | Phpbb2

Message par _Ayno Dim 7 Jan 2018 - 22:39

Re ,

sur ton phpbb2 une balise row1 existe, il suffirait donc de faire :
Code:
.row1 img { /* donc code */}

mais cette balise est certainement à 90% sûr utilisée ailleurs.

Autre solution ;

il faut se rendre dans template > Poster & Messages privés > affichage d'un message privé (en bas)

repérer la ligne {AVATAR_FROM}, entourer cette variable d'une balise
exemple :
Code:
<div class="avatarmp" {avatar_from} </div>

puis lui affecter les propriétés css souhaitées.

Je pense que cela fonctionne mais aucune certitude.
_Ayno

_Ayno
***

Messages : 127
Inscrit(e) le : 29/10/2017

http://second-monde.probb.fr
_Ayno a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avatars ronds sur le profil, la toolbar et les mps | Phpbb2

Message par Invité Jeu 11 Jan 2018 - 16:44

Hello Mat et_Ayno ,

pour les MPS ceci devrait fonctionner:
Code:

form[action^="/privmsg?folder"] img[alt="avatar"]
{
 border-radius: 150px;
 width: 150px;
 height: 150px;
}

_Ayno ,
Il faut prendre en compte que la variable n'est pas prise en compte dans la revue, donc comme la version phpbb2 nous aide bien grâce au alt de l'avatar, on ne va pas s'en priver Wink .

Mat,


Modules/HTML&JAVASCRIPT/Gestion des codes Javascript/Créer un nouveau Javascript

Mettre un titre explicite.

Cocher sur toutes les pages.

Déposes ceci:
Code:

$(function(){
$('form[action^="/privmsg?folder"]').find(' img[alt="avatar"]').wrap('<div class="M14_avatar"></div>');
});

Penses à cliquer sur le bouton VALIDER

Dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style

Ajoutes ceci:

Code:

div.M14_avatar{background-color:grey;}


Penses à cliquer sur le bouton Avatars ronds sur le profil, la toolbar et les mps | Phpbb2 3060548200


Et voilou, il ne reste plus que les réglages a mettre en œuvre Wink .

a++
Anonymous

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avatars ronds sur le profil, la toolbar et les mps | Phpbb2

Message par Mat Ven 12 Jan 2018 - 19:49

Bonsoir Visage souriant
Ça marche merci Visage souriant
Et pour les profils (profil simple) je n'y arrive pas  Visage neutre
Et je n'ai pas besoin de fond gris.
Merci d'avance Clin d'oeil
Mat

Mat
Membre habitué

Masculin
Messages : 1562
Inscrit(e) le : 05/09/2015

http://www.dixily.fr
Mat a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avatars ronds sur le profil, la toolbar et les mps | Phpbb2

Message par Invité Sam 13 Jan 2018 - 6:49

Hello Mat,
tu peux ajouter juste après le script donné celui-ci:
Code:

if(/^\/u/.test(location.pathname))
{
$(function(){
$(' img[alt="avatar"]').wrap('<div class="M14_avatar"></div>');
});
}


Ce qui donne:


Code:
 
$(function(){
$('form[action^="/privmsg?folder"]').find(' img[alt="avatar"]').wrap('<div class="M14_avatar"></div>');
});
if(/^\/u/.test(location.pathname))
{
$(function(){
$(' img[alt="avatar"]').wrap('<div class="M14_avatar"></div>');
});
}


Wink
a++
Anonymous

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avatars ronds sur le profil, la toolbar et les mps | Phpbb2

Message par Mat Sam 13 Jan 2018 - 11:20

Bonjour Clin d'oeil
Merci, mais ça ne fonctionne pas Visage souriant :
https://www.fidjix.com/u1
Mat

Mat
Membre habitué

Masculin
Messages : 1562
Inscrit(e) le : 05/09/2015

http://www.dixily.fr
Mat a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avatars ronds sur le profil, la toolbar et les mps | Phpbb2

Message par Invité Sam 13 Jan 2018 - 19:16

Re Mat,

le code source montre le contraire:
Avatars ronds sur le profil, la toolbar et les mps | Phpbb2 195
Modifie le style ainsi:
Code:

div.M14_avatar img
{
 border-radius: 150px;
}


a++
Anonymous

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avatars ronds sur le profil, la toolbar et les mps | Phpbb2

Message par Mat Sam 13 Jan 2018 - 19:28

Merci, ça fonctionne Visage souriant!
Avatars ronds sur le profil, la toolbar et les mps | Phpbb2 Captur19
Bonne soirée Clin d'oeil!
Mat

Mat
Membre habitué

Masculin
Messages : 1562
Inscrit(e) le : 05/09/2015

http://www.dixily.fr
Mat a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum