Instagram (modèle)
@ La Monarque
Les réseaux sociaux sont sur toutes les langues, à porter de mains que ça soit sur téléphone, ordinateur, tablette, ... Reflet de notre société, parfois déformer par des filtres, on aime y poster des photos de notre vie et voir celles des autres.
Nous vous proposons donc de créer un compte instagram. Pour cela, rien de plus simple. Il vous suffit d'ouvrir un nouveau sujet, avec comme titre le
me contacter
@ La Monarque
username
4,974 publications
339M followers
576 suivi(e)s
Username/Nom
description
description
Suivi(e) par username1 , username2 , username3 et 3 autres personnes
reels
identifié(e)
1,111 1k11
2,222 2k22
3,333 3k33
4,444 4k44
5,555 5k55
6,666 6k66
7,777 7k77
8,888 8k88
9,999 9k99
code by hyangsu
- Code:
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.2/font/bootstrap-icons.css"><link href="https://cdn.jsdelivr.net/gh/hyang5u/CODES/IG_DUPE/insta_main-layout_alt.css" rel="stylesheet">
<center><div class="IG-main-container--alt"><div class="IG-bg-main--alt"><div class="IG-header"><div class="HD-box-img"><div class="HD-gradient-bg"><img src="https://via.placeholder.com/80" class="HD-img-profil"></div></div><div class="HD-box-rest">
<div class="HD-first-line"><div class="HD-username">username <!-- A SUPPRIMER SI COMPTE NON-VERIFIE --><img src="https://tinyurl.com/IG-verif-check" class="verif-check"><!-- FIN SUPPRESSION --></div>
<div class="HD-follow-button">Suivre</div></div><div class="HD-infos"><div class="HD-info"><b>4,974</b> publications</div><div class="HD-info"><b>339M</b> followers</div><div class="HD-info"><b>576</b> suivi(e)s</div></div>
<div class="HD-descri"><b>Username/Nom</b><br>description</div>
<div class="HD-followed-by">Suivi(e) par <igb>username1</igb>, <igb>username2</igb>, <igb>username3</igb> et 3 autres personnes</div></div></div>
<div class="HL-box"><!-- DEBUT HIGHLIGHT --><div class="HL-cont"><div class="HL-cont-un"><div class="HL-bg-img"><img src="https://via.placeholder.com/42" class="HL-img"></div></div><div class="HL-cont-deux"><div class="HL-titre">:black_heart:</div></div></div><!-- FIN HIGHLIGHT --></div><div class="MID-nav"><div class="MID-nav-onglet" id="nav-onglet-actif"><div class="MID-black-line"></div><i class="bi-grid-3x3 icon-nav IGblack"></i> publications</div><div class="MID-nav-onglet"><i class="bi-camera-video-fill icon-nav"></i> reels</div><div class="MID-nav-onglet"><i class="bi-person-square icon-nav"></i> identifié(e)</div></div>
<div class="PIC-main"><!-- DEBUT FEED PRINCIPAL --><div class="PIC-pic-cont"><img src="https://via.placeholder.com/145" class="PIC-pic"><div class="PIC-hover"><i class="bi-heart-fill left-icon"></i> 1,111 <i class="bi-chat-fill right-icon"></i> 1k11</div></div><div class="PIC-pic-cont"><img src="https://via.placeholder.com/146" class="PIC-pic"><div class="PIC-hover"><i class="bi-heart-fill left-icon"></i> 2,222 <i class="bi-chat-fill right-icon"></i> 2k22</div></div><div class="PIC-pic-cont"><img src="https://via.placeholder.com/147" class="PIC-pic"><div class="PIC-hover"><i class="bi-heart-fill left-icon"></i> 3,333 <i class="bi-chat-fill right-icon"></i> 3k33</div></div><div class="PIC-pic-cont"><img src="https://via.placeholder.com/148" class="PIC-pic"><div class="PIC-hover"><i class="bi-heart-fill left-icon"></i> 4,444 <i class="bi-chat-fill right-icon"></i> 4k44</div></div><div class="PIC-pic-cont"><img src="https://via.placeholder.com/149" class="PIC-pic"><div class="PIC-hover"><i class="bi-heart-fill left-icon"></i> 5,555 <i class="bi-chat-fill right-icon"></i> 5k55</div></div><div class="PIC-pic-cont"><img src="https://via.placeholder.com/150" class="PIC-pic"><div class="PIC-hover"><i class="bi-heart-fill left-icon"></i> 6,666 <i class="bi-chat-fill right-icon"></i> 6k66</div></div><div class="PIC-pic-cont"><img src="https://via.placeholder.com/151" class="PIC-pic"><div class="PIC-hover"><i class="bi-heart-fill left-icon"></i> 7,777 <i class="bi-chat-fill right-icon"></i> 7k77</div></div><div class="PIC-pic-cont"><img src="https://via.placeholder.com/152" class="PIC-pic"><div class="PIC-hover"><i class="bi-heart-fill left-icon"></i> 8,888 <i class="bi-chat-fill right-icon"></i> 8k88</div></div><div class="PIC-pic-cont"><img src="https://via.placeholder.com/153" class="PIC-pic"><div class="PIC-hover"><i class="bi-heart-fill left-icon"></i> 9,999 <i class="bi-chat-fill right-icon"></i> 9k99</div></div><!-- FIN FEED PRINCIPAL --></div></div></div><div class="credit">code by hyangsu</div></center>
- rajouter un highlight:
- vous pouvez rajouter autant de highlight que vous le voulez, mais le layout est optimisé pour sept. néanmoins, vous pourrez scroll sur l'axe horizontal si vous en rajoutez plus (la scrollbar a été cachée pour des questions d'aesthetic).
à rajouter entre < ! -- DEBUT HIGHLIGHT -- > et < ! -- FIN HIGHLIGHT -- >
- Code:
<div class="HL-cont"><div class="HL-cont-un"><div class="HL-bg-img"><img src="https://via.placeholder.com/42" class="HL-img"></div></div><div class="HL-cont-deux"><div class="HL-titre">:black_heart:</div></div></div>
- pour rajouter un post au feed principal:
- il vous est possible de rajouter autant de posts que vous le voulez au feed, ils se stackeront automatiquement. la barre de défilement a été cachée, mais vous pouvez scroll pour afficher les posts potentiellement plus anciens !
à rajouter entre < ! -- DEBUT FEED PRINCIPAL -- > et < ! -- FIN FEED PRINCIPAL -- >
- Code:
<div class="PIC-pic-cont"><img src="https://via.placeholder.com/145" class="PIC-pic"><div class="PIC-hover"><i class="bi-heart-fill left-icon"></i> x,xxx <i class="bi-chat-fill right-icon"></i> xkxx</div></div>
me contacter
@ La Monarque
Publier
code by hyangsu
- Code:
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.2/font/bootstrap-icons.css"><link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/hyang5u/CODES/IG_DUPE/insta_single-post.css">
<center><div class="IGP-main-bg"><div class="TOP-infos"><div class="TOP-left"><div class="TOP-bg-grad"><img src="https://via.placeholder.com/80" class="TOP-img-profil"></div></div><div class="TOP-mid"><user>username</user> <!-- A SUPPRIMER SI COMPTE NON-VERIFIE --><img src="https://tinyurl.com/IG-verif-check" class="TOP-verif-check"><!-- FIN SUPPRESSION --><br><pc>localisation</pc></div><div class="TOP-right"><i class="bi-three-dots TOP-icon txt-black"></i></div></div><!-- DEBUT POST --><div class="IGP-post"><img src="https://via.placeholder.com/500x650" class="PST-main-img"></div><!-- FIN POST -->
<div class="BTM-icons"><div class="BTM-icon-un"><i class="bi-heart BTM-icon txt-black"></i></div><div class="BTM-icon-deux"><i class="bi-chat BTM-icon txt-black"></i></div><div class="BTM-icon-trois"><i class="bi-send BTM-icon txt-black"></i></div><div class="BTM-icon-quatre"><i class="bi-bookmark BTM-icon txt-black"></i></div></div>
<div class="IGP-caption"><b><pc>1,234 J'aime</pc></b>
<b><pc>username</pc></b> caption here
<div class="CAP-time">IL Y A X HEURES</div></div>
<div class="IGP-add-comment"><div class="COM-left"><i class="bi-emoji-smile BTM-icon txt-black"></i></div><input class="COM-add-comment" type="text" name="inputBox" placeholder="Ajouter un commentaire..."></input><div class="COM-publish">Publier</div></div></div><div class="credit-post">code by hyangsu</div></center>
me contacter
@ La Monarque
IL Y A 5 HEURES
- Code:
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/hyang5u/CODES/IG_DUPE/insta_comms.css"><center><div class="IGC-bg"><div class="CM-comment"><div class="CM-pp"><div class="CM-bg-grad"><img src="https://via.placeholder.com/80" class="CM-img-profil"></div></div><div class="CM-main-comment"><user>username </user> <!-- A SUPPRIMER SI COMPTE NON-VERIFIE --><img src="https://tinyurl.com/IG-verif-check" class="CM-verif-check"><!-- FIN SUPPRESSION --> a commencé à vous suivre.
<div class="CM-time">IL Y A 5 HEURES</div></div></div></div></center>
IL Y A 5 HEURES
- Code:
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/hyang5u/CODES/IG_DUPE/insta_comms.css"><center><div class="IGC-bg"><div class="CM-comment"><div class="CM-pp"><div class="CM-bg-grad"><img src="https://via.placeholder.com/80" class="CM-img-profil"></div></div><div class="CM-main-comment"><user>username </user> <!-- A SUPPRIMER SI COMPTE NON-VERIFIE --><img src="https://tinyurl.com/IG-verif-check" class="CM-verif-check"><!-- FIN SUPPRESSION --> a aimé votre publication.
<div class="CM-time">IL Y A 5 HEURES</div></div></div></div></center>
IL Y A 5 HEURES
- Code:
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/hyang5u/CODES/IG_DUPE/insta_comms.css"><center><div class="IGC-bg"><div class="CM-comment"><div class="CM-pp"><div class="CM-bg-grad"><img src="https://via.placeholder.com/80" class="CM-img-profil"></div></div><div class="CM-main-comment"><user>username </user> <!-- A SUPPRIMER SI COMPTE NON-VERIFIE --><img src="https://tinyurl.com/IG-verif-check" class="CM-verif-check"><!-- FIN SUPPRESSION --> a commenté votre publication : <cm>commentaire juste ici, commentaire juste ici commentaire juste ici</cm>
<div class="CM-time">IL Y A 5 HEURES</div></div></div></div></center>
me contacter
@ Contenu sponsorisé
me contacter
|
|