LATEST >>

Welcome Here And Thanks For Visiting. Like Us On Facebook...

EXEIdeas – Let's Your Mind Rock » Blogspot / Blogspot Social Sharing / Website / Website Social Sharing » Awesome And Simple EXE-Social Widget With Subscription Box

Awesome And Simple EXE-Social Widget With Subscription Box

Awesome And Simple EXE-Social Widget With Subscription Box

Am sharing with you again another cool subscription box which comprises of subscription box, and social sharing buttons. In my previous post, there is so so many widgets and it is another to that is simple but stylish. I have design it to the perfect taste so that it wouldn’t affect your blog loading time. To add this subscription box to your blog, In this I put a Email subscription from and three social sharing link FaceBook, Twitter, LinkedIn, Google+, YouTube, Rss And Other Social , so that this widget fulfill your both requirement. I used CSS3 to rotate these on hover design this widget so it take only few seconds to load. This Widget can be add in Blogger, WordPress or Any other HTML website. simply follow the few steps below.



Features:
1.) Social Network Icon With Subscription Box.
2.) Twist The Icons On Hover.
3.) FaceBook, Twitter, LinkedIn, Google+, YouTube, Rss And Other Social.
4.) Simple And Stylish Design.
5.) HD Icons.
6.) Quick To Load CSS.

How To Add In Blogspot?
1.) Go To Your www.blogger.com
2.) Open Your Desire Blog.
3.) Go To Layout.
4.) Click “Add A Gadget” Where You Want To Add It.
5.) Now Scroll To “HTML-JAVASCRIPT”
6.) Click “+” Icon To Add It.
7.) Now Copy The Below Code And Paste It To There.
8.) Leave The Title Empty.
9.) Click Save, Now You Are Done.

How To Add In Website?
1.) Just Go To Your HTML File.
2.) Now Copy The Below Code And Paste It Between <body> </body>.
3.) Save It, Now You Are Done.

