Share Widget Info Cực Đẹp cho Blogspot

Are you sure?

You want to turn off ads.

Xin chào tất cả các bạn đến với blog của mình.Hôm nay mình tình cờ thấy ở một template nước ngoài có cái widget info khá đẹp nên mình đem về share cho anh em
Share Widget Info Cực Đẹp cho Blogspot
Bắt tay vào làm thôi nào =))
Để thêm widget này vào blogspot thì rẩ đơn giản;các bạn chỉ cần vào bố cục →thêm tiện ích→html/js sau đó các bạn nhập toàn bộ đoạn code bên dưới vô
<style>

#about-wrapper{font-family: 'Roboto Condensed', sans-serif;;padding:0 0 20px;background:#fff;box-shadow:0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);width:100%;font-weight:700}

#about-wrapper .aboutimg{width:100%;height:130px;float:left;overflow:hidden}

img.profilex{width:60px;border-radius:100%;float:left;margin:-35px 20px 0;box-shadow:rgba(0, 0, 0, 0.2) 0px 8px 17px 0px, rgba(0, 0, 0, 0.188235) 0px 6px 20px 0px;height:60px}#about-wrapper p{padding:0 20px}

a.linkx{color:#fff;background-color:#404F6C;position:absolute;top:150px;right:30px;border-radius:100%;height:20px}

a.linkx:hover{background-color:#314151;color:#fff}

#about-wrapper h4{font-family: 'Roboto Condensed', sans-serif;line-height:3;font-weight:700;font-size:15px}

#material-subscribe{padding:20px 30px 30px;background:#fff;box-shadow:0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);width:100%;max-width:400px}

.buttonx{color:#fff!important;padding:10px 15px;border-radius:4px;border:none;outline:none;box-shadow:0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);cursor:pointer;transition:all .4s ease-in-out}

.buttonx:hover{box-shadow:0 8px 17px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19)}

.buttonx.red{background:#404F6C}

</style>

<div id="about-wrapper">

<div class="aboutimg">

<img src="https://1.bp.blogspot.com/-5VCfJV5dYOo/W2wRZk2tiFI/AAAAAAAAApM/_6g7_aU0yfAO-xelAe2PuqiyAYZ5GFxawCLcBGAs/s1600/bg.jpg" alt="NGUYỄN DIỆN BLOG" title="NGUYỄN DIỆN BLOG"/></div>

<img class="profilex" src="https://2.bp.blogspot.com/-JwM_GRXg28c/W2wQJ6jcaDI/AAAAAAAAApA/N4o0psLZ8vwPUuryAYP9i4-6Z6qevO9nwCLcBGAs/s1600/7d2454cf6411e0366737e9ae619c4568.jpg" title="NGUYỄN DIỆN BLOG"/>

<h4>NGUYỄN DIỆN</h4>

<p>Nguyễn Diện là một chàng trai đẹp trai,cute,dễ thương và rất hòa đồng</p>

<a class="buttonx linkx" href="#"><i class="fa fa-user"></i></a>

</div>
Lời Kết:Chúc các bạn thành công !
Tác giả: Gia Huy NY

Tôi là Huy,Say hello to you!

  • 4 nhận xét: