ပို႔စ္ကို ပံုစံတက် ပရင့္ထုတ္ႏိုင္ေအာင္

ဒီမွာ ေဖာ္ျပထားတဲ့ ပို႔စ္ အားလံုး လိုလိုဟာ က်ဴတိုရီရယ္ေတြ ျဖစ္လို႔ စာဖတ္သူ အေနနဲ႔ တခါတေလမွာ ေနာက္တစ္ခ်ိန္မွာ ျပန္လည္ ကိုးကားဖုိ႔အတြက္ မွတ္တမ္း လုပ္ထားခ်င္ေကာင္း လုပ္ထားခ်င္လိမ့္မယ္။ ဒါဆို က်ေနာ္တို႔ ပို႔စ္ေတြကို Print ထုတ္ခြင့္ ေပးထားရင္ စာဖတ္သူအတြက္ ပို အသံုးတည့္လိမ့္မယ္ ထင္တယ္။ ဒါေပမယ့္ ဒီအတိုင္း Print ထုတ္လိုက္ရင္ ဘေလာ့ဂ္မွာ ပါတဲ့ Header ပံုေတြ၊ Sidebar က Element ေတြပါ ပရင့္ထုတ္တဲ့အခါမွာ ပါလာလိမ့္မယ္။ တကယ္တမ္းေတာ့ စကၠဴနဲ႔ ထုတ္တဲ့အခ်ိန္မွာ အဲဒါေတြက အပိုေတြ ျဖစ္သြားပါတယ္။ ဒါေၾကာင့္ က်ေနာ္တို႔ စကၠဴနဲ႔ ထုတ္ေတာ့မယ္ ဆိုရင္ ဒါေတြကို ဖယ္ရွားဖို႔ လိုအပ္ပါတယ္။

CSS နဲ႔ JavaScript ေတြကို ေပါင္းစပ္ၿပီး ႐ုိး႐ိုးရွင္းရွင္းနဲ႔ အသံုးတည့္မယ့္ ပရင့္ထုတ္ေပးတဲ့ လုပ္ေဆာင္ခ်က္ေလးတစ္ခုကို က်ေနာ္တို႔ ဖန္တီးႏိုင္ခဲ့ပါၿပီ။ ပရင့္ထုတ္လိုက္ရင္ ဘေလာ့မွာ ပါတဲ့ ပို႔စ္နဲ႔ ေကာ္မန္႔ ေတြကိုပဲ စကၠဴေပၚ ပရင့္ထုတ္ေပးမွာပါ။

အခု က်ေနာ္ ဒီပို႔စ္မွာ ဘယ္လို ပရင့္ထုတ္လို႔ရေအာင္ လုပ္ေပးမလဲဆိုတာကို ႐ိုးရွင္းတဲ့ အဆင့္ေလး ႏွစ္ဆင့္နဲ႔ ရွင္းျပေပးပါ႔မယ္။ အခု လက္ရွိ စာမ်က္ႏွာကို ပရင့္ထုတ္ရင္ ဘယ္လို ေပၚမလဲ ဆိုတာ သိခ်င္ရင္ Browser မွာ ပါတဲ့ Print Preview နဲ႔ ၾကည့္ႏိုင္ပါတယ္။ အဲဒီမွာ ၾကည့္ၾကည့္ပါ။ Header ေကာ၊ Sidebar ေကာ အေရာင္အေသြး စံုစံုလင္လင္နဲ႔ ေပၚေနပါ႔မယ္။ ဒီအပိုေတြေၾကာင့္ က်ေနာ္ေတာ့ Printer မွင္ ပိုကုန္ႏိုင္ပါတယ္။

ဒီ ဥပမာမွာ ဆိုရင္

• Header နဲ႔ Sidebar ကို မျမင္ရေတာ့ပါဘူး။
• စာမွန္သမွ်ဟာ အျဖဴေရာင္ ေနာက္ခံနဲ႔ အနက္ေရာင္ စာလံုးအျဖစ္ ျမင္ရပါမယ္။
• ပို႔စ္အက်ယ္ဟာ ပရင့္ထုတ္မယ့္ စကၠဴနဲ႔ အက်ယ္အတုိင္း ေျပာင္းလဲသြားပါမယ္။
• ပို႔စ္မွာ ပါတဲ့ ပံုနဲ႔ ပံုစံ ခ်ထားမႈက မေျပာင္းလဲပါဘူး။
• လိုအပ္တဲ့ ေနရာကိုပဲ ပရင့္ထုတ္မွာ ျဖစ္ပါတယ္။

