Wednesday 7 May 2014

MSB Social Subscription Blogger Widget for Bloggers

Subscription Blogger Wiget
MSB Social Widget for Bloggers
Here is a new blogger widget MSB. It's very attractive and I already used this widget on my 2nd blog and I got good response from visitors so I decided to post this widget on GetThemeNow so other bloggers can also add this beautiful widget on their blogs. It has 5 social media icons and one space for your welcome message which is really good to impress your visitors. Follow the steps to add this widget on your blog. Thanks

How to Add this Widget to Blogger

  • 1)- Go to Blogger Dashboard > Design > Edit HTML
  • 2)- Tick the Expand Widget check box
  • 3)- Now Press Ctrl + F and find
]]></b:skin>
  • 4)- Now past this code above ]]></b:skin>
/* bluekut.com Mickey Subscribe Box start*/
.MickeySubBox {
    height:271px;
    width:282px;
    background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXZs6LQJ1IH1bZXWbj1OFakx_QirxD_OstKmmfGsb4Arqd-WWtnH4tlWY-T3wtajaNpDXrIY0oj8dqsrM9iBnWxvU3ygWEfBAYCSiKOhxOu8wez_-xHnDZkMu5Ui9AWxodBCfe7U24KzNK/s1600/s.png); background-repeat:no-repeat;
    padding-top:40px;
    padding-left:6px;
  
}

.MickeySubMickeySubBox1 {
    border:1px;
    border:solid;
    border-color:#999;
    float:left;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.MickeySubMickeySubBox1:hover {
    border-color:#F00;
    opacity:0.4;
filter:alpha(opacity=40);
}

.MickeySubMickeySubBox2 {
    border:1px;
    border:solid;
    border-color:#999;
    float:left;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.MickeySubMickeySubBox2:hover {
    border-color:#0CF;
        opacity:0.4;
filter:alpha(opacity=40);
}
.MickeySubMickeySubBox3 {
    border:1px;
    border:solid;
    border-color:#999;
    float:left;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.MickeySubMickeySubBox3:hover {
    border-color:#930;
        opacity:0.4;
filter:alpha(opacity=40);
}
.MickeySubMickeySubBox4 {
    border:1px;
    border:solid;
    border-color:#999;
    float:left;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.MickeySubMickeySubBox4:hover {
    border-color:#06F;
        opacity:0.4;
filter:alpha(opacity=40);
}
.MickeySubMickeySubBox5 {
    border:1px;
    border:solid;
    border-color:#999;
    float:left;
    -webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.MickeySubMickeySubBox5:hover {
    border-color:#F00;
        opacity:0.4;
filter:alpha(opacity=40);
}
.MickeySubBoxinner {
  
margin-top:69px;
margin-left:127px;
font-family:COMIC SANS MS;
text-align:center;
color:#FFF;
width:100px;  
}
  • 5)-  Now press Save Template
  • 6)-  Click the Layout tab from your blog Dashboard.
  • 7)-  Click Page Elements.
  • 8)-  Click Add a Gadget above the section you want to put your search box in.
  • 9)-  Click the plus sign next to HTML/Javascript.
  • 10)- Leave Title box blank.
  • 11)- Copy and paste this HTML code in the text area.
   <center>
<div class="MickeySubBox" >
<div class="MickeySubMickeySubBox1"><a href="Your Youtube URL"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixl1U7Hd7eD9GjRscPID8-kPrO9zyS01PSISuaKEq14R13ytYWrlpZjCNrf6olc41q2DyqzZAbNHHNRTih_GRhED7QlamTQlUc3y9ojMXkHrsYP4CdfwAkpz2aSOct5GOXGXQUBnvzkUyb/s1600/893494177848807.png" width="48" height="48" alt="YouTube"></a>
</div>

<div class="MickeySubMickeySubBox2"><a href="Your Twitter URL"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipY9X-XnLIuSZ4xG5_F5m0Aq-UchFPwBe8emWy_zbiddRDuX4bNLc-jnWF2WH81Ld8EYssQwYiZ1MxycTrLcHvKb-jxxnNI31yFX8dHlRVQ4JH4UkubcpNthYCxJLwn49WCHv6pDXVe7os/s1600/16431312759037013.png" width="48" height="48" alt="Twitter"></a>
</div>

<div class="MickeySubMickeySubBox3"><a href="Your RSS URL"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhksFcoYEquJLyfuyhtP6AzzvD9CS0ZMhWZG17Nrho-DghVkayme4y5yuOpVrZs8Ah6bCSMniNnBH2mO2bDuCh1zDUtHC4ehB7TAR11hdNdLpZBGISvhz15-HjTwglqZZ3G69wyol9wc_-0/s1600/718635171531639593.png" width="48" height="48" alt="RSS"></a>
</div>

<div class="MickeySubMickeySubBox4"><a href="Your Facebook URL"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4NCAOtGhf8H313wfsX640nwyYhmyiEX-fADkliEGmjpk0Vl1serpi1roGU-eJa2uDBXvNb64WrOHgDBgA3UNzqc5by7ehGbg9eXDfrLkHiGVb9Ec_WMrPc8q2KsC2601uTiR1rhRQ_S6h/s1600/997749011620314439.png" width="48" height="48" alt="Facebook"></a>
</div>
<div class="MickeySubMickeySubBox5"><a href="Your Google+ URL"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSKmGpXUlcYoGN1cen0vo55-wByaLp9Vu7yaFA8BQJUjhUwzMaWT-_aW3PzeX8tLrDxuYgNtVvkrnLL_zS4fS7DQJBqQZbajiJsJYLl3TMPPbP_I9UoKsHzcg0V7rcZoerjZrwXGhV8zGx/s1600/13100943382097916342.png" width="48" height="48" alt="Google+"></a>
</div>
<div class="MickeySubBoxinner">Write Anything Here ....</div>
</div></center>

 Note: Change the data in Red Bold and Blue Bold letters to your own

Write anything in the writing area but don't exceed from 6 to 7 words .
12)- Press Save

If you have any problem / suggestion please leave comments below I will try to solve your problem. Thanks
Categories:

0 comments:

Post a Comment

    Recent Articles

    Other Articles