pop up connexion

[Proviseur Sol]

Bonjour,
et-il possible d'arrondir les bords de la pop up connexion?
Merci d'avance
Proviseur Sol

[kheino]

Bonjour,

Je pense que ce devrait être possible, en quelle version est ton forum et si tu as déjà une popup, peux-tu donner le code ?

[Proviseur Sol]

Alors la version de mon forum est phpbb2.
Désolé mais je ne sais pas où aller chercher le code.
Merci

[kheino]

Désolé mais je ne sais pas où aller chercher le code.

C'est que tu n'as pas encore activer la popup apparemment...

Par contre, les infos sur ton forum, navigateur, statut, etc, tu les trouves dans ton profil ici.

C'est dans le PA >> Général >> Configuration > Popup de connexion >
Activer > Largeur > Hauteur

[Proviseur Sol]

C'est dans le PA >> Général >> Configuration > Popup de connexion >
Activer > Largeur > Hauteur

Ah oui! Bon, elle est activée et le code je dois aller le chercher où?
Merci

[kheino]

Je suis en train de le faire, mais j'ai cliqué sur "envoyer" au lieu de "prévisualisation", sorry.

[Proviseur Sol]

Merci de vous occuper de ma question!

[kheino]

Tout d'abord, c'est toi qui code la popup (presque entièrement).
Si tu vas dans la feuille de style CSS, au-dessus il y a un lien pour voir le CSS de base.
Tu fais une recherche (Ctrl+F) avec "popup" et tu y verras les trois identifiants concernant la popup.
On peut aussi aller dans le template overall_rheader, mais là c'est plus pour des éléments plus comples.

Nous allons commencer simple avec le codage de la popup dans le champ et du CSS.
Le HTML (BBcode en fait):

Code:

[table class="popup"][tr][td][center]CONNECT YOUR SELF[/center][/td][/tr][/table]

Le CSS :

#login_popup {
width: 350px;
border: 3px solid #000; /*toujours ces 3 lignes afin que tous les navigateurs standards puissent lire les arrondis*/
border-radius: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
padding: 1px;
margin: 0 auto;
}
.popup {
font: italic small-caps bold 13px arial; /* ordre a respecter pour les normes W3C avec le raccourci font > style > variant > weight > size/height > familly (on peut omettre toutes les propriétés sauf le size ez le family dans l ordre */
padding: 10px;
}

[Proviseur Sol]

Exusez moi, je suis débutante en forum, code...
Mais je ne sais pas où trouver mon css,
Merci

[kheino]

C'est dans Affichage >> Images et Couleurs >> Couleurs > Onglet Feuille de style CSS

A ce propos j'ai modifié les deux codes afin de centrer le contenu :

Code:

[table class="popup"][tr][td]CONNECT YOUR SELF[/td][/tr][/table]

.popup {
width: auto;
font: italic small-caps bold 13px arial; /* ordre a respecter pour les normes W3C avec le raccourci font > style > variant > weight > size/height > familly (on peut omettre toutes les propriétés sauf le size ez le family dans l ordre */
padding: 10px;
margin: 0 auto;
}

En rouge, ce qui permet de centrer.

[Proviseur Sol]

Alors ... il faut mettre ses codes dans le code de base c'est ça?

[kheino]

Alors ... il faut mettre ses codes dans le code de base c'est ça?

C'est dans Affichage >> Images et Couleurs >> Couleurs > Onglet Feuille de style CSS

.popup {
width: auto;
font: italic small-caps bold 13px arial; /* ordre a respecter pour les normes W3C avec le raccourci font > style > variant > weight > size/height > familly (on peut omettre toutes les propriétés sauf le size ez le family dans l ordre */
padding: 10px;
margin: 0 auto;
}

En rouge, ce qui permet de centrer.

Pour le BBcode, tu le mets dans le champ de la popup de connexion (comme indiqué plus haut) :
Général >> Configuration > Popup de connexion :

Code:

[table class="popup"][tr][td]CONNECT YOUR SELF[/td][/tr][/table]

[Proviseur Sol]

C'est mis!
Mais juste l'écriture à changer

[kheino]

C'est ici que ça se passe, et je t'ai mis en commentaire comment ça fonctionne :

font: italic small-caps bold 13px arial; /* ordre a respecter pour les normes W3C avec le raccourci font > style > variant > weight > size/height > familly (on peut omettre toutes les propriétés sauf le size ez le family dans l ordre */

La seule chose que tu paramètre séparemment c'est :
La couleur avec color: #fff; /*pour le blanc, ou #913873 pour une autre couleur*/

Le margin: 0 auto; est pour centrer le tout, si tu le supprimes ce sera alligné à gauche.

[Proviseur Sol]

Vraiment je sens que je dérange, mais étant toujours une débutante en code j'ai pas très bien compris ce qu'il fallait faire!
Vraiment, vraiment désolé!!

[kheino]

Tu n'as pas à être désolée d'être débutante, nous l'avons tous été.

Par contre, le te conseille le site que j'ai en profil pour apprendre et même ici de faire quelques recherches afin d'apprendre.
Je ne peux que t'aider à réaliser quelque chose, mais pas te donner un cours, tu peux comprendre pourquoi...
Si tu veux réaliser de belles choses, ou être efficace avec la gestion de ton forum, tu as le choix entre:
Apprendre le B A BA tant sur le codage que sur les forums FA
Ou engager un administrateur-codeur(se)

Alors, une dernière fois :
Dans le champs de la popup, tu vas mettre le code en BBcode :

Code:

[table class="popup"][tr][td]CONNECT YOUR SELF[/td][/tr][/table]

Ceci représente la structure (ou le squelette comme diraient certains), idem pour les codes HTML.

Tout ce qui est le "style CSS" sert, comme son nom l'indique aussi, à styler cette structure (ou un élément de cette structure), lui donner une apparence avec des propriétés propres au langage CSS.
Pour cela, on donne un attribut "class" ou "id" à la structure, ou bien à un élément de celle-ci (BBcode ou HTML) avec un identifiant (un nom), afin de le reprendre dans la feuille de style CSS.
Dans notre cas, c'est :

.popup {
width: auto;
font: italic small-caps bold 13px arial; /* ordre a respecter pour les normes W3C avec le raccourci font > style > variant > weight > size/height > familly (on peut omettre toutes les propriétés sauf le size ez le family dans l ordre */
padding: 10px;
margin: 0 auto;
}

Le point rouge est pour définir que c'est un attribut "class"
Le dièse # est pour un attribut id (dont le même identifiant ne peut être utilisé qu'une seule fois par page)

Il faut aussi savoir que les propriétés tant en HTML qu'en CSS sont en anglais.

Plus loin, il faut que tu fasses tes propres recherches.

[Proviseur Sol]

D'accord ça c'est fait!
Et pour que les bords soit rond, c'est ça?

[kheino]

Ah oui, j'ai oublié de remettre la propriété "radius" pour les coins arrondis.
Tu ajoutes ceci au code CSS :

border: 3px solid #000;
border-radius: 10px; /*toujours ces 3 lignes afin que tous les navigateurs standards puissent lire les arrondis*/
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
padding: 1px;

Ce qui donne au final :

.popup {
width: auto;
font: italic small-caps bold 13px arial; /* ordre a respecter pour les normes W3C avec le raccourci font > style > variant > weight > size/height > familly (on peut omettre toutes les propriétés sauf le size ez le family dans l ordre */
border: 3px solid #000;
border-radius: 10px; /*toujours ces 3 lignes afin que tous les navigateurs standards puissent lire les arrondis*/
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
padding: 1px;
margin: 0 auto;
}

[Proviseur Sol]

bon je voudrais que se soit les bords de la pop up connexin pas que il y ai un tableau enfin c'était peut etre pas voulu mais voila se que ça donne:
http://www.casimages.com/img.php?i=120121040806405604.png
merci!

[Proviseur Sol]

up

[Proviseur Sol]

up

[Proviseur Sol]

up

[Proviseur Sol]

UP

[Proviseur Sol]

je ferme le sujet