ဘေလာ့မွာ ကိုယ့္အေၾကာင္းကိုယ္ ေရးတဲ့ box (Autor box)ထည့္နည္း

Post oleh : Min Thu Ra | Rilis : 10:53 PM | Series : ဘေလာ့နည္းပညာ

အထက္ပါပံုလိုမ်ိဳးျဖစ္ခ်င္တယ္ဆိုရင္ လြယ္လြယ္ေလးပါ။

1. Blogger Dashboard ကို သြားေပါ႔ဗ်ာ
2. ၿပီးေတာ့ Layout ထဲကိုသြား
3. Add a gadget ကို ႏွိပ္ၿပီးေတာ့ Pop-up window ေပၚလာရင္ အဲထဲက HTML/Java Script ကို ႏွိပ္
4. အဲဒီမွာ ေအာက္က ေပးထားတာေတြ ကူးၿပီး ထည့္လိုက္ေတာ့။ Title မွာေတာ့ ႀကိဳက္တာေရး။

<script>#tib-author {
margin-top:20px;
background: url(http://2.bp.blogspot.com/-faF5DklfrGg/UOGAbENWjMI/AAAAAAAAIcA/hbl0KsKJHN0/s400/about-author-bg.png) repeat-x scroll 0 0 transparent;
border: 1px solid #CECECE;
overflow: hidden;
padding: 14px;
}
#tib-author img{border: 1px solid #CCCCCC;float: left;margin-right: 14px; padding:3px; width:65px; height:65px;}
#tib-author h5 {
background: url(http://2.bp.blogspot.com/-hNGJUjaasGY/UOGAb6LvbyI/AAAAAAAAIcY/6FDTVuaf2So/s400/author-line.png) repeat-x scroll center bottom transparent;
font-size: 14px;
margin-bottom: 8px;
overflow: hidden;
padding-bottom: 8px;
text-shadow: 1px 1px 1px #FFFFFF;
}
#tib-author h5 small {
color: #888888;
float: right;
font-size: 12px;
font-style: italic;
text-shadow: 1px 1px 1px #FFFFFF;
}
.author-descrip {color: #555555;line-height: 18px;text-shadow: 1px 1px 1px #FFFFFF;}</script>

ဒါဆုိရင္သူ႕ရဲ႕ CSS Code ေရာက္သြားပါၿပီဗ်ာ။

 Blogger >> Template >> Edit HTML ကိုသြားၿပီးရင္ Expand Widget Template ကိုအမွန္ျခစ္ေပးပါ။

<div class='post-footer-line post-footer-line-1'/>
<div class='post-footer'>
<div class='post-footer-line post-footer-line-2'/>
<div class='post-body entry-content'>

ဒီကုဒ္သံုးခုကို တစ္ခုျခင္းလိုက္ရွာပါ။ ေတြ႕တာနဲ႕ အဲ့ကုဒ္ေအာက္မွာ Author box ကိုသာထည့္ေပေတာ့။

<div id="tib-author">
<img src="ကိုယ့္ပံုကိုယ္ထည့္ပါ" width="55" />
<br />
<h5 style="color: black;">
<b>Author:</b>နာမည္ထည့္</h5>
<div class="author-descrip">
သင့္အေၾကာင္းနဲ႕ပတ္သတ္တဲ့အက်ဥ္းခ်ဳပ္ နည္းနည္းေရးရုံပဲ</div>
</div><div style="text-align: right;">
<a href="http://adf.ly/MgZer"><span style="font-size: x-small;"><b>Get this widget » ရယူရန္ </b></span></a><span style="font-size: x-small;"><b></b></span></div>

ကိုယ့္ပံုကိုယ္ထည့္ပါ ေနရာမွာ ကိုယ့္ပံုကို တင္ပါဗ်ာ။
နာမည္ထည့္ ေနရာမွာ နာမည္အရင္းထည့္ခ်င္ရင္ထည့္ပါ။ သို႕မဟုတ္ သင္ယခု Blogger မွာသံုးေနတဲ့နာမည္ကို ထည့္ပါ။
သင့္အေၾကာင္းနဲ႕ပတ္သတ္တဲ့အက်ဥ္းခ်ဳပ္ နည္းနည္းေရးရုံပဲ ေနရာမွာ အမ်ားႀကီးေရးစရာမလိုပါဘူး။ အဂၤလိပ္လိုပဲျဖစ္ျဖစ္ ၊ ျမန္မာလိုပဲျဖစ္ျဖစ္ ေရးလို႕ရပါတယ္။
တျခား html ေတြကျပင္စရာမလိုဘူး။ ကြ်န္ေတာ္အေရာင္နဲ႕ေပးထားတဲ့ စာေတြကိုပဲျပင္လိုက္ပါ။


                                    Admin - Min Thu Ra
                                     Credit to Tech in Blogging

facebook

twitter

Tweet

google+

linkedin