Alors si tout est bon, je te file les codes ^^
Il faut fonctionner en deux étapes. Premièrement, on créé une page HTML dans laquelle on met la pub. Ensuite, quand tu veux poster la pub à 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 :
- Code:
<html>
<head>
<meta charset="UTF-8" />
<title>Pub</title>
<style type="text/css">
body {
margin: 0px;
}
.pub_cadre {
width: 738px;
height: 770px;
margin: auto;
background-image: url('http://img11.hostingpics.net/pics/571798cadre.png');
padding-top: 72px;
text-align: center;
font-family: arial;
font-size: 13px;
}
.pub_image_top {
position: relative;
width: 450px;
height: 310px;
margin: auto;
border-radius: 105px 105px 0px 0px;
box-shadow: 0px 0px 10px #353535;
z-index: 1;
}
.pub_body {
position: relative;
background-image: url('http://img11.hostingpics.net/pics/367932fond.png');
width: 450px;
height: 365px;
margin: auto;
padding-top: 15px;
text-align: center;
z-index: 2;
}
.pub_bloc1 {
position: relative;
width: 400px;
height: 86px;
margin: auto;
border: 2px solid white;
background-color: white;
border-radius: 5px;
text-align: left;
overflow: hidden;
}
.pub_bloc1_text {
width: 390px;
height: 96px;
background-color: #dfdfdf;
padding: 5px;
overflow: auto;
text-align: justify;
}
.pub_bloc1_img {
position: absolute;
top: 0px;
left: 0px;
width: 400px;
height: 86px;
border-radius: 5px;
transition: all 1s;
-webkit-transition: all 1s;
}
.pub_bloc1:hover .pub_bloc1_img {
left: 450px;
}
.pub_bloc2 {
position: relative;
width: 404px;
height: 209px;
background-image: url('http://img11.hostingpics.net/pics/130557fond2.png');
border-radius: 5px;
margin: auto;
}
.contenu_pubonglet {
position: absolute;
top: 15px;
left: 15px;
width: 363px;
height: 169px;
background-color: #dfdfdf;
border-radius: 4px;
padding: 5px;
text-align: justify;
overflow: auto;
display: none;
transition: all 0.5s;
-webkit-transition: all 0.5s;
}
.pub_bloc3 {
width: 450px;
height: 35px;
margin: auto;
background-color: #3f87e1;
text-align: center;
}
#pub_predef_img {
margin-left: 30px;
margin-right: 30px;
}
</style>
</head>
<body>
<script type="text/javascript">
//<!--
function change_pubonglet(name)
{
document.getElementById('pubonglet_'+anc_pubonglet).className = 'pubonglet_0 pubonglet';
document.getElementById('pubonglet_'+name).className = 'pubonglet_1 pubonglet';
document.getElementById('contenu_pubonglet_'+anc_pubonglet).style.display = 'none';
document.getElementById('contenu_pubonglet_'+name).style.display = 'block';
anc_pubonglet = name;
}
//-->
</script>
<div class="pub_cadre">
<img src="URL_DE_L'iMAGE_DU_HAUT" alt="Image haut" class="pub_image_top" />
<div class="pub_body">
<div class="pub_bloc1">
<div class="pub_bloc1_text">
Texte derrière l'image.
</div>
<img src="URL_DE_L'iMAGE_DU_MILIEU" alt="Image milieu" class="pub_bloc1_img" />
</div>
<span class="pubonglet_1 pubonglet" id="pubonglet_Initial" onmouseover="javascript:change_pubonglet('Initial');"></span>
<img src="http://img11.hostingpics.net/pics/436524histoire.png" alt="Image histoire" class="pubonglet_0 pubonglet" id="pubonglet_Histoire" onmouseover="javascript:change_pubonglet('Histoire');" />
<img src="http://img11.hostingpics.net/pics/396239staffstats.png" alt="Image staff" class="pubonglet_0 pubonglet" id="pubonglet_Staff" onmouseover="javascript:change_pubonglet('Staff');" />
<img src="http://img11.hostingpics.net/pics/598703merci.png" alt="Image merci" class="pubonglet_0 pubonglet" id="pubonglet_Merci" onmouseover="javascript:change_pubonglet('Merci');" />
<div class="pub_bloc2">
<div class="contenu_pubonglet" id="contenu_pubonglet_Initial">
Passez sur les mots pour voir leur contenu ~
</div>
<div class="contenu_pubonglet" id="contenu_pubonglet_Histoire">
Contenu de l'onglet Histoire.
</div>
<div class="contenu_pubonglet" id="contenu_pubonglet_Staff">
Contenu de l'onglet Staff
</div>
<div class="contenu_pubonglet" id="contenu_pubonglet_Merci">
Contenu de l'onglet Merci
</div>
</div>
</div>
<div class="pub_bloc3">
<a href="LIEN_DU_REGLEMENT" target="_blank">
<img src="http://img11.hostingpics.net/pics/867597reglement.png" alt="Règlement" />
</a>
<a href="LIEN_DES_PREDEFINIS" target="_blank">
<img src="http://img11.hostingpics.net/pics/248333Prdfinis.png" alt="Prédéfinis" id="pub_predef_img" />
</a>
<a href="LIEN_DE_NOUS_REJOINDRE" target="_blank">
<img src="http://img11.hostingpics.net/pics/862017nousrejoindre.gif" alt="Nous Rejoindre" />
</a>
</div>
</div>
<script type="text/javascript">
//<!--
var anc_pubonglet = 'Initial';
change_pubonglet(anc_pubonglet);
//-->
</script>
</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="738px" height="842px" 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 ^^
