Ajouter une barre défilante zone de texte (profil)

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

Résolu Ajouter une barre défilante zone de texte (profil)

Message par _backdraft_ le Mar 30 Avr 2013 - 21:22

Bonjour,

J'ai ajouté un champ personnalisé dans les profils de mes membres. C'est un champ de texte, le problème est que j'écris énormément dans cette partie du coup ça déforme la page et c'est pas très esthétique... Je voulais donc savoir si je pouvais ajouter une barre défilante pour limiter la taille de la zone de texte mais pas la quantité de mots.

Merci

Forum :

PhpBB2
Templates et CSS modifiés.


Dernière édition par _backdraft_ le Jeu 9 Mai 2013 - 10:00, édité 1 fois
avatar

_backdraft_
Membre habitué(e)

Masculin
Messages : 1509
Inscrit(e) le : 04/03/2010

http://www.caserne35.com
_backdraft_ a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter une barre défilante zone de texte (profil)

Message par remy59210 le Mar 30 Avr 2013 - 21:23

Bonjour,

Essayez de passer a la ligne en rentrant ce code :
Code:
<br>
avatar

remy59210
***

Masculin
Messages : 134
Inscrit(e) le : 11/02/2013

http://hbetaville.forumactif.fr
remy59210 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter une barre défilante zone de texte (profil)

Message par _backdraft_ le Mar 30 Avr 2013 - 21:26

Salut,

Je ne cherche pas à faire un retour à la ligne mais créer une barre pour faire défiler le texte car ma zone de texte comporte une grande quantité de mots ce qui est assez moche dans le profil.

Merci
avatar

_backdraft_
Membre habitué(e)

Masculin
Messages : 1509
Inscrit(e) le : 04/03/2010

http://www.caserne35.com
_backdraft_ a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter une barre défilante zone de texte (profil)

Message par remy59210 le Mar 30 Avr 2013 - 21:31

Vers l'horizontal :

Code:
[scroll][/scroll]


Vers la verticale :

Code:
 [updown][/updown]
avatar

remy59210
***

Masculin
Messages : 134
Inscrit(e) le : 11/02/2013

http://hbetaville.forumactif.fr
remy59210 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter une barre défilante zone de texte (profil)

Message par _backdraft_ le Mar 30 Avr 2013 - 21:35

remy59210 a écrit:Vers l'horizontal :

Code:
[scroll][/scroll]


Vers la verticale :

Code:
 [updown][/updown]

Bonsoir,

Je ne parle pas non plus de ceci mais d'une barre de défilement (un ascenseur) qui s'appliquerais par défaut à ce champ de profil personnalisé.
avatar

_backdraft_
Membre habitué(e)

Masculin
Messages : 1509
Inscrit(e) le : 04/03/2010

http://www.caserne35.com
_backdraft_ a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter une barre défilante zone de texte (profil)

Message par remy59210 le Mar 30 Avr 2013 - 21:37

A oui d'accord je vais essayer de te trouver sa si j'y arrive.
avatar

remy59210
***

Masculin
Messages : 134
Inscrit(e) le : 11/02/2013

http://hbetaville.forumactif.fr
remy59210 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter une barre défilante zone de texte (profil)

Message par Milouze14 le Mer 1 Mai 2013 - 17:00

Salut _backdraft_,
c'est dans le profil des messages?
le résultat imagé (j'avoue le texte n'est pas très recherché Very Happy ) :




tu peux passer par ton template viewtopic_body
et entourer la partie concernée d'une class
et la partie renseignée du membre dans une div comme ceci:
Code:

<!-- BEGIN profile_field -->
<div class="M14_label">
{postrow.displayed.profile_field.LABEL}
  <div>{postrow.displayed.profile_field.CONTENT}</div>
{postrow.displayed.POSTER_RPG}
</div>
<!-- END profile_field -->


Puis la C.S.S :
Code:


.M14_label:nth-child(1) div{background-color:white;color:red;}
.M14_label:nth-child(2) div {background-color:red;color:white;}
/*le champs qui sera scrolle*/
.M14_label:nth-child(3) div
{
overflow-y: scroll;
overflow-x: hidden;
background-color: #cccccc;
width: 150px;
height: 50px;
padding:2px;
}


Il suffit d'ajouter autant :
Code:

.M14_label:nth-child(chiffre ou nombre)

et de trouver le chiffre correspondant au champs que tu désires Wink .

J'avoue que je n'ai pas trop compris l'ordre car chez moi ,
le champ que j'ai créé pour toi est à la quinzième position alors que dans le profil il est a
onzième reflexion .

Je pense que tous les champs créés précédemment doivent encore être connus Exclamation Exclamation .



Voilà mon ami Wink .
En espérant t'avoir aidé.

a++




avatar

Milouze14
Membre actif

Masculin
Messages : 4806
Inscrit(e) le : 18/04/2005

https://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter une barre défilante zone de texte (profil)

Message par _backdraft_ le Mer 1 Mai 2013 - 22:20

Bonjour,

