One of thoses stories
 
AccueilAccueil  CalendrierCalendrier  FAQFAQ  RechercherRechercher  MembresMembres  GroupesGroupes  S'enregistrerS'enregistrer  ConnexionConnexion  

Partagez | 
 

 CODAGE - Réseaux Sociaux

Voir le sujet précédent Voir le sujet suivant Aller en bas 
AuteurMessage
Emma B. Stark
Admin
avatar

Messages : 223
Date d'inscription : 23/11/2009

MessageSujet: CODAGE - Réseaux Sociaux   Dim 9 Aoû - 10:41

Modèle de téléphone - vérouillé



16:21

lundi 01 juin
Nom Prénom
Message
Glisser pour répondre
> Déverrouiller


Code:
<center><link href='http://fonts.googleapis.com/css?family=Lato:100' rel='stylesheet' type='text/css'>
<div style="background-image:url(http://www.imabox.fr/15/05/312126puEYGL04.png);width:300px;height:526px;"><div style="padding-top:73px;margin-left:-7px;"><div style="background-image:url(http://www.imabox.fr/15/05/311526uPY7mr48.png);width:206px;height:348px;color:black; font-family:lato;font-size: 50px;color:#ffffff;">
<center>16:21</center><br><span style="font-size:12px;font-family:arial"><center>lundi 01 juin</center></span><div style="font-size:12px;font-family:arial;margin-top:30px;color:#ffffff"><img src="http://www.imabox.fr/15/05/312029Kyrvsh41.png" style="width:15px;margin-right:4px;margin-left:-90px;text-align:left"><b>Nom Prénom</b></div><div style="font-size:12px;font-family:arial;color:#ffffff;margin-left:33px;text-align:left">Message</div><div style="font-size:11px;font-family:arial;color:#ffffff;margin-left:41px;opacity: 0.7;margin-left:33px;text-align:left">Glisser pour répondre</div><div style="font-size:16px;font-family:arial;margin-top:120px;color:#ffffff;opacity: 0.5;"><center>> Déverrouiller</center></div></center>
Revenir en haut Aller en bas
Voir le profil de l'utilisateur http://oneofthosestories.forumactif.com
Emma B. Stark
Admin
avatar

Messages : 223
Date d'inscription : 23/11/2009

MessageSujet: Re: CODAGE - Réseaux Sociaux   Mar 11 Aoû - 18:54

Modèle pour téléphone - reçu

Pseudo
Message


Code:
<center><div style="background-image:url(http://www.imabox.fr/15/05/312126puEYGL04.png);width:300px;height:526px;margin:20px"><div style="font-size:12px;font-family:arial;padding-top:70px;color:#000000;"><center>Pseudo</center></div><img src="http://illiweb.com/fa/pbucket.gif" style="width:60px;margin-top:20px;margin-left:-130px;text-align:left;border-radius:50px"><div style="font-size:10px;font-family:arial;margin-top:-50px;margin-left:60px;color:#ffffff;background-color :#0d85fe;width:110px;height:auto;padding:5px;border-radius:15px;text-align:left">Message</div></center>

Modèle pour téléphone - envoyé

Pseudo
Message

Code:
<table><center><div style="background-image:url(http://www.imabox.fr/15/05/312126puEYGL04.png);width:300px;height:526px;"><div style="font-size:12px;font-family:arial;padding-top:70px;color:#000000;"><center>Pseudo</center></div><img src="http://illiweb.com/fa/pbucket.gif" style="width:60px;margin-top:20px;margin-left:120px;text-align:left;border-radius:50px"><div style="font-size:10px;font-family:arial;margin-top:-50px;margin-left:-70px;color:#000000;background-color :#e5e5ea;width:110px;height:auto;padding:5px;border-radius:15px;text-align:left">Message </div></center></table>
Revenir en haut Aller en bas
Voir le profil de l'utilisateur http://oneofthosestories.forumactif.com
Emma B. Stark
Admin
avatar

Messages : 223
Date d'inscription : 23/11/2009

MessageSujet: Re: CODAGE - Réseaux Sociaux   Mar 11 Aoû - 19:23

Modèle pour Instagram - Accueil



Votre Username ici
Following
Nom d'utilisateur
Pseudo, nom, whatever Hello my name is Robert
###
posts
###
followers
###
following
 


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>

<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>

Modèle pour Instagram - Ajouter une ligne de photos



Code:
<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>

Modèle pour Instagram - commentaires



Votre Username ici
Votre pseudo # days ago
Following
Ta vie, tes tags #Jambon !
Saucisse au jambon and 125 others like this.
un pseudo
un commentaire. #tag @Link

un pseudo
un commentaire.




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>

