Show Mobile Navigation
Hacks
Showing posts with label Hacks. Show all posts
Showing posts with label Hacks. Show all posts

Google Researcher Finds Links Wannacry Ransome's with North Korea

Hemant Verma - 4:45 PM
Well Finally Indian Man and a Google Researcher Neel Mehta finds a link of Wannacry Ransomware with Lazarus Group. This group recently transfer 5 Billions of Money from Bangaladesh's Bank and this group is totally related by North Korea.



Read Also: How to Protect Your Computer from Ransomware Attack

Who is Lazarus Group?

Lazarus Group is a cybercrime group made up of an unknown number of individuals. While not much is known about the Lazarus Group, researchers have attributed many cyber attacks to them over the last decade. The earliest known attack that the group is responsible for is known as "Operation Troy", which took place from 2009–2012. This was a cyber-espionage campaign that utilized unsophisticated DDoS techniques to target the South Korean government in Seoul. They are also responsible for attacks in 2011 and 2013. It is possible that they were also behind a 2007 attack targeting South Korea, but that still isn't certain. A notable attack that the group is known for is the 2014 attack on Sony Pictures.

The Sony attack used more sophisticated techniques and highlighted how advanced the group has become over time. The most recent attack attributed to the group is recent 2016 bank heist which included an attack on the Bangladesh Bank, successfully stealing US$81 million.


Neel Mehta Finds a Clue

Neel Mehta, a security researcher at Google, found evidence that suggests the WannaCry ransomware,, is linked to a state-sponsored hacking group in North Korea, known for cyber attacks against South Korean organizations. Named as Lazarus Group and This group also steals the 5 Billions from Bangladesh's Bank.

This is WannaCrypt Attribution

Some security researchers from Kaspersky, Symantec, immediately followed the tip from Neel and confirmed a strong link between WannaCry and other malware families, including Lazarus, Joanap, and Brambul, which suggests WannaCry was written or modified by the same author and Lazarus mainly worked many times for the North Korea. So, it could be the North Korea behind to these attacks, But not really sure till yet.

(Note: This is not a allegation on North Korea, it's just a co-incidence)

Neel Mehtaprovide some source codes which proves that they related with Lazarus Group.


How to Add Facebook Verified Mark for Blog Author in Comments

Hemant Verma - 8:33 PM
Hello Friends when we open our Facebook account and when we see any celibrity's profile then we saw there a blue tick mark there and that means is that, this person is verified person and this is not a fake profile on Facebook. We can also add same kind of blue tick mark in blogger for authors and admins it means that tick mark will shows that This is Author's OR Admin's Comment.












Add Author's Verified Tick Mark in Blogger

You just have to add a one simple code in your blogger template.

  • Login to Blogger > Dashboard
  • Click on Drop Down Menu and Select Template
  • Backup your Template before making any changes to your blog
  • Press Ctrl + F and search the code shown below

]]></b:skin>



  • Paste below code just before it.

.comments .comments-content .icon.blog-author {
    background: url("https://dl.dropboxusercontent.com/s/gp8fhc34w2rka9h/verified%20page.png") no-repeat scroll 0 0 transparent;
}



  • Finally, Save Your Template. 



Final Words....!

This is a very simple trick of Blogger and this will gives a pro look and feel and if any visitor see your comment with a verified tick mark then some interesting thing will definetly hit in his / her mind and that will be a verified point of uniquiness. 

How to Secretly Copy Files From Someones PC Without His Knowledge

Hemant Verma - 7:58 PM



You can easily copy data from your friend's computer to with out knowing him/her. This trick can help you to do this kind of task, and you don't need any kind of internet support for this task and also don't need any kind of new technology like Bluetooth, Infrared etc. You can do this task by just a little notepad trick also need some codes for this job, and I will totally work very smoothly.

This Trick could prove to be very helpful and it would Copy and Steal all the Data without the Confirmation and Knowing of Computer Owner.



Create List of All Posts | Table of Content in Blogger by Generator

Hemant Verma - 6:41 PM

Table of Content means a list which includes our all posts with sorted by lables and also sorted by alphabets and this plugin is specially made by javascript and many times if we want to add this widget then we have to add many codes and after that we have to replace them by minding the symbols and if a newbie is doing this task for own blog then many times symbol's mistake does by newbie so you can add it direct in your blog without replacing any code OR any blog name. You will gonna add this widget thought widget Generators. So, Hope you gonna like this.



Add a Roseic Classical Mega Drop Down Menu

Hemant Verma - 10:46 AM

Drop down menus are very important in blogging and these kinds of stuff is also considerable for the visitors be'coz visitor when firstly see your menus and other widget and if he like that then she/he wish to visit again itself and content also very important fro the every blogger.

This drop down menu is very different be'coz this not multilevel but this a mega drop down menu which is under the series of R means Roseic.




Add a Professional eRose Author Bio Widget

Hemant Verma - 10:09 AM

Many Bloggers wants the new and fresh widgets of blogger and most of the saying we want new author bio widget which includes the all aspects of blogging like Social Media as Facebook, Twitter, Youtube etc. so keep it in mind, in this widget you will get Donation Button, Be a Blogger Button and much when you use this widget.





Add eRose Author Bio Widget in Blogger

  • Login to Blogger > Dashborad
  • Click on Drop Down Menu and select Template
  • Backup your Template before making any changes to your blog
  • Press Ctrl + F and search the code shown below.

]]></b:skin>


  • Paste below code just above it.

.clear {
clear:both;
}

#author-box {
margin:10px 0;
}

#author-box a:hover {
background:none!important;
}

#author-box .row-1 {
background:#333;
padding:20px;
}

#author-box .row-1 .avatar {
float:left;
line-height:1;
-moz-box-shadow:0 0 10px #FFF;
-webkit-box-shadow:0 0 10px #FFF;
box-shadow:0 0 10px #FFF;
}

#author-box .row-1 .info {
margin:0 0 0 110px;
}

#author-box .row-1 .info h6 {
color:#FFF;
font-size:20px;
margin:-4px 0 0;
}

#author-box .row-1 .info h6 span {
font-size:11px;
font-weight:400;
background:#1BA1E2;
-webkit-border-radius:40px;
-moz-border-radius:40px;
border-radius:40px;
filter:alpha(opacity=60);
opacity:0.6;
margin:0 0 0 1em;
padding:1px 9px 2px;
}

#author-box .row-1 .info p {
color:#DDD;
font-weight:400;
font-size:14px;
margin:0;
}

#author-box .row-2 {
background:#666;
}

#author-box .row-2 a.social-item {
display:block;
float:left;
color:#FFF;
text-align:center;
padding:15px;
}

#author-box .row-2 .social-item .icon {
height:32px;
width:32px;
}

#author-box .row-2 .social-item > span {
display:block;
text-align:center;
margin:auto;
}

#author-box .row-2 .social-item .label {
font-weight:700;
font-size:13px;
}

#author-box .row-2 .social-item .click {
font-size:11px;
color:#EAEAEA;
line-height:1;
}

#author-box .row-2 a.social-item:hover {
background:#1BA1E2!important;
}

#author-box .row-3 {
background:#1BA1E2;
}

#author-box .row-3 form,#author-box .row-3 a.donation-button {
display:block;
float:left;
}

#author-box .row-3 .donation-button {
background:#1BA1E2;
border:none;
font-family:Impact;
font-size:30px;
color:#FFF;
line-height:1.2em;
margin:0;
padding:10px;
}

#author-box .row-3 .donation-button:hover {
background:#000;
cursor:pointer;
}

#author-box .row-3 .register-button {
display:block;
color:#FFF;
border:none;
font-family:Impact;
font-size:30px;
text-align:right;
line-height:1.2em;
margin:0;
padding:10px;
}

#author-box .row-3 .register-button:hover {
color:#000;
cursor:pointer;
}

#author-box .row-2 .social-item.twitter .icon {
background-position:0 -32px;
}

#author-box .row-2 .social-item.facebook .icon {
background-position:0 -64px;
}

#author-box .row-2 .social-item.gplus .icon {
background-position:0 -96px;
}

#author-box .row-2 .social-item.linkedin .icon {
background-position:0 -128px;
}

#author-box .row-2 .social-item.youtube .icon {
background-position:0 -160px;
}

#author-box .row-2 .social-item.pinterest .icon {
background-position:0 -192px;
}

#author-box .social-item .icon {
background-image:url(https://lh5.googleusercontent.com/--PQVoN23nrI/UYHHvhtNSxI/AAAAAAAAJPA/5weO87qvER4/s224/ausocial.png)!important;
background-repeat:no-repeat;
}

 
  • Now Search for below code once again

<div class='post-footer-line post-footer-line-1'>


  • Paste below code just after it.

<div id='author-box'>
            <div class='row row-1'>
                <div class='avatar'>
                    <a href='http://www.widgetgenerators.com/2012/09/about-author.html'><img alt='author-avatar' class='avatar avatar-90 photo' height='90' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-0qnF72vsKqy3oaXuRAFYQI0jgYp9V5e7L5Ob5kYQrNwYIC56yzNJcj0CGhSWgXVa5IXP1QX652Hv8W02Roqz4MH5bUzyLWkIhOkeUb80w6VI3o3Pa119WAte2wBc7x5qXFQViucp2pgc/s1600/Capture.PNG' width='90'/></a>
                </div>
                <div class='info'>
  <h6>Posted By: Hemant Verma <span>Admin and Author</span></h6>
    <p><strong><a href='http://www.widgetgenerators.com/2012/09/about-author.html'>Hemant Verma </a> is the founder of Widget Generators.</strong> <strong>Graduate in Computer Applications in 2012,  Love to Make Blogger Hacks and Like to Play with HTML and a Business Man.</strong></p>
                </div>
                <div class='clear'/>
            </div>
            <div class='row row-2'>
                <a class='social-item website' href='http://www.widgetgenerators.com' meta='website' target='_blank'>
                    <span class='icon'/>
                    <span class='label'>Website</span>
                  <span class='click'><span class='val'>113576 Visitors</span> </span>
                </a>
          
                <a class='social-item twitter' href='https://twitter.com/Widgetgenerator' meta='twitter' target='_blank'>
                    <span class='icon'/>
                    <span class='label'>Twitter</span>
                    <span class='click'><span class='val'>200 Followers</span></span>
                </a>
          
                <a class='social-item facebook' href='http://www.facebook.com/Widgetgenerators' meta='face' target='_blank'>
                    <span class='icon'/>
                    <span class='label'>Facebook</span>
                    <span class='click'><span class='val'>500 Likes</span></span>
                </a>
          
                <a class='social-item gplus' href='https://plus.google.com/101961392825834817673' meta='gplus' target='_blank'>
                    <span class='icon'/>
                    <span class='label'>Google+</span>
                    <span class='click'><span class='val'>70 Joined</span></span>
                </a>
          
                <a class='social-item linkedin' href='http://ph.linkedin.com/Widgetgenerators' meta='linkedin' target='_blank'>
                    <span class='icon'/>
                    <span class='label'>LinkedIn</span>
                    <span class='click'><span class='val'>40 Links</span></span>
                </a>
          
                <a class='social-item youtube' href='https://www.youtube.com/user/Widgetgenerators' meta='youtube' target='_blank'>
                    <span class='icon'/>
                    <span class='label'>Youtube</span>
                    <span class='click'><span class='val'>30 Followers</span></span>
                </a>
          
              
            <div class='clear'/></div>
            <div class='row row-3'>
            <form action='https://www.paypal.com/cgi-bin/webscr' class='author-donation' method='post'>
                <input name='cmd' type='hidden' value='_donations'/>
                <input name='business' type='hidden' value='vhemant03@gmail.com'/>
                <input name='lc' type='hidden' value='US'/>
                <input name='item_name' type='hidden' value='Donate Blogger'/>
                <input name='no_note' type='hidden' value='0'/>
                <input name='currency_code' type='hidden' value='USD'/>
                <input class='donation-button' name='submit' type='submit' value='+Donate to Author'/>
            </form><a class='register-button' href='http://blogger.com/'>Become a Blogger</a><div class='clear'/></div>
    </div>

  • Finally Save your Template.
  • You are done


Make Changes....!

  • Replace this http://www.widgetgenerators.com/2012/09/about-author.html with your author bio page link (Optional)
  • Replace this https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-0qnF72vsKqy3oaXuRAFYQI0jgYp9V5e7L5Ob5kYQrNwYIC56yzNJcj0CGhSWgXVa5IXP1QX652Hv8W02Roqz4MH5bUzyLWkIhOkeUb80w6VI3o3Pa119WAte2wBc7x5qXFQViucp2pgc/s1600/Capture.PNG with your author image.
  • Replace this Hemant Verma with your Author OR Admin name.
  • Replace this Hemant Verma  with your author bio.
  • Replace this www.widgetgenerators.com with your website link.
  • Replace this Widgetgenerator with your twitter username.
  • Replace this Widgetgenerators with your Facebook username.
  • Replace this 101961392825834817673 with your Google Plus id
  • Replace this Widgetgenerators with your linked in profile id.
  • Replace this Widgetgenerators with youtube username.
  • Replace this vhemant03@gmail.com with your email id on Paypal account

If Any Problem Comes, Ask in Comments



Customize Contact Form of Blogger

Hemant Verma - 4:06 PM

As we all know that Blogger recently launched their contact form by which you can easily contact and send your questions and queries to the admin OR author of the blog / site and this very helpful for admins be'coz many professional bloggers had to purchase the hosting and then they created their own contact form by using PHP languages OR many of us (like me) use free wufoo OR and any other contact form making service and where we have create account and also had to spend long time to create them but after all you couldn't get any professional look but in today's tutorial you will easily design your contact form in just 5 min with free cost and it will for life long. 




It Include only 3 Simple Parts.

    1. Add Contact Form in Blogger
    2. Add Contact Form in Static Page
    3. Customize Contact Form in New Look


Part 1. Add Contact Form in Blogger

  • Login to Blogger > Dashborad
  • Click on Drop Down Menu and select Layout
  • Add Gadget
  • Click on More Gadget
  • Select Contact Form


  • Now Give a Name to your Contact Form as we recommend you should give Contact Form

  • Finally your Contact Form Saved.



Part 2. Add Contact Form in Static Page

  • Login to Blogger > Dashborad
  • Click on Drop Down Menu and select Pages
  • Click on New Page 
  • Select Blank Page

  • Now Click on HTML an Paste below code in it.

<div class='form'>
<!-- Custom Contact Form By WG Starts -->
<form name='contact-form'>
<!-- Name Field -->
<input class='contact-form-name' id='ContactForm1_contact-form-name' name='name' value="Name" size='30' type='text' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Name&quot;;}' onfocus='if (this.value == &quot;Name&quot;) {this.value = &quot;&quot;;}' />
<p></p>
<!-- Email ID Field -->
<input class='contact-form-email' id='ContactForm1_contact-form-email' name='email' value="Email ID"  size='30' type='text' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Email ID&quot;;}' onfocus='if (this.value == &quot;Email ID&quot;) {this.value = &quot;&quot;;}'/>
<p></p>
<!-- Message Field -->
<textarea class='contact-form-email-message'  id='ContactForm1_contact-form-email-message' name='email-message'  value='Leave Your Message..'  onblur='if (this.value == &quot;&quot;) {this.value = &quot;Leave Your Message..&quot;;}' onfocus='if (this.value == &quot;Leave Your Message..&quot;) {this.value = &quot;&quot;;}'></textarea>
<p></p>
<!-- Clear Button -->
<input class='WG-btnLogin' type='reset' value='Clear'/>
<!-- Send Button --> 
<input class='WG-btnLogin' id='ContactForm1_contact-form-submit' type='button' value='Send'/>
<p></p>
<!-- Validation -->
<div style='text-align: center; max-width: 222px; width: 100%'>
<p class='contact-form-error-message' id='ContactForm1_contact-form-error-message'></p>
<p class='contact-form-success-message' id='ContactForm1_contact-form-success-message'></p>
</div>
</form>
<!-- Custom Contact Form By WG Ends -->
</div>


  • Finally Publish that Page


