Style လွလွ နဲ႔ Subscribe Box ထည့္နည္း....

အထက္ေဖာ္ျပပါပံုအတိုင္း Style လွလွ နဲ႔ လုပ္ခ်င္သူေတြ အတြက္....

1. Blog-->Dashboard-->Layout-->ADD HTML/Javascript မွ တစ္ခု ထည့္ပါ...
2. ေအာက္က ေပးထားတဲ႔ Code ေတြကို ကူးထည့္ေပးလိုက္ပါ 

<style>
    #bp-social {
    width: 300px;     }
    .bp-iconset{
    padding: 5px;
    }
    .bp-iconset img:hover{
    opacity:0.8
    }
   .fb{
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    padding-bottom: 5px;
    text-align: center;
   }
    .facebook{
   text-align: center;
   padding-top: 10px;
   width:80%;
    }
    .twitter{
    padding-top: 10px;
    text-align: center;
    }
   .addthis_counter{
   float: left;
   height: 60px;
   padding-left: 60px;
   }
   .email-subscribe-emailbox form {
    width:100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;border: 0;
    }
    .email-subscribe-emailbox input.emailu {
    float:left;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    border: 0;
    color: #999;
    padding: 7px 10px 8px;
    width: 100%;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    font-size: 13px;
    border: 1px solid #ccc;  
    }
    .email-subscribe-emailbox input.emailu:focus {
    color: #333;
    }
    .email-subscribe-emailbox input.submitu {
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    color: black;
    padding: 7px 14px;
    font-weight: bold;
    font-size: 12px;
    float: right;
    cursor: pointer;
    }
    .email-subscribe-emailbox input.submitu:hover {
    text-decoration: none;
    }
</style>
    <div id="bp-social">
    <div class="bp-iconset">
    <center>
    <a style="margin-right: 10px;" href="Facebook Page URL" target="_blank" rel="nofollow">
    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6FA_V3tyLEWraoMTrPaD8W__vSQ-STo9lmHUNmnEZCEjCz0lR6ptI_u_rBFgdg0FI2CXIgIdJN49ehqESbgT4ofVz5wXPqsUtI9CtK5rQi73nM328cS-YLAlICWNIAqE0gMAMvXQnU2D-/s1600/facebook.png" width='50px' height='65px' title='Facebook'/></a>
    <a style="margin-right: 10px;" href="Twitter Page URL" target="_blank" rel="nofollow">
    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWzgVv6IwywtroxM2-VhKQLj8CpCc9URwv23sSIZI_eutRheBeKyTchdi1OlPF9Tg0L0e8ICxdUCKknNmbzHkBwX7IQy38HK278rSOM5DbQjcHbqHCqK9Ng-8JfE0QwS2Qc6qESV3z64l9/s1600/twitter.png" width='50px' height='65px' title='Twitter'/></a>
    <a style="margin-right: 10px;" rel="me" href="Google Plus Page URL" target="_blank">
    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhxKJStus3Hr0I4fqhm7vktdKj7DnViZzc2eJLsubTOJuWhWgOq_v1fP6xCVlCzl1yl5kbo72CJ6gjDLzwJkcNP4-5NL-cNfEQbEJ71zpfKUhTR2juz02fAM0t8X_sucmTSJNXaiYita7SM/s1600/googleplus.png" width='50px' height='65px' title='Google Plus'/></a>
    <a style="margin-right: 10px;" href="Pinterest Page URL" target="_blank">
    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQun62_rUedicLcwapgeHin7IDjiBerjpIXsLatDAFcROKrpdjTsjPkQzwzd5JDt2Q_9TqhCvwCtJeJmCeribK7wCDukfHhpNp2_z2KS5qatMojtlRSRARrwFdSwSslayvxM2RsKLGK-ni/s1600/pinterest.png" width='50px' height='65px' title='Pinterest'/></a>
     </center>
    <center>
   <a style="margin-right: 10px;" href="RSS Feed Page URL" target="_blank" rel="nofollow">
    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJP_I6wsBOt_bQZitELRAW6ZG0GFDjjXfbr4Rzf26PO0kAjCFZisLlZQwFDHn6g4cvmYKyfZuU2fb4fWWDRAYpKzwjqSfPKnVhqg5ALdLakRl4L4iQDmTmf2VlKD7cEkRQBtKChnPWgSGt/s1600/rss.png" width='50px' height='65px' title='RSS Feed'/></a>
    <a style="margin-right: 10px;" rel="me" href="Flickr Page URL" target="_blank">
    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhY-ugixYBS_PKZHcUB2s7ladd1G5DWq5vPY8lR9f9_m97eJPueVIi18CnkIeFeHs85BBLfDZye7ceuBEyEXOr7QPCj3ngYZ0q4SLXJO9vyPSR-NHWfx9FXpvYQT82Kil3x39fr-BAuvXyt/s1600/flickr.png" width='50px' height='65px' title='Flickr'/></a>
    <a style="margin-right: 10px;" href="Linkedin Page URL" target="_blank">
    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgntwpQMkD4UlqqeitPsDlZBSdc6yIVw_2lRGY3_gzUFam59mkVuv-wXPcj8Z2RVbPGa0ZcSZRV6gcMI-2bzuG1PXiWBVRNCLljtDE9f3JfjP_FI-iVMI1xRElhZ_zJ1EdzfmcEE-ljrCZL/s1600/linkedin.png" width='50px' height='65px' title='Linkedin'/></a>
    <a style="margin-right: 10px;" href="Youtube Page URL" target="_blank" rel="nofollow">
    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7UNJPZ1mVptgNlwYC-S5y_5XMUCFzgFJYfr7lcpFtyWoH8H_JN-57903k0Al5vYPFIsA9053CEiN-eDSp6WvrinJW7Yv7exDzdRXFicMULD38LRm54AqeOUP00MFNKLSfSkb6BosKOfM7/s1600/youtube.png" width='50px' height='65px' title='Youtube'/></a>
    </center>
