ပန္းတစ္ခင္း...ခ်စ္ျခင္းေတြရွိမွ...လွႏုိင္မွာပါ။

ပန္းတစ္ခင္း...ေဒါသမီးေတြၿငိမ္းမွ လွႏုိင္မွာပါ။

ပန္းတစ္ခင္း...အတၱေတြရွင္းမွ လွႏုိင္မွာပါ။

Showing posts with label Posts ေတြေခါက္သိမ္းျခင္း. Show all posts
Showing posts with label Posts ေတြေခါက္သိမ္းျခင္း. Show all posts

Saturday, September 27, 2008

Posts ေတြေခါက္သိမ္းျခင္း

မိမိရဲ႕ Posts ကုိ ေခါက္သိမ္းဖုံုးကြယ္ထားခ်င္ရင္ေအာက္ပါအတုိင္းလုပ္ၾကည့္ပါ။ Peek-A-Boo Post လုိ႔ေခၚပါတယ္။ ကဲမနီေရ စလုိက္ၾကရေအာင္-
(၁) ေအာက္ေဖာ္ျပပါ code ကုိ Javascript Document(*.js)File type နဲ႔ Save ပါ။ Dreamweaver Software တုိ႔လုိမ်ိဳးမွာ ထည့္သြင္း Save ႏုိင္ပါတယ္။

function toggleIt(id) {
post = document.getElementById(id);
if (post.style.display != 'none') {
post.style.display = 'none';
} else {
post.style.display = '';
}
}
function showFullPost(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost")
spans[i].style.display = 'inline';
if (spans[i].id == "readmore")
spans[i].style.display = 'none';
}
}
function showFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost")
spans[i].style.display = 'inline';
if (spans[i].id == "showlink")
spans[i].style.display = 'none';
if (spans[i].id == "hidelink")
spans[i].style.display = 'inline';
}
}
function hideFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost")
spans[i].style.display = 'none';
if (spans[i].id == "showlink")
spans[i].style.display = 'inline';
if (spans[i].id == "hidelink")
spans[i].style.display = 'none';
}
post.scrollIntoView(true);
}
function checkFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
var found = 0;
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost")
found = 1;
if ((spans[i].id == "showlink") && (found == 0))
spans[i].style.display = 'none';
}
}
function commentDisplay(json) {
for (var i = 0; i < numcomments; i++) {
var entry = json.feed.entry[i];
var alturl;if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
alturl = entry.link[k].href;break;
}
}
alturl = alturl.replace("#", "#comment-");if (entry.content) {
comment = entry.content.$t;
} else if (entry.summary) {
comment = entry.summary.$t;
}
var re = /<\S[^>]*>/g;
comment = comment.replace(re, "");
document.write('<a href="' + alturl + '">' + entry.author[0].name.$t + '</a> commented:<br/>');
if (comment.length < numchars)
document.write(comment + '<br/><br/>');else
document.write(comment.substring(0, numchars) + '...<br/><br/>');
}
document.write('Widget sponsored by:<br/><a href="http://bvibes.com">< img src="http://fbvibes.com/templates/yget/images/vibes_logo.png"/></a><br/>');
}


>>အသင့္လုပ္ၿပီးသား File ကုိပဲလုိခ်င္ရင္ေတာ့ Download လုပ္ယူပါ။
(၂) ၄င္း(.js)File ကုိ File Hosting Site တစ္ခုတြင္ Upload လုပ္ၿပီး URL Link ကုိရယူပါ။
>>ေအာက္ပါ က်ေနာ္ Share ေပးထားတဲ့ URL link ကုိပဲသံုးမယ္ဆုိရင္လည္း သံုးႏုိင္ပါတယ္။
http://pethein2008.googlepages.com/hackosphere.js
(၃) ေအာက္ေဖာ္ျပပါ Attribute Tag တြင္ ၄င္း(.js)file ၏ URL link ကုိထည့္သြင္းေပးရပါမယ္။
<script type='text/javascript' src='URL link' />

ဥပမာ---
<script type='text/javascript' src='http://sgt.pethein.googlepages.com/hackosphere2.js' />

(၄) Dashboard မွ Layout==>Edit HTML သုိ႔သြားၿပီး အရင္ဆံုး
-Download Full Template ကုိႏွိပ္ၿပီး Backup လုပ္ထားပါ။
-Expand Widget Templates ရဲ႕ box ေလးမွာ Tick လုပ္ေပးလုိက္ပါ။
-ၿပီးရင္ Edit HTML ထဲမွ </Head> ဆုိတဲ႔ Tag ကုိရွာပါ။ ေတြ႕ရင္ ၄င္းရဲ႕အေပၚကပ္လွ်က္မွာ (.js)file ၏ URL link ထည့္သြင္းထားခဲ့ေသာ Attribute Tag ကုိထည့္သြင္းေပးလုိက္ပါ။
(၅) ၄င္း Attribute Tag ကုိထည့္သြင္းၿပီးၿပီဆုိရင္ ေအာက္ေဖာ္ျပပါ code ကုိရွာပါ။ အျမန္ရွာခ်င္ရင္ေတာ့ ctrl+F ကုိႏွိပ္ၿပီး fine: box ထဲတြင္ <b:includable id='post' var='post'> ကုိ ရုိက္ထည့္ၿပီး next ကုိႏွိပ္၍ ရွာပါက ခ်က္ခ်င္းေတြ႕ႏိုင္ပါသည္။
<b:includable id='post' var='post'>
<div class='post hentry'>
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href= 'data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href= 'data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>
<div class='post-header-line-1'/>
<div class='post-body entry-content'>
<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>

