avoir un
Altagram
Vous voulez inventer une vie sur les réseaux sociaux à votre personnage? Créez lui un Altagram, l'instagram de ce monde! Si vous n'avez pas accès à photoshop ou autre logiciel de ce genre, vous pouvez utiliser le site photopea afin de recadrer vos images. Pour les héberger, vous pouvez utiliser servimg (www).
Pour le post d'en-tête, copier-coller le code ci-dessous et remplacer les données en majuscule afin de compléter le message d'en-tête. L'image de profil est de 130*130. La photo de profil est de 110*110. Les photos de la galerie sont de 145*145.
Vous pouvez mettre en lien le moodboard (pinterest) de votre personnage, sa playlist spotify ou son tylter. Inventer une adresse web, amusez-vous! Sinon, effacer le code suivant du code principale.
Pour créer un message sans image, copier-coller le code ci-dessous et remplacer les données en majuscule.
L'image de profil est de format 60*60.
Pour créer un message avec une image, copier-coller le code ci-dessous et remplacer les données en majuscule.
L'image de profil est de format 60*60 et l'image publiée est de 400*400.
explications
Votre titre de sujet doit obligatoirement commencer par altagram - suivi de votre pseudo altagram.Pour le post d'en-tête, copier-coller le code ci-dessous et remplacer les données en majuscule afin de compléter le message d'en-tête. L'image de profil est de 130*130. La photo de profil est de 110*110. Les photos de la galerie sont de 145*145.
- Code:
- <div class="bt-instagram bt-instacolores"><div class="btinsta-barra"><div><span class="sf sf-chevron-left"></span><b>revenir en arrière</b></div><div class="btinsta-seguir">suivre+</div></div><div class="btinsta-portada"><div class="btinsta-imagen"><img src="URL IMAGE 130*130"/></div><div class="btinsta-datos"><instauser>PSEUDO</instauser><instadescr>biographie</instadescr>
<instalink><span class="sf sf-link-1-o"></span><a href="URL">https://www.tylter.com/@_pseudo</a></instalink></div></div><div class="btinsta-galeria"><img src="URL IMAGE 145*145"/><img src="https://placehold.jp/145x145.png"/><img src="https://placehold.jp/145x145.png"/><img src="https://placehold.jp/145x145.png"/><img src="URL IMAGE 145*145"/><img src="https://placehold.jp/145x145.png"/></div></div><a class="bettycred" style="margin-top:-5px;width:540px;" href="http://bettyleg.tumblr.com/">bettyleg</a>
<link href="//solrainha.github.io/saturnicons/saturnicons.css" rel="stylesheet"><link href="https://fonts.googleapis.com/css2?family=Hammersmith+One&family=Hind&display=swap" rel="stylesheet"><style>.bt-instacolores{--bti-acento1:#a42e6e; --bti-acento2:#42429a;}.bt-instagram > div:not(.instadescr) br{display:none} .bt-instagram{width:540px; border:1px solid #ccc; background:#fff; margin:10px auto; border-radius:20px; font-family:'Hind'; overflow:hidden; background:#fff;} .btinsta-portada{padding:40px; display:flex; align-items:center;} .btinsta-imagen > img{width:120px; height:120px; border-radius:180px; display:block; padding:5px; background:#fff} .btinsta-imagen{width:130px; height:130px;background: linear-gradient(var(--bti-acento1),var(--bti-acento2)); border-radius:180px; padding:6px;} .btinsta-datos{width:380px; max-height:140px;overflow:hidden; margin-left:30px;} .btinsta-datos > instauser{font-weight:700; font-size:20px; font-family:'Hammersmith One'; color:#777; display:block; } .btinsta-datos > instadescr{line-height:16px; display:block; font-size:13.5px; padding:10px 0px 5px; color:#555;} .btinsta-datos > instalink{ font-size:12px; display:flex; align-items:center;} .btinsta-datos > instalink span{color:var(--bti-acento1); padding-right:10px; font-size:12px;} .btinsta-datos > instalink a{color:var(--bti-acento2); text-decoration:none;} .btinsta-barra{height:40px; border-bottom:1px solid #ddd; display:flex; align-items:center; padding:0px 20px; color:#777; font-size:12px; justify-content:space-between;}.btinsta-barra div > span{padding-right:10px; font-size:10px;} .btinsta-galeria {border-top:1px solid #ccc; display:flex; flex-wrap:wrap; padding:15px 20px 40px; background:#fcfcfc} .btinsta-galeria img{width:145px; height:145px; margin:20px 10px 0px 10px; border-radius:10px;} .btinsta-seguir{width:130px; height:20px; display:flex; align-items:center; justify-content:center; border:1px solid #ccc; border-radius:10px; background:#fafafa; text-transform:uppercase; font-weight:800; color:var(--bti-acento1); letter-spacing:2px; font-size:11px;}.bettycred{display:block; margin:-20px auto 0px; border:1px solid #ddd; width:100px; padding:5px 0px; font-size:8px;text-transform:uppercase; text-align:center; letter-spacing:2px;background:#fff; color:#999; text-decoration:none;}</style>
Vous pouvez mettre en lien le moodboard (pinterest) de votre personnage, sa playlist spotify ou son tylter. Inventer une adresse web, amusez-vous! Sinon, effacer le code suivant du code principale.
- Code:
- <instalink><span class="sf sf-link-1-o"></span><a href="URL">https://www.tylter.com/@_pseudo</a></instalink>
Pour créer un message sans image, copier-coller le code ci-dessous et remplacer les données en majuscule.
L'image de profil est de format 60*60.
- Code:
- <div class="bt-instagramp bt-instacolores"><div class="btinstap-header" style="border-bottom:0;"><div><img src="URL IMAGE 60*60"/><span><b style="color:#a42e6e">PSEUDO</b>09.54 a.m.</span></div></div><div class="btinstap-descrip" style="margin-left:110px; width:260px; margin-top:-20px;">TEXTE.</div></div>
<link href="//solrainha.github.io/saturnicons/saturnicons.css" rel="stylesheet"><link href="https://fonts.googleapis.com/css2?family=Hammersmith+One&family=Hind&display=swap" rel="stylesheet"><style>.bt-instagramp{width:400px; border:1px solid #ccc; border-radius:15px; margin:10px auto; font-family:'Hind';background:#fff;} .bt-instagramp > div:not(.btinstap-descrip) br{display:none;} .btinstap-header{height:90px; border-bottom:1px solid #ccc; display:flex; align-items:center; padding:0px 20px; justify-content:space-between;} .btinstap-header div > img{width:60px; height:60px; border-radius:180px; border:1px solid #ccc; display:block; padding:3px;}.btinstap-header > div{display:flex; align-items:center; line-height:17px;} .btinstap-header > div span{padding-left:20px; font-size:13px; color:#888;} .btinstap-header > div span b{font-family:'Hammersmith One'; display:block; font-size:18px; color:var(--bti-acento1);} .btinstap-header >.sf{color:#555; font-size:18px;}.btinstap-descrip{width:360px; margin:0px auto; line-height:16px; font-size:13px; padding:0px 0px 30px; color:#555;} .btinstap-img{width:400px; height:400px;}.bettycred{display:block; margin:-20px auto 0px; border:1px solid #ddd; width:100px; padding:5px 0px; font-size:8px;text-transform:uppercase; text-align:center; letter-spacing:2px;background:#fff; color:#999; text-decoration:none;}</style>
Pour créer un message avec une image, copier-coller le code ci-dessous et remplacer les données en majuscule.
L'image de profil est de format 60*60 et l'image publiée est de 400*400.
- Code:
- <div class="bt-instagramp bt-instacolores"><div class="btinstap-header"><div><img src="URL IMAGE 60*60"/><span><b style="color:#a42e6e">PSEUDO</b>VILLE, PAYS</span></div><span class="sf sf-more-o"></span></div><div class="btinstap-img"><img src="URL IMAGE 400*400"/></div><div class="btinstap-icons"><div><span class="sf sf-heart-o"></span><span class="sf sf-chat-o"></span><span class="sf sf-paper-plane-o"></span></div><span class="sf sf-bookmark-o"></span></div><div class="btinstap-descrip">TEXTE</div></div><a class="bettycred" style="margin-top:-5px;width:400px;" href="http://bettyleg.tumblr.com/">bettyleg</a>
<link href="//solrainha.github.io/saturnicons/saturnicons.css" rel="stylesheet"><link href="https://fonts.googleapis.com/css2?family=Hammersmith+One&family=Hind&display=swap" rel="stylesheet"><style>.bt-instagramp{width:400px; border:1px solid #ccc; border-radius:15px; margin:10px auto; font-family:'Hind'; background:#fff;} .bt-instagramp > div:not(.btinstap-descrip) br{display:none;} .btinstap-header{height:90px; border-bottom:1px solid #ccc; display:flex; align-items:center; padding:0px 20px; justify-content:space-between;} .btinstap-header div > img{width:60px; height:60px; border-radius:180px; border:1px solid #ccc; display:block; padding:3px;}.btinstap-header > div{display:flex; align-items:center; line-height:17px;} .btinstap-header > div span{padding-left:20px; font-size:13px; color:#888;} .btinstap-header > div span b{font-family:'Hammersmith One'; display:block; font-size:18px; color:var(--bti-acento1);} .btinstap-header >.sf{color:#555; font-size:18px;} .btinstap-img{height:400px; width:400px; border-bottom:1px solid #ccc;} .btinstap-icons{display:flex; align-items:center; justify-content:space-between; padding:0px 20px; height:50px;} .btinstap-icons span{font-size:20px; padding-left:15px; color:#777; font-weight:500;} .btinstap-descrip{width:360px; margin:0px auto; line-height:16px; font-size:13px; padding:0px 0px 30px; color:#555;} .btinstap-img,.btinstap-img img{width:400px; height:400px;}.bettycred{display:block; margin:-20px auto 0px; border:1px solid #ddd; width:100px; padding:5px 0px; font-size:8px;text-transform:uppercase; text-align:center; letter-spacing:2px;background:#fff; color:#999; text-decoration:none;}</style>