Memasang Widget Sosial Media Di Sidebar Blog
Untuk Memasang Widget Ini Pastikan Blog Kamu Sudah Terpasang Link Css Awesome Jika Belum Tambah Css Link Di Bawah Ini Tepat Sebelum </head>,<link href='//maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css' rel='stylesheet'/>CTRL
+F
pada keyboard kamu/* Sosial Media Widget */
#HTML68 .sosmedarl-info h4{background:transparent;position:relative;padding:0;margin:0;border:0;text-align:center;font-size:120%}
.sosmedarl-img{position:relative;max-height:140px;overflow:hidden}
.sosmedarl-img img {max-width:100%;width:100%;transition:all .6s;}
.sosmedarl-img:hover img{transform:scale(1.2) rotate(-10deg)}
.sosmedarl-img:before{content:'';background:rgba(0,0,0,0.3);position:absolute;top:0;left:0;right:0;bottom:0;z-index:2;transition:all .3s}
.sosmedarl-img:hover:before{background:rgba(0,0,0,0.6);}
.aboutfloat-img{width:55%;position:absolute;top:35%;bottom:35%;left:22.5%;z-index:3}
.sosmedarl-float{text-align:center;display:table;width:100%;height:100%}
.sosmedarl-float a{background:transparent;color:#fff;padding:8px 14px;z-index:2;display:table-cell;width:100%;font-size:90%;text-transform:uppercase;vertical-align:middle;border:2px solid #fefefe;border-radius:3px;transition:all .3s}
.sosmedarl-float:hover a{background:#e74c3c;color:#fff;border-color:transparent;}
.sosmedarl-float a i{font-weight:normal;margin:0 5px 0 0}
.sosmedarl-wrpicon{display:block;margin:15px auto;position:relative;}
.sosmedarl-wrpicon .extender{width:100%;display:block;}
.extender{text-align:center;font-size:16px}
.extender .sosmedarl-icon{display:inline-block;border:0;margin:0;padding:0;width:32%;}
.extender .sosmedarl-icon a{background:#ccc;display:inline-block;font-weight:400;color:#fff;padding:0 12px;line-height:32px;border-radius:3px;font-size:12px;width:100%;}
.extender .sosmedarl-icon i{font-family:fontawesome;margin:0 3px 0 0}
.sosmedarl-icon.fbl a{background:#3b5998}
.sosmedarl-icon.twitt a{background:#19bfe5}
.sosmedarl-icon.crcl a{background:#d64136}
.sosmedarl-icon.fbl a:hover,.sosmedarl-icon.twitt a:hover,.sosmedarl-icon.crcl a:hover{background:#404040}
.extender .sosmedarl-icon:hover a,.extender .sosmedarl-icon a:hover{color:#fff;}
.sosmedarl-info{margin:10px 0 0 0;font-size:13px;text-align:center;}
.sosmedarl-info p{margin:5px 0}
.sosmedarl-info h4{margin-bottom:10px;font-size:16px;text-transform:uppercase;color:#444;font-weight:700}
.sosmedarl-info h4 span {position:relative;display:inline-block;padding:0 10px;margin:0 auto;}
.sosmedarl-info h4:before,.sosmedarl-info h4:after {position:absolute;top:51%;overflow:hidden;width:50%;height:1px;content:'\a0';background-color:rgba(0,0,0,0.08);}
.sosmedarl-info h4:before {margin-left:-50%;text-align:right;}*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}<b:widget id='HTML68' locked='false' title='Sosial Media' type='HTML' visible='true'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<div class='sidebar_about_author'>
<div class='inner_wrapper'>
<div class='sosmedarl-img'>
<img alt='Judul Blog' class='img-responsive' height='auto' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguGEhh9WR21VXtwc6UgMZitA9MTtrGAgPBn4F7s0ljXntewEGyh9BA4g5kx5_NJx-rVGHXImEsBmapa5K5M6iA5UZta2XSKV-FiB-s6PujZ6bf3bdF12uEDI9a9po0I75yDpjTHzpSe7s/s1600/logo+my.JPG' title='Judul Blog' width='300'/>
<div class='aboutfloat-img'><span class='sosmedarl-float'><a href='#' rel='nofollow' target='_blank' title='Join Our Site'><i class='fa fa-user'/> Join Our Site</a></span></div>
</div>
</div>
<div class='sosmedarl-info'>
<h4><span>Judul Blog</span></h4>
<p>Deskripsi blog tulis di sini</p>
</div>
<div class='sosmedarl-wrpicon'>
<ul class='extender'>
<li class='sosmedarl-icon fbl'><a href='#' target='_blank' title='Follow Our Facebook'><i class='fa fa-facebook fa-fw'/> Like</a></li>
<li class='sosmedarl-icon twitt'><a href='#' target='_blank' title='Follow Our Twitter'><i class='fa fa-twitter fa-fw'/> Follow</a></li>
<li class='sosmedarl-icon crcl'><a href='#' rel='nofollow' target='_blank' title='Follow Our Google+'><i class='fa fa-google-plus fa-fw'/> Circle</a></li>
</ul>
</div>
</div>
</div>
</b:includable>
</b:widget>
Demikin dari saya semoga bermanfaat terimakasi
# Saya akan coba merespon komentar baru secepatnya.
# Harap berkomentar dengan bahasa baku tanpa singkatan.
# Komentar promosi, spam, dan komentar satu kalimat yang tidak bermutu akan saya hapus langsung.
# Jangan menggunakan nama pengomentar dengan nama yang berbau porno, judi, dan yang negatif lainnya.
# Setiap komentar akan dimoderasi secara manual sebelum muncul. EmoticonEmoticon