forum test team boulet
 
AccueilDernières imagesS'enregistrerConnexion
Le deal à ne pas rater :
Google Pixel 7 5G – Smartphone 6,3″ OLED FHD+ 8 Go + 128 Go
316 €
Voir le deal

 

 PA neverutopia à modifier

Aller en bas 
AuteurMessage
éléa
Administrateur
Administrateur
éléa


Cancer
Messages : 603
Age : 53

PA neverutopia à modifier Empty
MessageSujet: PA neverutopia à modifier   PA neverutopia à modifier I_icon_minitimeDim 23 Aoû - 18:36

JackSparrow a écrit:
appel du premier message :

Bonjour !

Voici une seconde mise en forme de page d'accueil très complète que vous n'avez plus qu'à remplir et modifier à votre goût (couleurs essentiellement). C'est une page d'accueil très condensée donc parfaite pour un forum déjà lourd ou long. En 650px de largeur par 240px de hauteur vous aurez le contexte, les news, le staff, les prédéfinis, les top site, partenaires, et les crédits. En sachant bien entendu que vous pouvez adapter les contenus à votre forum très facilement.

Voici un aperçu de la page d'accueil dont je vais vous fournir les codes :

[Seuls les administrateurs ont le droit de voir ce lien]

Il s'agit de la seconde mise en forme, celle comportant juste avant le titre "Page d'accueil "Mozaik" (aperçu du tutoriel)".
Vous pouvez constater qu'il y a énormément d'animations, elles sont réalisées seulement à l'aide du css donc aucun javascript n'est présent dans ce tutoriel. Le css est par contre assez long.

Le HTML :

Code:
Code:
<div id="mozaik"><div id="mozaik_top">
<span class="mozaik_titretop"><img src="http://img15.hostingpics.net/pics/612828topsite.png" alt="Top sites et Partenaires" /></span><div class="mozaik_contenu2">Votez pour nous !<br />
<a href="#"><img src="http://forum.reference-corrs.com/themes/etoile.gif" alt="Top" /></a><a href="#"><img src="http://forum.reference-corrs.com/themes/etoile.gif" alt="Top" /></a><a href="#"><img src="http://forum.reference-corrs.com/themes/etoile.gif" alt="Top" /></a>
<br /><br />
Nos Partenaires<br />
<a href="#"><img src="http://media2.paperblog.fr/i/468/4683274/bienvenue-nouvelle-partenaire-house-of-night--L-41CNGx-175x130.jpeg" alt="Nom du forum" /></a><a href="#"><img src="http://4.bp.blogspot.com/-ZYIzBqlG43Y/TrGS0QHf0QI/AAAAAAAAAIs/PzQsIVI3s48/s1600/0000000000000101230110642314831.png" alt="Nom du forum" /></a><a href="#"><img src="http://img11.hostingpics.net/pics/913004Partenaire1.gif" alt="Nom du forum" /></a>
</div>
</div><div id="mozaik_credits"><span class="mozaik_titrecredits"><img src="http://img15.hostingpics.net/pics/603093crdits.png" alt="Nos Crédits" /></span><div class="mozaik_contenu3">Nous remercions ...<br /><br />
Le contexte a été élaboré et rédigé par ..., ... et ... sous inspiration des oeuvres de ...<br />
Le graphisme du forum a été réalisé par ... <br />
Le codage a pu être mis en place grâce à ..., avec l'aide de ... <br />
Cette page d'accueil a été réalisée par Sparrow-style, prise sur <a href="http://www.never-utopia.com">Never-Utopia</a>.<br /><br />
(c) merci de respecter le travail de ces personnes. </div>
</div><div id="mozaik_accueil"><div id="mozaik1"><div class="mozaik_titre1"></div><div class="mozaik_contenu"><img src="http://24.media.tumblr.com/tumblr_m2pft6YL5K1qhyiolo1_500.gif" alt="" class="mozaik_illu" />Cyprum
 itidem insulam procul a continenti discretam et portuosam inter