Part 3. Customize Contact Form in New Look

  • Login to Blogger > Dashborad
  • Click on Drop Down Menu and select Template
  • Backup your Template before making any changes to your blog
  • Press Ctrl + F and search the code shown below.

]]></b:skin>


  • Paste Below code just above it.

#ContactForm1
{
display: none ! important;
}


  • Now Search for </head>
  • Paste below code just before </head>

<b:if cond='data:blog.pageType == "static_page"'>
  <style>
#ContactForm1{ display:none!important;}
  </style>
</b:if>

<style>
/*---- Compatible contact Form by WG -----*/
.contact-form-name, .contact-form-email, .contact-form-email-message {
max-width: 220px;
width: 100%;
font-weight:bold;
}
     
.contact-form-name {
background: #FFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBPwDFbBapogjoGEtgl8vrR5DEe1WDuf4QE6x2LYB994swdHMhGGuAKi1YgyEtTbqzFOp_wWIhDYVcll2u3BbdHdVArw3wZyQx3Ycn9ZiKYylS21voo3r0MkmjaNcHWbPd4ofEaN4VMl8/s320/name.png) no-repeat 7px 8px;
background-color: #FFF;
border: 1px solid #ddd;
box-sizing: border-box;
color: #A0A0A0;
display: inline-block;
font-family: Arial,sans-serif;
font-size: 12px;
font-weight:bold;
height: 24px;
margin: 0;
margin-top: 5px;
padding: 5px 15px 5px 28px;
vertical-align: top;
}
    
.contact-form-email {
background: #FFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpIMLvY17nSo-l9VTpI3CldUc6ENiBDCfC8z18xhi2v1b_Uw2_3iKikJGGUxYanEjipy3w3k5TA-TNJ5QWGdpEm0xeRsfvsl3oAwChwBqRWgJGfpqhHNQ2Dhd3Vs_BxTcu74MK3TWNOR0/s320/email.png) no-repeat 7px 10px;
background-color: #FFF;
border: 1px solid #ddd;
box-sizing: border-box;
color: #A0A0A0;
display: inline-block;
font-family: Arial,sans-serif;
font-size: 12px;
font-weight:bold;
height: 24px;
margin: 0;
margin-top: 5px;
padding: 5px 15px 5px 28px;
vertical-align: top;
}

.contact-form-email:hover, .contact-form-name:hover{
border: 1px solid #bebebe;
box-shadow: 0 1px 2px rgba(5, 95, 255, .1);

padding: 5px 15px 5px 28px;
}
.contact-form-email-message:hover {
border: 1px solid #bebebe;
box-shadow: 0 1px 2px rgba(5, 95, 255, .1);
padding: 10px;
}
.contact-form-email-message {
background: #FFF;
background-color: #FFF;
border: 1px solid #ddd;
box-sizing: border-box;
color: #A0A0A0;
display: inline-block;
font-family: arial;
font-size: 12px;
margin: 0;
margin-top: 5px;
padding: 10px;
vertical-align: top;
max-width: 350px!important;
height: 150px;
border-radius:4px;
}

.contact-form-button {
cursor:pointer;
height: 32px;
line-height: 28px;
font-weight:bold;
border:none;
}