<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>

Modèle Instagram - ajouter des commentaires

un pseudo
un commentaire.


Code:
<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>

Modèle pour Instagram - commenter



Votre Username ici
un pseudo Commentaire pas trop long sinon ça devient grave moche


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>

<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>
Revenir en haut Aller en bas
Voir le profil de l'utilisateur http://oneofthosestories.forumactif.com
Emma B. Stark
Admin
avatar

Messages : 223
Date d'inscription : 23/11/2009

MessageSujet: Re: CODAGE - Réseaux Sociaux   Mar 11 Aoû - 21:58

Modèle pour Facebook - Accueil


Prénom + Nom






Exprimez vous...

CREDIT > CHAUSSETTE

Code:
<center><div style="font-family: arial; border-radius:0px 0px 0px 0px;background:url('URL D'UNE GRANDE IMAGE POUR METTRE EN FOND');height: 200px; width:450px;margin-bottom:-10px;" align="justify"></div><table><td><img style="border-radius:2px 2px 2px 2px; width: 100px;margin-left:-130px; height: 100px;border:3px solid white;box-shadow:0px 0px 3px black; margin-top:-90px;" src="URL D'UNE ICONE 100*100"; ></td><td>
<div style="color:white;text-shadow:0px 0px 3px black; font-size:25px;letter-spacing: -2px; margin-top:-40px;font-family:Arial;margin-left:-20px;">[b]Prénom + Nom[/b]</div></td></table><BR>
<div style="font-family: arial; margin-top:-50px;background: url('http://nsa31.casimages.com/img/2014/01/22//140122053802623075.png'); text-align: justify;height: 48px; width:450px; font-size:10px;font-family:arial;">
</div><div style="font-family: arial; margin-top:px;background: #e9eaed; text-align: justify;height: 20px; width:450px; font-size:10px;font-family:arial;">
</div><div style="font-family: arial; margin-top: px;background: url('http://nsa31.casimages.com/img/2014/01/22//140122054536653784.png'); text-align: justify;height: 39px; width:450px; font-size:10px;font-family:arial;">
</div><div style="font-family: arial; margin-top:px;background: #ffffff; text-align: justify;height: 48px; width:430px; font-size:14px;font-family:helvetica;color:#777777;padding:10px;">
Exprimez vous...</div></center>
[font=Arial][size=7]CREDIT > [url=http://socktreasurebox.e-monsite.com/]CHAUSSETTE[/url][/size][/font]

Modèle pour Facebook - commentaires

Prénom Nom
XX Mois ·
Racontez votre vie ici


J'aime · Commenter · Désactiver les notifications · Promouvoir · Partager

CREDIT > CHAUSSETTE

Code:
<center><div style="font-family: arial; border:2px solid #d3d4d7;margin-top:px;background: #ffffff; text-align: justify;height: px; border-radius:6px 6px 6px 6px;width:430px; font-size:14px;font-family:helvetica;color:#777777;padding:10px;"><table><td><img style="border-radius:6px 6px 6px 6px; width: 50px; height: 50px; " src="URL D'UNE ICONE 100*100"; ></td><td><span style="color:#3b5998; font-size:14px;letter-spacing: -1px;font-family:Arial;">[b]Prénom Nom[/b]</span>
<span style="color:#89919c; font-size:12px;letter-spacing: px;font-family:Arial;">XX Mois · </span>
</td></table>
Racontez votre vie ici
<img style=" width: 430px;  " src="URL D'UNE IMAGE SI VOUS VOULEZ EN METTRE A SUPPRIMER LE CODE SI VOUS NE VOULEZ PAS"; >

<span style="color:#89919c; font-size:12px;letter-spacing: px;font-family:Arial;">J'aime · Commenter ·  Désactiver les notifications · Promouvoir · Partager</span></div></center>
[font=Arial][size=7]CREDIT > [url=http://socktreasurebox.e-monsite.com/]CHAUSSETTE[/url][/size][/font]
Revenir en haut Aller en bas
Voir le profil de l'utilisateur http://oneofthosestories.forumactif.com
Contenu sponsorisé




MessageSujet: Re: CODAGE - Réseaux Sociaux   

Revenir en haut Aller en bas
 
CODAGE - Réseaux Sociaux
Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1
 Sujets similaires
-
» Boutons réseaux sociaux sur le forum
» [SOFT] BUDDYMOD : Pour tous les réseaux sociaux : Twitter, Facebook, MSN [Gratuit]
» Les réseaux sociaux et leurs problèmes
» Foursquare, le futur des Réseaux Sociaux
» Réseaux sociaux

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
One of those stories :: Archives-
Sauter vers: