kp3နည္းပညာ၊၂၉၅၊ဘေလာ့ Header မွာလြယ္ကူစြာပံုထည့္နည္း

                      အခုတင္တဲ့Postေလးကေတာ့ဘေလာ့ဂါေလာကမွာမသိတဲ့သူေတြမရွိသေလာက္ပါဘဲလို႕ ေျပာရင္လည္းရပါတယ္။ဘေလာ့Haederမွာလြယ္ကူစြာပြုထည့္နည္းေလးပါ၊ဘေလာ့ဂါညီေလးတစ္ေယာက္က အီးေမးလ္ကေနေတာင္းဆိုထားလို႕မတင္ေပး၇င္လည္းစိတ္ေကာက္သြားမွာမၾကိဳက္လို႕တင္ေပးလိုက္တာပါ။ သိျပီတဲ့ဘေလာ့မိတ္ေဆြေတြလည္းနားလည္ေပးမယ္ထင္ပါတယ္။ ေအာက္မွာထည့္နည္းနဲ႕တကြပံုျပထား ပါတယ္။ပံုကအတိုင္းလုပ္ေပးလိုက္ရင္မိမိရဲ႕ဘေလာ့Titleနာမည္ေလးကမေပၚေတာ့ဘူးေပါ့ေနာ္၊ဘေလာ့မိတ္ ေဆြအားကိုခင္မင္ေလးစားလွ်က္kp3မိသားစုေနာက္တစ္နည္းက kp3နည္းပညာ၊၁၁၇၊မွာရွိပါတယ္။

အဆင့္၊၁၊ေအာက္ပံု

အဆင့္၊၂၊ေအာက္ပံု

အဆင့္၊၃၊ေအာက္ပံု

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစျခင္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု

Read More

kp3နည္းပညာ၊၂၃၄၊ဘေလာ့ Header ကိုႏိုပ္ရင္တျခား၀က္ဆိုက္ေရာက္သြားေအာင္လုပ္နည္း

အခုတင္တဲ့ Post ေလးကေတာ့က်ေနာ္တို႕ရဲ့ဘေလာ့ Header လင့္ခ္ကိုႏိုပ္ရင္အျခားမိမိရဲ႕ဘေလာ့၀က္ဆိုက္ သို႕မဟုတ္မိမိႏွစ္သက္တဲ့ဘေလာ့လင့္ခ္၀က္ဆိုက္လင့္ခ္ကိုတခါထဲ ေရာက္သြားေအာင္ လုပ္နည္းေလးပါ။ ေအာက္မွာလုပ္နည္းနဲ႕တကြ Code

၁။Layout

၂။Edit HTML

၃။Expand Widgets Templateကိုအမွန္ျခစ္ေပးပါ။

ေအာက္က Code ကိုရွာပါ၊

<div class='titlewrapper'>
  <h1 class='title'>
  <b:if cond='data:blog.url == data:blog.homepageUrl'>
  <data:title/>
  <b:else/>
  <a expr:href='data:blog.homepageUrl'><data:title/></a>
  </b:if>
  </h1>
  </div>

ေတြ႕ျပီဆိုရင္ေအာက္က Code ႏွင့္အစားထိုးေပးလိုက္ပါ။

<div class='titlewrapper'>
  <h1 class='title'>
  <a expr:href='ဤေနရာမွာမိမိရဲ႕ဘေလာ့ သို့မဟုတ္ ၀က္ဆိုက္လင့္ခ္ကိုထည့္ေပးပါ'><data:title/></a>
  </h1>
  </div>

၄။Save Template ကိုႏိုပ္ပါ။ျပီးပါျပီ။။။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု

Read More

kp3နည္းပညာ၊၂၇၊မိမိရ႕ဘေလာ႕headerရဲ့ေဘးမွာSearch Engine ထားခ်င္ရင္

ေဟာဒီမွာထပ္လာျပန္ၿပီဗ်ာ၊ဒါလည္းဘဲျမင္ဘူးၾကမွာပါ ဒါေပမယ့္ရွားပါတယ္ တခ်ိဳ႕ဘေလာ့ေတြမွာေတြ႔ၾကမယ္ထင္ပါတယ္ headerရဲ့ေဘးမွာSearch Engine ထားတာ၊
သူတို႔ရဲ့ဘေလာ့မွာColumnႏွစ္ခုပါလို႔ပါဘဲ။ က်ေနာ္တို႔လည္းသူတို႔ထားျခင္ေတာ့ထားလို႔ရေအာင္မသိၾကေသးတ့ဲ ခ်စ္မိတ္ေဆြအတြက္........................
ေအာက္မွာပံုႏွင္႔တကြ code
၁။click Layout

၂။click edit HTML

ေအာက္ကcode ကိုထပ္ရွာပါ


/* Header
===================================
*/
#header-wrapper {
width:900px;
margin:0 auto 0px;
background:$bgheadercolor url(http://ahom24.googlepages.com/magazine_01.jpg) no-repeat top center;
height:190px;
}

#header-inner {
width:900px;
background-position: center;
margin-$startSide: auto;
margin-$endSide: auto;
}

#header {
margin: 0px;
text-align: left;
color:$pagetitlecolor;
}

ေတြ႔ၿပီဆိုရင္ျဖဳတ္ၿပီးမွ ေအာက္ကcodeကိုအစားထိုးလိုက္ပါ


/* Header
===================================
*/

#header-wrapper {
width:900px;
margin:0 auto 0px;
background:$bgheadercolor url(http://ahom24.googlepages.com/magazine_01.jpg) no-repeat top center;
height:190px;
}

#head-inner {
width:600px;
background-position: left;
margin-left: auto;
margin-right: auto;
float:left;
}

#header {
margin: 0px;
text-align: left;
color:#ffcc66;
}

#r_head{
width:300px;
float:left;
padding-top:10px;
}

ေအာက္ကcodeကိုထပ္ရွာပါ

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Test Blog (Header)' type='Header'/>
</b:section>
</div>


ေတြ႔ၿပီဆိုရင္ျဖဳတ္ၿပီးမွေအာက္ကcodeကိုအစားထိုးလိုက္ပါ


<div id='header-wrapper'>
<div id='head-inner'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Test Blog (Header)' type='Header'/>
</b:section>
</div>
<div id='r_head'>
<b:section class='header' id='header2' preferred='yes'/>
</div>
</div>

ေအာက္ကပံုအတိုင္းေပၚလာပါလိမ့္မည္၊၊
၃။save Tamplate buttonကိုႏိုပ္ပါ၊ၿပီးပါၿပီ။ ခ်စ္မိတ္အားလံုးေက်းဇူးကမ႓ာ

Read More

kp3နည္းပညာ၊၂၅၊မိမိရ႕ဘေလာ႕(Header)ေပၚမွာ Add Page Elementထည့္ခ်င္ရင္

လာျပန္ျပီဗ်ာ၊အခုပာာကေတာ့bloggerမိတ္ေဆြအားလံုးအတြက္ အက်ဳံးဝင္မယ္လို႔ထင္ပါတယ္၊မိမိရဲ႕ဘေလာ့ပိုမိုၿပီးလွပေစမယ္ထင္ပါတယ္ (Header)ေပၚမွာ Add Page Elementထည့္နည္းေလးပါ၊မသိၾကေသးတဲ့ခ်စ္မိတ္ေဆြေတြအတြက္ပါ အားလုံးကိုခင္လည္း ခင္ပါတယ္ေလးလည္းေလးစာပါတယ္၊မိမိဘေလာ့ေလးလွခ်င္ရင္ေတာ့နည္းနည္းအပင္ပန္းခံတာေပါ့ေနာ္..ဟီး....
ေအာက္မွာပံုနဲ႔တကြ code

စရၾကရေအာင္ေနာ္

၁။login blogger

၂။click layout

၃။click Page Element ေအာက္ပံုအတုိင္း ျမင္ရၾကမွာပါ

၄။click Edit HTML tab

၅။click Download Full Template, အေရးႀကီးပါတယ္Backupလုပ္ရန္မေမ့ၾကပါနဲ႔

ေအာက္ကcodeကိုရွာပါ

]]></b:skin> ေအာက္မွာ ေအာက္ကcodeကိုထပ္ထည့္ေပးပါ

#under_header{
margin:10px 0;
padding:1%;
width:98%;
}

ေအာက္ကcode ကိုထပ္ရွာပါ

<div id="'header-wrapper'">
<b:section class="'header'" id="'header'" maxwidget="1" showaddelement="no">
<b:widget id="'Header1'" locked="'true'" title="'test" type="'Header'/">
</b:section>
</div>

ေတြ႕ျပီဆိုရင္ ေအာက္မွာ ေအာက္ကcodeကိုထပ္ထည့္ေပးပါ

<div id="under_header">
<b:section class="'header'" id="'underheader'" preferred="'yes'/">
</div>

၆။click Save Tamblateႏိုပ္ပါ၊

ေအာက္ကပံုအတုိင္းေပၚလာပါလိမ့္မည္၊ၿပီးပါၿပီ

Read More