-၄င္း code ကုိေတြ႕ရင္ Select လုပ္ၿပီး ေအာက္ေဖာ္ျပပါ code အားလံုးကုိ copy / paste လုပ္ကာ ထည့္သြင္း ေပးလုိက္ပါ။
<b:includable id='post' var='post'>
<div class='post uncustomized-post-template' expr:id='"post-" + data:post.id'>
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title'>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</h3>
</b:if>

<div class='post-header-line-1'/>

<div class='post-body'>
<b:if cond='data:blog.pageType == "item"'>
<p><data:post.body/></p>

<b:else/>
<style>#fullpost {display:none;}</style>
<p><data:post.body/></p>
<span id='showlink'>
<p><a expr:onclick='"javascript:showFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>Read More>></a></p>
</span>
<span id='hidelink' style='display:none'>
<p><a expr:onclick='"javascript:hideFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>Collapse>></a></p>
</span>
<script type='text/javascript'>
checkFull("post-" + "<data:post.id/>");
</script>
</b:if>

<div style='clear: both;'/> <!-- clear for photos floats -->
</div>

-အထက္ပါ code အတြင္း အနီေရာင္ ျဖင့္ျပထားေသာ ေနရာတုိ႔တြင္ မိမိႀကိဳက္ရာ ေျပာင္းထည့္ေပးႏုိင္ပါတယ္။
ဥပမာ- အျပည့္အစံုသုိ႔>>> ႏွင့္ ျပန္ေခါက္ထားခ်င္ရင္>>> စသည္ျဖစ္ပါ။
-ၿပီးရင္ Save Template ကုိႏွိပ္ၿပီး Save ပါ။ Expand Widget Template ရဲ႕ box မွ Tick ကုိျဖဳတ္ၿပီး Save လုပ္ပါ။
(၆) Dashboard မွ Settings==>Formatting ကုိသြားပါ။ Post Template ၏ box ထဲတြင္ ေအာက္ပါ code ကုိ ထည့္သြင္းေပးလုိက္ပါ။
Type your summary here.
<span id="fullpost">
Type the rest of your post here.
</span>

-ဒီလုိထည့္သြင္းေပးျခင္းအားျဖင့္ မိမိ post ေရးတဲ့အခါတုိင္း Edit HTML ဘက္တြင္ အၿမဲေတြ႕ေနရမွာပါ။
-Comopse ဘက္မွာေတာ့ ေအာက္ေဖာ္ျပပါအတုိင္း လုိ္က္ေဖာ္ျပေပးေနမွာပါ။
-အေပၚဆံုးစာတန္းကုိ Select လုပ္ၿပီး မိမိအၿမဲတမ္း ေဖာ္ျပေပးခ်င္တဲ့ Post စာသားတစ္ခ်ိဳ႕ကုိ ေရးႏုိင္ၿပီး ေအာက္ကစာတန္း ကုိေတာ့ Select လုပ္ၿပီး မိမိေခါက္ထားခ်င္တဲ့ Post ေတြကုိေရးသားႏုိင္ပါတယ္။
-အဓိက မိမိသိထားရမွာကေတာ့ မိမိေခါက္ထားခ်င္တဲ့ text စာသားေတြဟာ ေအာက္ေဖာ္ျပပါ Attribute tag အတြင္းတြင္ ရွိေနေစရမွာပါ-
<span id="fullpost">ေခါက္ထားရန္စာသားမ်ား</span>

ေရးၿပီးသား Post ေတြကုိ ျပင္မယ္ဆုိရင္လည္း အခုလုိပဲ ျပင္ဆင္ေပးရမွာပါ။

မွတ္ခ်က္။ ဒီ Post ကုိ ကုိရန္ေအာင္လည္း ေရးခဲ့ဘူးၿပီးျဖစ္ကာ အခုနားလည္ေစရန္အလုိ႔ငွာ ရွင္းလင္းျပရျခင္း သာျဖစ္ပါသည္။ မူရင္း Post ကေတာ့ ဒီ blogspot ေလးမွာပါ။

အဆင္ေျပပါေစ

အျပည့္အစံုသုိ႔>>>