municipia crebra urbes duae faciunt claram Salamis et Paphus, altera
Iovis delubris altera Veneris templo insignis. tanta autem tamque
multiplici fertilitate abundat rerum omnium eadem Cyprus ut nullius
externi indigens adminiculi indigenis viribus a fundamento ipso carinae
ad supremos usque carbasos aedificet onerariam navem omnibusque
armamentis instructam mari committat.
<br /><br />
Equitis
 Romani autem esse filium criminis loco poni ab accusatoribus neque his
iudicantibus oportuit neque defendentibus nobis. Nam quod de pietate
dixistis, est quidem ista nostra existimatio, sed iudicium certe
parentis; quid nos opinemur, audietis ex iuratis; quid parentes
sentiant, lacrimae matris incredibilisque maeror, squalor patris et haec
 praesens maestitia, quam cernitis, luctusque declarat.</div>
</div><div id="mozaik2"><div class="mozaik_titre2"></div><div class="mozaik_contenu"><div class="mozaik_news"><span class="mozaik_datenews">15/09/2012</span>Contenu nouveauté 1.</div><div class="mozaik_news"><span class="mozaik_datenews">21/09/2012</span>Contenu nouveauté 2.</div><div class="mozaik_news"><span class="mozaik_datenews">4/10/2012</span>Contenu nouveauté 3.</div></div>
</div><div id="mozaik3"><div class="mozaik_titre3"></div><div class="mozaik_contenu">

<span class="mozaik_avatar" style="background: url(http://i64.servimg.com/u/f64/09/04/37/22/avata360.png) center center no-repeat;"><span class="mozaik_avatardescr"><span class="mozaik_avatartitre">Nom du perso'</span>Hae
 duae provinciae bello quondam piratico catervis mixtae praedonum a
Servilio pro consule missae sub iugum factae sunt vectigales. et hae
quidem regiones velut in prominenti terrarum lingua positae ob orbe eoo
monte Amano disparantur.</span></span>

<span class="mozaik_avatar" style="background: url(http://img716.imageshack.us/img716/593/garfunkel01.jpg) center center no-repeat;"><span class="mozaik_avatardescr"><span class="mozaik_avatartitre">Nom du perso'</span>Description du membre, lien MP, etc...</span></span>

<span class="mozaik_avatar" style="background: url(http://img688.imageshack.us/img688/56/johnnydepp11.png) center center no-repeat;"><span class="mozaik_avatardescr"><span class="mozaik_avatartitre">Nom du perso'</span>Description du membre, lien MP, etc...</span></span></div></div><div id="mozaik4"><div class="mozaik_titre4"></div><div class="mozaik_contenu">
<table><tr>
<td style="vertical-align: top;"><span class="mozaik_predef"><span class="predef_icone"><img src="http://images1.fanpop.com/images/photos/1500000/Johnny-Depp-johnny-depp-1567237-100-100.jpg" alt="Predef" /></span><span class="predef_nom">Nom du Personnage</span>Description rapide du personnage. <a href="#">Voir sa fiche</a></span></span>
<span class="mozaik_predef"><span class="predef_icone"><img src="http://www.1001cocktails.com/magazine/wp-content/uploads/johnnydepp_whisky-300x213-1-100x100.jpg" alt="Predef" /></span><span class="predef_nom">Nom du Personnage</span>Description rapide du personnage. <a href="#">Voir sa fiche</a></span></span>
<span class="mozaik_predef"><span class="predef_icone"><img src="http://99.mgl.skyrock.net/art/PRIP.84674799.3.0.png" alt="Predef" /></span><span class="predef_nom">Nom du Personnage</span>Description rapide du personnage. <a href="#">Voir sa fiche</a></span></span>
</td>
<td style="vertical-align: top;">
<span class="mozaik_predef"><span class="predef_icone"><img src="http://a4.img.v4.skyrock.net/0836/72220836/pics/photo_72220836_1.png" alt="Predef" /></span><span class="predef_nom">Nom du Personnage</span>Description rapide du personnage. <a href="#">Voir sa fiche</a></span></span>
<span class="mozaik_predef"><span class="predef_icone"><img src="http://www.actucine.com/wp-content/uploads/2012/01/Johnny+Deep-100x100.jpg" alt="Predef" /></span><span class="predef_nom">Nom du Personnage</span>Description rapide du personnage. <a href="#">Voir sa fiche</a></span></span>
</td>
</tr></table>
</div>
</div>
</div></div>


Le CSS :

Code:
Code:
/* PAGE ACCUEIL MOZAIK */

#mozaik
{
  width: 660px;
  height: 260px;
  margin: auto;
}
#mozaik a
{
  font-weight: bold;
  color: #575757 !important;
  text-decoration: none !important;
}
#mozaik a:hover
{
  color: #3a3a3a;
  text-decoration: none !important;
}
#mozaik_top
{
  position: relative;
  z-index: 1;
  width: 30px;
  height: 238px;
  overflow: hidden;
  margin-top: 10px;
  float: left;
  background: #b9b9b9;
  border: 1px solid #d6d6d6;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
#mozaik_top:hover
{
  position: relative;
  z-index: 999;
  width: 330px;
  background: #d6d6d6;
  border: 1px solid #e3e3e3;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
#mozaik_credits
{
  position: relative;
  z-index: 1;
  width: 30px;
  height: 238px;
  overflow: hidden;
  margin-top: 10px;
  float: right;
  background: #b9b9b9;
  border: 1px solid #d6d6d6;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
#mozaik_credits:hover
{
  position: relative;
  z-index: 999;
  width: 330px;
  background: #d6d6d6;
  border: 1px solid #e3e3e3;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
.mozaik_titretop
{
  display: block;
  width: 30px;
  height: 238px;
  float: left;
  overflow: hidden;
  background-color: transparent;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
#mozaik_top:hover .mozaik_titretop
{
  background-color: #9e9e9e;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
.mozaik_titrecredits
{
  display: block;
  width: 30px;
  height: 238px;
  float: right;
  overflow: hidden;
  background-color: transparent;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
#mozaik_credits:hover .mozaik_titrecredits
{
  background-color: #9e9e9e;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
#mozaik_accueil
{
  width: 600px;
  height: 240px;
  margin: auto;
  padding: 10px;
  text-align: justify;
}
#mozaik1
{
  position: absolute;
  z-index: 1;
  width: 300px;
  height: 120px;
  overflow: hidden;
  background: #c19898;
  border-left: 3px solid #9e3535;
  box-shadow: 0px 0px 0px #000000;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
#mozaik1:hover
{
  z-index: 999;
  width: 600px;
  height: 240px;
  background: #dcdcdc;
  border-left: 0px solid #9e3535;
  box-shadow: 0px 0px 5px #000000;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
#mozaik2
{
  position: absolute;
  z-index: 1;
  width: 300px;
  height: 120px;
  overflow: hidden;
  background: #a8b6cc;
  border-right: 3px solid #3b5d94;
  box-shadow: 0px 0px 0px #000000;
  margin-left: 300px;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
#mozaik2:hover
{
  z-index: 999;
  width: 600px;
  height: 240px;
  margin-left: 0px;
  background: #dcdcdc;
  border-right: 0px solid #3b5d94;
  box-shadow: 0px 0px 5px #000000;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
#mozaik3
{
  position: absolute;
  z-index: 1;
  width: 300px;
  height: 120px;
  overflow: hidden;
  background: #a3c5a5;
  border-left: 3px solid #429046;
  box-shadow: 0px 0px 0px #000000;
  margin-top: 120px;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
#mozaik3:hover
{
  z-index: 999;
  width: 600px;
  height: 240px;
  margin-top: 0px;
  background: #dcdcdc;
  border-left: 0px solid #429046;
  box-shadow: 0px 0px 5px #000000;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
#mozaik4
{
  position: absolute;
  z-index: 1;
  width: 300px;
  height: 120px;
  overflow: hidden;
  background: #d7d1a0;
  border-right: 3px solid #c7b731;
  box-shadow: 0px 0px 0px #000000;
  margin-left: 300px;
  margin-top: 120px;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
#mozaik4:hover
{
  z-index: 999;
  width: 600px;
  height: 240px;
  margin-left: 0px;
  margin-top: 0px;
  background: #dcdcdc;
  border-right: 0px solid #c7b731;
  box-shadow: 0px 0px 5px #000000;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}

.mozaik_titre1
{
  width: 300px;
  height: 120px;
  background: url(http://img15.hostingpics.net/pics/372569contexte.png) top left no-repeat transparent;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
#mozaik1:hover .mozaik_titre1
{
  width: 600px;
  height: 60px;
  background: url(http://img15.hostingpics.net/pics/372569contexte.png) top left no-repeat #9e3535;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
.mozaik_titre2
{
  width: 300px;
  height: 120px;
  background: url(http://img15.hostingpics.net/pics/898361lesnews.png) top left no-repeat transparent;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
#mozaik2:hover .mozaik_titre2
{
  width: 600px;
  height: 60px;
  background: url(http://img15.hostingpics.net/pics/898361lesnews.png) top left no-repeat #3b5d94;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
.mozaik_titre3
{
  width: 300px;
  height: 120px;
  background: url(http://img15.hostingpics.net/pics/707275staff.png) top left no-repeat transparent;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
#mozaik3:hover .mozaik_titre3
{
  width: 600px;
  height: 60px;
  background: url(http://img15.hostingpics.net/pics/707275staff.png) top left no-repeat #429046;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
.mozaik_titre4
{
  width: 300px;
  height: 120px;
  background: url(http://img15.hostingpics.net/pics/585458predef.png) top left no-repeat transparent;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
#mozaik4:hover .mozaik_titre4
{
  width: 600px;
  height: 60px;
  background: url(http://img15.hostingpics.net/pics/585458predef.png) top left no-repeat #c7b731;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}

.mozaik_contenu
{
  width: 98%;
  margin-left: auto;
  margin-right: auto;
  margin-top: 5px;
  height: 160px;
  overflow: auto;
  font-size: 11px;
  color: #7d7d7d;
  text-shadow: 1px 1px 0px #f1f1f1;
}
.mozaik_contenu2
{
  width: 280px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 5px;
  height: 220px;
  overflow: auto;
  font-size: 12px;
  font-weight: bold;
  text-transform: uppercase;
  text-align: center;
  color: #7d7d7d;
  text-shadow: 1px 1px 0px #f1f1f1;
}
.mozaik_contenu3
{
  width: 280px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 5px;
  height: 220px;
  overflow: auto;
  font-size: 11px;
  font-style: italic;
  text-align: left;
  color: #7d7d7d;
  text-shadow: 1px 1px 0px #f1f1f1;
}
.mozaik_illu
{
  width: 150px;
  float: left;
  border: 1px solid #ffffff;
  margin: 5px;
}
.mozaik_news
{
  margin: 5px;
  padding-bottom: 5px;
  border-bottom: 1px solid #3b5d94;
}
.mozaik_datenews
{
  display: inline-block;
  font-size: 12px;
  font-weight: bold;
  color: #3b5d94;
  margin-right: 20px;
}
.mozaik_avatar
{
  position: relative;
  z-index: 1;
  display: inline-block;
  width: 80px;
  height: 150px;
  overflow: hidden;
  border: 2px solid #9e9e9e;
  box-shadow: 0px 0px 0px #000000;
  opacity: 0.5;
  -moz-opacity: 0.5;
  -khtml-opacity: 0.5;
  filter: alpha(opacity=50);
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
.mozaik_avatar:hover
{
  position: relative;
  z-index: 999;
  display: inline-block;
  width: 150px;
  height: 150px;
  overflow: hidden;
  border: 2px solid #9e9e9e;
  box-shadow: 0px 0px 5px #000000;
  opacity: 1;
  -moz-opacity: 1;
  -khtml-opacity: 1;
  filter: alpha(opacity=100);
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
.mozaik_avatardescr
{
  display: block;
  background: url(http://img15.hostingpics.net/pics/301068noir50.png);
  margin-top: 150px;
  height: 150px;
  overflow: auto;
  color: #e4e4e4;
  font-size: 10px;
  line-height: 12px;
  text-shadow: 1px 1px 0px #000000;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
.mozaik_avatar:hover .mozaik_avatardescr
{
  margin-top: 130px;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
.mozaik_avatardescr:hover
{
  margin-top: 0px !important;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
.mozaik_avatartitre
{
  display: block;
  text-align: center;
  font-size: 12px;
  font-weight: bold;
  text-transform: uppercase;
  margin-bottom: 10px;
}
.mozaik_predef
{
  clear: both;
  display: block;
  height: 60px;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
.mozaik_predef:hover
{
  display: block;
  height: 60px;
  box-shadow: 0px 0px 5px #000000;
  transition: 1s;
  -moz-transition: 1s;
  -o-transition: 1s;
  -htm-transition: 1s;
  -webkit-transition: 1s;
  -ms-transition: 1s;
}
.mozaik_predef a
{
  text-transform: uppercase;
  color: #52400a !important;
  text-decoration: none !important;
  text-shadow: 1px 1px 0px #ffffff;
}
.mozaik_predef a:hover
{
  text-decoration: none !important;
}
.predef_icone
{
  display: block;
  float: left;
  width: 50px;
  height 50px;
  overflow: hidden;
  margin: 5px;
  border: 2px solid #9e9e9e;
}
.predef_icone img
{
  width: 50px;
}
.predef_nom
{
  display: block;
  font-size: 12px;
  font-weight: bold;
  text-transform: uppercase;
  color: #937723;
}


Les Modifications :

Pour simplifier les choses j'ai affiché le titre des blocs et des onglets coulissants en image. ainsi, vous pourrez assez facilement réaliser les votres, selon le genre de votre forum. Il suffira de les faire en transparence pour conserver l'effet de transition dans le changement de la couleur de fond du titre.
Je vous conseille également de garder les mêmes tailles d'image que moi, pour éviter d'avoir à modifier les tailles dans le css.

Les couleurs sont bien évidemment modifiables dans le css, il peut s'agit de la même couleur pour chaque cadre. Il y a beaucoup de changements de couleur, je vous conseille de faire pour un bloc survolé un fond plus clair que lorsqu'il n'est pas survolé.

Voici pour vous aider des morceaux de code, ceux correspondant uniquement aux avatars du staff ou aux prédéfinis, si vous souhaitez en ajouter et que vous vous perdez un peu dans les codes :

Ajouter une news :
Code:
Code:
<div class="mozaik_news"><span class="mozaik_datenews">15/09/2012</span>Contenu nouveauté 1.</div>

Ajouter un membre du staff :
Code:
Code:
<span class="mozaik_avatar" style="background: url(http://img716.imageshack.us/img716/593/garfunkel01.jpg) center center no-repeat;"><span class="mozaik_avatardescr"><span class="mozaik_avatartitre">Nom du perso'</span>Description du membre, lien MP, etc...</span></span>

Ajouter un prédéfini :
Code:
Code:
<span class="mozaik_predef"><span class="predef_icone"><img src="http://images1.fanpop.com/images/photos/1500000/Johnny-Depp-johnny-depp-1567237-100-100.jpg" alt="Predef" /></span><span class="predef_nom">Nom du Personnage</span>Description rapide du personnage. <a href="#">Voir sa fiche</a></span></span>
(Ils sont à ajouter d'un côté ou de l'autre du tableau.)

Lien de la page : [Seuls les administrateurs ont le droit de voir ce lien]
Revenir en haut Aller en bas
https://tous-amis.forumactif.com
éléa
Administrateur
Administrateur
éléa


Cancer
Messages : 603
Age : 53

PA neverutopia à modifier Empty
MessageSujet: Re: PA neverutopia à modifier   PA neverutopia à modifier I_icon_minitimeVen 28 Aoû - 17:18

[Seuls les administrateurs ont le droit de voir ce lien]

Code:
[url=http://www.servimg.com/view/19007617/581][img]http://i18.servimg.com/u/f18/19/00/76/17/histoi10.jpg[/img][/url]

Code:
http://i18.servimg.com/u/f18/19/00/76/17/histoi10.jpg


[Seuls les administrateurs ont le droit de voir ce lien]

Code:
[url=http://www.servimg.com/view/19007617/582][img]http://i18.servimg.com/u/f18/19/00/76/17/les-no10.jpg[/img][/url]



Code:
http://i18.servimg.com/u/f18/19/00/76/17/les-no10.jpg



[Seuls les administrateurs ont le droit de voir ce lien]

Code:
[url=http://www.servimg.com/view/19007617/583][img]http://i18.servimg.com/u/f18/19/00/76/17/staff10.jpg[/img][/url]

Code:
http://i18.servimg.com/u/f18/19/00/76/17/staff10.jpg


[Seuls les administrateurs ont le droit de voir ce lien]

Code:
[url=http://www.servimg.com/view/19007617/584][img]http://i18.servimg.com/u/f18/19/00/76/17/liens-10.jpg[/img][/url]


Code:
http://i18.servimg.com/u/f18/19/00/76/17/liens-10.jpg
Revenir en haut Aller en bas
https://tous-amis.forumactif.com
éléa
Administrateur
Administrateur
éléa


Cancer
Messages : 603
Age : 53

PA neverutopia à modifier Empty
MessageSujet: Re: PA neverutopia à modifier   PA neverutopia à modifier I_icon_minitimeVen 28 Aoû - 17:34

[Seuls les administrateurs ont le droit de voir ce lien]


Code:
[url=http://www.servimg.com/view/19007617/585][img]http://i18.servimg.com/u/f18/19/00/76/17/news10.jpg[/img][/url]

Code:
http://i18.servimg.com/u/f18/19/00/76/17/news11.jpg
Revenir en haut Aller en bas
https://tous-amis.forumactif.com
éléa
Administrateur
Administrateur
éléa


Cancer
Messages : 603
Age : 53

PA neverutopia à modifier Empty
MessageSujet: Re: PA neverutopia à modifier   PA neverutopia à modifier I_icon_minitimeVen 28 Aoû - 17:38

[Seuls les administrateurs ont le droit de voir ce lien]

Code:
[url=http://www.servimg.com/view/19007617/587][img]http://i18.servimg.com/u/f18/19/00/76/17/news-110.jpg[/img][/url]


Code:
http://i18.servimg.com/u/f18/19/00/76/17/news-110.jpg
Revenir en haut Aller en bas
https://tous-amis.forumactif.com
éléa
Administrateur
Administrateur
éléa


Cancer
Messages : 603
Age : 53

PA neverutopia à modifier Empty
MessageSujet: Re: PA neverutopia à modifier   PA neverutopia à modifier I_icon_minitimeVen 28 Aoû - 17:56

[Seuls les administrateurs ont le droit de voir ce lien]

Code:
[url=http://www.servimg.com/view/19007617/588][img]http://i18.servimg.com/u/f18/19/00/76/17/histoi11.jpg[/img][/url]

Code:
http://i18.servimg.com/u/f18/19/00/76/17/histoi11.jpg


[Seuls les administrateurs ont le droit de voir ce lien]

Code:
[url=http://www.servimg.com/view/19007617/589][img]http://i18.servimg.com/u/f18/19/00/76/17/staff-10.jpg[/img][/url]

Code:
http://i18.servimg.com/u/f18/19/00/76/17/staff-10.jpg


[Seuls les administrateurs ont le droit de voir ce lien]

Code:
[url=http://www.servimg.com/view/19007617/590][img]http://i18.servimg.com/u/f18/19/00/76/17/liens-11.jpg[/img][/url]

Code:
http://i18.servimg.com/u/f18/19/00/76/17/liens-11.jpg
Revenir en haut Aller en bas
https://tous-amis.forumactif.com
éléa
Administrateur
Administrateur
éléa


Cancer
Messages : 603
Age : 53

PA neverutopia à modifier Empty
MessageSujet: Re: PA neverutopia à modifier   PA neverutopia à modifier I_icon_minitimeVen 28 Aoû - 17:56

[Seuls les administrateurs ont le droit de voir ce lien]

Code:
[url=http://www.servimg.com/view/19007617/591][img]http://i18.servimg.com/u/f18/19/00/76/17/pannea10.jpg[/img][/url]

Code:
http://i18.servimg.com/u/f18/19/00/76/17/pannea10.jpg
Revenir en haut Aller en bas
https://tous-amis.forumactif.com
éléa
Administrateur
Administrateur
éléa


Cancer
Messages : 603
Age : 53

PA neverutopia à modifier Empty
MessageSujet: Re: PA neverutopia à modifier   PA neverutopia à modifier I_icon_minitimeVen 28 Aoû - 18:21

[Seuls les administrateurs ont le droit de voir ce lien]

Code:
[url=http://www.servimg.com/view/19007617/592][img]http://i18.servimg.com/u/f18/19/00/76/17/test_010.png[/img][/url]

Code:
http://i18.servimg.com/u/f18/19/00/76/17/test_010.png
Revenir en haut Aller en bas
https://tous-amis.forumactif.com
éléa
Administrateur
Administrateur
éléa


Cancer
Messages : 603
Age : 53

PA neverutopia à modifier Empty
MessageSujet: Re: PA neverutopia à modifier   PA neverutopia à modifier I_icon_minitimeVen 28 Aoû - 18:23

[Seuls les administrateurs ont le droit de voir ce lien]

Code:
[url=http://www.servimg.com/view/19007617/593][img]http://i18.servimg.com/u/f18/19/00/76/17/test_011.png[/img][/url]

Code:
http://i18.servimg.com/u/f18/19/00/76/17/test_011.png
Revenir en haut Aller en bas
https://tous-amis.forumactif.com
éléa
Administrateur
Administrateur
éléa


Cancer
Messages : 603
Age : 53

PA neverutopia à modifier Empty
MessageSujet: Re: PA neverutopia à modifier   PA neverutopia à modifier I_icon_minitimeVen 28 Aoû - 18:30

[Seuls les administrateurs ont le droit de voir ce lien]

Code:
[url=http://www.servimg.com/view/19007617/594][img]http://i18.servimg.com/u/f18/19/00/76/17/test-c10.png[/img][/url]

Code:
http://i18.servimg.com/u/f18/19/00/76/17/test-c10.png
Revenir en haut Aller en bas
https://tous-amis.forumactif.com
éléa
Administrateur
Administrateur
éléa


Cancer
Messages : 603
Age : 53

PA neverutopia à modifier Empty
MessageSujet: Re: PA neverutopia à modifier   PA neverutopia à modifier I_icon_minitimeVen 28 Aoû - 18:30

[Seuls les administrateurs ont le droit de voir ce lien]

Code:
[url=http://www.servimg.com/view/19007617/595][img]http://i18.servimg.com/u/f18/19/00/76/17/test-c11.png[/img][/url]

Code:
http://i18.servimg.com/u/f18/19/00/76/17/test-c11.png
Revenir en haut Aller en bas
https://tous-amis.forumactif.com
éléa
Administrateur
Administrateur
éléa


Cancer
Messages : 603
Age : 53

PA neverutopia à modifier Empty
MessageSujet: Re: PA neverutopia à modifier   PA neverutopia à modifier I_icon_minitimeVen 28 Aoû - 18:48

[Seuls les administrateurs ont le droit de voir ce lien]

Code:
[url=http://www.servimg.com/view/19007617/596][img]http://i18.servimg.com/u/f18/19/00/76/17/liens-12.jpg[/img][/url]

Code:
http://i18.servimg.com/u/f18/19/00/76/17/liens-12.jpg
Revenir en haut Aller en bas
https://tous-amis.forumactif.com
éléa
Administrateur
Administrateur
éléa


Cancer
Messages : 603
Age : 53

PA neverutopia à modifier Empty
MessageSujet: Re: PA neverutopia à modifier   PA neverutopia à modifier I_icon_minitimeVen 28 Aoû - 18:52

[Seuls les administrateurs ont le droit de voir ce lien]

Code:
[url=http://www.servimg.com/view/19007617/597][img]http://i18.servimg.com/u/f18/19/00/76/17/staff-11.jpg[/img][/url]

Code:
http://i18.servimg.com/u/f18/19/00/76/17/staff-11.jpg
Revenir en haut Aller en bas
https://tous-amis.forumactif.com
Contenu sponsorisé





PA neverutopia à modifier Empty
MessageSujet: Re: PA neverutopia à modifier   PA neverutopia à modifier I_icon_minitime

Revenir en haut Aller en bas
 
PA neverutopia à modifier
Revenir en haut 
Page 1 sur 1

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
 :: catégorie-2 :: test-3-
Sauter vers: