AccueilAccueil  RechercherRechercher  MembresMembres  GroupesGroupes  S'enregistrerS'enregistrer  Connexion  

Partagez | 
 

 Modèle de code

Voir le sujet précédent Voir le sujet suivant Aller en bas 
AuteurMessage
Admin

avatar
Admin

PRESENT(E) DEPUIS : 04/10/2016 MESSAGES : 21 CREDITS : sweet disaster (av.)

Voir le profil de l'utilisateur http://albuquerque.forumactif.com

MessageSujet: Modèle de code   Mer 19 Oct - 18:55

NB : les codes sont de Zadig sur Bazzart.

A METTRE A CHAQUE DEBUT DE POST :
Code:
<link href='http://fonts.googleapis.com/css?family=Grand+Hotel' rel='stylesheet' type='text/css'><link href='http://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'><link href='http://Zadig.opendrive.com/files/85298802_ewQZo/Instagram%20-%20CSS%20Page%20principale.css' rel='stylesheet' type='text/css'><!--
--> <style type='text/css'>.photo{width: 100px; height: 100px; padding:5px; margin: 5px;} .photo-inside{width: 100px; height:100px; background-color: rgba(0, 0, 0, 0.1); background-size:100px;position: relative;left: -1px;top: -1px;}.instapost {width: 480px; background: none repeat scroll 0% 0% #F8F8F8; padding: 5px; border-radius: 5px; margin-bottom: 5px;}</style>

PAGE PRICIPALE :
Code:
<center> <div class="insta-fond"><!--

---- Début de la barre Instagram ----

--> <div class="insta-barre"><!--
--> <table cellpadding="0" cellspacing="0"><tr><td><div style="position: relative; left:-130px;"><table cellpadding="0" cellspacing="0"><tr><td><div class="insta-separator"></div></td><td><div style="background-color:rgba(6, 54, 95, 0.35); height:30px;"><a href="http://www.bazzart.org/u4334"> <div class="insta-home"> </div></a> </div></td><td><div class="insta-separator"></div></td></tr></table></div></td><td><div class="logo"> Instagram </div> </td><td><div style="position: relative; right:-127px;"> <!--
--><table cellpadding="0" cellspacing="0"><tr><td><div class="insta-separator"></div> </td><td> <!--

--><div style="margin-left:8px; margin-right:3px;"><!--
Début mini icone utilisateur
--> <div class="mini-icon-profile" style="background-image: url(votre-image de profil);"></div><!--
Fin icone utilisateur et début Username
--></div> </td><td><div class="insta-miniusername">Votre Username ici</div><!--
----- Fin Username -----
--></td><td><div class="insta-separator"></div></td></tr></table></div></td></tr></table> </div><!--

---- FIN de la barre Instagram ----

--><div class="insta-feed-header" style=""><!--

---------- Début du header contenant les icones --------------------

--> <div class="insta-icon-container"> <table cellpadding="0" cellspacing="0"><tr><td><!--
----- IMAGE 1 -----
--><!--
IMAGE 1.a--><div id="instaimg1" style="background-image: url(votre-image);"> <!--
IMAGE 1.b
--><div class="instahover1" style="background-image: url(votre-image);"></div></div><!--
---- IMAGE 2 ----
--> <!-- IMAGE 2.a
--> <div id="instaimg2" style="background-image: url(votre-image);"> <!--
IMAGE 2.b
--><div class="instahover2" style="background-image: url(votre-image);"></div></div></td><td><!--
----- IMAGE 3 (grande pic) -----
--><!--
IMAGE 3.a --><div id="instaimg" style="background-image: url(votre-image);"><!--
IMAGE 3.b
--><div class="instahover" style="background-image: url(votre-image);"></div></div></td><td><!--
------ IMAGE 4 ------
--><!-- IMAGE 4.a
--><div id="instaimg3" style="background-image: url(http://img4.hostingpics.net/pics/818362NicoIc4.png);"><!--
IMAGE 4.b
--><div class="instahover3" style="background-image: url(votre-image);"></div></div> <!--
------ IMAGE 5 ------
--><!-- IMAGE 5.a
--><div id="instaimg4" style="background-image: url(votre-image);"><!--
IMAGE 5.b
--><div class="instahover4" style="background-image: url(votre-image);"></div></div></td> <td><!--
------ IMAGE 6 ------
--><!-- IMAGE 6.a
--><div id="instaimg5" style="background-image: url(votre-image);"><!--
IMAGE 6.b
--><div class="instahover5" style="background-image: url(votre-image);"></div></div><!--
------ IMAGE 7 ------
--><!-- IMAGE 7.a
--> <div id="instaimg6" style="background-image: url(votre-image);"><!--
------ IMAGE 7 ------
--><!-- IMAGE 7.b
--><div class="instahover6" style="background-image: url(votre-image);"></div></div></td></tr></table> </div></div><!--

---------- FIN du header contenant les icones --------------------

--> <div class="insta-fond-profile"><table cellpadding="0" cellspacing="0"><tr><td><div class="icon-profile-wrap"> <!--

---------- Icone du profil (la même que la mini) --------------------

--><div class="icon-profile" style="background-image: url(votre-image de profil);"><!--

--></div><div style="height:4px;"></div><div class="insta-button-follow"> <div class="insta-follow-text"> Following</div></div></div></td><td><!--
------------ DEBUT DU PROFIL ------------------
--><div class="insta-username2">Nom d'utilisateur </div><!--
--><div class="bio-user"> <b>Pseudo, nom, whatever</b> Hello my name is Robert </div></td><td> <!--
------------ DEBUT DES STATS ------------------
--><div class="insta-stat"><center><!--
------------ Nombre de posts ------------------
--><table cellpadding="0" cellspacing="0"><tr> <td> <div class="stat-a">###</div> <div class="stat-b"> posts </div></td> <!--
------------ Nombre de followers ------------------
--><td> <div class="stat-separator"></div></td><td><div class="stat-a">###</div><div class="stat-b"> followers </div></td><!--
------------ Nombre de compte suivis ------------------
--><td><div class="stat-separator"></div></td><td><div class="stat-a">###</div><div class="stat-b"> following </div></td></tr></table></center></div></td></tr></table></div><!--
------------ FIN DU PROFIL ------------------
--> <!--
------------ DEBUT DU FEED PHOTOS ------------------
--><div class="feed-photos"><table cellpadding="0" cellspacing="0" class="feed-photo-container"><tr><!--

--> <td> <div class="photo"> <div class="photo-inside" style="background-image: url(votre-image);"> </div></div></td><!--

--> <td> <div class="photo"> <div class="photo-inside" style="background-image: url(votre-image);"> </div></div></td><!--

--> <td> <div class="photo"> <div class="photo-inside" style="background-image: url(votre-image);"> </div></div></td><!--

--> <td> <div class="photo"> <div class="photo-inside" style="background-image: url(votre-image);"> </div></div></td><!--
--> </tr> </table><!--

--><div class="feed-divider"></div><!--

--> <table cellpadding="0" cellspacing="0" class="feed-photo-container"><tr><!--
--><td> <div class="photo"> <div class="photo-inside" style="background-image: url(votre-image);"> </div></div></td> <!--

--><td> <div class="photo"> <div class="photo-inside" style="background-image: url(votre-image);"> </div></div></td><!--

--> <td> <div class="photo"> <div class="photo-inside" style="background-image: url(votre-image);"> </div></div></td><!--

--> <td> <div class="photo"> <div class="photo-inside" style="background-image: url(votre-image);"> </div></div></td><!--

--> </tr> </table>  <!--
Coller le code avant le <!-- précédent pour rajouter des lignes.
--></div><div class="load-footer">Load more...</div></div> </center>

NOUVEAU POST :
Code:
<center><!--

---- Début de la barre Instagram ----

--> <div class="insta-barre" style="left:0px;"><!--
--> <table cellpadding="0" cellspacing="0"><tr><td><div style="position: relative; left:-130px;"><table cellpadding="0" cellspacing="0"><tr><td><div class="insta-separator"></div></td><td><div style="background-color:rgba(6, 54, 95, 0.35); height:30px;"><a href="http://www.bazzart.org/u4334"> <div class="insta-home"> </div></a> </div></td><td><div class="insta-separator"></div></td></tr></table></div></td><td><div class="logo"> Instagram </div> </td><td><div style="position: relative; right:-127px;"> <!--
--><table cellpadding="0" cellspacing="0"><tr><td><div class="insta-separator"></div> </td><td> <!--

--><div style="margin-left:8px; margin-right:3px;"><!--
Début mini icone utilisateur
--> <div class="mini-icon-profile" style="background-image: url(votre image de profil);"></div><!--
Fin icone utilisateur et début Username
--></div> </td><td><div class="insta-miniusername">Votre Username ici</div><!--
----- Fin Username -----
--></td><td><div class="insta-separator"></div></td></tr></table></div></td></tr></table> </div><!--

---- FIN de la barre Instagram ----

--><div class="insta-fond" style="padding-top:5px;"><div class="instapost"><table cellpadding=0 cellspacing=0 cellmargin=0 width=100%><tr valign="middle"><td width="230px" style="border-right: 1px solid #AAA; padding: 3px;"><a href="http://www.bazzart.org/u4334"><!--

--><div class="insta-post-left"> <!--
Votre image de post
--><div class="insta-post-left-img" style="background:url(Pic postée)"></div></div></a><!--

--></td><td><!--

--><div style="background: #fefefe;"><div class="profile-bar"><table width="100%"><tr valign="top"><!--
Mini-image de profil
--><td width="30px"><div class="insta-comment-img" style="background:url(votre image)"></div></td><td><!--

--><div class="insta-poster">Votre pseudo <!--
--><b># days ago</b> </div></td><!--

--><td width="60px"><div class="insta-button-follow" style="margin-top: 0px"><span class="insta-follow-text">Following</span></div></td></tr><!--

--><tr><td colspan="2"><div class="instacap"> Ta vie, tes tags #Jambon ! </div> </td></tr></table></div> <!--
La Like bar. Si t'as pas de likes, bah tu mets 0 *pan*
--><div class="likesBar"> <span class="likesBar-pseudo">Saucisse au jambon</span> and <span class="likesBar-number">125</span> others like this. </div><!--
Les champs des commentaires
--> <div class="insta-comment"><!--

--> <div style="icomm"> <div class="insta-comment-img" style="background:url(image de profil du commentateur)"></div> <b>un pseudo</b><br/> un commentaire. <i>#tag</i> <a href="" class="insta-link">@Link</a></div><br/> <!--

--><div style="icomm"> <div class="insta-comment-img" style="background:url(image de profil du commentateur)"></div> <b>un pseudo</b> <br/> un commentaire.</div>
<!-- Remplacer ici pour rajouter des commentaires -->
</div><!--
--> <div style="background: #fefefe; padding: 0px 0px"><img src="http://image.noelshack.com/fichiers/2014/13/1395771220-0nwsiwm2.png"/></div></div><!--

--></td></tr></table> </div></div></center>

POSTER UN COMMENTAIRE :
Code:
<center><!--

---- Début de la barre Instagram ----

--> <div class="insta-barre" style="left:0px;"><!--
--> <table cellpadding="0" cellspacing="0"><tr><td><div style="position: relative; left:-130px;"><table cellpadding="0" cellspacing="0"><tr><td><div class="insta-separator"></div></td><td><div style="background-color:rgba(6, 54, 95, 0.35); height:30px;"><a href="http://www.bazzart.org/u4334"> <div class="insta-home"> </div></a> </div></td><td><div class="insta-separator"></div></td></tr></table></div></td><td><div class="logo"> Instagram </div> </td><td><div style="position: relative; right:-127px;"> <!--
--><table cellpadding="0" cellspacing="0"><tr><td><div class="insta-separator"></div> </td><td> <!--

--><div style="margin-left:8px; margin-right:3px;"><!--
Début mini icone utilisateur
--> <div class="mini-icon-profile" style="background-image: url(votre-image);"></div><!--
Fin icone utilisateur et début Username
--></div> </td><td><div class="insta-miniusername">Votre Username ici</div><!--
----- Fin Username -----
--></td><td><div class="insta-separator"></div></td></tr></table></div></td></tr></table> </div><!--

---- FIN de la barre Instagram ----

--><div class="insta-fond" style="padding-top:2px;"><div class="insta-reply-wrap"><div class="insta-reply-img" style="background:url(votre-image)"></div> <span class="reply-pseudo">un pseudo</span> Commentaire pas trop long sinon ça devient grave moche </div></div></center>
Admin

avatar
Admin

PRESENT(E) DEPUIS : 04/10/2016 MESSAGES : 21 CREDITS : sweet disaster (av.)

Voir le profil de l'utilisateur http://albuquerque.forumactif.com

MessageSujet: Re: Modèle de code   Mer 19 Oct - 18:58

version mobile

NB : les codes sont de Chaussette sur Bazzart.

PAGE PRINCIPALE :
Code:
<link href='https://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'><style>.fondinsta{width:400px; height: 650px;margin:auto; background:white} .fondhautinsta{width:375px; height: 25px; margin:auto; background:#f9f9f9;border-bottom:solid #dbdbdb 2px;text-align:left;padding:5px;padding-left:15px;padding-top:10px; padding-right:10px;} .textegras{font-family: 'Roboto', sans-serif;font-weight:bold;text-transform: lowercase;color:#262626;font-size: 12px;} .photoprofil{width: 80px; height:80px; border-radius:100px;margin-left:25px;margin-right:20px;margin-top:-10px;} .groupeinfo{width:60px;text-align:center;margin-right:10px;margin-left:5px;} .groupeens{width:250px; height: 100px; margin:auto; background:;margin-left:px;} .textenormal{font-family: 'Roboto', sans-serif;text-transform: lowercase;color:#c1c1c1; font-size: 12px;} .modifier{width:200px; height:15px; text-align:center; background:#eeeeee;text-transform: uppercase;padding:5px; color:#262626;font-family: 'Roboto', sans-serif; font-size: 11px;} .descriptioninst{width:375px; text-align:left;padding:5px;padding-left:15px; padding-right:10px;font-family: 'Roboto', sans-serif;color:#262626;font-size: 12px;padding-bottom:10px;} .catinst{width:375px; border-bottom:solid #dbdbdb 1px;border-top:solid #dbdbdb 1px;padding:5px;padding-top: 10px;padding-left:15px; padding-right:10px;padding-bottom:5px;} .basinst{width:375px; padding:5px;padding-top: 10px;padding-left:15px; padding-right:10px;padding-bottom:5px;} .basbasinst{width: 20px; height:20px; border-radius:30px;padding:2px;border:solid #dbdbdb 1px; margin-left:50px;}</style>

<center><div class="fondinsta"> <div class="fondhautinsta"><span class="textegras">PSEUDO</span><img src="http://nsa38.casimages.com/img/2016/05/26//160526064351413379.png" style=" width: 20px;" align="right"></div>
<center><table><tr><td><img src="URL ICON PHOTO DE PROFIL" class="photoprofil "></td><td><div class="groupeens"><table><tr><td><center><div class="groupeinfo"><span class="textegras">102</span>
<span class="textenormal">publicatio...</span></div></center></td><td><center><div class="groupeifo "><span class="textegras">102</span>
<span class="textenormal">abonnés</span></center></td><td><div style="width:60px;margin-right:10px;text-align:center; "><span class="textegras">102</span>
<span class="textenormal">abonnem...</span></td></tr></table><div class="modifier">Modifier votre profil</div> </div></td></tr></table></center><div class="descriptioninst">Blabla blabla bla
blabla bla bla lba
balablalbalab </div><div class="catinst"><center><img src="http://nsa38.casimages.com/img/2016/05/26//16052607411967944.png" style=" width: 20px; "> <img src="http://nsa38.casimages.com/img/2016/05/26//160526075311560793.png" style=" width: 20px;margin-left:50px; "> <img src="http://nsa38.casimages.com/img/2016/05/26//160526075410604013.png" style=" width: 20px;margin-left:50px; "> <img src="http://nsa37.casimages.com/img/2016/05/26//160526075608264211.png" style=" width: 20px; margin-left:50px;"></center></div><div style="width:400px; height: 330px; overflow:auto;"><table><tr><td><div style="background-image:url('URL IMAGE POSTE'); background-position:50% 50%; width: 125px;height:125px;" ></div></td><td> <div style="background-image:url('URL IMAGE POSTE'); background-position:50% 50%; width: 125px;height:125px;"></div></td><td> <div style="background-image:url('URL IMAGE POSTE'); background-position:50% 50%; width: 125px;height:125px;" ></div></td></tr></table><table><tr><td><div style="background-image:url('URL IMAGE POSTE'); background-position:50% 50%; width: 125px;height:125px;" ></div></td><td> <div style="background-image:url('URL IMAGE POSTE'); background-position:50% 50%; width: 125px;height:125px;"></div></td><td> <div style="background-image:url('URL IMAGE POSTE'); background-position:50% 50%; width: 125px;height:125px;" ></div></td></tr></table><table><tr><td><div style="background-image:url('URL IMAGE POSTE'); background-position:50% 50%; width: 125px;height:125px;" ></div></td><td> <div style="background-image:url('URL IMAGE POSTE'); background-position:50% 50%; width: 125px;height:125px;"></div></td><td> <div style="background-image:url('URL IMAGE POSTE'); background-position:50% 50%; width: 125px;height:125px;" ></div></td></tr></table>
</div><div class="basinst"><center><img src="http://nsa38.casimages.com/img/2016/05/26//160526083217725288.png" style=" width: 20px; "> <img src="http://nsa38.casimages.com/img/2016/05/26//160526083217824597.png" style=" width: 20px;margin-left:50px; "> <img src="http://nsa38.casimages.com/img/2016/05/26//160526081554793286.png" style=" width: 20px;margin-left:50px; "> <img src="http://nsa37.casimages.com/img/2016/05/26//160526083145909905.png" style=" width: 20px;margin-left:50px; "> <img src="URL ICON PHOTO PROFIL" class=" basbasinst"></center></div></div></center>
[font=Arial][size=7]CREDIT > [url=http://socktreasurebox.e-monsite.com/]CHAUSSETTE[/url][/size][/font]

NOUVEAU POST :
Code:
<link href='https://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'><style>.fondinsta{width:400px; height: auto;margin:auto; background:white;} .fondhautinsta{width:375px; height: 25px; margin:auto; background:#f9f9f9;border-bottom:solid #dbdbdb 2px;text-align:left;padding:5px;padding-left:15px;padding-top:10px; padding-right:10px;} .textegras{font-family: 'Roboto', sans-serif;font-weight:bold;text-transform: lowercase;color:#262626;font-size: 12px;} .photoprofil1{width:30px;height:30px; border-radius:30px;border:solid #dbdbdb 1px; margin-left:10px;} .descrient{width:365px; text-align:left;padding:5px;padding-left:15px; padding-right:10px;font-family: 'Roboto', sans-serif;color:#262626;font-size: 12px;padding-bottom:10px;text-align:justify;border-top:solid #dbdbdb 1px;}  </style>

<center><div class="fondinsta"> <div class="fondhautinsta"><center><img src="http://nsa38.casimages.com/img/2016/05/27//16052711280072955.png" style=" height: 30px;margin-top:-5px;margin-right:-30px;" align="center"><img src="http://nsa37.casimages.com/img/2016/05/27//160527114723458714.png" style=" height: 30px;margin-top:-5px;" align="right"></div>
<table><tr><td><img src="URL D'UNE ICONE PHOTO DE PROFIL" class="photoprofil1"></td><td> <div style="width:300px; margin-left:10px;"><span class="textegras">PSEUDO</span><img src="http://nsa38.casimages.com/img/2016/05/27//160527120447172296.png" style=" height: 30px;margin-top:-5px;" align="right"></div></td></tr></table> 
<img src="URL DE L'IMAGE DU POSTE" style="margin-top:px; width:400px;" align="center">
<img src="http://nsa37.casimages.com/img/2016/05/27//160527013643567319.png" style=" width: 30px;margin-top:5px;margin-left:20px; " align="left"> <img src="http://nsa37.casimages.com/img/2016/05/27//160527013643663121.png" style=" width: 30px;margin-top:5px; margin-left:20px; " align="left"> <img src="http://nsa37.casimages.com/img/2016/05/27//160527013643933470.png" style=" width: 30px;margin-top:5px;margin-left:20px; " align="left">

<div class="descrient"><span class="textegras">❤ 10 J'aime</span>
<span class="textegras">PSEUDO</span> Blabla blabla bla
blabla bla bla lba
balablalbalab </div><div style="width:375px; padding:5px;padding-top: 10px;padding-left:15px; padding-right:10px;padding-bottom:5px;background:#f9f9f9;border-top:solid #dbdbdb 2px;"><center><img src="http://nsa37.casimages.com/img/2016/05/27//160527015701416289.png" style=" width: 20px; "> <img src="http://nsa38.casimages.com/img/2016/05/26//160526083217824597.png" style=" width: 20px;margin-left:50px; "> <img src="http://nsa38.casimages.com/img/2016/05/26//160526081554793286.png" style=" width: 20px;margin-left:50px; "> <img src="http://nsa37.casimages.com/img/2016/05/26//160526083145909905.png" style=" width: 20px;margin-left:50px; "> <img src="URL D'UNE ICONE PHOTO DE PROFIL" style="width: 20px; height:20px; border-radius:30px;padding:2px;border:solid #dbdbdb 1px; margin-left:50px;" ></center></div></div></center>
[font=Arial][size=7]CREDIT > [url=http://socktreasurebox.e-monsite.com/]CHAUSSETTE[/url][/size][/font]

POSTER UN COMMENTAIRE :
Code:
<link href='https://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'><style>.fondinstagr{width:400px; height: 185px;margin:auto; background:white;} .fondhautinstag{width:375px; height: 25px; margin:auto; background:#f9f9f9;border-bottom:solid #dbdbdb 2px;text-align:left;padding:5px;padding-left:15px;padding-top:15px; padding-right:10px;} .imagehaut{height: 30px;margin-top:-7px;margin-right:10px;border-right:solid #dbdbdb 1px;} .titrecom{font-family: 'Roboto', sans-serif;color:#262626;font-size: 13px;} </style>

<center><div class="fondinstagr"> <div class="fondhautinstag"><img src="http://nsa38.casimages.com/img/2016/05/27//160527032208186863.png" class="imagehaut" align="left"><span class="titrecom">Commentaires</span></div>
<img src="http://nsa38.casimages.com/img/2016/05/27//160527033625656770.png" style="width:50px;" align="center">

<div style="width:375px; padding:5px;padding-left:15px; padding-right:10px;padding-bottom:5px;background:;border-top:solid #dbdbdb 1px;"><center><table><tr><td><img src="http://nsa37.casimages.com/img/2016/05/27//160527034611512054.png" style=" width: 25px; margin-top:-9px;"></td><td><div style="width:304px; height: 50px; overflow:auto;margin-left:10px;margin-top:-9px;color:#c1c1c1; font-size: 12px;font-family: 'Roboto', sans-serif;">blabla bla blablabla blabla bla bla blabla blablabla bla blabla blablabla blablabla blablabla blablabla blablabla blabla bla</div></td><td><div style="width:35px; background:#4592d8;height:61px;margin-top:-9px;"align="right"><img src="http://nsa38.casimages.com/img/2016/05/27//160527035105824285.png" style=" width: 35px;margin-top:12px;  " ></div></td></tr></table></center></div></div></center>
[font=Arial][size=7]CREDIT > [url=http://socktreasurebox.e-monsite.com/]CHAUSSETTE[/url][/size][/font]
 
Modèle de code
Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1
 Sujets similaires
-
» quel est ce modèle de Charvel ?
» mon new clip, code rouge- makiavel (revolution urbaine)
» DOBRO OMI modèle 75 round neck à vendre ou éch avec
» Sur quel modèle joue Ben Harper dans cette vidéo ?
» FBI cherche craqueur de code

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
 :: Réseaux sociaux :: Internet :: Instagram-
Sauter vers: