Accueil
Créer un forumAide pour Signature codée
2 participants
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code
Page 1 sur 1 • Partagez
Aide pour Signature codée
par Lisy Nila Sam 22 Nov 2014 - 2:20
Détails techniques
Version du forum : phpBB2
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Google Chrome
Personnes concernées par le problème : Tous les utilisateurs
Problème apparu depuis : En essayant le code...
Lien du forum : http://lalliance-des-dragon.forumsrpg.com/
Description du problème
Bonsoir,Je sais qu'il y a plusieurs sujet de ce genre, mais aucun n'a les réponses que je cherche malheureusement. A vrai dire, je viens surtout vous demander votre aide.
Avant de commencer mon explication, ma feuille CSS, on ne sait jamais. Les codes qui s'y trouvent ne sont pas utilisés pour la suite, mais peut être y a-t-il quelque chose qui interfère, même si j'en doute... Enfin, j'imagine que rien ne coûte de vérifier.
- Code:
body {
background-image:url(http://i39.servimg.com/u/f39/18/51/75/88/fond_d10.jpg);
background-size: 100% auto;
}
/* MISE EN FRORME CATEGORIES ET FORUM */
.description
{
display: block;
width: 606px;
margin: auto;
height: 78px;
overflow: hidden;
border: 2px solid #9c9c9c;
box-shadow: 1px 1px 1px #191817;
-moz-box-shadow: 1px 1px 1px #191817;
-htm-box-shadow: 1px 1px 1px #191817;
-webkit-box-shadow: 1px 1px 1px #191817;
-o-box-shadow: 1px 1px 1px #191817;
}
.description_contenu
{
position: absolute;
display: block;
width: 596px;
height: 68px;
overflow: auto;
background-color: #191817;
font-size: 10px;
color: #9c9c9c;
text-align: justify;
padding: 5px;
opacity: 0;
-moz-opacity: 0;
-khtml-opacity: 0;
filter: alpha(opacity=0);
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 1s;
-moz-transition: 1s;
-o-transition: 1s;
-htm-transition: 1s;
-webkit-transition: 1s;
}
.description_contenu:hover
{
opacity: 0.8;
-moz-opacity: 0.8;
-khtml-opacity: 0.8;
filter: alpha(opacity=80);
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 1s;
-moz-transition: 1s;
-o-transition: 1s;
-htm-transition: 1s;
-webkit-transition: 1s;
}
Voilà, en cherchant des idées pour mon forum (qui est en phpBB2), je suis tombée sur ça :
http://fanstasy-graph.eklablog.net/signature-codee-a46890787
et je trouve cette signature géniale, surtout pour du RP ^^
Mais, je n'arrive pas à l'installer. Il faut dire que je comprends à peine le CSS et l'HTML, donc ça n'aide pas...
Et j'ai activé BBCode, HTML et JAVASCRIPT
J'ai fait le test avec le code donner par la créatrice, qui est le suivant.
- Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<script type="text/javascript">
//<!--
function change_onglet(name)
{
document.getElementById('onglet_'+anc_onglet)
.className = 'onglet_0 onglet';
document.getElementById('onglet_'+name).
className = 'onglet_1 onglet';
document.getElementById('contenu_onglet_'+anc_onglet)
.style.display = 'none';
document.getElementById('contenu_onglet_'+name).
style.display = 'block';
anc_onglet = name;
}
//-->
</script>
<style type="text/css">
.onglet,
.onglet_0 {display:inline-block;
width: 150px;
background: #a34626;
margin:auto;
margin-bottom: -1px;
padding:3px;
border:1px solid black;
border-top: 4px solid black;
border-radius: 10px 10px 0 0;
font-family : Impact;
letter-spacing: 3px;
text-align: center;
-webkit-transition: 300ms;
-moz-transition: 300ms;
transition: 300ms;
}
.onglet:hover {background: #bd5f2b
}
.contenu_onglet{ font-size : 14px ;
background: #a34626;
border-radius : 20px;
border: 1px solid #000000;
border-left: 6px solid black;
border-right: 6px solid black;
box-shadow: 0 0 10px black, inset 0 0 10px black;
padding: 10px;
display:none;
height : 200px;
width : 600px;
overflow : auto;
color: #e7c3b7;
text-shadow : 1px 1px 0px black;
}
.cadre { border-radius: 10px;
background: rgba(0, 0, 0, 0.3);
width: 400px;
height: 187px;
float: right;
text-align: left;
padding: 5px;
box-shadow: 0 0 10px #ee7837, inset 0 0 5px black;
overflow : auto;
}
.contact {border: 1px solid black;
border-left: 3px solid black;
border-right: 3px solid black;
background: rgba(238, 120, 55, 0.6);
padding: 5px;
margin-top: 10px;
color: black
}
a {color: black;
text-decoration: none;
text-shadow: none;
font-weight:bold;
}
</style>
</head>
<body>
<div class="onglets">
<center><span class="onglet_0 onglet" id="onglet_1er" onmouseover="javascript:change_onglet('1er');">SIGNATURE</span>
<span class="onglet_0 onglet" id="onglet_2eme" onmouseover="javascript:change_onglet('2eme');">ANCIENS KITS</span>
<span class="onglet_0 onglet" id="onglet_3eme" onmouseover="javascript:change_onglet('3eme');">MOI</span>
</center>
</div>
<center> <div class="contenu_onglet" id="contenu_onglet_1er">
<img src="http://ekladata.com/LL_FFgnJyGMVWv_TAg6rnfpIIhk.png" alt=""><br/></div>
<center> <div class="contenu_onglet" id="contenu_onglet_2eme">
<img src="http://ekladata.com/1RsvO8ELdqRX3DnRps1urL-MPSI.jpg"/><br/>
<img src="http://ekladata.com/qEqY2wyUKiY7IpIDa6ZhyGWFwJQ.png"/>
</div>
<center> <div class="contenu_onglet" id="contenu_onglet_3eme">
<div style="float:left"><img src="http://ekladata.com/d1b3rsARkHy-JOObf5r016zv8Ok.png"/><div class="contact"><a href="http://fanstasy-graph.eklablog.net">Blog</a> | <a href="http://nagalia.deviantart.com/">Deviantart</a></div></div>
<div class="cadre"><p>Je suis Nagalia!<br/>
16 ans, terminale S et voulant devenir web-designeuse ^^
<br/><br/>
J'adore dessiner, des personnages de manga ou fantastique genre des elfes. En fait, je dessine beaucoup des personnages sortant tout droit de mon imagination de folle XD Genre Nagalia, une elfe noire complètement sadique :P Bref voilà pour la petite histoire sur l'origine de mon pseudo. Vous l'aurez deviné, je suis fan d'héroïque fantasy!<br/>
Il faut également préciser que je suis une veritable accro au graph!<br/><br/>
Bref, vous voyez qu'on peut mettre vraiment ce qu'on veut dans cette signature, et sans aucune limite de caractère ;)</p> </div></div>
<script type="text/javascript">
//<!--
var anc_onglet = '3eme';
change_onglet(anc_onglet);
//-->
</script>
</body>
</html>
Je l'ai enregistré sur mon forum à partir de la gestion des pages HTML dans le Panneau d'administration, et j'ai obtenu l'URL suivant :
http://lalliance-des-dragon.forumsrpg.com/h1-signaturehtml
Puis ! La créatrice à donner l'iframe suivant à mettre dans la signature :
- Code:
<iframe style="width: LARGEURpx ; height: HAUTEURpx; display: block; margin-left: auto; margin-right: auto;" src="URL" frameborder="no" scrolling="no" width="320" height="240"></iframe>
Que j'ai rempli comme suit :
- Code:
<iframe style="width: 600px; height: 300px; display: block; margin-left: auto; margin-right: auto;" src="http://lalliance-des-dragon.forumsrpg.com/h1-signaturehtml" frameborder="no" scrolling="no" width="320" height="240"></iframe>
Pour les tailles, je ne suis pas sûre d'avoir mit les bonnes dimensions, en essayant et en décryptant le code j'ai obtenu ces deux là mais c'est imprécis je trouve.
J'ai fais un test en le postant sur un sujet, et dans la signature... Le résultat final est le même pour les deux, il y a juste l'iframe qui s'affiche tel quel.
Cependant, pour le sujet, lorsque je fais une prévisualisation, j'obtiens quelque chose comme cela.
Je ne peux d'ailleurs pas faire défiler.
De plus, lorsque j'édite les messages de mon forum, la case ''Désactiver le HTML dans ce message '' est cochée, je la décoche, et elle est à chaque fois recochée... Ce que je ne comprends pas du tout.
Comme dit, je découvre tout juste le HTML, je peux y comprendre deux trois bases, mais ça s'arrête là. J'ai compris par exemple que le code rassemblait en une fois de l'HTML, du CSS et du JAVASCRIPT... et voyant qu'il y a des espaces spéciales à chaque type de codes dans le panneau d'administration, j'en suis venue à me demander si c'était pas tout simplement qu'il vaut mieux séparer les codes CSS et Javascript de l'HTML... Mais bon, comme dit je n'y comprends rien, et je ne saurais même pas comment faire donc bon. ^^
Voilà, je crois avoir tout dit... si y a besoin d'autres infos j'essaierais de répondre du mieux que je peux. ^^
J'imagine que c'est un gros boulot, donc je vous remercie déjà de porter attention à ce message, en espérant que l'on trouvera ce qui ne marche pas.
Encore merci.
Dernière édition par Lisy Nila le Sam 22 Nov 2014 - 10:37, édité 1 fois
Lisy Nila- Nouveau membre
-
Messages : 8
Inscrit(e) le : 31/05/2014 -
Re: Aide pour Signature codée
par Invité Sam 22 Nov 2014 - 6:40
Salut Lisy Nila ,
tout fonctionne correctement, seulement quand tu as créé la page en mode simple (WYSIWYG) alors qu'il faut passer par le mode Création en mode avancé (HTML)
On reprend tout :zen:
Création en mode avancé (HTML)
Titre * : Le titre de la signature
Voulez-vous utiliser le haut et le bas de page de votre forum ? NON
Utiliser cette page en tant que page d'accueil ? NON
Colles ce contenu:
Cliques sur le bouton Valider
Repères le lien de ta page web , puis déposes là dans l'iframe
tout fonctionne correctement, seulement quand tu as créé la page en mode simple (WYSIWYG) alors qu'il faut passer par le mode Création en mode avancé (HTML)
On reprend tout :zen:
Création en mode avancé (HTML)
Titre * : Le titre de la signature
Voulez-vous utiliser le haut et le bas de page de votre forum ? NON
Utiliser cette page en tant que page d'accueil ? NON
Colles ce contenu:
- Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<script type="text/javascript">
//<!--
function change_onglet(name)
{
document.getElementById('onglet_'+anc_onglet)
.className = 'onglet_0 onglet';
document.getElementById('onglet_'+name).
className = 'onglet_1 onglet';
document.getElementById('contenu_onglet_'+anc_onglet)
.style.display = 'none';
document.getElementById('contenu_onglet_'+name).
style.display = 'block';
anc_onglet = name;
}
//-->
</script>
<style type="text/css">
.onglet,
.onglet_0 {display:inline-block;
width: 150px;
background: #a34626;
margin:auto;
margin-bottom: -1px;
padding:3px;
border:1px solid black;
border-top: 4px solid black;
border-radius: 10px 10px 0 0;
font-family : Impact;
letter-spacing: 3px;
text-align: center;
-webkit-transition: 300ms;
-moz-transition: 300ms;
transition: 300ms;
}
.onglet:hover {background: #bd5f2b
}
.contenu_onglet{ font-size : 14px ;
background: #a34626;
border-radius : 20px;
border: 1px solid #000000;
border-left: 6px solid black;
border-right: 6px solid black;
box-shadow: 0 0 10px black, inset 0 0 10px black;
padding: 10px;
display:none;
height : 200px;
width : 600px;
overflow : auto;
color: #e7c3b7;
text-shadow : 1px 1px 0px black;
}
.cadre { border-radius: 10px;
background: rgba(0, 0, 0, 0.3);
width: 400px;
height: 187px;
float: right;
text-align: left;
padding: 5px;
box-shadow: 0 0 10px #ee7837, inset 0 0 5px black;
overflow : auto;
}
.contact {border: 1px solid black;
border-left: 3px solid black;
border-right: 3px solid black;
background: rgba(238, 120, 55, 0.6);
padding: 5px;
margin-top: 10px;
color: black
}
a {color: black;
text-decoration: none;
text-shadow: none;
font-weight:bold;
}
</style>
</head>
<body>
<div class="onglets">
<center><span class="onglet_0 onglet" id="onglet_1er" onmouseover="javascript:change_onglet('1er');">SIGNATURE</span>
<span class="onglet_0 onglet" id="onglet_2eme" onmouseover="javascript:change_onglet('2eme');">ANCIENS KITS</span>
<span class="onglet_0 onglet" id="onglet_3eme" onmouseover="javascript:change_onglet('3eme');">MOI</span>
</center>
</div>
<center> <div class="contenu_onglet" id="contenu_onglet_1er">
<img src="http://ekladata.com/LL_FFgnJyGMVWv_TAg6rnfpIIhk.png" alt=""><br/></div>
<center> <div class="contenu_onglet" id="contenu_onglet_2eme">
<img src="http://ekladata.com/1RsvO8ELdqRX3DnRps1urL-MPSI.jpg"/><br/>
<img src="http://ekladata.com/qEqY2wyUKiY7IpIDa6ZhyGWFwJQ.png"/>
</div>
<center> <div class="contenu_onglet" id="contenu_onglet_3eme">
<div style="float:left"><img src="http://ekladata.com/d1b3rsARkHy-JOObf5r016zv8Ok.png"/><div class="contact"><a href="http://fanstasy-graph.eklablog.net">Blog</a> | <a href="http://nagalia.deviantart.com/">Deviantart</a></div></div>
<div class="cadre"><p>Je suis Nagalia!<br/>
16 ans, terminale S et voulant devenir web-designeuse ^^
<br/><br/>
J'adore dessiner, des personnages de manga ou fantastique genre des elfes. En fait, je dessine beaucoup des personnages sortant tout droit de mon imagination de folle XD Genre Nagalia, une elfe noire complètement sadique :P Bref voilà pour la petite histoire sur l'origine de mon pseudo. Vous l'aurez deviné, je suis fan d'héroïque fantasy!<br/>
Il faut également préciser que je suis une veritable accro au graph!<br/><br/>
Bref, vous voyez qu'on peut mettre vraiment ce qu'on veut dans cette signature, et sans aucune limite de caractère ;)</p> </div></div>
<script type="text/javascript">
//<!--
var anc_onglet = '3eme';
change_onglet(anc_onglet);
//-->
</script>
</body>
</html>
Cliques sur le bouton Valider
Repères le lien de ta page web , puis déposes là dans l'iframe
- Code:
<iframe style="width: 700px; height: 400px; display: block; margin-left: auto; margin-right: auto;" src="LE LIEN DE LA PAGE WEB" frameborder="no" scrolling="no"></iframe>
Puis déposes enfin dans ta signature ;) .
Ta c.s.s ne peut intervertir sur l'affichage de ta page html pour information car elles sont bien distinctes ;)
a++
Invité- Invité
Re: Aide pour Signature codée
par Lisy Nila Sam 22 Nov 2014 - 9:00
Nop, désolée.
Le code fonctionne en prévisualisation, mais pas une fois posté.
Le code fonctionne en prévisualisation, mais pas une fois posté.
Lisy Nila- Nouveau membre
-
Messages : 8
Inscrit(e) le : 31/05/2014 -
Re: Aide pour Signature codée
par Invité Sam 22 Nov 2014 - 9:42
Re,
sur ce lien le bloc fonctionne parfaitement chez moi:
http://lalliance-des-dragon.forumsrpg.com/t79-contexte-clans-et-tribus#269
a++
sur ce lien le bloc fonctionne parfaitement chez moi:
http://lalliance-des-dragon.forumsrpg.com/t79-contexte-clans-et-tribus#269
a++
Invité- Invité
Re: Aide pour Signature codée
par Lisy Nila Sam 22 Nov 2014 - 9:48
Ok... Bon, ben depuis mon compte Narrateur je peux pas le voir, même dans la signature d'un autre. ^^' Par contre avec un compte joueur je peux. Étrange... si vous avez une explication je la veux bien, mais bon, ça marche. 
Lisy Nila- Nouveau membre
-
Messages : 8
Inscrit(e) le : 31/05/2014 -
Re: Aide pour Signature codée
par Invité Sam 22 Nov 2014 - 9:54
Re,
je viens de m'inscrire sur ton fofo , peux tu le temps de l'intervention me passer dans le même
statut que toi, une fois le soucis résolu tu pourras supprimer mon compte
.
a++
je viens de m'inscrire sur ton fofo , peux tu le temps de l'intervention me passer dans le même
statut que toi, une fois le soucis résolu tu pourras supprimer mon compte
.a++
Invité- Invité
Re: Aide pour Signature codée
par Lisy Nila Sam 22 Nov 2014 - 10:00
Je t'ai mis dans le groupe des Admin, c'est suffisant?
Lisy Nila- Nouveau membre
-
Messages : 8
Inscrit(e) le : 31/05/2014 -
Re: Aide pour Signature codée
par Invité Sam 22 Nov 2014 - 10:04
Re,
oui c'est suffisant merci, tu n'as aucun script dans la gestion du même nom,
donc ton navigateur doit être responsable car je vois bien les signatures .
a++
oui c'est suffisant merci, tu n'as aucun script dans la gestion du même nom,
donc ton navigateur doit être responsable car je vois bien les signatures
.a++
Invité- Invité
Re: Aide pour Signature codée
par Lisy Nila Sam 22 Nov 2014 - 10:05
D'accord... Bon ben l'important est que ça marche. Merci pour tout, je peux indiqué comme résolu je penses. ^^
Encore merci.
Encore merci.
Lisy Nila- Nouveau membre
-
Messages : 8
Inscrit(e) le : 31/05/2014 -
Re: Aide pour Signature codée
par Invité Sam 22 Nov 2014 - 10:07
Re,
dernière chose, j'ai posté sur ton fofo te demandant de déposer l'iframe .
a++
dernière chose, j'ai posté sur ton fofo te demandant de déposer l'iframe
.a++
Invité- Invité
Re: Aide pour Signature codée
par Chacha Sam 22 Nov 2014 - 10:46
. . | Bonjour et Bienvenue Vu que vous êtes nouveau, voici quelques sujets importants :sur le Forum des Forums ForumActif  Sécurité : mail de fondation - Ce qu'il ne faut pas faire
|
Chacha- Modéractif
-
Messages : 69406
Inscrit(e) le : 21/08/2010 -
Sujets similaires» Signature codée
» Signature codée problématique
» [CSS]Besoin d'aide pour mettre des séparations pour le template viewtopic_body
» gradualfader dans une signature codée
» Léger problème avec signature codée
» Signature codée problématique
» [CSS]Besoin d'aide pour mettre des séparations pour le template viewtopic_body
» gradualfader dans une signature codée
» Léger problème avec signature codée
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum