Shouters Free Template from Soratemplates

DEMO - DOWNLOAD

Shouters is a great template blogspot that BloggerForYou wants to introduce to you. Shouter fits into any topics: magazine, news, editorial and entertainment, lifestyle, reviews, technology and product promotion / affiliate and it is easy to customize with its powerful features. Shouters is equipped with many gadgets to help you publish your blog more professional.
How To Setup Shouters Blogger Template
1. Top Navigation
2. Social Top Widget/Social Footer Widget
3. Main Menu/DropDown

Social Counter Code

<a href="#">
<div class="fb-icon-bg">
</div>
<div class="fb-bg">
</div>
</a>
  <a href="#">
  <div class="twi-icon-bg">
</div>
<div class="twi-bg">
</div>
</a>
  <a href="#">
  <div class="g-icon-bg">
</div>
<div class="g-bg">
</div>
</a>
<a href="linkedin-url">
  <div class="lin-icon-bg">
</div>
<div class="lin-bg">
</div>
</a>
<a href="instagram-url">
  <div class="ins-icon-bg">
</div>
<div class="ins-bg">
</div>
</a>
<style>
.fb-bg:hover, .twi-bg:hover, .g-bg:hover, .ins-bg:hover, .lin-bg:hover {background:#303030;}
.fb-icon-bg {
 background: #354f88;
 height: 37px;
 margin: 0 0 -37px 0;
 width: 41px; 
}

.fb-icon-bg:after {
 content: "\f09a"; font-family: FontAwesome;
  display: block;
  padding: 9px 10px 5px 15px;
color:#fff;
}

.fb-bg {
 background: #3b5998;
 display: block;
 height: 37px;
 margin: 0 0 10px 41px;
}

.fb-bg:after {
 color: #fff;
 content: "Facebook";
 height: 37px;
 left: 8%;
 position: relative;
 
 top: 22%;
 width: 41px; 
}

.fb-bg:hover{
  cursor: pointer;
}

.fb-bg:active{
  background: #354f88;
}

/* Twitter */
.twi-icon-bg:after {
 content: "\f099"; font-family: FontAwesome;
  display: block;
  padding: 11px 10px 6px 11px;
color:#fff;
}

.twi-icon-bg {
 background: #40a2d1;
 height: 37px;
 margin: 0 0 -37px 0;
 width: 41px; 
}

.twi-bg {
 background: #45b0e3;
 height: 37px;
 margin: 0 0 10px 41px;
}
 
.twi-bg:after {
 color: #fff;
 content: "Twitter";
 height: 37px;
  left: 11%;
 position: relative;

top: 22%;
  width: 41px; 
}

.twi-bg:hover {
  cursor: pointer;
}

.twi-bg:active {
  background: #40a2d1;
}

/* Google+ */
.g-icon-bg:after {
 content: "\f0d5"; font-family: FontAwesome;
  display: block;
  padding: 11px 10px 6px 13px;
color:#fff;
}

.g-icon-bg {
 background: #ce3e26;
 height: 37px;
 margin: 0 0 -37px 0;
 width: 41px; 
}
 
.g-bg {
 background: #de4c34;
 height: 37px;
     margin: 0 0 10px 41px;
}
 
.g-bg:after {
 color: #fff;
 content: "Google+";
 height: 37px;
 left: 10%;
 position: relative;
 
 top: 22%;
 width: 41px; 
}

.g-bg:hover {
  cursor: pointer;
}
.lin-icon-bg {
    background: #075e8c;
    height: 37px;
    margin: 0 0 -37px 0;
    width: 41px;
}
.lin-icon-bg:after {
    content: "\f0e1";
    font-family: FontAwesome;
    display: block;
    padding: 11px 10px 6px 13px;
    color: #fff;
}
.lin-bg {
    background: #0077B5;
    height: 37px;
    margin: 0 0 10px 41px;
}
.lin-bg:after {
    color: #fff;
    content: "Follow up on Linkedin";
    height: 37px;
    left: 10%;
    position: relative;
    top: 22%;
    width: 41px;
}
.ins-icon-bg {
    background: #ffc238;
    height: 37px;
    margin: 0 0 -37px 0;
    width: 41px;
}
.ins-icon-bg:after {
    content: "\f16d";
    font-family: FontAwesome;
    display: block;
    padding: 11px 10px 6px 13px;
    color: #fff;
}
.ins-bg {
    background: #ffd438;
    height: 37px;
    margin-left: 41px;
}
.ins-bg:after {
    color: #fff;
    content: "Follow us on Instagram";
    height: 37px;
    left: 10%;
    position: relative;
    top: 22%;
    width: 41px;
}
</style>

Subscription Widget Code

Shouters Free Template from Soratemplates

No comments

Recent Posts

Sora Templates