Alzufen étant hospitalisé, je viens te poster ses codes. Je suis aussi là pour répondre à tes questions si besoin il y a. Et je précise que c'est toujours ses codes, considères-moi juste comme le facteur, je n'y ai pas touché ^^
Il faut fonctionner en deux étapes. Premièrement, on créé une page HTML dans laquelle on met le code du billet d'avion. Ensuite, quand tu veux poster le billet à quelque part, tu poste une iframe avec le lien de la page HTML.
Donc, pour créer la page HTML, on doit aller dans :
> Panneau d'administration
> > Modules
> > > HTML & Javascript
> > > > Gestion des pages HTML
On clique sur "Création en mode avancé (HTML)". Tu dois choisir un titre quelconque, puis t'assurer que les options suivantes soient cochées :
Voulez-vous utiliser le haut et le bas de page de votre forum ? NON
Utiliser cette page en tant que page d'accueil ? NON
Ensuite, tu copies/colles le code qui va suivre, puis tu valides. À savoir que quand Alzufen parlait de sa petite ligne de code magique qui permet d'enlever les signes spéciaux du genre "$%?$%" qui apparaissent, on parle ça : «meta http-equiv="content-type" content="text/html; charset=utf-8" /».
Code à mettre dans la page HTML :
- Code:
<html>
<head>
<link href='http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz' rel='stylesheet' type='text/css' />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Billet d'avion</title>
<style type="text/css">
body {margin: 0px;}
.billet{
width: 560px;
height: 265px;
border: double #D8D8D8;
text-transform:uppercase;
font-family: Calibri, 'Yanone Kaffeesatz';
}
.billet_gauche,.billet_milieu,.billet_droite,.billet_idroite,.billet_igauche{
display: inline-block;
vertical-align: top;
}
.billet_gauche{
width: 380px;
padding: 4px;
}
.billet_milieu{
width: 0;
height: 263px;
border: 1px dashed #000
}
.billet_droite{
width: 160px;
padding: 4px;
}
.billet_haut{
width: 100%;
border-bottom: 2px solid #D5D5D5;
font-size: 13px;
font-weight: bold;
text-align: center;
}
.billet_droite .billet_haut{
text-align: left;
}
.texte_d_haut{
float: left;
}
.texte_m_haut{
background: #000;
color: #fff;
padding-left: 4px;
padding-right: 4px;
}
.texte_g_haut{
float: right;
}
.billet_igauche{
width: 205px;
}
.billet_texte{
font-size: 12px;
}
.billet_chiffre{
font-size: 42px;
margin-top: -10px;
margin-left: 5px;
}
.billet_pm{
font-size: 20px;
}
.billet_date{
font-size: 11px;
}
.billet_gris{
position: relative;
background: #F2F2F2;
padding: 10px;
padding-top: 4px;
height: 158px;
}
.texte_gris_h{
font-size: 9px;
line-height: 2;
padding-bottom: 10px;
border-bottom: 1px dashed #000;
}
.texte_gris_b{
margin-top: 20px;
font-size: 6.5px;
line-height: 2;
}
.billet_idroite{
width: 170px;
}
.texte_coach{
display: inline-block;
text-align: right;
text-transform: none;
width: 36%;
}
.texte_lnfn{
font-size: 14px;
}
.texte_rapid{
font-size: 12px;
}
.texte_bas{
margin-top: 5px;
border-top: 2px solid #D5D5D5;
font-size: 26px;
font-weight: bold;
letter-spacing: 3px;
text-align: center;
}
</style>
</head>
<body>
<div class="billet">
<div class="billet_gauche">
<div class="billet_haut">
<span class="texte_d_haut">United Flight D3048</span>
<span class="texte_m_haut">RAP - DEN</span>
<span class="texte_g_haut">Last Name, First Name</span>
</div>
<div style="padding-top: 10px;">
<div class="billet_igauche">
<div class="billet_texte">Departure Gate</div>
<div class="billet_chiffre">A22</div>
<div class="billet_texte" style="margin-top: 15px;">Boards At</div>
<div class="billet_chiffre" style="display: inline-block;">3 : 15</div>
<div style="display: inline-block; vertical-align: middle;">
<span class="billet_pm">pm</span> <span class="billet_date">sept 01 2010</span>
</div>
<div class="billet_texte" style="margin-top: 15px;">Boarding Zone</div>
<div class="billet_chiffre" style="display: inline-block;">2</div>
<img src="http://image.noelshack.com/fichiers/2014/44/1414966410-barcode.png" width="145px" height="35px;" style="display: inline-block; vertical-align: top; margin-left: 25px;" />
</div>
<div class="billet_idroite">
<div class="billet_date" style="margin-bottom: 5px;">1st leg to sfo | transfer at den</div>
<div class="billet_gris">
<div class="texte_gris_h">2 207 365 3958 3309 0<br />00I8A<br />United Airlines Inc</div>
<div class="texte_gris_b">PCS. Ck WT. UNCK WT. SEQ NO. PCS. Ck WT. UNCK WT.<br />
<div style="position: absolute; bottom: 0;">No smoking</div>
</div>
</div>
</div>
</div>
<div class="texte_bas">
<img src="http://image.noelshack.com/fichiers/2014/44/1414959562-united-airlines-old-logo.png" height="15px" width="25px" />
United <span style="color: #51A7D3;">Boarding Pass</span>
</div>
</div><div class="billet_milieu"></div><div class="billet_droite">
<div class="billet_haut">United Flight D3048</div>
<div style="padding-top: 10px;">
<div class="billet_texte">Seat Number</div>
<div class="billet_chiffre" style="display:inline-block;">23A</div>
<div class="texte_coach">Coach</div>
<div class="texte_lnfn">Last Name, First Name</div>
<img src="http://image.noelshack.com/fichiers/2014/44/1414966406-barcode-1.png" width="160px" height="15px;" style="margin-top: 5px; margin-bottom: 5px;" />
<div class="texte_rapid">Rapid City sd to denver co<br />rap to den</div>
<div class="billet_texte" style="margin-top: 10px;">Departs</div>
<div class="billet_chiffre" style="display: inline-block;">3 : 40</div>
<div class="billet_pm" style="display: inline-block; vertical-align: middle;">pm</div>
</div>
<div class="texte_bas" style="letter-spacing: 4px; margin-top: 9px;">
<img src="http://image.noelshack.com/fichiers/2014/44/1414959562-united-airlines-old-logo.png" height="15px" width="25px" />
United
</div>
</div>
</div>
</body>
</html>
Ça, c'était la première étape. Maintenant, on retourne sur la page de gestion des pages HTML. Tu pourras voir ta page nouvellement créée et surtout, dans la deuxième colone, tu auras "URL du lien".
Pour l'iframe, il s'agit du code qui va suivre. Tu copies/colles la "URL du lien" de ta page HTML là où c'est écrit en majuscules qu'il faut le mettre et tu postes l'iframe là où tu veux l'utiliser ^^
- Code:
<iframe src="URL_DU_LIEN_DE_LA_PAGE_HTML" width="566px" height="272px" style="margin: auto; display: block;" frameBorder="0" seamless="seamless"></iframe>
Voilà, si tu as de la difficulté à l'installer ou qu'il y a des bugs, n'hésites pas à le dire ^^
j'aimerais le même que ceci
Après j'y connais rien en billet d'avion XD