<div class="fb">
    <div class="facebook">
<a class="addthis_counter"></a>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js"></script>
<iframe src="//www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.facebook.com%2FTipsNTricksForBloggerLovers&amp;send=false&amp;layout=box_count&amp;width=50&amp;show_faces=false&amp;font=arial&amp;colorscheme=light&amp;action=like&amp;height=90&amp;appId=271817639530563" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:50px; height:60px;" allowtransparency="true"></iframe>
<div class="g-plusone" data-size="tall"></div>
<script type="text/javascript">
  (function() {
    var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
    po.src = 'https://apis.google.com/js/plusone.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
  })();
</script>
    </div>
</div>
    <div class="twitter">
    <iframe allowtransparency="true" frameborder="0" scrolling="no" src="http://platform.twitter.com/widgets/follow_button.1335513764.html#_=1335528101755&amp;id=twitter-widget-0&amp;lang=en&amp;screen_name=ProTipsNTricks&amp;show_count=true&amp;show_screen_name=true&amp;size=m" class="twitter-follow-button" style="width: 244px; height: 20px; " title="Twitter Follow Button">
    </iframe>
    <script src="http://platform.twitter.com/widgets.js" type="text/javascript"></script>
    </div>
     <div class="email-subscribe-emailbox">
    <form action="http://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=bloggerprofessional', 'popupwindow', 'scrollbars=yes,width=550,height=520'); return true" target="popupwindow">
    <table width="100%">
    <tr>
    <td>
    <input class="emailu" name="email" placeholder="Enter your email" type="text"/>
    </td>
    <td width="70px">
    <input class="submitu TZDefault" type="submit" value="Subscribe"/>
    </td>
    </tr>
    </table>
    <input name="uri" type="hidden" value="bloggerprofessional"/>
    <input name="loc" type="hidden" value="en_US"/>
    </form>
    </div>
    </div>
    </div>

အဆင္ေျပပါၿပီ လွလွေလးေတြနဲ႔ လန္းႏိုင္ၾကပါေစ....

naungkhantthu@gmail.com

Posted in: Blogger, Tips And Tricks