ကဲ က်ေနာ္တို႔ ဘေလာ့ဂ္မွာ Code ဘယ္လို ထည့္သြင္းရမလဲ ဆိုတာ စၿပီး တင္ျပသြားပါမယ္။ Layout >> Edit HTML မွာ Expand Widget Templates ကို အမွန္ျခစ္ ျခစ္ေပးပါ။

အဆင့္ (၁) ပရင့္ စတုိင္ သက္မွတ္ျခင္း

ေအာက္မွာ ေပးထားတဲ့ Code ကို </head> မတုိင္ခင္မွာ ထည့္ေပးပါ။

<style media='print' type='text/css'>
#header-wrapper, #header, .header, #sidebar-wrapper, .sidebar, #footer-wrapper, #footer, .date-header, .post-meta-data, .comment-link, .comment-footer, #blog-pager, #backlinks-container, #navbar-section, .subscribe_notice, .noprint {display: none;}
#main-wrapper {width: 95%}
</style>

အဆင့္ (၂) Print this post လင့္ခ္ ထည့္သြင္းျခင္း

စာဖတ္သူ အေနနဲ႔ Print ထုတ္လို႔ ရတယ္ဆိုတာ သိေစခ်င္တာေၾကာင့္ က်ေနာ္တို႔ ပို႔စ္ရဲ႕ ေအာက္နားမွာ Print လုပ္ႏိုင္ဖို႔ ခလုတ္ေလးတစ္ခု သြားထည့္ၾကရေအာင္။ လင့္ခ္သံုးမ်ဳိး က်ေနာ္ တင္ျပေပးသြားပါ႔မယ္။ ကိုယ္ ႀကိဳက္ရာ တစ္ခုကို ေရြးၿပီး ထည့္ေပးလိုက္ပါ။

ပထမဆံုးအေနနဲ႔ <p><data:post.body/></p> ဆိုတာေလး အရင္ ရွာေပးပါ။ ေတြ႕ရင္ သူ႔ရဲ႕ ေအာက္နားမွာပဲ ျပထားတဲ့ လင့္ခ္သံုးမ်ဳိးကေန တစ္မ်ဳိး ေရြးၿပီး သူ႔ေဘးက Code ကို ထည့္ေပးပါ။

႐ိုး႐ိုးစာေၾကာင့္ လင့္ခ္
Print this post

<b:if cond='data:blog.pageType == "item"'>
<a href='javascript:window.print()'>Print this post</a>
</b:if>

ခလုတ္လင့္ခ္

<b:if cond='data:blog.pageType == "item"'>
<form> <input type="button" value="Print This Page" onClick="window.print()" /> </form>
</b:if>

ပံုႏွင့္စာတြဲလ်က္ လင့္ခ္
Print this post

<b:if cond='data:blog.pageType == "item"'>
<span style='background: url(http://bloggerbuster.com/images/print.gif) left no-repeat; padding-left: 20px;'><a href='javascript:window.print()'>Print this post</a></span>
</b:if>

ဒီ Code ကို ျဖည့္ၿပီးၿပီ ဆိုရင္ေတာ့ Template ကို Save ဖုိ႔ မေမ့ပါနဲ႔။ တကယ္လို႔ စာဖတ္သူက ပို႔စ္တစ္ခုခုကို ပရင့္ထုတ္ခ်င္ရင္ အဲဒီ ပို႔စ္ကို သြားၿပီး အဲဒီ ပို႔စ္ရဲ႕ ေအာက္ဆံုးမွာ ရွိတဲ့ ခလုပ္ကို ႏွိပ္ၿပီး ပရင့္ ထုတ္ႏိုင္ပါတယ္။ ကိုယ့္ရဲ႕ တန္းပလိတ္မွာ စမ္းလုပ္မၾကည့္ခင္ က်ေနာ့္ရဲ႕ ပို႔စ္မွာ ပါတဲ့ Print ခလုတ္ကို ႏွိပ္ၿပီး ပရင့္ထြက္တဲ့ ပံုစံကို သေဘာက်မက် စမ္းသပ္ၾကည့္ႏိုင္ပါတယ္။ အဆင္ေျပပါေစဗ်ာ။