Cara Membuat Tampilan About Me Keren

Hai selamat datang di kupitam blog...
pada kali ini kita akan membuat tampilan about me yang keren, bagaimana caranya? yuk simak di bawah ini :

  • Masuk Dashboard Blogger (Masuk disini)
  • Pilih Tata Letak
  • Tambahkan Gadget / Widget
  • Pilih HTML/JavaScript
  • Salin kode di bawah ini dan tempelkan

<style>
#Profil {
    display:block;
    width:100%;
    backround:#fff;float:none;
    border-radius:30px;border:1px solid
}
#Profil img {
    display:block;
    border-radius:40px;
    border:4px solid #48d
}
.Profil {
    display:block;
    width:100%
}
.Profil img {
    display:block;
    margin-top:-60px;
    border-radius:90px;
    width:155px;
    heigth:155px;
    border:2 px solid #48d
}
#Profil h3 {
    color:#48d;
    font-size:170%
}
#Profil a{
    font-size:24px;
    padding:0 4px 0 0
}
#Profil p{
    font-size:12px;
    padding:10px
}
.fa.fa-facebook-square {
    color:#48d;
    transition:all 0.2s ease-in-out;
}
.fa.fa-twitter-square {
    color:#2fedd7;
    transition:all 0.2s ease-in-out;
}
.fa.fa-pinterest-square {
    color:#f72e35;
    transition:all 0.2s ease-in-out;
}
.fa.fa-google-plus-square {
    color:#f72e35;
    transition:all 0.2s ease-in-out;
}
.fa.fa-linkedin-square {
    color:#2d92f7;
    transition:all 0.2s ease-in-out;
}
.fa.fa-github {
    color:#ec26ef;
    transition:all 0.2s ease-in-out;
}
.fa.fa-instagram {
    color:#e5a020;
    transition:all 0.2s ease-in-out;
}
</style>

<div align="center">
    <div id="Profil">
        <img src='MASUKAN-URL-BANNER' />
        <div class="Profil">
            <img src='MASUKAN-URL-FOTO' />
        </div>
        <br/>
        <h3>NAMA ANDA</h3>
        <br />
        <a href='http://facebook.com/ID-FACEBOOK' target='_blank'><i class='fa fa-facebook-square fa-lg'/> <span class='inv'/></span></i></a>
        <a href='http://plus.google.com/ID-GOOGLE' target='_blank'><i class='fa fa-google-plus-square fa-lg'/><span class='inv'/></span></i></a>
        <a href='https://instagram.com/ID-INSTAGRAM' target='_blank'><i class='fa fa-instagram fa-lg'/><span class='inv'/></span></i></a>
        <a href='http://linkedin.com/in/ID-LINKEDIN' target='_blank'><i class='fa fa-linkedin-square fa-lg'/><span class='inv'/></span></i></a>
        <a href='https://path.com/id/ID-PATH' target='_blank'><i class='fa fa-pinterest-square fa-lg'/> <span class='inv'/></span></i></a>
        <a href='http://twitter.com/ID-TWITTER' target='_blank'><i class='fa fa-twitter-square fa-lg'/><span class='inv'/></span></i></a>
        <br/>
        <br/>
        <p>DESKRIPSI TENTANG DIRI ANDA</p>
    </div>
    <hr/>
</div>
  • Ganti tulisan yang sudah saya Blok dan  saya beri warna Biru sesuai dengan diri anda
  • Jika sudah selesai, simpan
Gampang kan? :)

0 komentar