10/23/2018

Averie Blogger Template 2019 Free Download Blogger Templates Responsive Blogger Template

Averie Blogger Template 2019 Free Download Blogger Templates
Averie Blogger Template
Author:- SoraTemplates
Designer:- SoraTemplates
Averie Blogger Template feature
Averie Blogger Template best for news, fashion, tech, the lifestyle website. Averie Blogger Template top Instagram widget, feature posts, top, and men two type menu. Homepage show only post title and thumbnail. Responsive, Mobile Friendly, Custom 404 Page, Fast Loading, Fashion, Minimal, Seo Friendly, Ads Ready, Clean Layout, Simple Design, Drop Down Menu, Social Sharing, HTML5 & CSS3, Browser Compatibility.
Averie Blogger Template Documentation
1. Follow us widget code
<div class="social-counter-man">
<a class="count facebook" href="#">
<div class="icon"><i class="fa fa-facebook"></i></div>
<p><span>34.2k</span> likes</p>
<p class="action-btn">Like</p>
</a>
<!-- TWITTER -->
<a class="count twitter" href="#">
<div class="icon"><i class="fa fa-twitter"></i></div>
<p><span>28.6k</span> followers</p>
<p class="action-btn">Follow</p>
</a>
<!-- YOUTUBE -->
<a class="count youtube" href="#">
<div class="icon"><i class="fa fa-youtube"></i></div>
<p><span>8.6k</span> subs</p>
<p class="action-btn">Subscribe</p>
</a>
<!-- GOOGLE PLUS -->
<a class="count google-plus" href="#">
<div class="icon"><i class="fa fa-google-plus"></i></div>
<p><span>17.3k</span> followers</p>
<p class="action-btn">+1</p>
</a>
<!-- INSTAGRAM -->
</div>
<style>
.social-counter-man{
padding: 0;
display: block;
}
.count{
display: block;
padding: 7px 0;
text-align: left;
transition: all 0.5s ease;
}
.count:hover{
background: rgba(0,0,0,0.033);
transform: scale(1.065);
}
.count .icon{
background: #aaa;
display: inline-block;
float: left;
color: white;
font-size: 22px;
margin-left: 5px;
text-align: center;
width: 45px;
height: 45px;
border-radius: 50%;
text-shadow: 0 0 3px rgba(0,0,0,0.2);
display: table;
}
.count .icon i{
display: table-cell;
vertical-align: middle;
}
.count p{
display: inline-block;
font-size: 13px;
color: #ececec;
margin: 11px;
}
.count p span{
color: #1c1c1c;
font-size: 18px;
font-weight: bold;
padding-right: 2px;
}
.count .action-btn{
float: right;
display: inline-block;
background: #aaa;
color: white;
padding: 3px 6px;
border-radius: 3px;
font-size: 14px;
margin: 11px;
}
/*== COLORS ==*/
.facebook .icon{background:#3b5999;}
.facebook .action-btn{background:#3b5999;}
.facebook .icon i{padding-top:2px;}

.twitter .icon{background:#55acee;}
.twitter .action-btn{background:#55acee;}
.twitter .icon i{padding-top:2px;}

.youtube .icon{background:#cd201f;}
.youtube .action-btn{background:#cd201f;}
.youtube .icon i{font-size:24px}

.google-plus .icon{background:#dd4b39;}
.google-plus .action-btn{background:#dd4b39;}
.google-plus .icon i{font-size: 18px; padding-top: 1px;}

.instagram .icon{background:#e4405f;}
.instagram .action-btn{background:#e4405f;}

.rss .icon{background:#f57d00;}
.rss .action-btn{background:#f57d00;}

.social-counter-2 .linkedin, .linkedin .icon,.linkedin .action-btn{background:#0077B5}
.social-counter-2 .vimeo, .vimeo .icon,.vimeo .action-btn{background:#1ab7ea}

.social-counter-2 .vk, .vk .icon,.vk .action-btn{background:#4c75a3}
.social-counter-2 .tumblr, .tumblr .icon,.tumblr .action-btn{background:#34465d}
.social-counter-2 .pinterest, .pinterest .icon,.pinterest .action-btn{background:#bd081c}
.social-counter-2 .stumbleupon, .stumbleupon .icon,.stumbleupon .action-btn{background:#eb4924}
.social-counter-2 .reddit, .reddit .icon,.reddit .action-btn{background:#ff5700}
.social-counter-2 .yelp, .yelp .icon,.yelp .action-btn{background:#af0606}
.social-counter-2 .weibo, .weibo .icon,.weibo .action-btn{background:#df2029}
.social-counter-2 .producthunt, .producthunt .icon,.producthunt .action-btn{background:#da552f}
.social-counter-2 .whatsapp, .whatsapp .icon,.whatsapp .action-btn{background:#25D366}
.social-counter-2 .vine, .vine .icon,.vine .action-btn{background:#00b489}
.social-counter-2 .slack, .slack .icon,.slack .action-btn{background:#3aaf85}
.social-counter-2 .dribbble, .dribbble .icon,.dribbble .action-btn{background:#ea4c89}
.social-counter-2 .flickr, .flickr .icon,.flickr .action-btn{background:#ff0084}
.social-counter-2 .behance, .behance .icon,.behance .action-btn{background:#131418}
.behance .icon i{font-size:18px;} .social-counter-2 .foursquare, .foursquare .icon,.foursquare .action-btn{background:#f94877}
.social-counter-2 .snapchat, .snapchat .icon,.snapchat .action-btn{background:#FFFC00}
.snapchat .icon i{font-size:24px;text-shadow: -1px 0 black,0 -1px black, 1px 0 black, 0 1px black}
.snapchat .action-btn{text-shadow: 0 0 1px black}
</style>
2. Instagram widget
<div id='instafeed'/>
<script type='text/javascript'>//<![CDATA[
var feed = new Instafeed({
get: 'user',
userId: 4578212267,
limit:8,
sortBy:'random',
accessToken: '4578212267.1677ed0.1c160e2835fd4d33888b0175d44bdf9d',
template: '<li><a href="{{link}}" target="_blank"><img src="{{image}}" /><div
class="insta-likes"><div style="display: table; vertical-align: middle; height: 100%; width: 100%;"><span
style="display: table-cell; vertical-align: middle; height: 100%; width: 100%;">{{likes}} <i class="fa fa-
heart"></i><br/>{{comments}} <i class="fa fa-
comment"></i></span></div></div></a></li>',
resolution: 'standard_resolution'
});
feed.run();
//]]>
</script></div>

XEM THÊM

Averie Blogger Template 2019 Free Download Blogger Templates
4/ 5
Oleh