Most Pirated Movies Of All Time
About The Infographics
It is a true fact as soon as the movies become blockbuster hits,thei...
Social Sharing Widget With Email Subscription Box For Blogger
About The Widget
I came through a social sharing widget in recent days which you can find on the right side of this post,I kept it as my social sharing widget for testing and it increased my social shares by 37% ,so I felt that I should share this tutorial with you,below you can find the steps to add this widget.This widget was intoduced by bloggeryard in one of their articles and I really appreciate this work of there's.
Steps To Add It:-
- Go to Layout tab of your blog
- Click on Add A Gadget
- Select HTML/Javascript from the list that appears
- Leave the title empty and add the following code in the content tab:-
<link href="http://fonts.googleapis.com/css?family=Roboto:400,700" rel="stylesheet" type="text/css" />
<link href='//fonts.googleapis.com/css?family=Source Sans Pro:200,200italic,300,300italic,regular,italic,600,600italic,700,700italic,900,900italic&subset=latin' rel='stylesheet' type='text/css'/>
<style>
#technopcarea-socialsub {
width:300px;
height:350px;
background:whitesmoke;
border:1px solid #eaeaea;
box-shadow:0 0 2px 2px #ccc;
}
.technopcarea-socialsub-title {
font-size:20px;
font-family: 'Oleo Script', cursive;
background:hsl(198, 100%, 49%);
padding:5px;
border-bottom: 2px solid #444;
color:white;
text-align:center;
}
#technopcarea-socialsub-icons{
padding-top: 8px;
padding-left: 4px;
padding-bottom: 15px;
border-bottom: 2px dotted hsl(0, 0%, 27%);
}
ul.technopcarea-socialsub-icons{
margin:0;
padding:0;
list-style:none;
-webkit-perspective: 10000px;
-moz-perspective: 10000px;
-o-perspective: 10000px;
perspective: 10000px;
}
ul.technopcarea-socialsub-icons li{
display: inline-block;
width: 55px;
height: 50px;
margin-right: -px;
background: none;
font: bold 36px Arial;
text-transform: uppercase;
text-align: center;
cursor: pointer;
padding-left:10px;
}
ul.technopcarea-socialsub-icons li a{
display:block;
width: 100%;
height: 100%;
color: black;
text-decoration: none;
outline: none;
-webkit-transition:all 300ms ease-out 0.1s;
-moz-transition:all 300ms ease-out 0.1s;
-o-transition:all 300ms ease-out 0.1s;
transition:all 300ms ease-out 0.1s;
}
ul.technopcarea-socialsub-icons li a span{
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding-top: 5px;
display:block;
width: 100%;
height: 100%;
-webkit-transition:all 300ms ease-out 0.1s;
-moz-transition:all 300ms ease-out 0.1s;
-o-transition:all 300ms ease-out 0.1s;
transition:all 300ms ease-out 0.1s;
}
ul.technopcarea-socialsub-icons li a img{
border-width: 0;
}
ul.technopcarea-socialsub-icons li:hover a{
-moz-transform: rotateY(180deg);
-webkit-transform: rotateY(180deg);
transform: rotateY(180deg);
background: none;
}
ul.technopcarea-socialsub-icons li:hover a span{
-moz-transform: rotateY(180deg);
-webkit-transform: rotateY(180deg);
transform: rotateY(180deg);
}
.technopcarea-socialemailsub {
font-size:14px;
padding:5px;
color:#444;
font-family: Arial;
font-family:bold;
}
.technopcarea-socialemailsubname {
background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBb7oaYXxVpRvOrY20oY0s5N5q2YQ241ef7MzmbdoWXIbzQUCymRz28yDcI-Q1dFPgTcBg8rbuKf4-ery8oz3LJqB8iu4sbtU_NRWCPJYauDnX2vbF6Wr7lyZedt8FEcjUnKkGFfzQaDw/s320/name.png) no-repeat 7px 8px;
border:1px solid #ddd;
font-family:Arial,sans-serif;
font-size:13px;
font-weight:bold;
color:hsla(0,0%,27%,0.69);
width:225px;
height:25px;
padding:5px 15px 5px 28px;
margin-left:10px;
display:inline-block;
transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;
-webkit-transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;
-moz-transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;
-o-transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;
}
.technopcarea-socialemailsubemail {
background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUtgzPn1n0cuOyit9nr7NZc9RhFj7JOOGSZDNHW10BHztAm4qyeaZD2d_8xt1WUeW246n39HNyYKgvfmOGm2ngMTKAX7MexZ8zXR-s8Q5L9kpd2zLoNDHlmZXQVYAVHC2F5ZcYBB9Nw9w/s320/email.png) no-repeat 7px 10px;
border:1px solid #ddd;
font-family:Arial,sans-serif;
font-size:13px;
font-weight:bold;
color:hsla(0,0%,27%,0.69);
width:225px;
height:25px;
margin-top:10px;
padding:5px 15px 5px 28px;
margin-left:10px;
display:inline-block;
transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;
-webkit-transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;
-moz-transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;
-o-transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;
}
.technopcarea-socialemailsubname:hover,.technopcarea-socialemailsubemail:hover {
border:1px solid #bebebe;
box-shadow:0.5px 1.5px 2px rgba(5,95,255,.1);
}
.technopcarea-socialemailsubname:focus, .technopcarea-socialemailsubemail:focus{
border-color: hsl(198, 100%, 49%);
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset, 0 0 8px hsl(198, 100%, 49%);
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset, 0 0 8px hsl(198, 100%, 49%);
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset, 0 0 8px hsl(198, 100%, 49%);
outline: 0 none;
}
.technopcarea-socialemailsubbutton {
-moz-box-shadow: 3px 4px 0px 0px #1564ad;
-webkit-box-shadow: 3px 4px 0px 0px #1564ad;
box-shadow: 3px 4px 0px 0px #1564ad;
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #79bbff), color-stop(1, #378de5));
background:-moz-linear-gradient(top, #79bbff 5%, #378de5 100%);
background:-webkit-linear-gradient(top, #79bbff 5%, #378de5 100%);
background:-o-linear-gradient(top, #79bbff 5%, #378de5 100%);
background:-ms-linear-gradient(top, #79bbff 5%, #378de5 100%);
background:linear-gradient(to bottom, #79bbff 5%, #378de5 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#79bbff', endColorstr='#378de5',GradientType=0);
background-color:#79bbff;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
border:1px solid #337bc4;
display:inline-block;
color:#ffffff;
font-family:arial;
font-size:17px;
font-weight:bold;
padding:8px 70px;
text-decoration:none;
margin-top:10px;
margin-left:35px;
text-shadow:0px 1px 0px #528ecc;
}
.technopcarea-socialemailsubbutton:hover {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #378de5), color-stop(1, #79bbff));
background:-moz-linear-gradient(top, #378de5 5%, #79bbff 100%);
background:-webkit-linear-gradient(top, #378de5 5%, #79bbff 100%);
background:-o-linear-gradient(top, #378de5 5%, #79bbff 100%);
background:-ms-linear-gradient(top, #378de5 5%, #79bbff 100%);
background:linear-gradient(to bottom, #378de5 5%, #79bbff 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#378de5', endColorstr='#79bbff',GradientType=0);
background-color:#378de5;
}
.technopcarea-socialemailsubbutton:active {
position:relative;
top:1px;
}
</style>
<div id='technopcarea-socialsub'>
<div class='technopcarea-socialsub-title'>
Get In Touch With Us
</div>
<div id='technopcarea-socialsub-icons'>
<ul class="technopcarea-socialsub-icons">
<li>
<a href="http://www.facebook.com/TechnoPcArea">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgY6RI1RkMSjgVMEuuUhgViblwMMbSSBQyHY4p3gx0rvT7VyEHcYdEYopjGvkETIIhgpROVFo-LxaWQQ1iB8UtoRzptZwpZ-S-k8u-3ZHtqDjp5_eryKuOXIGzfv9xphV1m5C5DMVE9kg/s64/blueprint-social-03.png" title="Add to Facebook" />
</a>
</li>
<li>
<a href="https://plus.google.com/101996924620264617682">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglfHfKDd-Hd22KBCHaSOokrPTr_N5yCwImxD-bbtPbkwvK7mUkXvKUP_qdqIDhYboyxYLOFgM2y4nSwaIpV9GMHeOWdQkrO0JzgT-L7yvL3Blp7RgbH9ypyTYt69CPljPUsPdo98LCf7I/s64/blueprint-social-04.png" title="Google plus" />
</a>
</li>
<li>
<a href="http://www.twitter.com/TechnoPcArea">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAhKyCjehhJNmcORTRXsnKlzv76dvX5QcY3Ay9ZUt3CllINiiVLsf07j5EW7Y7o6xcet51iez6tspWHSmNAU1zmCAaBTrKDjbPIXJuGPFdKtPP1C6HRZsnapGHNFfGAXefCNPfgGbs9wg/s64/blueprint-social-01.png" title="Add to Twitter" />
</a>
</li>
<li>
<a href="http://feeds2.feedburner.com/TechnoPcArea">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEip3DXZzpR_Asy_CNtierCJ7_KZFjmaeSsb_OJtGFrFs3RITm8OZIU-W8N65z9qWDFXAWjJa933Y_MhUL4sWTv9TkEX7nXBgHp4c30lmS_JxqbKBVcfU9KjBS4Xmsszkud_DkJ_vVAXAfc/s64/blueprint-social-10.png" title="Add RSS Feed" />
</a>
</li>
</ul>
</div>
<div class='technopcarea-socialemailsub'>
<p style='padding-top:5px;padding-bottom:10px;font-size: 14px;padding: 10px;font-family:Source Sans Pro;'>
Your Description Here
</p>
<form action='http://feedburner.google.com/fb/a/mailverify?uri=TechnoPcArea' class='technopcarea-subsbox-form' method='post' target='_new'>
<input class='technopcarea-socialemailsubname' name='name' placeholder='Your Name' type='text'/>
<input class='technopcarea-socialemailsubemail' name='email' placeholder='Your Email Address' type='text'/>
<input class='technopcarea-socialemailsubbutton' type='submit' value='Sign Up!'/>
</form>
</div>
</div>
- Replace my highlighted usernames with yours
What Do I Say About It ?
If I say honestly then I love this widget a lot as it increased my social likes and share and this would eventually increase your backlinks.A live demo of it can be found at the right side of this page.
Subscribe to:
Post Comments
(
Atom
)
Popular Posts On TechnoPcArea
-
About The List Of Movies I have watched a lot of mov... vies in 2014 and written reviews of a lot of movies .On watching all I decided to.. Read more -
... About The Buttons I got these two amazing read more buttons on two very popular websites.I liked these bu.. Read more -
About The Software What will you do when you delet... te an iPhone contact by accident? The first method that comes up to our mind may .. Read more -
Why To Write High Quality Content ? There are more t... than 250 million websites on the web but have you ever read on more than 5 websit.. Read more -
About The Infographics Since content marketing is ... growing very rapidly,blogerer's are also emerging.If you want to be better t.. Read more
Comments With Link Not Related To Post Are Deleted