Cara membuat Profil dan Media Sosial di Blogger

Selamat sore, bertemu lagi bareng saya tentunya dalam acara "Tanpa Kata"

Kali ini saya akan memberikan sebuah tutorial ,, langsung saja ke KTP

1.Buka dulu akun Blogger masing-masing
2. Klik Tata Letak -> Tambahkan Gadget -> Script/HTML
3. Salin kode dibawah ini

<div class=kotak>
      <div id=myprofile>
      <img  id="profile" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfZ8920BMrFb_mf-jTuvzLh5y4ZVQIPV7MFUYzLE_Z2dVOAYLq0S6e3EBb6BFfviF37A8vOxz0rnjCoXWmzXIECSwk5IkoypMMe8ASbZ8-Y_UnkvXPmVEOsVaReASfOpqTnOamZ5zz8Whq/s640/fb.jpg" align="left"/> Hallo guys, kenalkan nama saya Etgar Kurniawan, add sosial network saya, yah !?..<br/> <a style="color:#666;"  href="http://www.trans-ind-com.blogspot.com" rel='nofollow' target='_blank'> Read More..</a><br/>
        <div class='touchme'><!--Google Plus--> <a class='googleplus' href="https://plus.google.com/u/0/102300137019045607981" rel='external nofollow' target='_blank'></a> <!--Facebook--> <a class='facebook' href="https://www.facebook.com/akichajkt" rel='external nofollow' target='_blank'></a> <!-- Twitter --> <a class='twitter' href="https://twitter.com/etgarnotes" rel='external nofollow' target='_blank' ></a>
    </div></div></div>
    <style>
       #myprofile{border:1px solid #ddd; margin:0;padding:10px; overflow:hidden;background:#333;border:1px solid #1e1e1e;border-radius:4px;color:#ddd;box-shadow: 2px 2px 2px 2px #000; }
       #profile{ border:2px solid #888; margin:2px 5px 0px 0px;padding:2px;text-align:justify;height:150px;width: 120px;border-radius:4px;} #profile:hover { border:2px solid #ccc;cursor:pointer;text-align:justify; }
       .opacity:hover  {  -moz-box-shadow: 1px 1px 4px #000; -webkit-box-shadow: 1px 1px 4px #000; box-shadow: 1px 1px 4px #000; }
       .touchme a { display:block;height:50px;width:37px;padding:0 5px;margin-top:10px; float:left;background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEheyiAjjiMwWEpPDlbPIzDlEf3qS8D1rOTV5hHufB7BnRWd_3hj7Ylrr_VEbU6c5ihIXdpsf4DeVMFfmJvNwi4sVFTNKqLCK3UFiAZ6Gn-k_JTwEPV-SJghu0DohEmZupUhrNKQxpcuEVA/s1600/Sharing+Touch+Me.png) no-repeat;} .touchme a.googleplus { background-position: 0px -58px; } .touchme a.googleplus:hover { background-position: 0px 0px; } .touchme a.twitter { background-position: 0px -290px; } .touchme a.twitter:hover { background-position: 0px -232px; } .touchme a.facebook { background-position: 0px -406px; } .touchme a.facebook:hover { background-position: 0px -348px; }
      </style>

Nb : warna merah ganti dengan foto profil masing-masing ... warna hijau ganti tulisan masing-masing . . .. warna biru ganti url link profil masing-masing

4. Simpan dan Lihat hasilnya


Selamat Mencoba ^_^ Semoga Berhasil