Merci pour ton aide, cependant ce n'est pas pour le profil dans les messages mais dans le profil du membre.

Tant que j'y suis vu que c'est sur le même sujet, j'avais une autre question. Je sais qu'on peut rendre le champ visible que pour les administrateurs, je voulais savoir si on peut rendre le champs visibles que aux administrateurs mais aussi au membre à qui appartient le champ. En gros tout le monde à le champ personnalisé mais le champ de X ne serait pas visible par Y mais uniquement par X lui même et les administrateurs (j'espère être claire :s).

Merci beaucoup !
Backdraft
avatar

_backdraft_
Membre habitué(e)

Masculin
Messages : 1509
Inscrit(e) le : 04/03/2010

http://www.caserne35.com
_backdraft_ a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter une barre défilante zone de texte (profil)

Message par Milouze14 le Jeu 2 Mai 2013 - 19:53

Salut _backdraft_ ,

désolé mais je n'ai pas trouvé mieux, essayes ceci dans ta C.S.S:
Code:

dd.ajax-profil_parent #text_editor_iframe input.post, textarea.inputbox, textarea.post
{
overflow-y: scroll;
overflow-x: hidden;
max-width: 250px;
height: 80px;
padding:2px;
}

#profile-advanced-details.genmed:first-child div.field_uneditable
{
overflow-y: scroll;
overflow-x: hidden;
max-width: 250px;
height: 80px;
padding:2px;
}

Le soucis rencontré est la même structure pour les libellés Wink .

a++
avatar

Milouze14
Membre actif

Masculin
Messages : 4806
Inscrit(e) le : 18/04/2005

https://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter une barre défilante zone de texte (profil)

Message par _backdraft_ le Jeu 2 Mai 2013 - 22:11

Merci Milouze, mais le code ne marche pas, le seul effet que j'ai remarqué c'est qu'il réduit la box de réponse rapide.

Cordialement
Backdraft
avatar

_backdraft_
Membre habitué(e)

Masculin
Messages : 1509
Inscrit(e) le : 04/03/2010

http://www.caserne35.com
_backdraft_ a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter une barre défilante zone de texte (profil)

Message par Milouze14 le Ven 3 Mai 2013 - 4:07

Salut _backdraft_ ,

en dehors de la réponse rapide tu avais un visuel différent dans le profil du membre?

a++
avatar

Milouze14
Membre actif

Masculin
Messages : 4806
Inscrit(e) le : 18/04/2005

https://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter une barre défilante zone de texte (profil)

Message par _backdraft_ le Ven 3 Mai 2013 - 22:42

Non le CSS ne fait pas d'autres effets.

J'ai réussis à faire un code qui donne ce que je voudrais faire :

Code:
.field_uneditable {
overflow-y: scroll;
height: 75px;
}

Problème : ce code s'applique à tous les champs du profil, et la barre s'affiche même quand le texte ne dépasse pas 75px.

Merci
avatar

_backdraft_
Membre habitué(e)

Masculin
Messages : 1509
Inscrit(e) le : 04/03/2010

http://www.caserne35.com
_backdraft_ a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter une barre défilante zone de texte (profil)

Message par _backdraft_ le Lun 6 Mai 2013 - 22:14

UP
avatar

_backdraft_
Membre habitué(e)

Masculin
Messages : 1509
Inscrit(e) le : 04/03/2010

http://www.caserne35.com
_backdraft_ a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter une barre défilante zone de texte (profil)

Message par Milouze14 le Mer 8 Mai 2013 - 18:49

Salut _backdraft_ ,

il faut en fait trouver l'identifiant du champs Wink .

Tu sélectionnes l'intitulé du champs puis tu fais un clic droit puis code source de la sélection:

Tu devrais trouver un identifiant de ce style:
Code:
<dl id="field_id1">


Il faudra mettre ce dernier dans la C.S.S :

Code:
#field_id1

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

colle ceci:


Code:

/* La partie renseignee*/
dl#field_id1 .field_uneditable /* l identifiant correspondant */
{
overflow-y: scroll;
width:300px;
height: 75px;
background:orange;
margin-left:5px;
padding:5px;
-webkit-border-top-left-radius: 8px;
-webkit-border-bottom-left-radius: 8px;
-moz-border-radius-topleft: 8px;
-moz-border-radius-bottomleft: 8px;
border-top-left-radius: 8px;
border-bottom-left-radius: 8px;
}
/* La partie qui sera edite*/
.field_editable textarea#profile_field_2_1.post /* l identifiant correspondant */
{
overflow-y: scroll;
width:300px;
height: 75px;
background-color:orange;
margin-left:5px;
padding:5px;
-webkit-border-top-left-radius: 8px;
-webkit-border-bottom-left-radius: 8px;
-moz-border-radius-topleft: 8px;
-moz-border-radius-bottomleft: 8px;
border-top-left-radius: 8px;
border-bottom-left-radius: 8px;
}

Pense à valider les modifications en cliquant sur le bouton "Valider".

Les deux modules auront une couleur de fond orange avec des bordures arrondies seulement à gauche,
d'une largeur de 300px et d'une hauteur de 75px Wink .

J'ai expliqué volontairement pour les personnes voulant l'identique Wink .

a++
avatar

Milouze14
Membre actif

Masculin
Messages : 4806
Inscrit(e) le : 18/04/2005

https://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter une barre défilante zone de texte (profil)

Message par _backdraft_ le Mer 8 Mai 2013 - 21:43

Bonsoir, merci pour ton aide !

J'ai essayé mais j'ai du me rater quelque part car ne marche pas, voilà ce que j'ai mis dans mon CSS :

Code:
/* La partie renseignee*/
dl#field_id6 .field_uneditable /* l identifiant correspondant */
{
overflow-y: scroll;
width:300px;
height: 75px;
background:orange;
margin-left:5px;
padding:5px;
-webkit-border-top-left-radius: 8px;
-webkit-border-bottom-left-radius: 8px;
-moz-border-radius-topleft: 8px;
-moz-border-radius-bottomleft: 8px;
border-top-left-radius: 8px;
border-bottom-left-radius: 8px;
}
/* La partie qui sera edite*/
.field_editable textarea#profile_field_2_1.post /* l identifiant correspondant */
{
overflow-y: scroll;
width:300px;
height: 75px;
background-color:orange;
margin-left:5px;
padding:5px;
-webkit-border-top-left-radius: 8px;
-webkit-border-bottom-left-radius: 8px;
-moz-border-radius-topleft: 8px;
-moz-border-radius-bottomleft: 8px;
border-top-left-radius: 8px;
border-bottom-left-radius: 8px;
}

Merci
Backdraft
avatar

_backdraft_
Membre habitué(e)

Masculin
Messages : 1509
Inscrit(e) le : 04/03/2010

http://www.caserne35.com
_backdraft_ a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter une barre défilante zone de texte (profil)

Message par Milouze14 le Jeu 9 Mai 2013 - 5:17

Salut _backdraft_ ,

J'ai essayé mais j'ai du me rater quelque part car ne marche pas

Code:

Tu sélectionnes l'intitulé du champs puis tu fais un clic droit puis code source de la sélection:
Tu devrais trouver un identifiant de ce style:
        <dl id="field_id1">

c'est cette partie que tu as zappé ,
il faut que tu reportes ton identifiant qui sera différent dans la css .

a++
avatar

Milouze14
Membre actif

Masculin
Messages : 4806
Inscrit(e) le : 18/04/2005

https://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter une barre défilante zone de texte (profil)

Message par _backdraft_ le Jeu 9 Mai 2013 - 9:23

Milouze14 a écrit:c'est cette partie que tu as zappé ,
il faut que tu reportes ton identifiant qui sera différent dans la css .

Désolé d'être embêtant mais je comprends pas bien ou je dois placer cette identifiant car moi je l'avais mis comme ceci :

_backdraft_ a écrit:dl#field_id6 .field_uneditable

(en faisant clique droit et tout j'ai trouvé : field_id6)
avatar

_backdraft_
Membre habitué(e)

Masculin
Messages : 1509
Inscrit(e) le : 04/03/2010

http://www.caserne35.com
_backdraft_ a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Ajouter une barre défilante zone de texte (profil)

Message par Milouze14 le Jeu 9 Mai 2013 - 9:36

Re,
désolé mais j'avais cru que tu avais déposé le même identifiant que le mien Embarassed .

Tu parles bien du profil d un membre ?

Chez moi cela fonctionne :

Le module simple:


Le module en ajoutant du texte:


C'est bien une zone de texte _backdraft_ ?

a++


avatar

Milouze14
Membre actif

Masculin
Messages : 4806
Inscrit(e) le : 18/04/2005

https://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter une barre défilante zone de texte (profil)

Message par _backdraft_ le Jeu 9 Mai 2013 - 9:54

Bonjour,

Oui j'ai bien tout vérifié, c'est une zone de texte.

Pour être sur qu'on parle de la même chose voici là ou je veux le modifier (dans le profil) :



Pour le deuxième CSS il n'y a rien à modifier dans l'identifiant ? Car je n'ai rien modifié ?

Merci
Backdraft
avatar

_backdraft_
Membre habitué(e)

Masculin
Messages : 1509
Inscrit(e) le : 04/03/2010

http://www.caserne35.com
_backdraft_ a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter une barre défilante zone de texte (profil)

Message par _backdraft_ le Jeu 9 Mai 2013 - 9:57

Milouze14 après avoir regardé dans le code source j'ai réussis, j'ai remplacé le :

Code:
dl#field_id6 .field_uneditable

Par :

Code:
tr#field_id6 .field_uneditable

Merci beaucoup pour ta patience et ton aide Smile
avatar

_backdraft_
Membre habitué(e)

Masculin
Messages : 1509
Inscrit(e) le : 04/03/2010

http://www.caserne35.com
_backdraft_ a été remercié(e) par l'auteur de ce sujet.

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


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