.contact-form-button {
display: inline-block;
zoom: 1; /* zoom and *display = ie7 hack for display:inline-block */
*display: inline;
vertical-align: baseline;
margin: 0 2px;
outline: none;
cursor: pointer;
text-align: center;
text-decoration: none;
font: 14px/100% Arial, Helvetica, sans-serif;
padding: .5em 2em .55em;
text-shadow: 0 1px 1px rgba(0,0,0,.3);
-webkit-border-radius: .5em;
-moz-border-radius: .5em;
border-radius: .5em;
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
box-shadow: 0 1px 2px rgba(0,0,0,.2);
}
.contact-form-button:hover {
text-decoration: none;
}
.contact-form-button:active {
position: relative;
top: 1px;
}

.WG-btnLogin
{
    -moz-border-radius:2px;
    -webkit-border-radius:2px;
    border-radius:15px;
    background:#a1d8f0;
    background:-moz-linear-gradient(top, #badff3, #7acbed);
    background:-webkit-gradient(linear, center top, center bottom, from(#badff3), to(#7acbed));
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#badff3', EndColorStr='#7acbed')";
    border:1px solid #7db0cc !important;
    cursor: pointer;
    padding:11px 16px;
    font:bold 11px/14px Verdana, Tahomma, Geneva;
    text-shadow:rgba(0,0,0,0.2) 0 1px 0px;
    color:#fff;
    -moz-box-shadow:inset rgba(255,255,255,0.6) 0 1px 1px, rgba(0,0,0,0.1) 0 1px 1px;
    -webkit-box-shadow:inset rgba(255,255,255,0.6) 0 1px 1px, rgba(0,0,0,0.1) 0 1px 1px;
    box-shadow:inset rgba(255,255,255,0.6) 0 1px 1px, rgba(0,0,0,0.1) 0 1px 1px;
    margin-center:12px;
    float:center;
    padding:7px 21px;
}

.WG-btnLogin:hover,
.btnLogin:focus,
.btnLogin:active{
    background:#a1d8f0;
    background:-moz-linear-gradient(top, #7acbed, #badff3);
    background:-webkit-gradient(linear, center top, center bottom, from(#7acbed), to(#badff3));
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#7acbed', EndColorStr='#badff3')";
}
.WG-btnLogin:active
{
    text-shadow:rgba(0,0,0,0.3) 0 -1px 0px;
}
</style>

      <!--[if IE 9]>
    <style>
   
.contact-form-name {
background: #FFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBPwDFbBapogjoGEtgl8vrR5DEe1WDuf4QE6x2LYB994swdHMhGGuAKi1YgyEtTbqzFOp_wWIhDYVcll2u3BbdHdVArw3wZyQx3Ycn9ZiKYylS21voo3r0MkmjaNcHWbPd4ofEaN4VMl8/s320/name.png) no-repeat 7px 0px;
}
.contact-form-email {
background: #FFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpIMLvY17nSo-l9VTpI3CldUc6ENiBDCfC8z18xhi2v1b_Uw2_3iKikJGGUxYanEjipy3w3k5TA-TNJ5QWGdpEm0xeRsfvsl3oAwChwBqRWgJGfpqhHNQ2Dhd3Vs_BxTcu74MK3TWNOR0/s320/email.png) no-repeat 7px 6px;
}
    </style>
    <![endif]-->
   
    <style>
@media screen and (-webkit-min-device-pixel-ratio:0) {

.contact-form-name {
background: #FFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBPwDFbBapogjoGEtgl8vrR5DEe1WDuf4QE6x2LYB994swdHMhGGuAKi1YgyEtTbqzFOp_wWIhDYVcll2u3BbdHdVArw3wZyQx3Ycn9ZiKYylS21voo3r0MkmjaNcHWbPd4ofEaN4VMl8/s320/name.png) no-repeat 7px 6px;
padding: 15px 15px 15px 28px;

}
.contact-form-email {
background: #FFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpIMLvY17nSo-l9VTpI3CldUc6ENiBDCfC8z18xhi2v1b_Uw2_3iKikJGGUxYanEjipy3w3k5TA-TNJ5QWGdpEm0xeRsfvsl3oAwChwBqRWgJGfpqhHNQ2Dhd3Vs_BxTcu74MK3TWNOR0/s320/email.png) no-repeat 7px 8px;
padding: 15px 15px 15px 28px;
}

.contact-form-email:hover, .contact-form-name:hover{
padding: 15px 15px 15px 28px;
}

.contact-form-button {
height: 28px;
}
}
</style>


  • Finally Save your Template and Say Bingo be'coz you are done with it.
  • Enjoy with Professional look of your own personal contact form :)

Add a Unique Wordpress Style Floating Social Sharing Bar Widget

Hemant Verma - 8:15 PM

Wordpress Style Widgets are very important for blogger be'coz it's always gives the unique look and feel to your website that's why we also embed one awesome wordpress plugin, which is known as Floating Social Sharing Bar, it's simply when you scroll down your page then you can see this widget and also you can change the color according yourself and according to your theme color. It's simply made by the CSS and JavaScript and flexible codes, so it will not be problem to install it in your blog.








Add Wordpress Style Widget

  • Login to Blogger > Dashborad
  • Click on Drop Down Menu and select Template
  • Backup your Template before making any changes to your blog
  • Now Click on Edit HTML > Proceed > Expand Widget Templates
  • Press Ctrl + F and search the code shown below.
</head>

  • Paste below code before </head>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.js"></script>


Note: If Your Template Already Installed Above jQuery Code then Skip First Step


  • Press Ctrl + F and search the code shown below.

 <data:post.body/>

  • Paste below code just after it.

<b:if cond='data:blog.pageType == "item"'>
<div id='md-active-share-comment-marker'></div>
</b:if>

  •  Press again Ctrl + F and search the code shown below. 

</body>

  •  Paste below code just before </body>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script src='https://dl.dropboxusercontent.com/u/63968842/Floating%20Social%20sharing%20Horizontal%20Bar%28www.widgetgenerators.blogspot.com%29.js' type='text/javascript'/>
<div id='md-share-window' style='width: 100%; display: block; position: fixed; top: -450px; left: 0px; background-color: rgba(235, 88, 60, 0.8); z-index: 100; padding: 0 0 10px 0;'>
<div style='width: 800px; margin: 20px auto;'>
<span id='twitter' style='float:left; margin: 0 5px; padding: 3px 0 0 0;'>
<a class='twitter-share-button' data-count='vertical' href='http://twitter.com/share'>Tweet</a>
<script src='http://platform.twitter.com/widgets.js' type='text/javascript'/></span>
<span id='md-plusone' style='float:left; padding-top: 4px; margin: 0 5px;'>
<script src='https://apis.google.com/js/plusone.js' type='text/javascript'/>
<g:plusone size='tall'/></span>
<span id='md-fblike' style='float: left; margin: 0 5px; padding: 4px 0 0; width: 50px; overflow: hidden;'>
<div id='fb-root'/>
<script src='http://connect.facebook.net/en_US/all.js#appId=155934781145405&amp;xfbml=1'/>
<fb:like font='' href='' layout='box_count' send='false' show_faces='false' width='50'>
</fb:like>
</span>         
<div style='display:block; margin: 0 5px; padding: 5px 0px 0px; color: #FFFFFF'>
Are you Awesome? Legend has it that Awesome people can and will share this post!<br/>
<span style='color: #FFFFFF; font-size: 18px;'><data:blog.pageName/></span>
</div>
</div>
</div>
</b:if>

  • Now Finally Save your template.


If Any Problem Comes, Ask in Comments



Previous
Editor's Choice

 



Make Your Blog Like a Pro
About | Contact | Affiliates | Privacy Policy | TOS