<!-- This Is A CopyRight Code Of EXEIdeas International.It Is Free To Use But With HTML Design Code.If AnyOne Found To Be Changing This Code Should Be Under Legal Action Via DMCA. -->
<style>
#exeideasbody {
background:#f8f8f8;
margin:0 0 40px 0;
padding:10px;
border: 3px outset #ff0000; -moz-border-radius: 10px; border-radius: 10px;
overflow:hidden;
font-size: 14px;
}
.spinning_icons a{
width:36px;
height:36px;
display:inline-block;
text-indent:-9999em;
background-position:0 0;
background-repeat:no-repeat;
z-index:2000;
overflow:hidden;
}
.spinning_icons a:hover{
transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
transition: transform 0.2s ease-out;
-webkit-transition: -webkit-transform 0.2s ease-out;
-moz-transition: -moz-transform 0.2s ease-out;
}
.twitter{ background:url('http://4.bp.blogspot.com/-05nZtw8WXLE/T1h_HuxjRnI/AAAAAAAADgo/rw88iwdiKIM/s000/twitter.png'); }
.facebook{ background:url('http://4.bp.blogspot.com/-P9SChCbjibg/T1h_HlnZ0YI/AAAAAAAADgs/wNmJ5EKi6lE/s000/facebook.png'); }
.linkedin{ background:url('http://4.bp.blogspot.com/-7KqOsBoC-aY/T1h_KhOoPCI/AAAAAAAADhA/cjRF7qiGZOY/s000/linkedin.png'); }
.rss{ background:url('http://1.bp.blogspot.com/-ff_XfJA8KM8/T1h_KqwUURI/AAAAAAAADhI/KB9DvIVr9jo/s000/rss.png'); }
.youtube{ background:url('https://lh6.googleusercontent.com/-EjnvqvxdSIQ/T40l3XSfhlI/AAAAAAAAB9s/4VnPEZgDXSQ/s32/YouTube.png'); }
.googleplus{ background:url('http://3.bp.blogspot.com/-3elsv4uhSzs/T1h_KSLDYVI/AAAAAAAADg4/Nw8kol8SBhE/s000/gplus.png.png'); }
.mixsocial{ background:url('https://lh6.googleusercontent.com/-xcHvGi2TpZk/T6jP9vrvTMI/AAAAAAAACGg/7mFW9zJeCic/s32/myspace.png'); }
#email-news-subscribe .email-box{
padding: 5px 10px;
font-family: "Arial","Helvetica",sans-serif;
height:35px;}
#email-news-subscribe .email-box input.email{
background:#FFFFFF;
border: 1px solid #dedede;
color: #999;
padding: 7px 10px 8px 10px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-o-border-radius: 3px;
-ms-border-radius: 3px;
-khtml-border-radius: 3px;
border-radius: 3px;
border-image: initial;
font-family: "Arial","Helvetica",sans-serif;}
#email-news-subscribe .email-box input.email:focus{color:#333}
#email-news-subscribe .email-box input.subscribe{
background: -moz-linear-gradient(center top,#FFCA00 0,#FF9B00 100%);
background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#FFCA00),color-stop(1,#FF9B00));
background: -moz-linear-gradient(center top,#FFCA00 0,#FF9B00 100%);
-pie-background: linear-gradient(270deg,#ffca00,#ff9b00);
font-family: "Arial","Helvetica",sans-serif;
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
border:1px solid #cc7c00;
color:white;
text-shadow:#d08d00 1px 1px 0;
padding:7px 14px;
margin-left:3px;
font-weight:bold;
font-size:12px;
cursor:pointer;
border-image: initial;}
#email-news-subscribe .email-box input.subscribe:hover{
background: #ff9b00;
background-image:-moz-linear-gradient(top,#ffda4d,#ff9b00);
background-image:-webkit-gradient(linear,left top,left bottom,from(#ffda4d),to(#ff9b00));
filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr=#ffffff,endColorStr=#ebebeb);
outline:0;-moz-box-shadow:0 0 3px #999;
-webkit-box-shadow:0 0 3px #999;
box-shadow:0 0 3px #999
background:-webkit-gradient(linear,left top,left bottom,color-stop(0,#ffda4d),color-stop(1,#ff9b00));
background:-moz-linear-gradient(center top,#ffda4d 0,#ff9b00 100%);
-pie-background:linear-gradient(270deg,#ffda4d,#ff9b00);
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
border:1px solid #cc7c00;
color:#FFFFFF;
text-shadow:#d08d00 1px 1px 0}
</style>
<!--[if IE]>
<style>
#email-news-subscribe .email-box input.subscribe{
background: #FFCA00;
}
</style>
<![endif]-->
<center id="exeideasbody">
<div class="spinning_icons">
<a href="http://twitter.com/EXEIdeas" class="twitter" title="twitter">Twitter</a>
<a href="http://facebook.com/EXEIdeas2010" class="facebook" title="facebook">Facebook</a>
<a href="http://pk.linkedin.com/in/exeideas" class="linkedin" title="linkedin">Linkedin</a>
<a href="https://plus.google.com/102256859586166648016" class="googleplus" title="Google Plus">Google Plus</a>
<a href="http://feeds.feedburner.com/EXEIdeas" class="rss" title="rss">RSS</a>
<a href="http://www.youtube.com/EXEIdeas" class="youtube" title="youtube">YouTube</a>
<a href="http://www.exeideas.com/p/about-us.html" class="mixsocial" title="Other Social">Social</a>
</div>
<div id="email-news-subscribe">
<div class="email-box">
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=exeideas', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input class="email" type="text" style="width: 150px; font-size: 12px;" id="email" name="email" value="Enter Your Email here.." onfocus="if(this.value==this.defaultValue)this.value=&#39;&#39;;" onblur="if(this.value==&#39;&#39;)this.value=this.defaultValue;" />
<input type="hidden" value="EXEIdeas" name="uri" />
<input type="hidden" name="loc" value="en_US" />
<input class="subscribe" name="commit" type="submit" value="Subscribe" />
</form>
</div>
</div>
</center>
<!-- This Is A CopyRight Code Of EXEIdeas International.It Is Free To Use But With HTML Design Code.If AnyOne Found To Be Changing This Code Should Be Under Legal Action Via DMCA. -->

Customization:
1.) Change All Blue Link With Your Links.
2.) Change Red Text With Your FeedBurner ID.
3.) Sav3 And Done.

You Like It, Please Share This Recipe With Your Friends Using...

6 Responses to “Awesome And Simple EXE-Social Widget With Subscription Box”

  1. How can i add this below post in blogger.
    Thanks

  2. Asim Nawaz says:

    when will this popup pop out? i mean on loading home page? can i put it in a link or a widget?

    http://downloadsandtricks.blogspot.com/
    An Informative site which provides free softwares, ebooks, wallpapers, videos, solution manuals, programming, blogging tips & tutorials & much more Interesting Stuff

Leave a Reply

Your email address will not be published. Required fields are marked *