tag:blogger.com,1999:blog-52868095158366346002024-03-13T07:32:36.321+05:30පොඩි පොඩි දේවල්Saranga Rathnayakehttp://www.blogger.com/profile/01103209861183518579noreply@blogger.comBlogger26125tag:blogger.com,1999:blog-5286809515836634600.post-39819921977490683972015-06-08T23:42:00.001+05:302015-06-09T00:09:01.824+05:30CourseNet.lk badge එක ඔබේ blog එකටත් එකතු කරගන්න<a href="http://coursenet.lk/">CourseNet.lk</a> කියන්නෙ ලංකාවෙ තියෙන courses ඔක්කොම එකම තැනකින් බලා ගන්න පුලුවන් site එකක්. විවිධ වයස් සීමාවල සිටින, විවිධ අධ්යාපන මට්ටම්වල සිටින ඕනම කෙනෙක්ට විවිධ අධ්යාපන ආයතන මගින්, විවිධ category යටතේ පවත්වන විවිධ courses ගැන දැන ගැනීමේ පහසුව <a href="http://coursenet.lk/">CourseNet.lk</a> මගින් ලැබෙනවා. Courses ගැන වැඩි විස්තර දැන ගන්න <a href="http://coursenet.lk/">CourseNet.lk</a> එකෙන්ම අධ්යාපන ආයතනයට සම්බන්ධ වෙන්නත් පුලුවන්.<br />
<br />
Phone එකෙනුත් මේ site එක බලන්න පුලුවන්..<br />
<br />
<a href="http://coursenet.lk/">CourseNet.lk</a> badge එක ඔබේ blog එකටත් එකතු කරගන ඔබගේ මිතුරු මිතුරියන් දැනුවත් කරන්න.
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://www.coursenet.lk/Content/images/coursenet-badge-si.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://www.coursenet.lk/Content/images/coursenet-badge-si.png" /></a></div>
<br />
මේ තියෙන්නෙ HTML code එක...
<br />
<blockquote class="tr_bq">
<a href="http://www.coursenet.lk" target="_blank"><img src="http://www.coursenet.lk/Content/images/coursenet-badge-si.png" alt="Courses In Sri Lanka" /></a> </blockquote>
Saranga Rathnayakehttp://www.blogger.com/profile/01103209861183518579noreply@blogger.com0tag:blogger.com,1999:blog-5286809515836634600.post-37146307572914887902014-02-27T07:46:00.000+05:302014-02-27T07:46:08.294+05:302014 ඔයා මොනවද ඉගෙන ගන්නෙ ?<span style="font-family: Verdana,sans-serif;">කලින් සටහනෙන් මම කිව්වනෙ අපි පටන් ගත්තු අලුත් වැඩේ ගැන (<a href="http://sarangasl-si.blogspot.com/2013/01/courses.html">අලුත් වැඩක් - ලංකාවෙ තියන courses එකම තැනකින්</a>), දැන්නම් ගොඩක් දුරට ඉවරයි. Phone එකෙන් බලන්න පුළුවන් වෙන්නත් හදල තියෙන්නෙ, ගිහිල්ලම බලන්නකො...</span><br />
<span style="font-family: Verdana,sans-serif;"><br /></span>
<span style="font-family: Verdana,sans-serif;">Web Site : <a href="http://www.coursenet.lk/" target="_blank">coursenet.lk</a> Facebook : <a href="https://www.facebook.com/coursenet" target="_blank">facebook.com/coursenet</a></span><br />
<br />
<span style="font-family: Verdana,sans-serif;">(ගිහින් බලල හොඳයිනම් මතක ඇතුව Like එකක්, + </span><span style="font-family: Verdana,sans-serif;"><span style="font-family: Verdana,sans-serif;">එකක් </span>දාල එන්න ඕන...)</span>Saranga Rathnayakehttp://www.blogger.com/profile/01103209861183518579noreply@blogger.com1tag:blogger.com,1999:blog-5286809515836634600.post-61444654654596286662013-01-16T07:48:00.001+05:302013-12-05T13:46:08.734+05:30අලුත් වැඩක් - ලංකාවෙ තියන courses එකම තැනකින්...<span style="font-family: Verdana,sans-serif;">අද පොඩි පොඩි දේවල් වලින් කියන්න යන්නෙ මම ඇතුලු අපේ බෝඩිමේ සෙට් එක පටන් ගත්තු අලුත් වැඩක් ගැන.</span><br />
<span style="font-family: Verdana,sans-serif;"><br /></span>
<span style="font-family: Verdana,sans-serif;">අපි සෙට් එක එකතු වෙලා හැදුව ලංකාවෙ තියන courses ලේසියෙන්ම හොයාගන්න පුළුවන් site එකක්. තාම වැඩේ පටන් ගත්ත විතරයි. තව ගොඩක් දේවල් තියනව කරන්න. ගිහිල්ලම බලන්නකො...</span><br />
<span style="font-family: Verdana,sans-serif;"><br /></span>
<span style="font-family: Verdana,sans-serif;">Web Site : <a href="http://www.coursenet.lk" target="_blank">coursenet.lk</a> Facebook : <a href="https://www.facebook.com/coursenet" target="_blank">facebook.com/coursenet</a></span><br />
<span style="font-family: Verdana,sans-serif;">(ගිහින් බලල හොඳයිනම් මතක ඇතුව Like එකක් දාල එන්න ඕන...)</span><br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://www.coursenet.lk" imageanchor="1" style="margin-left: 1em; margin-right: 1em;" target="_blank"><img border="0" height="250" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjexxoYm9DT_X3wImd-0sLesfLa1Fju7Db0qR5yfuh4GO5LNI8fUwvt3HfRgNKCY6PL9K46NFP8RtphhpNvjIDUEbRpzLJIKaC-im7McjHJFy4wu4U1JpoepOj5q1eLoJ1LCvJc_xBsTV8/s1600/Untitled-2.jpg" width="400" /></a></div>
Saranga Rathnayakehttp://www.blogger.com/profile/01103209861183518579noreply@blogger.com18tag:blogger.com,1999:blog-5286809515836634600.post-46906180351227901372011-03-03T17:36:00.013+05:302011-03-04T19:12:13.137+05:30ලියන සටහන් කියවන අය අතරෙ ලේසියෙන් බෙදාගන්න පට්ට ගැජට් එකක්<div style="font-family: Verdana,sans-serif;">කට්ටියට මතක ඇතිනෙ මම මීටකලින් <a href="http://sarangasl-si.blogspot.com/2009/12/blog-post_28.html" target="_blank">ලියන සටහන් කියවන අයට පේන්න තියන්න</a> කියල ලියපු සටහන. ඒකෙදි මම කිව්වෙ අපේ blog එකට ආපු කෙනෙක්ට අපි ලියපු අනිත් සටහන් පෙන්නන්න දාන්න පුළුවන් ගැජට් එකක් ගැනනෙ.<br />
<br />
අද කියන්න යන්නෙ අපි ලියන සටහන් බලන්න එන අයගෙ යාළුවන් අතරත් ලේසියෙන්ම බෙදා හදාගන්න උදවු වෙන ගැජට් එකක් ගැන. මේ සටහන Scroll කරද්දි වම් පැත්තෙන් උඩ පහල යන ගැජට් එක ඔයාගෙ blog එකට එකතු කරගන්න හැටි තමයි මම කියන්න යන්නෙ.<br />
<br />
මේකෙට කියන්නෙ <a href="http://wordpress.org/extend/plugins/sharebar/" target="_blank">Sharebar</a> කියල, Wordpress වලට හදල තියන plugin එකක්. මම කියන්න යන්නෙ මේක අපි Blogger Blog එකකට එකතු කරගන්න විදිහ ගැන. මම ඕන කරන පියවරවල් ටික Screen-Shot එක්කම දාල තියනව. තේරෙන්නෙ නැති තැනක් තියනවනම් comment එකක් දාන්න අමතක කරන්න එපා හොඳද.<br />
<br />
1. මේක තමයි වැදගත්ම පියවර. අපි මුලින්ම කරන්න ඕනෙ අපේ දැනට තියන Template එකේ backup එකක් ගන්න එක. ඒකට කරන්න තියෙන්නෙ <b style="color: red;">Design --> Edit HTML</b> ගිහිල්ල Download Full Template click කරන එක.<br />
<br />
<div style="font-family: Verdana,sans-serif;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYQcwsZIyHrfBFu_mOClFjh-fQeKaDaJoX97PQGcxGwBxOHXQ7HqLmB8RcIk5hvc8-f3SWxqf5hXSzYSSTqThagHKATQh0G-5Czsm4FRd8Sd91Y8mLqzsm_1-K7l2JkRyEc0ls-F2LUx4/s1600/edit_html.GIF" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="121" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYQcwsZIyHrfBFu_mOClFjh-fQeKaDaJoX97PQGcxGwBxOHXQ7HqLmB8RcIk5hvc8-f3SWxqf5hXSzYSSTqThagHKATQh0G-5Czsm4FRd8Sd91Y8mLqzsm_1-K7l2JkRyEc0ls-F2LUx4/s320/edit_html.GIF" width="320" /></a></div><br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-ezvI3fIuKsyvOc4zGk7hNWAaRScqlZn0jBO_KvsF24YEg2YgCFL5DYAAIJssgINpe_qqZsAjfCnFENJM7bE1UxATkXgFSK8zzVbbKDv-n1zdR_BA2bAGw7snFMfN4XqgRVclt_s-d_E/s1600/download_template.GIF" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="128" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-ezvI3fIuKsyvOc4zGk7hNWAaRScqlZn0jBO_KvsF24YEg2YgCFL5DYAAIJssgINpe_qqZsAjfCnFENJM7bE1UxATkXgFSK8zzVbbKDv-n1zdR_BA2bAGw7snFMfN4XqgRVclt_s-d_E/s320/download_template.GIF" width="320" /></a></div></div><br />
2. ඊටපස්සෙ කියන Expand Widget Templates එක උඩ කොටන්න.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIHP1IUebJQ9hQCgQXydeRaV7bb85WeXQ5YqiuUlye0Vx6Oo3rfzsWkJXezTNEpZlIX8mE_gJYwEoLSAAnUaQHIIFcjFCiZWMYxcDzziuK1PtuKVW6I0560IagT_h7su2azF73rFjoJxI/s1600/expand.GIF" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="162" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIHP1IUebJQ9hQCgQXydeRaV7bb85WeXQ5YqiuUlye0Vx6Oo3rfzsWkJXezTNEpZlIX8mE_gJYwEoLSAAnUaQHIIFcjFCiZWMYxcDzziuK1PtuKVW6I0560IagT_h7su2azF73rFjoJxI/s320/expand.GIF" width="320" /></a></div><br />
3. දැන් කරන්න තියෙන්නෙ <b><span style="color: red;"></head></span></b> කියන Tag එක හොයාගන්න එක. Ctrl + F ඔබල පොඩි search පාරක් දැම්මනම් ලේසියෙන්ම හොයාගන්න පුළුවන්. දැන් මම පහලින් දාල තියන code එක ඒ <b>Tag එකට උඩින්</b> paste කරන්න.<br />
<pre class="brush: js;highlight: [4,5,38,39,40,41,42,43,44,45,46]"><style type='text/css'>
#sharebox {
float: left;
margin-left: -95px;
background: #f0f0f0;
position: absolute;
-moz-border-radius: 5px;
border-radius: 5px;
}
#sharebox .wdt {
float: left;
clear: left;
padding: 5px;
}
</style>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function() {
var offset = $("#sharebox").offset();
var topPadding = 15;
$(window).scroll(function() {
if ($(window).scrollTop() > offset.top) {
$("#sharebox").stop().animate({
marginTop: $(window).scrollTop() - offset.top + topPadding
});
} else {
$("#sharebox").stop().animate({
marginTop: 0
});
};
});
});
</script>
<script type="text/javascript">
(function() {
var s = document.createElement('SCRIPT'), s1 = document.getElementsByTagName('SCRIPT')[0];
s.type = 'text/javascript';
s.async = true;
s.src = 'http://widgets.digg.com/buttons.js';
s1.parentNode.insertBefore(s, s1);
})();
</script> </pre><div class="sourcecode">මේකෙ (4)හතර වෙනි සහ (5) පස් වෙනි lines බොහෝ දුරට ඔයාගෙ blog එකට ගැළපෙන විදිහට වෙනස් කරගන්න වෙයි. හතර වෙනි line එකෙන් තමයි කියන්නෙ ලිපියට වඩා කොච්චර වම් පැත්තෙන්ද ගැජට් එක එහා මෙහා යන්න ඕන කියල. මෙතන මම කියල තියෙන්නෙ pixel 95ක් වම් පැත්තෙන් හිටපන් කියල. පස් වෙනි line එකේ තියන colour code එකන් කියන්නෙ background colour එක, ඒකත් ඔයාට ඕන විදිහට <a href="http://en.wikipedia.org/wiki/Web_colors" target="_blank">වෙනස් කරගන්න පුළුවන්</a>.</div><br />
4. ඊට පස්සෙ කරන්න තියෙන්නෙ <b><span style="color: red;"><data:post.body/></span></b> හොයාගන්න එක. ඒකත් කලින් කලා වගේම search පාරක් දාල හොයාගන්න. පහල තියන code කෑල්ල <b>ඒකට උඩින්</b> paste කරන්න.<br />
<pre class="brush: html"><b:if cond='data:blog.pageType == "item"'>
<div id='sharebox'>
<div class='wdt'><a class='DiggThisButton DiggMedium'/></div>
<div class='wdt'><div style='padding-left:3px'><iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=box_count&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:53px; height:65px;'/></div></div>
<div class='wdt'><a class='twitter-share-button' data-count='vertical' href='http://twitter.com/share'>Tweet</a><script src='http://platform.twitter.com/widgets.js' type='text/javascript'/></div>
</div>
</b:if>
</pre>5. වැඩේ ඉවරයි, දැන් තියෙන්නෙ Template එක Save කරල ගැජට් එක වැඩද කියල බලන එක තමයි. <br />
<br />
මම දැනට පෙන්නල දීල තියෙන්නෙ Digg, Twitter සහ Facebook කියන site වල badge එකතු කරගන්න හැටි. ඒකෙදි මම දාල තියන පලවෙනි code එකේ 38 වෙනි පේළියෙ ඉඳන් 46 වෙනි පේළිය වෙනකන් තියන code එක ඕන වෙන්නෙ ඔයා Digg එකතු කරනවනම් විතරයි. ඔයා Digg අයින් කරනවනම් ඒ code කෑල්ලයි, දෙවෙනියට දාල තියන code එකේ තුන් වෙනි පේළියයි (<div class='wdt'><a class='DiggThisButton DiggMedium'/></div>) අයින් කරන්න ඕන. <br />
<br />
අපි බලමු කොහොමද අපිට ඕන කරන social networking site එකක් මේ ගැජට් එකට එකතු කර ගන්නෙ කොහොමද කියල. ඒකෙදි අපි මුලින්ම කරන්න ඕන අපි එකතු කරන්න හදන social network site එකේ badge එකක් තියනවනම් ඒකට අදාල code එක හොයාගන්න එක. උදාහරණයක් විදිහට ඔයාට <a href="http://www.stumbleupon.com/badges/" target="_blank">මෙතනට ගිහින් </a> StumbleUpon වලට අදාල badge එක එකතු කරගන්න ඕන code එක ගන්න පුළුවන්. පහළින් තියෙන්නෙ ඒක එකතු කර ගත්තට පස්සෙ එන සම්පූර්ණ code එක.<br />
<pre class="brush: html;highlight: [6]"><b:if cond='data:blog.pageType == "item"'>
<div id='sharebox'>
<div class='wdt'><a class='DiggThisButton DiggMedium'/></div>
<div class='wdt'><div style='padding-left:3px'><iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=box_count&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:53px; height:65px;'/></div></div>
<div class='wdt'><a class='twitter-share-button' data-count='vertical' href='http://twitter.com/share'>Tweet</a><script src='http://platform.twitter.com/widgets.js' type='text/javascript'/></div>
<div class='wdt'><script src='http://www.stumbleupon.com/hostedbadge.php?s=5'></script></div>
</div>
</b:if>
</pre><br />
කරලම බලන්නකො එහෙනම්, අවුලක් තියනවනම් comment එකක් දාල අහන්න. Like එකක් දාන්නත් අමතක කරන්න එපා ඕං. ඔබට ජය!</div>Saranga Rathnayakehttp://www.blogger.com/profile/01103209861183518579noreply@blogger.com24tag:blogger.com,1999:blog-5286809515836634600.post-11504394493919959422010-11-23T03:37:00.000+05:302010-11-23T00:32:48.182+05:30Laptop එකක් ගනිද්දි මේ ගැනත් බලන්නඔන්න ගොඩක් කාලෙකට පස්සෙ අද වෙලාවක් හොයාගත්ත බ්ලොග් එක පැත්තෙ එන්න. අද මම කියන්න යනදේ ගොඩක් ප්රයෝජනවත් වෙන්නෙ අලුතින් laptop ගන්න ඉන්න කට්ටියට.<br />
<br />
අපි ඉතින් ගොඩක් වෙලාවට බලන්නෙ අපි ගන්න යන laptop එකේ කතා කරගත්තු විදිහට RAM, Processing Speed, VGA, Disk Space වගේ දේවල් තියනවද කියලනෙ. ඊට අමතරව බලන්න ඕන තව දෙයක් තියනව. ඒ තමයි laptop එකේ LCD/LED screen එක.<br />
<br />
මේ screen එකේ අපිට පේන්නෙ නැති තරම් කුඩාවට කළු, සුදු හෝ වෙනත් පැහැයක් ගන්නාවූ ලප තියෙන්න පුළුවන්. මේවට කියන්නෙ Dead/Stuck Pixel කියල. අපි මේක ගැන සැලකිලිමත් වෙන්න ඕන ප්රධානම හේතුව තමයි, මේවගේ ලප (Dead Pixel) එකක් දෙකක් තිබුනට අපිට අලුත් screen එකක් warranty යටතේ හම්බවෙන්නෙ නැති එක. එහෙම අලුත් එකක් දෙන්නනම් ගොඩක් වෙලාවට අඩුම තරමින් Dead Pixel 5ක් වත් තියෙන්න ඕන. මේක laptop brand එක අනුව වෙනස් වෙන දෙයක්.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8LSBnxBfScpSceaoTu1Azl-m2JJEWz3Ej8v_t7FtMrXl4rqjC03SJmQySXy8iy6GQwLe_msEzHQodKCtCHZFFQgz3-jRQc0DYvZ7Id4OdSzmh818jI2H7-mCCDYSkV2jTuFoW24MsKAo/s1600/deadpixel.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8LSBnxBfScpSceaoTu1Azl-m2JJEWz3Ej8v_t7FtMrXl4rqjC03SJmQySXy8iy6GQwLe_msEzHQodKCtCHZFFQgz3-jRQc0DYvZ7Id4OdSzmh818jI2H7-mCCDYSkV2jTuFoW24MsKAo/s1600/deadpixel.jpg" /></a></div><br />
ඔයා ගන්න යන laptop එකේ Dead Pixel තියනවද කියල බලන්න පුළුවන් ලේසිම විදිහ තමයි wallpaper එකට සුදු පාට පින්තූරයක් සහ කලු පාට පින්තූරයක් දාල හොඳින් පරීක්ෂා කරන එක. මේ web site (<a href="http://udpix.free.fr/index.php" target="_blank">UDPixel</a>) එකේ තියන පොඩි software එකෙන් ඒ වැඩේ ලේසියෙන්ම කරන්න පුළුවන්. Install කරන්න ඕන නැති නිසා laptop එක ගන්න වෙලාවට Flash Drive එකක දාගන ගිහින් run කරල බලන්න තියෙන්නෙ.<br />
මෙතනින් බාගන්න:<br />
<a href="http://udpix.free.fr/setup/UDPixel22.zip">UDPixel v2.2 English (.zip - 72kB) Compressed binaries, no installer</a><br />
<br />
ඊට අමතරව <a href="http://www.gdargaud.net/Hack/DeadPixels.html" target="_blank">මේ web site එකට (Dead Pixels Test)</a> ඒ වෙලාවෙම ගිහිනුත් හොඳ පරීක්ෂාවක් කරගන්න පුළුවන්. අමාරුවෙන් සල්ලි හොයාගන laptop එක ගත්තට පස්සෙ දුක් වෙනවට වඩා හොඳට පරීක්ෂා කරල ගන්න එක හොඳයිනෙ.<br />
<br />
එහෙනම් ඉතින් පස්සෙ වෙලාවක අලුත් සටහනකින් හමුවෙමු. කියවල බලල ප්රතිචාරයක් දාන්නත් අමතක කරන්න එපා. ඔබට ජය !Saranga Rathnayakehttp://www.blogger.com/profile/01103209861183518579noreply@blogger.com9tag:blogger.com,1999:blog-5286809515836634600.post-60906329155078306992010-02-03T19:51:00.001+05:302010-02-20T20:02:13.362+05:30JQuery වලින් Form එකකට Auto Suggest සහ Validation දාගමුමම මීට කලින් ලියපු සටහන් වල <a href="http://sarangasl-si.blogspot.com/2009/12/jquery.html" target="_blank">JQuery</a>, <a href="http://sarangasl-si.blogspot.com/2009/12/jquery-najax.html" target="_blank">JQuery වලින් ලේසියෙන්ම AJAX ගොඩදාන හැටි</a> සහ <a href="http://sarangasl-si.blogspot.com/2010/01/jqueryui.html" target="_blank">JQueryUI </a>ගැන කිව්ව ඔයගොල්ලන්ට මතක ඇති. අද සටහනෙන් කියන්න යන්නෙ ඒ දේවල් වල ප්රායෝගික යෙදීමක් ගැන. අපිට ගොඩක් web site වල forms තියනව දැකගන්න පුළුවන්නෙ, අද කියල දෙන්න යන්නෙ JQuery සහ AJAX පාවිච්චි කරල අපේ web site එකේ තියන form එකකට auto suggest දාගන්න හැටි සහ validation කරන හැටි. මේකෙදි ලබාගන්න දත්ත ටික PHP වලින් MySQL Database එකකට save කරගන්න හැටිත් කියල දෙන්න මම බලාපොරොත්තු වෙනව. ගොඩක් දේවල් විස්තර කරන්න තියන නිසා සටහන නම් ටිකක් දිග එකක් වෙයි.<br />
<br />
සටහනේ එන code කෑලි අවබෝද කරගන්න JavaScript,PHP සහ MySQL පිළිබඳ මූලික දැනුමක් තිබ්බොත් හොඳයි. ඒ දේවල් ගැන ලේසියෙන් ඉගෙන ගන්න <a href="http://www.w3schools.com">w3schools</a> site එකෙන් ඔයගොල්ලන්ට පුළුවන්. මොකද මමත් ඒකෙන් තමයි ගොඩාක් දේවල් ඉගෙන ගත්තෙ.<br />
<br />
මුලින්ම මේ පහල තියන තැනින් කියල දෙන්න යන code එක බාගන්නකො. ඊට පස්සෙ මම කියල තියන විස්තරේ බැලුවොත් ලේසියෙන්ම කරල තියන විදිහ තේරුම්ගන්න පුළුවන් වෙයි.<br />
<table border="0" style="width: 400px;"><tbody>
<tr><td><br />
<a href="http://www.4shared.com/file/214335131/69f45d35/jquery_form.html" target="_blank"><img style="border:0px" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgG2_JOhNaPfMc7VkbWszT9_zyT84Po0B5suuvREd0jLcCjNTjJ9VtqSI0rvru3_an_aHgLBo37x2JO4buUWjldi2TTBP7K6J8PpUcg-vdsXT7y_CuuvhCud88CM8jaLOcXObicRedLYlzC/s320/download.gif" /></a></td><td><br />
<a href="http://www.sarangasl.webuda.com/jquery/jquery_form/" target="_blank"><img style="border:0px" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiimqIaLgsZVwUulsNsr7qVAiA6AA0XKyYlXmkE2mk3B51uV_7B0UdKJ-BwTGpqoztQPEWza5vGcVG5DtbPRI9wkRXTkqG5BChCH-oKQEH3J9_xjlhvAzowWOE0JxAz8ad666aIwOmkHJnT/s320/demo.gif" /></a></td></tr>
</tbody></table>Password : sara<br />
<br />
<div class="sourcecode">Live Demo එකට ගිහින් පුරවන්න උත්සහයක් දීල බලන්නකො. වැරදියට පුරවන්න දෙන්නෙ නෑ නේද? <br />
එහෙම පිරෙව්වත් submit කරන්න බෑ නේද? ඔයාගෙ මැසිමෙ මේක run කරල මේක බලන්න ඕනනම්,<br />
PHP සහ MySQL තියන XAMP වගේ server එකක දාල තමයි බලන්න වෙන්නෙ. <br />
</div><br />
<b>දැන් බලමු මේක හරි විදිහට ඔයාගෙ මැසිමෙ run කරන හැටි</b><br />
<br />
සංක්ෂිප්ත ගොනුව බාගන දිග ඇරල බැලුවොත් ඔයාලට පෙනෙයි css,js,scripts සහ images කියල folders ටිකකුයි index.php කියල ගොනුවකුයි. ඔයාගෙ browser එකේ index.php ගොනුව විවෘත්ත කරල බැලුවොත් පහළ තියනව වගේ form එකක් එනව දැකගන්න පුළුවන් වෙයි. <br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdhnQjMzqd2WJQHgpJoJz4EcOLmmAe_M1UavCJZwdWFTwx3BIjFYHEfFtUrrSN-B5Tc40efc0U6XTe-V3_8TA7HPnI4Gurnr4PjHbV29yQjhCdZIfUH3giTRO-l4YmBxUrVJN1SN5TU0E/s1600-h/form.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdhnQjMzqd2WJQHgpJoJz4EcOLmmAe_M1UavCJZwdWFTwx3BIjFYHEfFtUrrSN-B5Tc40efc0U6XTe-V3_8TA7HPnI4Gurnr4PjHbV29yQjhCdZIfUH3giTRO-l4YmBxUrVJN1SN5TU0E/s320/form.JPG" /></a></div><br />
මුලින්ම මම දීල තියන උදාහරණෙ ඇතුලත් වෙන jquery_form කියන folder එක ඔයාගෙ localhost ක්රියාත්මක වෙන folder එකට copy කරගන්නකො. උදාහරණයක් විදිහට ඔයා පාවිච්චි කරන්නෙ WAMP නම් www folder එකට, XAMP නම් htdocs folder එකට. දැන් scripts කියන folder එකේ තියන dbc.php එක ඔයාගෙ Text Editor එකේ open කරගන්න. පොඩි වෙනස්කම් ටිකක් කරන්න ඕන ඔයාට ගැලපෙන විදිහට. <br />
<script class="brush:php;wrap-lines: false;" type="syntaxhighlighter">
<![CDATA[
<?php
$host = "localhost";
$dbname = "userdata";
$username = "root";
$password = "";
?>
]]>
</script><br />
ඔයා server එක අලුතෙන්ම install කලානම් කිසි වෙනසක් හරන්න ඕන නෑ. එහෙම නැත්නම් දැනට නැති නමක් $dbname එකට දෙන්න. MySQL වලට password එකක් දීල තියනවනම් ඒක $password එකට දෙන්න. එච්චටයි කරන්න තියෙන්නෙ.<br />
<br />
<div class="sourcecode">ඊට පස්සෙ තියන පියවරවල් කරන්න ඕන server එක online තියෙද්දි. මම කරන්න ඕන<br />
වැඩෙයි ඒකෙන් එන ප්රතිඵලයයි දෙකම මෙතනදි කියන්නම්.<br />
<br />
1. මුලින්ම sql.php file එක server එකේ run කරන්න,<br />
ඒකට කරන්න තියෙන්නෙ browser එකේ address bar එකේ ඒකට යන පාර දෙන එක විතරයි.<br />
උදාහරණයක් විදිහට http://localhost/jquery_form/scripts/sql.php ගන්න පුළුවන්. <br />
<br />
මේකෙදි වෙන්නෙ අලුත් database එකක් හැදෙන එක. ඒක වෙන්නෙ කලින් ඔයා dbc.php එකට<br />
කරපු වෙනස්කම් වලට අදාලව. වෙනසක් කරේ නැත්නම් userdata කියල database එකක details_user<br />
කියල table එකක් අදාල columns එක්කම හැදෙනව. මතක තියාගන්න මේක එක පාරක් කළාම ඇති.<br />
මේ file එක අපේ වැඩේට අදාල නෑ, ඒක මම ලිව්වෙ ලේසියෙන්ම database එක හදාගන්න.<br />
<br />
2. ඊටපස්සෙ කරන්න තියෙන්නෙ index.html එක server එකේ run කරන එක.<br />
දැන් form එක හරි විදිහට පුරවල submit කරල බලන්නකො. එතකොට අපේ දත්ත ටික database එකේ<br />
save වෙලා තියෙයි.<br />
<br />
එක පාරක් submit කරල ඊලඟ පාර සම්පූර්ණ නමයි උපන්දිනෙයි පුරවල අර කලින් දීපු Login Name<br />
එකම දීල බලන්නකො. මොකද උනේ ? ඒ නම දැනට තියන හින්ද වෙන නම් ටිකක් suggest වෙලා<br />
එනව නේද ?<br />
</div><br />
දැන් බලමුකො code වලට ගිහිල්ල කොහොමද මේ වැඩේ කරල තියෙන්නෙ කියල. මුලින්ම බලමු index.php වල code එක.<br />
<script type="syntaxhighlighter" class="brush:html;first-line: 8; wrap-lines: false;"><![CDATA[
<title>JQuery Ajax Form | Saranga Rathnayake</title>
<!-- CSS -->
<link rel="stylesheet" href="css/styles.css" type="text/css"/>
<link type="text/css" href="css/jquery-ui-1.7.2.custom.css" rel="stylesheet" />
<!-- JavaScript -->
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.7.2.custom.min.js"></script>
<script src="js/validation.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$('#datepicker').datepicker({
dateFormat:'dd/mm/yy',
changeMonth: true,
changeYear: true,
yearRange: '-90:+0',
maxDate: '+0'
});
});
</script>
</head>
<div id="container">
<form id="logform" name="logform" class="logform" method="post" action="" >
<?php if(
]]></script><br />
වැඩිය හැඩ වැඩ කරල නැතිව HTML Table පාවිච්චි කරල තමයි මම form එක හදල තියෙන්නෙ. ඕන විදිහට හැඩ කරගන්න එක ඔයාට බාරයි. මේකට මම JQuery සහ JQueryUI වගේ ඕන කරන JavaScripts සහ CSS link කරගන තියනව. 11 වෙනි පේළියෙදි මම JQuery link කරල තියෙන්නෙ. උපන් දිනේ දෙන්න හැදුවනම් ඔයාට පේන්න ඇති ලස්සන දින දර්ශකයක් එනව අපිට දිනේ තෝරන්න. ඒකෙදි මම පාවිච්චි කරල තියෙන්නෙ JQueryUI වල datepicker කියන ගැජට් එක. ඒකට තමයි ඊලඟ පේලියෙ JQueryUI link කරල තියෙන්නෙ. 18 වෙනි පේළියෙ ඉඳන් 28 වෙනි පේළිය වෙනකන් තියන JavaScript කෑල්ල datepicker එකට ඕන කරන ටිකක්. <br />
<br />
එතකොට මොකක්ද 17 වෙනි පේලියෙ තියන අනිත් JavaScript එක? ඒකෙ තමයි මම validation සහ suggestion කරල තියෙන්නෙ, ඉස්සරහට ඒක විස්තර කරන්නම්කො. 32 වෙනි පේළියෙ ඉඳන් 86 වෙනි පේළිය වෙනකන් තියන PHP කෑල්ල දැනට අමතක කරන්න, ඒක form එක submit කළාට පස්සෙ වෙන දෙයක් ගැන. එතනින් එහාට තියෙන්නෙ සාමාන්ය විදිහට HTML table එකක form එක හදල තියන එක. මෙතනදි හැම input එකකටම යටින් span එකක් දාල තියෙන්නෙ JavaScript වලින් validate කරල එන ප්රතිඵලය පෙන්වන්න. කරන හැටි ඉස්සරහට කියන්නම්කො.<br />
<br />
<b>කොහොමද Validation සහ Suddestions කරන්නෙ ?</b><br />
<br />
ඇත්තටම අපේ මාතෘකාවට අදාල වෙන්නෙ validation.js කියන file එක. මොකද මේකෙ තමයි validation සහ suggestion වලට අදාල code තියෙන්නෙ. මේකෙදි මම හැම input එකක්ම validate කරන්න වෙනම function එකක් ලියල තියනව. ඒවගේම suggest කරන වැඩ වලට වෙනම function ලියල තියනව. ඒ ඒ input වල blur සහ keyup event එකේදි මම අර කලින් කියපු functions යොදාගන validate කරල තියනව. ඒ වගේම form එකේ submit event එකේදි මම හැම input එකක්ම බලල තියනව.<br />
<br />
දැන් බලමු validation.js වල code එක, මම කෑලි කෑලි අරගන විස්තර කරන්නම්.<br />
<script class="brush: js;first-line: 24; wrap-lines: false;" type="syntaxhighlighter">
<![CDATA[
//On blur
name.blur(validateNameAndSuggest);
iname.blur(validateIName);
address.blur(validateAddress);
email2.blur(validateEmail);
nic.blur(validateNIC);
phno.blur(validatePhNo);
email.blur(validateLoginEmailAndSuggest);
imgveri.blur(validateImg);
// on changed
bday.change(validateDOB);
//On key press
//name.keyup(validateName);
//iname.keyup(validateIName);
]]>
</script><br />
මෙතනදි තමයි මම එක එක events වලදි functions වලට call කරල තියෙන්නෙ. මම key up event එකේදි වෙන ටික comment කරල තියෙන්නෙ, කැමතිනම් ඔයාට පුළුවන් ඒක uncomment කරන්න. ඊට පස්සෙ බලමු මේ විදිහට call වෙන function එකක් දිහා.<br />
<script class="brush: js;first-line: 190; wrap-lines: false;" type="syntaxhighlighter">
<![CDATA[
function validateNIC(){
var a = $("#nic").val();
var filter = /^[0-9]{9}[v|V]$/;
if(filter.test(a)){
nic.removeClass("error");
nicInfo.text("");
nicInfo.removeClass("error");
return true;
}
//if it's NOT valid
else{
nic.addClass("error");
nicInfo.text("Type a valid NIC please, format: xxxxxxxxxV");
nicInfo.addClass("error");
return false;
}
}
]]>
</script><br />
අපි validation වලට Regular Expressions පාවිච්චි කරනවනම් ගොඩාක් ලේසියෙන් අපේ වැඩේ කරගන්න පුළුවන්. මෙතනදිත් මම Regular Expressions පාවිච්චි කරල තියනව. අපි දෙන input එකත් එක්ක ඒක ගැලපෙනවනම් ප්රශ්ණයක් නෑ, හැබැයි ගැලපෙන්නෙ නැත්නම් මම කරල තියෙන්නෙ input textbox එකට අලුතෙන් CSS Class එකක් එකතු කරන එක සහ අර මම කලින් කියපු input textbox එක යටින් තිබුන span එකට text එකක් ලියන එක. එතකොට ඒ ඒ CSS Classes අනුව input textbox එක වෙනස් වෙනව. මෙතනදිනම් මම කරල තියෙන්නෙ පාට වෙනස් කරන එක. දැන් බලමු කොහොමද suggestion එකක් කරන්නෙ කියල.<br />
<script class="brush: js;first-line: 314; wrap-lines: false;" type="syntaxhighlighter">
<![CDATA[
function suggestLogginName(){
var name = $("#fname").val();
var bday = $("#datepicker").val();
if(validateName() && validateDOB()){
$.post("scripts/isValiedName.php", { loginName:name, birthday:bday,suggestion:"OK" },
function(data){
emailInfo.html(data);
});
}
}
]]>
</script><br />
මේ function එක call වෙන්නෙ මීට උඩින් තියන function එකේදි අපි දෙන Login Name එක දැනට database එකේ තිබුනොත් කියල ඔයාලට තේරෙනව ඇතිනෙ. මෙතනදි මම කරල තියෙන්නෙ AJAX වලින් සම්පූර්ණ නමයි උපන්දිනයයි වෙනම PHP file එකකට (isValiedName.php) යවන එක. ඊට පස්සෙ ඒකෙන් අපි එවපු දත්ත ටික එහාට මෙහාට කරල දැනට database එකේ නැති නම් ටිකක් ආපහු එවනව. ඊට පස්සෙ කරල තියෙන්නෙ ඒ එන නම් ටික පෙන්නන එක. හරි ලේසියි.<br />
<br />
<b>වැඩි විස්තර</b><br />
<br />
අපි බලමු form එක submit කලාට පස්සෙ මොකද වෙන්නෙ කියල. මම form එකේ action එකට index.php මයිනෙ දීල තියෙන්නෙ. ඒ හින්ද අපි post method එකෙන් යවන data ටික ගන්න ඕනත් index.php එකේ ඉඳන්මයි. ඒකට තමයි index.php එකේ 32 වැනි පේළියෙන් පටන් ගන්න PHP කෑල්ල තියෙන්නෙ. validation.php එක ඕන වෙන්නෙ අපි යවන data PHP වලිනුත් validate කරන්න ඕන හින්ද, මොකද නැත්නම් JavaScript dissable කරල තිබ්බොත් data validate වෙන්නෙ නැති හින්ද. අන්තිමට data validate උනොත් database එකේ ලියන එක තමයි කරල තියෙන්නෙ. එච්චටයි !<br />
<br />
හපොයි, හිතුවට වඩා පට්ටම දිග උනා. මේ සටහන web development කරන අයට වැදගත් වෙයි කියල හිතනව. අවුලක් තියනවනම් ප්රතිචාරයක් විදිහට දාන්නත් අමතක කරන්න එපා. ඔබට ජය !Saranga Rathnayakehttp://www.blogger.com/profile/01103209861183518579noreply@blogger.com13tag:blogger.com,1999:blog-5286809515836634600.post-26474820861533269042010-01-15T16:03:00.013+05:302010-01-15T17:32:04.371+05:30Gmail වලට ආපු අලුත් වැඩ කෑලිඔයගොල්ලො දැනටමත් දන්නව ඇතිනෙ Gmail වලට අලුත් අලුත් වැඩ කෑලි ගොඩක් ඇවිත් තියනව කියල. <a href="http://mail.google.com/mail/help/intl/en/about_whatsnew.html" target="_blank">Google's approach to email</a> පිටුවට ගියොත් ඔයාට පුළුවන් ඒ දේවල් බලාගන්න. මම කියන්න යන්නෙ මේ ගැජට් අතරින් දාගත්තොත් කෝකටත් හොඳයි කියල හිතුන එකක් ගැන. මේක ඔය අමත්ක වෙන ලෙඩේ සහ වරදින ලෙඩේ තියන කට්ටියට පට්ට ගැජට් එකක්. ගැජට් එකේ නම තමයි Undo Send.<br />
<br />
මේකෙන් කරන්නෙ mail එක යවල තත්පර කිහිපයක් යනකන් අපිට ඒක යවන එක නවත්තන්න අවස්ථාවක් දෙන එක. මේක හදපු අය කියන දෙයක් තමයි, mail එක යවල තත්පර පහක් විතර කාලයක් ඇතුලත අපිට mail එකේ අඩුපාඩුවක් තියනවනම් පේනව කියන එක. උදාහරණයක් විදිහට attach කරන්න අමතක වෙන එක, අකුරු වල සහ ව්යාකරණ වල තියන අඩුපාඩු ගන්න පුළුවන්. මම අත්දැකීමෙන් දන්නව attach කරන්න අමතක වෙච්ච වෙලාවට send කරාට පස්සෙ ටක් ගාල මතක් වෙනව attach කලේ නෑ නේද කියල. එතකොට ඉතින් පෙරහැර ගිහින් ඉවරයිනෙ.<br />
<br />
ඔයාලට මතකද මම අර කලින් කියල දුන්න <a href="http://sarangasl-si.blogspot.com/2009/12/gmailpicture.html" target="_blank">Gmail body එකට attach කරන්නෙ නැතුව පින්තූරයක් දාන හැටි</a>. අන්න ඒ විදිහටම Labs වලට ගිහිල්ල මේ Undo Send feature එක enable කරගන්න තියෙන්නෙ. <br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEZFv2Lqt5KfyV6j044UVzjqRGPIFFRjGVdacZMkycR18i5plrglRSQ2J_s7UIIvbpKTK50cRteNz2t2XhSaHh3yWvpFumbpjxU7ubb6yH8jjkzLuiYPaXiLadSAqoVITNFqtcpnPdzZ8/s1600-h/sent.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEZFv2Lqt5KfyV6j044UVzjqRGPIFFRjGVdacZMkycR18i5plrglRSQ2J_s7UIIvbpKTK50cRteNz2t2XhSaHh3yWvpFumbpjxU7ubb6yH8jjkzLuiYPaXiLadSAqoVITNFqtcpnPdzZ8/s320/sent.JPG" /></a><br />
</div><br />
වෙනද mail එක ගියාට පස්සෙ එන notification එක ඉස්සරහ දැන් Undo කියල link එකක් එයි. රූපෙ බැලුවොත් පැහැදිළිවෙයි. කරල බලල හොඳ නරක ඔය පහළ තියන කොටුවෙ ලියන්නකො. සටහන එහෙනම් මෙතනින් ඉවරයි, ඔබට ජය !Saranga Rathnayakehttp://www.blogger.com/profile/01103209861183518579noreply@blogger.com11tag:blogger.com,1999:blog-5286809515836634600.post-8699021410834074732010-01-13T18:24:00.005+05:302011-04-21T15:41:45.659+05:30Google ගෙන් හරියට අහන හැටිඔන්න අදත් මම කියන්න යන්නෙ පොඩි දෙයක් ගැන. අපි ඉතින් මොකක් හරි දෙයක් දැනගන්න ඕන උනහම ගොඩක් වෙලාවට Google ගෙන්නෙ අහන්නෙ. මේ සටහනෙන් කියන්න යන්නෙ Google ට ලේසියෙන් උත්තර දෙන්න පුළුවන් වෙන්න අපිට ඕන දේ අහන හැටි. මේ විදිහට කලොත් ඕන්නැති ගොඩක් ප්රතිඵල හලාගන්න පුළුවන්.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgxVTEHrDuW_QC5I48aOmxda6gdNrQ7wnnVoQDRoA5qLjGcH_oj1Db1KupGxJxiCKvBcUOFoyFOWj9rPkbYewtgRURKQ5wPh1QQcB-tRd_T69lfo3dJvEJqKYu8_-263-gl5bzCw1XudU/s1600-h/google.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgxVTEHrDuW_QC5I48aOmxda6gdNrQ7wnnVoQDRoA5qLjGcH_oj1Db1KupGxJxiCKvBcUOFoyFOWj9rPkbYewtgRURKQ5wPh1QQcB-tRd_T69lfo3dJvEJqKYu8_-263-gl5bzCw1XudU/s320/google.JPG" /></a><br />
</div><br />
<b>1. නිශ්චිත වාක්යාංශ ("Some text here") </b><br />
හිතන්න ඔයාට ඕන කියල සිංහල යුනිකෝඩ් පිහිටුවන හැටි Google ගෙන් අහන්න, මේ වගේ වෙලාවට <span style="background-color: #fff2cc;">install sinhala unicode</span> කියල හොයනව වෙනුවට ඔයාට පුළුවන් පෙරළි කොමා දෙකක් අස්සෙ දාල <span style="background-color: #fff2cc;">"install sinhala unicode"</span> කියල හොයන්න. එතකොට Google අපිට කියන්නෙ ඔය වචන තුන ඔය පිළිවෙලටම තියන එව්ව විතරයි.<br />
<br />
<b>2. ඕන්නැති වචන හලන්න (-YourText)</b><br />
අපිට එන ප්රතිඵල ගාන අඩු කරගන්න මේක පාවිච්චි කරන්න පුළුවන්. ඔයාට <span style="background-color: #fff2cc;">install sinhala unicode</span> ගැන හොයන්න ඕන, හැබැයි එන ප්රතිඵල වල <span style="background-color: #fff2cc;">siyabas </span>තියෙන්න බැරිනම් <span style="background-color: #fff2cc;">install sinhala unicode -siyabas</span> කියල හොයපුවාම ගොඩ. පේනවනෙ කරල තියෙන දේ, අර පොඩි ඉරි කෑල්ලෙන් එහා පැත්තෙ එන්න ඕන නැති වචනෙ දෙන්න තියෙන්නෙ. <span style="background-color: #fff2cc;">install sinhala unicode -siyabas -download</span> කියල දීපුවාම siyabas සහ download කියන වචන දෙකම හැලෙනව.<br />
<br />
<b>3. සමාන දේවල් තියන පිටු (related:URL)</b><br />
ඒ කියන්නෙ මේ වගේ දෙයක්, හිතන්නකො අපිට http://www.w3schools.com/php/default.asp කියන පිටුවෙ අපි හොයන දේ හම්බවුනා කියල, <span style="background-color: #fff2cc;">related:http://www.w3schools.com/php/default.asp</span> කියල හොයපුවාම අර කලින් පිටුවෙ තියන දේට සම්බන්ද දේවල් තියන තවත් පිටු අපිට හොයාගන්න පුළුවන්.<br />
<br />
<b>4. එක Site එකක විතරක් හොයන හැටි (YourText site:URL)</b><br />
හිතන්න ඔයාට මොකක් හරි දෙයක් ගැන එක site එකක විතරක් තියන දේවල් හොයන්න ඕන කියල, උදාහරණයක් විදිහට <span style="background-color: #fff2cc;">php site:www.w3schools.com</span> කියල දුන්නොත් අපිට www.w3schools.com කියන site එකේ php ගැන ලියවුන පිටු හොයාගන්න පුළුවන්.<br />
<br />
<b>5. විශේෂ ලියකියවිලි වර්ගයක් හොයන හැටි (filetype:Type)</b><br />
ඔයාට ඕනනම් php tutorial ගැන තියන pdf files හොයන්න, <span style="background-color: #fff2cc;">php tutorial filetype:pdf</span> කියල දීපුවාම ගොඩ.<br />
<br />
<b>6. හදිස්සියකට ගානක් හදාගන්න</b><br />
ඔය පොඩි ගානක් හදාගන්න අපි හැම තිස්සෙම කරන වැඩක් තමයි Calculator එක පාවිච්චි කරන එක, <span style="background-color: #fff2cc;">(5.5*10)/5</span> කියල දීල බලන්නකො මොකද වෙන්නෙ කියල.<br />
<br />
<b>7. අර්ථ දැක්වීම් හොයන්න (define:Text)</b><br />
<span style="background-color: #fff2cc;">define:unicode</span> කියල හොයපුවාම අපිට unicode කියන එකේ අර්ථ දැක්වීම ලේසියෙන්ම දැනගන්න පුළුවන්.<br />
<br />
දැන් දන්නවනෙ කොහොමද Google ගෙන් හරියට අහන්නෙ කියල, කරල බලල ප්රතිචාරයකුත් කොටලම ගියානම් තමයි හොඳ. එහෙනම් සටහන මෙතනින් ඉවරයි. ඔබට ජය !<br />
<br />
<div class="sourcecode">පසු සටහන:<br />
මේ විදිහට හොයන්න පුළුවන් එක එක විදි ගැන විස්තරාත්මක ලිපියක් <a href="http://www.googleguide.com/advanced_operators_reference.html" target="_blank">මෙතනින්</a> බලන්න.<br />
</div>Saranga Rathnayakehttp://www.blogger.com/profile/01103209861183518579noreply@blogger.com39tag:blogger.com,1999:blog-5286809515836634600.post-28923730280479439062010-01-08T16:58:00.007+05:302010-01-12T12:33:20.581+05:30Windows මුර පදය අමතක වුනොත් ගොඩදාන හැටිඅදනම් පොඩි පොඩි දේවල් වලින් කියන්න යන්නෙ ටිකක් ලොකු දෙයක් ගැන. මුලින්ම කියන්න ඕන මේ දේ වැරදි විදිහට පාවිච්චි කරන්න ඔට්ටු නෑ කියල. මම කියන්න යන්නෙ Windows වල මුර පදය අමතක උනොත් recover කරගන්න විදිහක් ගැන. මටත් මේක ගැන හොයන්න ඕන උනේ යාළුවෙක්ට වෙච්ච ඒ වගේ අකරතැබ්බියක් හින්ද. Windows කිව්වම ඉතින් ජාති ගොඩක් තියනවනෙ, මම බලපු site එකේනම් තිබ්බෙ මෙන්න මෙහෙම, <br />
<br />
<div class="sourcecode">Tested on: NT 3.51, NT 4 (all versions and SPs), Windows 2000 (all versions & SPs), <br />
Windows XP (all versions, also SP2 and SP3), Windows Server 2003 (all SPs), <br />
Windows Vista 32 and 64 bit (SP1 also), Window 7 (all variants). <br />
Some say also Windows Server 2008 is OK<br />
</div><br />
හැබැයි ඕං මම කරල බැලුවෙනම් Windows XP SP_2 වල. නැත්නම් කට්ටිය අත්හදා බලල වැඩ කරන්නෙ නැතුව ගියොත් මට වලක් කපාගන වැලලෙන්නයි වෙන්නෙ. <br />
<br />
මේවගේ වෙලාවට මුලින්ම බලන්න ඕන Default Administrator Account එකේ මුර පදයක් නැද්ද කියල, ඒකට logging window එකේදි Ctrl + Alt + Delete දෙපාරක් ඔබල user name එකට Administrator කියල දීල මුර පදය නැතුව ඇතුලට යන්න පුලුවන්ද බලන්න. ( Safe Mode එකෙදි මේ Default Administrator Account එක logging window එකේ පෙන්වනව, Safe Mode යන්න Windows logo එක පේන්න කලින් F8 ඔබන්න ). ඒකෙ මුර පදයත් මතක නැත්නම් ඉතින් මේ විදිහට තමයි ගොඩ ගන්න වෙන්නෙ. මේ වැඩේට අපිට Bootable CD එකක් හදා ගන්න වෙනව. මම කියන්නම්කො කරන පිළිවෙල.<br />
<br />
<div class="sourcecode" style="color: red;overflow: visible;">වැදගත් :<br />
මේ විදිහට recover කළායින් පසුව කලින් තිබුනු encrypted files කියවීමට නොහැකි වේ, <br />
අන්තිම පියවරේදි read only file system කියල error එකක් එනවනම් Safe Mode එකට ගිහින් <br />
log in window එක ආපුවාම Shut Down කරල නැවත උත්සහ කරල බලන්න. <br />
මොකද කලින් පාර හරියට Shut Down වෙලා තිබ්බෙ නැත්නම් අවුල්.<br />
</div><br />
1. <a href="http://pogostick.net/%7Epnh/ntpasswd/cd080802.zip" target="_blank">මෙතනින් ISO Image</a> එක බාගන <a href="http://download.cnet.com/Active-ISO-Burner/3000-2646_4-10602452.html?part=dl-105270&subj=dl&tag=button" target="_blank">Active ISO Burner</a> වගේ මෘදුකාංගයක් පාවිච්චි කරල CD එක burn කරගන්න.<br />
<br />
2. ඊට පස්සෙ මුර පදය අමතක වෙච්ච මැසිම ඒකෙන් boot කරන්න. ( මෙහෙම කරන්නනම් first boot device එක CD-ROM විදිහට BIOS වල දීල තියෙන්න ඕන, ඒකට මැසිම on වෙනකොටම DEL ඔබල BIOS ගිහින් first boot device එක CD-ROM දෙන්න )<br />
<br />
3. දැන් තියෙන්නෙ එන උපදෙස් පිළිපදින එක තමයි. සම්පූර්ණ විස්තරයක් <a href="http://pogostick.net/%7Epnh/ntpasswd/walkthrough.html" target="_blank">මෙන්න මෙතන</a> තියනව. මේක බාගන printout එකක් අරන් හිටියොත් වඩාත් හොඳයි. මේකෙදි සාර්ථකම ක්රමය කියන්නෙ Administrator Account එකේ මුර පදය එක හිස් කරන එක. <a href="http://pogostick.net/%7Epnh/ntpasswd/" target="_blank">මෙතෙන්ට</a> ගිහින් වැඩි විස්තර ඕනනම් බලාගන්නකො.<br />
<br />
<b>වැරදි කෙනෙක්ට ගියොත්, අපි බේරෙන්නෙ කොහොමද ?</b><br />
<br />
මේකත් කියන එක ඇඟට ගුණයි කියල මට හිතුන. උඩ තියන මෘදුකාංගය USB Pen Drive එකක උනත් පාවිච්චි කරන්න පුළුවන්. ඒක හින්ද මේ වගේ දෙයක් වැරදි විදිහට පාවිච්චි කරන කෙනෙක්ගෙන් බේරෙන්න තියන විදිහ තමයි first boot device එක Hard Disk කරල BIOS වලට මුර පදයක් දාන එක. හැබැයි Mother Board එකේ බැටරිය ගැලෙව්වහම ඒකත් නැති වෙනව. ඒකට විසඳුම තමයි <a aiotitle="click to expand" href="javascript:togglecomments('yourDivId')">මෙන්න මේක</a>.<br />
<div class="commenthidden" id="yourDivId"><br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKCZFuXd-kPsPcvxe5yr7fHSugeWZ7xg_JSBTsuSgGHwaJClQbeCDlaBi_zmzFi1qfzzjvA3NboBx7ZwSX_Hk2YCIRHq3TPkUTGdJFV1rnPVPJaoG9HCghz81CgsXJIDTQ6HPPkEzzJ0A/s1600-h/lock1.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKCZFuXd-kPsPcvxe5yr7fHSugeWZ7xg_JSBTsuSgGHwaJClQbeCDlaBi_zmzFi1qfzzjvA3NboBx7ZwSX_Hk2YCIRHq3TPkUTGdJFV1rnPVPJaoG9HCghz81CgsXJIDTQ6HPPkEzzJ0A/s320/lock1.jpg" /></a><br />
</div></div>කොහොමද හොඳයි නේද? එහෙනම් ඉතින් මම දැන් යනව. ඔබට ජය !Saranga Rathnayakehttp://www.blogger.com/profile/01103209861183518579noreply@blogger.com12tag:blogger.com,1999:blog-5286809515836634600.post-91552229068843351182010-01-06T15:54:00.009+05:302010-01-12T12:33:09.541+05:30ජනෙල් හතේ සැඟවුනු දෙයියන්ගෙ මාදිලියකට්ටිය බලනව ඇති මොකක්ද මේ හරුපෙ කියල. Windows 7 වල තියනව සැඟවුනු God Mode කියල එකක්, ඒක ගැනයි මේ කියන්න යන්නෙ. මේකනම් අලුත්ම දෙයක් නෙවෙයි, Vista වලත් තිබ්බ දෙයක්. මුලින්ම කියන්න ඕන දෙයක් තමයි මේක Vista 64 bit වල කරල බලන්න එපා කියන එක. නැත්නම් කට්ටිය OS එක අවුල් ගියා කියල මාව කයි, 32 bit නම් අවුලක් නෑ. Windows 7 නම් අවුලක්ම නෑ. මෙහෙමයි සැඟවුනු දෙයියන්ගෙ මාදිලියට යන්නෙ, හරිම සරළයි.<br />
<br />
1. මුලින්ම අලුත් folder එකක් හදන්න.<br />
2. ඊට පස්සෙ මේ පහල තියන නමින් ඒක rename කරන්න.<br />
<div class="sourcecode">GodMode.{ED7BA470-8E54-465E-825C-99712043E01C}<br />
</div><br />
වැඩේ ඉවරයි ! දැන් ඇතුලට ගිහින් බලන්නකො මොනවද තියෙන්නෙ කියල. <br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgex94lxACSz4MvEm_Bupmgvhztk44GDIYYyRbEEXbxf2krmHYFEbCiWRZUmQwAjUCbOz3gpbbcJhuIqRYa9Z2dh1y9cXJMCoXUwdrors2TrUPr7IcK5NQpIl3JaliSFvRvaKUzVwSbIOA/s1600-h/god_mode_windows7.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgex94lxACSz4MvEm_Bupmgvhztk44GDIYYyRbEEXbxf2krmHYFEbCiWRZUmQwAjUCbOz3gpbbcJhuIqRYa9Z2dh1y9cXJMCoXUwdrors2TrUPr7IcK5NQpIl3JaliSFvRvaKUzVwSbIOA/s320/god_mode_windows7.jpg" /></a><br />
</div><br />
මේකට දෙයියන්ගෙ මාදිලිය කියන්නෙ Operating System එකේ තියන ඕනම Control Panel එකකට එකම තැනකින් යන්න පුළුවන් හින්ද. නරකම නෑ නේද? කරල බලල හොඳ නරක කියන්නකො. එහෙනම් සටහන මෙතනින් ඉවරයි. ඔබට ජය !Saranga Rathnayakehttp://www.blogger.com/profile/01103209861183518579noreply@blogger.com19tag:blogger.com,1999:blog-5286809515836634600.post-28868240777033453382010-01-06T09:35:00.003+05:302010-01-06T13:41:56.491+05:30Admin ගේ ගණන් බලන් නැතුව නිදහසේ වැඩ කරගන්නපොදු පරිඝණක පාවිච්චි කරන ගොඩක් වෙලාවට අපිට එන ප්රශ්ණයක් තමයි වැඩක් කරගන්න ගියහම ඕන කරන මෘදුකාංග ස්ථාපනය කරල නැති එක. ගොඩක් වෙලාවට ඒ වගේ පරිඝණක වල admin බලතලත් අපිට නෑනෙ, ඉතින් ඒක හින්ද මෘදුකාංග ස්ථාපනය කරන්නත් බෑ. මේ වගේ වෙලාවට ඉතින් අපේ පිහිටට ඉන්නෙ Portable Applications තමයි. <br />
<br />
අද මම කියන්නෙ ඒ වගේ Portable Applications එකතුවක් තියන <a href="http://portableapps.com" target="_blank">PortableApps.Com</a> කියන site එක ගැන. අද වෙනකොට ගොඩක් දෙනා අතර ප්රසිද්ධ Portable Firefox හදල තියෙන්නෙත් මේ ගොල්ලො තමයි. මේ site එකෙන් අපිට free and open source මෘදුකාංග ගොඩාක් බාගන්න පුළුවන්. මෙව්ව USB flash drive, iPod, memory card සහ portable hard drive වගේ ඕන එකක දාගන වැඩ කරගන්න පුළුවන්. මෙන්න තියනව එව්වගෙන් ටිකක්,<br />
<br />
<a href="http://portableapps.com/apps/internet/firefox_portable" target="_blank">Mozilla Firefox, Portable Edition</a> - සම්මාන දිනූ Web Browser එක<br />
<a href="http://portableapps.com/apps/graphics_pictures/gimp_portable" target="_blank">GIMP Portable</a> - Photo සහ Image Editing වලට<br />
<a href="http://portableapps.com/apps/music_video/vlc_portable" target="_blank">VLC Media Player Portable</a> - ලේසියෙන් පාවිච්චි කරන්න පුළුවන් Media Player එකක්<br />
<a href="http://portableapps.com/apps/office/openoffice_portable" target="_blank">OpenOffice.org Portable</a> - Microsoft අනුකූලතාව සමගින්<br />
<a href="http://portableapps.com/apps/utilities/7-zip_portable" target="_blank">7-Zip Portable</a> - File Archiving සහ Compressing වලට<br />
<a href="http://portableapps.com/apps/utilities/infrarecorder_portable" target="_blank">InfraRecorder Portable</a> - CD සහ DVD Burn කරගන්න<br />
<a href="http://portableapps.com/apps/development/xampp" target="_blank">XAMPP</a> - Apache, mySQL, PHP, phpMyAdmin<br />
<br />
අපිට ඕන කරන දේ හොයාගන්න පහසු වෙන්න Accessibility, Development, Education, Games, Graphics & Pictures, Internet, Music & Video, Office, Operating Systems සහ Utilities වශයෙන් විස්තර සහිතව වර්ගීකරණයක් තියන <a href="http://portableapps.com/apps" target="_blank">මේ (Applications) පිටුව</a> බලන්නකො. <br />
<br />
මේ මෘදුකාංග එකක්වත් limited එව්වවත් trial version වත් නෙමෙයි, පාවිච්චි කරන්න අමතර මෘදුකාංග, දෘඩාංග ඕන වෙන්නෙත් නෑ. ඔයාට තියෙන්නෙ බාගෙන පාවිච්චි කරල යාළුවන්ටත් දෙන එක. ඔන්න ඔහොමයි admin ගෙ ගණන් බලන්නැතුව වැඩ කර ගන්නෙ. එහෙනම් අදට මම යනව. ඔබට ජය !Saranga Rathnayakehttp://www.blogger.com/profile/01103209861183518579noreply@blogger.com3tag:blogger.com,1999:blog-5286809515836634600.post-78106699319761779162010-01-04T08:59:00.001+05:302010-01-12T12:32:45.578+05:30JQuery UI, ලොකු ලොකු දේවල් ලේසියෙන් කරගන්නJQuery ගැන මම මීට කලින් ලිපි දෙකකදි කතා කළානෙ. මතක නෑ වගේනම් පහළ තියන links වලට කොටල එව්ව බලලම ඉන්නකො.<br />
<br />
1. <a href="http://sarangasl-si.blogspot.com/2009/12/jquery.html" target="_blank">JQuery, පොඩ්ඩක් ලියල වැඩ ගොඩක් දාන්න</a><br />
2. <a href="http://sarangasl-si.blogspot.com/2009/12/jquery-najax.html" target="_blank">JQuery වලින් ලේසියෙන්ම AJAX ගොඩදාන්න</a><br />
<br />
අද කියන්නෙ JQuery UI ගැන. ඒක JQuery පාවිච්චි කරල හදපු තවත් Free JavaScript Library එකක්. මේක පාවිච්චි කරල අපිට ලේසියෙන්ම interactive web applications හදන්න පුලුවන්. මේ උදාහරණ ටික බලන්නකො වැඩ කිඩ ටිකක් බලාගන්න.<br />
<br />
1. <a href="http://jqueryui.com/demos/draggable" target="_blank">Draggable</a> <br />
2. <a href="http://jqueryui.com/demos/droppable" target="_blank">Droppable</a> <br />
3. <a href="http://jqueryui.com/demos/sortable" target="_blank">Sortable</a> <br />
4. <a href="http://jqueryui.com/demos/datepicker" target="_blank">Datepicker</a> <br />
5. <a href="http://jqueryui.com/demos/progressbar" target="_blank">Progressbar</a> <br />
6. <a href="http://www.filamentgroup.com/lab/date_range_picker_using_jquery_ui_16_and_jquery_ui_css_framework/" target="_blank">Date Range Picker</a> <br />
<br />
කොහොමද, හොඳයි නේද? තවත් වැදගත් දෙයක් තමයි මෙව්ව IE 6.0+, FF 2+, Safari 3.1+, Opera 9.0+ සහ Chrome 1.0 ඇතුලු ගොඩක් browsers වල අවුලක් නැතුව වැඩ කරන එක. අපිට වැඩකරන හැටි ඉගෙන ගන්න විස්තර සහිත documentation එකකුත් තියනව. මේ ඔක්කොම දේවල් <a href="http://jqueryui.com/home" target="_blank">මෙතෙන්ට (JQuery UI Home)</a> ගියොත් බලාගන්න පුලුවන්. <a href="http://jqueryui.com/home" target="_blank">මෙතනින්</a> බලාගන්න උදාහරණ ටික. <br />
<br />
Code එක බාගන අපිට ඕන විදිහට වෙනස් කරන්න තමයි තියෙන්නෙ. මේ සටහනනම් ගොඩක් වැදගත් වෙන්නෙ web designing කරන අයට තමයි. තවත් මේ වගේ දේවල් ගැන ඉස්සරහට කියල දෙන්නම්කො. ඔන්න එහෙනම් මම ගියා. ඔබට ජය !Saranga Rathnayakehttp://www.blogger.com/profile/01103209861183518579noreply@blogger.com5tag:blogger.com,1999:blog-5286809515836634600.post-85543083370210797602010-01-01T14:34:00.002+05:302010-01-12T12:31:54.467+05:30ජීවිතේ මුල් වරට - කවි පෙළක් ලිව්ව මං<div style="font-size: large;">ලැබූ නව අවුරුද්ද - ඔබ ඇතුලු සැම දෙනට<br />
සුභම වසරක් වෙන්න - අවසරයි පතන්නට<br />
වෙනසකුත් ඇතිවෙන්න - වසරෙ මුල් සටහනට<br />
අලුත් ලෙසකින් ඔන්න - ලියනවා කියවන්ට<br />
<br />
සින්ඩියට එක්වෙලා - තවම මං මාසයයි<br />
අලුත් දේ කියවලා - දැනගත්තු දේ ගොඩයි<br />
මං ලියපු දේ ගැනත් - ලැබුනු අදහස් ගොඩයි<br />
තවත් දේවල් ගොඩක් - ලියන්නට මට හිතයි<br />
<br />
බ්ලොග් එකට හිතමිතුරො - හැමදාම එක් වෙයන්<br />
ලියන්නට අලුත්දේ - මගෙ හිතට වැටීයන්<br />
ලියපුවා බලන අය - දිනෙන් දින වැඩි වෙයන්<br />
ප්රතිචාර ලියන්නත් - හැමෝටම හිතීයන්<br />
<br />
සමාවෙන්නට ඕන - පාඩමක් නෑ ඕං<br />
අලුත් පාඩම් පෙළක් - ඉදිරියෙදි ගේන්නං<br />
ජීවිතේ මුල් වරට - කවි පෙළක් ලිව්ව මං<br />
ගලපගන කියවාල - හොඳ නරක කිව්වනං<br />
</div>Saranga Rathnayakehttp://www.blogger.com/profile/01103209861183518579noreply@blogger.com12tag:blogger.com,1999:blog-5286809515836634600.post-54629736352663517792009-12-30T15:08:00.003+05:302010-02-06T20:07:38.902+05:30JQuery වලින් ලේසියෙන්ම AJAX ගොඩදාන්නඔන්න 2009 යෙ අන්තිම සටහනින් කියල දෙන්න යන්නෙ JQuery පාඩමක්. කට්ටියට මතකද දන්නෑ මම කලින් JQuery වලට හීනියට වගේ හැඳින්වීමක් දුන්න. කොහෙ මතක හිටින්නද ඔව්ව නේද? <a href="http://sarangasl-si.blogspot.com/2009/12/jquery.html" target="_blank">මෙතනට</a> කොටල ඒක පොඩ්ඩක් බලල හිටියනං.<br />
<br />
<b>අද මොකක්ද කරන්න යන්නෙ ?</b><br />
<br />
අද මම කියල දෙන්න යන්නෙ ඔය Web Site හදද්දි ගොඩක් වෙලාවට කරන්න ඕන වෙන දෙයක් JQuery සහ AJAX පාවිච්චි කරල ලේසියෙන්, ලස්සනට කරගන්න හැටි. මෙහෙමයි සිද්දිය, පහල තියන රූපෙ බලල ඉන්නකො.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZwXQJIPUWx4EyvjaP_My5JAjqTEe43sM8tYoZNiKSymab5L1OwJWrOFMmPeXn4FLgF1Etnx9n4fhP5LVAgJOUyzkI6kdc5yW8Oixxty3UA-VmJ4p-ex9-ua98AGSQG1HRobQEJAar7dE/s1600-h/layout.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZwXQJIPUWx4EyvjaP_My5JAjqTEe43sM8tYoZNiKSymab5L1OwJWrOFMmPeXn4FLgF1Etnx9n4fhP5LVAgJOUyzkI6kdc5yW8Oixxty3UA-VmJ4p-ex9-ua98AGSQG1HRobQEJAar7dE/s320/layout.JPG" /></a><br />
</div><br />
දැනට හිතන්නකො ඔය තියෙන්නෙ අපේ Web Site එකේ සැළැස්ම කියල. හිතන්න ඔය "C" කියන කොටසෙ තියන links වලට කොටපුවාම "B" කොටසෙ තියන "main" කියන div එකේ වෙනස් වෙනස් දේවල් පෙන්වගන්න ඕන වෙනව කියල. තේරුණාද මන්ද? සිංහලෙන්ම කියනවනම් links click කළාම main div එකට load කරන content එක වෙනස් කරන්න ඕන කියල. දැන් තේරෙන්න ඇතිනෙ.<br />
<br />
ඔය වැඩේ කරගන්න අපි වෙනම pages හදල links වලට කොටද්දි එව්ව load කරන්න ගියොත් අපරාදයක් වෙනව. මොකද එතකොට "A" සහ "C" කියන කොටස් වල තියන දේවලුත් නිකන් බොරුවට ආයෙමත් load කරන්න වෙනව. ඔන්න ඕක හින්ද තමයි අපි AJAX පාවිච්චි කරන්නෙ. එතකොට page refresh එකක් නැතිවම අපිට පුලුවන් ඕන කරන වැඩේ කරගන්න.<br />
<br />
<b>කොහොමද කරන්නෙ ?</b><br />
<br />
මෙහෙමයි, මුලින්ම මම විස්තර කරන්න යන උදාහරණෙ බාගන්නකො. <br />
<br />
<div style="background-color: #ffe599;"><a href="http://www.4shared.com/file/184577187/cc718b73/JQuery_AJAX.html" target="_blank">http://www.4shared.com/file/184577187/cc718b73/JQuery_AJAX.html</a><br />
Password : sara<br />
<br />
Live Demo : <a href="http://sarangasl.webuda.com/jquery/jquery_ajax/" target="_blank">මෙතන</a><br />
</div><br />
ඕක මම හදපු පොඩි උදාහරණයක්. බාගත්තු එකේ තියන code කෑලි තමයි මම විස්තර කරන්න යන්නෙ. කෝකටත් කලින් index.html file එක browser එකේ open කරල බලන්නකො. පහළ තියන රූපෙ වගේ එකක්නෙ එන්නෙ.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmT20tmJcUPrrzUDwjODDUtZKwvggJPXq5g_Ew9w7nbvgeUDWbi200WgDnw6qhhiENSM-Ucifi8HN7b0_8dDS_Q-Tv5nprj37zbkZn_OqZAl4FGAS320kwmPfWO05TW8O4v6fyoapM4EU/s1600-h/view.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmT20tmJcUPrrzUDwjODDUtZKwvggJPXq5g_Ew9w7nbvgeUDWbi200WgDnw6qhhiENSM-Ucifi8HN7b0_8dDS_Q-Tv5nprj37zbkZn_OqZAl4FGAS320kwmPfWO05TW8O4v6fyoapM4EU/s320/view.JPG" /></a><br />
</div><br />
ඔයාලට පේනව නේද "Home", "About" සහ "Contact Us" කියල links තුනක්. එව්වට කොටල බන්නකො වෙනස් වෙන හැටි. අන්තිම එකේ තියන අවුල දැනට ගනන් ගන්න එපා. මම ඔය උදාහරණෙ හැදුවෙ අර උඩින් ව්ස්තර කරපු සිද්දියට අදාලව. දැන් අපි බලමු code එක. index.html file එක ඔයාලඟ තියන text editor එකෙන් open කරගන්නකො. මුලින්ම බලන්න ඒකෙ තියනව නේද කියල මේ පහළ තියනව වගේ code කෑල්ලක්. <br />
<br />
<div class="sourcecode"><script src="jquery-1.3.1.min.js" type="text/javascript" ></script><br />
</div><br />
අන්න ඒකෙන් තමයි මම JQuery link කරල තියෙන්නෙ. සාමාන්ය JavaScript එකක් link කරන විදිහටම තමයි. ඊළඟට බලන්න මේ පහළ තියන JavaScript කෑල්ල තියනව නේද කියල.<br />
<script class="brush: js;wrap-lines: false; highlight: [3,5,9,23]" type="syntaxhighlighter">
<![CDATA[
$(document).ready(function() {
//$("#main").load("home.html");
$("#link1").click(function(){
$("#main").load("home.html");
});
$("#link2").click(function(){
$.ajax({
url: "about.html",
cache: true,
beforeSend: function(){
$("#main").slideUp("fast");
},
success: function(html){
$("#main").slideDown("slow");
$("#main").html(html);
}
});
});
$("#link3").click(function(){
$.post("boo.php", { link_id:"link3" },
function(data){
$("#main").html(data);
});
});
});
]]>
</script><br />
අපි ලියන හැම event එකක්ම ලියන්න ඕන <a href="http://docs.jquery.com/Tutorials:Introducing_$%28document%29.ready%28%29" target="_blank">$(document).ready කියන function</a> එක ඇතුලෙ. ඒකයි එහෙම එකක් තියෙන්නෙ හොඳද. ඔතන මම කරල තියෙන්නෙ අපේ තියන links වලට id දීල එව්වල click event වලට function ලියල තියන එක. මම ඔතනදි එකම වැඩේ කරගන්න ක්රම තුනක් තමයි පෙන්නල තියෙන්නෙ.<br />
<br />
මුලින්ම බලන්න 5 වෙනි පේළිය, ඒකෙන් තමයි මම "Home" කියන link එක click කරද්දි ( id එක "link1" ) home.html file එක main div එකට load කරන්නෙ. ඔය තමයි සරළම විදිහට JQuery වලින් AJAX request එකක් කරන. ඊලඟට බලන්නකො 9 වෙනි පේළිය, ඒකෙන් "About" කියන link එක click කරද්දි ( id එක "link2" ) about.html file එක main div එකට load කරනව. <br />
<br />
හැබැයි මේක කලින් එකට වඩා වෙනස්, අපිට පුලුවන් එක එක effects දාල ලස්සන කරගන්න. beforeSend සහ success කියන functions ඇතුලෙ තමයි එව්ව ලියන්න ඕන. දාන්න පුලුවන් effects ගැන <a href="http://docs.jquery.com/Effects" target="_blank">මෙතනින් </a>බලන්නකො. දැන් 3 වෙනි පේළිය බලන්න, ඒක මම comment කරලනෙ තියෙන්නෙ. ඒකෙ comment නැතිකලොත් page එක load වෙද්දිම main div එකට home.html file එක load වෙනව. කට්ටියට තේරෙනවද මන්ද කියන එව්ව.<br />
<br />
අන්තිමටම 23 වෙනි පේළිය, ඒකෙ කරල තියෙන්නෙ වෙනස්ම දෙයක්. ඒකෙදි මම data අරගන තියෙන්නෙ boo.php කියන php file එකෙන්. වැඩිය අමාරු නෑ, පොඩ්ඩක් බලපුවාම වැඩේ තේරෙයි. ඕක හරි විදිහට වැඩ කරන්නනම් XAMPP වගේ PHP තියන server එකක run කරල බලන්න ඕන. <br />
<br />
ඔන්න එහෙනම් දැන් JQuery වලින් AJAX ගොඩදාන එක ගේමක් නෙවෙයිනෙ. කරලම බලන එක තමයි වඩාත් හොඳ. අවුල් තියනවනම් අහන්නකො. කියවල බලල ප්රතිචාරයක් දෙන්නත් අමතක කරන්න එපා. ඉවර කරන්න කලින් ප්රාර්ථනා කරනව 2010 අවුරුද්ද අපි හැමෝටම සුභම සුභ එකක් වේවා කියල. ඔබට ජය !Saranga Rathnayakehttp://www.blogger.com/profile/01103209861183518579noreply@blogger.com10tag:blogger.com,1999:blog-5286809515836634600.post-69443536084876415822009-12-29T11:22:00.000+05:302009-12-29T11:35:05.405+05:30LinkWithin, ලියන සටහන් කියවන අයට පේන්න තියන්නබ්ලොග් ලියන කවුරුත් වගේ දන්නවනෙ ඉතින් ලෝකෙ නැති වැඩ අස්සෙ වෙලාවක් හොයාගන අලුත් සටහනක් බ්ලොග් එකට ලියල දාන්න තියන අමාරුව. හැබැයි ඉතින් ඒ දාපු සටහන කියවල කට්ටිය දෙන ප්රතිචාර කියවද්දි දැනන සතුටත් වචන වලින් කියන්න බැරි තරම්. අද මම කියන්න යන්නෙ අපි අමාරුවෙන් ලියන සටහන ගොඩක් කියවන කට්ටිය අතරට යවාගන්න පාවිච්චි කරන්න පුලුවන් පොඩි ගැජට් එකක් ගැන. <br />
<br />
මේකට කියන්නෙ LinkWithin කියල. ගොඩක් කට්ටිය නම කියපු ගමන් දන්නව ඇති. තවමත් මේ ගැජට් එක දාගන නැති කට්ටියට කියන්නම්කො විස්තරේ. මේකෙන් වෙන්නෙ අපි ලියන සටහන යටින් තවත් අපි කලින් ලියපු සටහන් ටිකක් එව්වගෙ තියන පින්තූරෙකුත් එක්ක ලස්සනට පෙන්වන එක. පහළ තියන රූපෙ බැලුවොත් සිද්දිය පැහැදිළි වෙයි.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHh4MzpditXb6o8xQp5d8rztvjgZ_tGsRjcaKcuxdb4L-8n3Wq4qQS9lNdXlmrpZJowtyKgnQAs-fTaR-_mDCpnX2WpljYdHTOBif6nMhXhwWVU9pfjDY6HG02pPlvCUPNJUxqF_Km7z0/s1600-h/related.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHh4MzpditXb6o8xQp5d8rztvjgZ_tGsRjcaKcuxdb4L-8n3Wq4qQS9lNdXlmrpZJowtyKgnQAs-fTaR-_mDCpnX2WpljYdHTOBif6nMhXhwWVU9pfjDY6HG02pPlvCUPNJUxqF_Km7z0/s320/related.jpg" /></a><br />
</div><br />
මේ ගැජට් එක free එකක්, ඒ වගේම මේක අපේ බ්ලොග් එකට දාගන්න ලොකු ගේමක් දෙන්න ඕනත් නෑ. Register වෙන්න ඕනත් නෑ. ඔයාට කරන්න තියෙන්නෙ බ්ලොග් එකට ලොග් වෙලා <a target="_blank" href="http://www.linkwithin.com/learn">මෙතනට (LinkWithin Site)</a> ගිහින් ගැජට් එක දාගන්න එක විතරයි. <br />
<br />
ඔයාගෙ බ්ලොග් එක Blogger බ්ලොග් එකක්නම් දැම්මට පස්සෙ Layout page එකට ගිහිල්ල Blog Posts කියන Gadget එකට යටින් මේ අලුත් Gadget එක දාන එක තමයි ගොඩක් හොඳ. හැබැයි ඒකෙ default title එක එන්නෙ "You might also like:" කියල. ඒක සිංහලෙන් දාන්නනම් පහළ තියන code එක Gadget එකේ edit mode එකට ගිහින් paste කරන්න. රූපෙ බැලුවොත් පැහැදිළි වෙයි.<br />
<br />
<div class="sourcecode"><script>linkwithin_text='මෙව්වත් කියවල බලන්න :'</script><br />
</div><br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDOOdP02W8Q5suo2W4QivwRGky1S3P4xhFWbv8zfmpuJCt9Ok6kIoNZk8CEuC6a3UmcvORlKnw8osa9abInHor9GOhKzfUVUj2VAYLHrsbN73vjOrXb_R2QVRxXKrXAedFlIezCeTLsOY/s1600-h/edit_mode.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDOOdP02W8Q5suo2W4QivwRGky1S3P4xhFWbv8zfmpuJCt9Ok6kIoNZk8CEuC6a3UmcvORlKnw8osa9abInHor9GOhKzfUVUj2VAYLHrsbN73vjOrXb_R2QVRxXKrXAedFlIezCeTLsOY/s320/edit_mode.JPG" /></a><br />
</div><br />
ප්රශ්ණ තියනවනම් ඒ කට්ටියගෙන්ම අහන්නත් පුලුවන්. දාල බලල අල්ලන්නෙ නෑ වගේනම් අයින් කරල දාන්න තියෙන්නෙ. කෝකටත් දාගනම බලන්නකො. එහෙනම් සටහන මෙතනින් ඉවරයි. ඔබට ජය !Saranga Rathnayakehttp://www.blogger.com/profile/01103209861183518579noreply@blogger.com24tag:blogger.com,1999:blog-5286809515836634600.post-64267332366535284932009-12-28T11:21:00.000+05:302009-12-28T15:20:23.116+05:30Blogger බ්ලොග් එකට නිවැරදිව META Tag දාමුමට මේ සටහන ලියන්න හිතුනෙ <a href="http://sarangasl.blogspot.com/" target="_blank">මගෙ කඩ්ඩ බ්ලොග් එකට</a> META Tag දාන්න ගිහින් වෙච්ච අකරතැබ්බියක් හින්ද. මුලින්ම කියන්න ඕන අද තියන Search Engine ඔය META Tag වල එන "Keywords" Tag එක ගැන එච්චර උනන්දුවක් නෑ කියල. "Description" tag එකේ තියන එකනම් search result වල result එකට යටින් පෙන්නනව දැකල තියනව. <br />
<br />
මමත් ඉතින් ඔන්න ඔහෙ ඕන එකක් කියල බ්ලොග් එකට META Tag දැම්ම. මෙන්න ටික දවසකින් බලද්දි Webmaster Tools වල HTML suggestions ඇවිල්ල. Duplicate meta descriptions තියනව, එව්ව අයින් කරගන්න කියල තමයි කියන්නෙ. මදැයි වැඩි හොඳට කියල META Tag දාන්න ගියා. පහල තියන රූපෙ බලන්නකො මට වෙච්ච දේ බලාගන්න. <br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhp2XG6m96y8SGu8wHAqrEYpxEuzOVirbOytuzpkXP4bArVUlDuAthS3Hsn4v7vQBZ9bN2xzHHUTLZCLYaJ-mpY6YvYM2jd6XpYWh4VhVoY54EwCDegRiVjE3SwqZ0WPqIVeH0_hem5oPA/s1600-h/duplicate.GIF" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhp2XG6m96y8SGu8wHAqrEYpxEuzOVirbOytuzpkXP4bArVUlDuAthS3Hsn4v7vQBZ9bN2xzHHUTLZCLYaJ-mpY6YvYM2jd6XpYWh4VhVoY54EwCDegRiVjE3SwqZ0WPqIVeH0_hem5oPA/s320/duplicate.GIF" /></a><br />
</div><br />
පොඩ්ඩක් හොයල බලද්දි හොයාගන්න පුලුවන්වුනා අවුලක් වෙන්නෙ නැතිවෙන්න META Tag දාන්න විදිහක්, කට්ටියටම දැනගන්න මුල ඉඳන්ම කරන හැටි කියන්නම්කො.<br />
<br />
1. මුලින්ම dashboard එකට ලොග් වෙලා "Layout --> Edit HTML" යන්න. එතකොට එන්නෙ පහල තියන රූපෙ වගේ එකක්නෙ, ඒකෙන් හොයාගන්න <b:include data='blog' name='all-head-content'/> තියන තැන. ඒහ තියෙන්නෙ <head > tag එකයි </head> tag එකයි මැද්දෙ හොඳද. Ctrl + F පාවිච්චිකරල හෙව්වනම් ලේසියෙන්ම හොයාගන්න පුලුවන්.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgF4gIGQbFsYweVZOzvHRT-9JctjD8SS8rrvU7AhNBHkXRqkcHMr5WGG5ISPrbu7CaCa5qLGesHzYe2nzQN2liiLEFe1IONV94Uc37ystXDUFUTnrcUtn91FPRLIGFyEFCp1p0EJtOQO4k/s1600-h/edit_html.GIF" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgF4gIGQbFsYweVZOzvHRT-9JctjD8SS8rrvU7AhNBHkXRqkcHMr5WGG5ISPrbu7CaCa5qLGesHzYe2nzQN2liiLEFe1IONV94Uc37ystXDUFUTnrcUtn91FPRLIGFyEFCp1p0EJtOQO4k/s320/edit_html.GIF" /></a><br />
</div><br />
2. දැන් අර හොයාගත්තු එකට පහලින් මෙන්න මේටික paste කරන්න. වෙනසක් කරන්න කලින් ඔයාගෙ දැනට තියන template එකේ backup එකක් ගන්නත් අමතක කරන්න එපා හොඳද.<br />
<br />
<div class="sourcecode"><b:if cond='data:blog.url == data:blog.homepageUrl'><br />
<meta content='මෙතන description එක දාන්න' name='description'/><br />
<meta content='මෙතන keywords දාන්න' name='keywords'/><br />
<meta content='මෙතන ඔයාගෙ නම ඇතුලත් කරන්න' name='author'/><br />
</b:if><br />
</div><br />
මෙතනදි කරල තියෙන්නෙ අපේ home page එකට විතරක් keywords සහ description එක දාන එක. Description එක ඇතුලත් කරද්දි අකුරු 200 කට වඩා දිග එකක් නොදෙන තරමට තමයි වඩා හොඳ. Keywords දෙද්දිත් 20 කට වඩා දෙන්න ඕන නෑ. එකම වචනෙ තුන් පාරකට වඩා දෙන එකත් ඇඟට ගුන නෑ. <br />
<br />
වැඩේ ඉවර උනාට පස්සෙ save කරන්න. අවුලක් නෑ නේද? තියනවනම් අහන්න ඕන හොඳද. කියවල ඉවර වෙලා පහල තියන කොටුවෙ මොනවහරි ලියල යන්නත් අමතක කරන්න එපා. ඔබට ජය !Saranga Rathnayakehttp://www.blogger.com/profile/01103209861183518579noreply@blogger.com6tag:blogger.com,1999:blog-5286809515836634600.post-22064875236518369212009-12-27T10:13:00.001+05:302010-01-12T12:31:05.704+05:30JQuery, පොඩ්ඩක් ලියල වැඩ ගොඩක් දාන්නනත්තලුත් ඉවරයි, දැන් ඉතින් ආයෙත් වැඩ. අද මම කියන්න යන්නෙ Web Site හදන අයට ගොඩක් වැදගත් වෙන දෙයක් ගැන. හැමෝම දන්නව ඇතිනෙ JavaScript ගැන. අපිට ගොඩක් වෙලාවට JavaScript වලින් එක ඒක ජාතියෙ වැඩ කරගන්න පුලුවන්නෙ. JQuery කියන්නෙත් අන්න ඒ වගේ JavaScript Library එකක්. මෙතනදි තියන විශේෂත්වය තමයි JQuery පාවිච්චි කරල අපිට පුලුවන් පොඩි code කෑල්ලක් ලියල ලොකු වැඩක් කරගන්න.<br />
<br />
ඊලඟට තියන වැදගත්ම දේ තමයි මේක free and open source වීම. ඇත්තටම අද වෙනකොට JQuery ලෝකෙ තියන ජනප්රියම JavaScript Library එක වෙලාතියනව, ඒකට මෙන්න මේ දේවල් උදව් වෙලා තියනව.<br />
<br />
1. Lightweight - Link කරන්න ඕන file එක 19KB තරම් කුඩා එකක් වීම.<br />
2. Cross-browser - දැනට තියන ඕනැම browser එකක අවුලක් නැතිව වැඩ කිරීම.<br />
3. CSS3- Compliant - CSS අනුකූලතාවය.<br />
<br />
JQuery පාවිච්චි කරල අපිට Document Navigating, DOM Element Selecting , Creating Animations, Event Handling සහ Ajax Development වගේ දේවල් ගොඩාක් ලේසියෙන්ම කරගන්න පුලුවන්. වැඩි කතා ඕන නෑ, මේ උදාහරණ ටික බලන්නකො.<br />
<br />
1. <a href="http://visionmasterdesigns.com/demo/ajaxinterface/" target="_blank">AJAX Interface using JQuery/PHP</a><br />
2. <a href="http://sixrevisions.com/demo/slideshow/final.html" target="_blank">Create an Accessible Slideshow Using jQuery</a><br />
3. <a href="http://www.queness.com/resources/html/slideshow/jquery-slideshow.html" target="_blank">JQuery Photo Slider with Semi Transparent Caption</a><br />
4. <a href="http://valums.com/wp-content/uploads/2009/04/menu/final.htm" target="_blank">Create a Vertical Scrolling Menu with Tooltips</a><br />
<br />
ඔය තියෙන්නෙ කරගන්න පුලුවන් වැඩ වලින් චූට්ටක් විතරයි. ඔය හැම දෙයක්ම කරගන්න අපිට කරන්න තියෙන්නෙ එක JavaScript file එකක් අපේ site එකට link කරගන්න විතරයි. <a href="http://jquery.com/" target="_blank">JQuery site එකට</a> ගිහින් ඒක බාගන්න පුලුවන්. තව උදාහරණ ගොඩක් <a href="http://docs.jquery.com/Tutorials" target="_blank">මෙතනින්</a> බලාගන්න පුලුවන්. මුලින්ම <a href="http://docs.jquery.com/Tutorials:How_jQuery_Works" target="_blank">මේක</a> බලල ඉන්න එක තමයි වඩා හොඳ.<br />
<br />
එහෙනම් මේ සටහනත් ඉවරයි. ඉස්සරහට කියන්නම්කො JQuery පාවිච්චි කරල කරල තියන තවත් වැඩ. ඔන්න කියවල බලල ප්රතිචාරයක් දෙන්නත් අමතක කරන්න එපා හොඳද. ඔබට ජය !Saranga Rathnayakehttp://www.blogger.com/profile/01103209861183518579noreply@blogger.com11tag:blogger.com,1999:blog-5286809515836634600.post-31853991491268056612009-12-24T10:32:00.001+05:302010-01-12T12:29:54.467+05:30Admin බලතල නැතුව Portable Firefox වලට Flash Player දාමුඅදත් මම කියල දෙන්න යන්නෙ පොඩි වැඩක් කරන හැටි, හැබැයි වැඩේ පොඩි උනාට සමහර වෙලාවට ගොඩක් ප්රයෝජනවත්. මේක මට හම්මවුනේ lab එකට වෙලා FaceBook එකේ රස්තියාදු ගහන වෙලාවක. මෙහෙමයි සිද්දිය. <br />
<br />
ඒ දවස්වල මට Barn Buddy උණ තිබිච්ච කාලෙ. පොඩි වෙලාවක් හම්බෙච්ච ගමන් කරන්නෙ හොරකමේ යන එක. ඔන්න ඉතින් වෙලාවක් හොයාගන lab එකට ආව පලදාව නෙලාගන්න කියල. කොහෙ නෙලන්නද, මෙන්න කියනව Flash Player එක update කරගන්න කියල. අපිට ඉතින් මෙව්වගෙ admin බලතල නැති හින්ද ඒ වැඩේ හරියන්නෙ නෑනෙ, ඕකට විසඳුමක් හොයද්දි තමයි මට Portable Firefox මතක් උනේ. ඔය වගේ වෙලාවට ඉතින් අපි කාගෙත් පිහිටට ඉන්නෙ Google නෙ. Google ගෙන් අහපුවාම ගොඩදාගන්න විදිහක් හම්බ වුනා. කට්ටියටම දැනගන මම පියවරවල් ටික කියන්නම්කො. හැම දෙනාටම තේරෙන විදිහට ගොඩක් සරළවම කියන්නම්.<br />
<br />
1. මුලින්ම <a href="http://portableapps.com/apps/internet/firefox_portable" target="_blank">මෙතනින්</a> Portable Firefox බාගන install කරගන්න. Admin බලතල නැත්නම් ගොඩක් වෙලාවට C: drive එකට install කරන්න දෙන්නෙ නෑ. එහෙම උනොත් වෙන drive එකකට හරි pen එකකට හරි තමයි install කරන්න වෙන්නෙ.<br />
<br />
2. ඊට පස්සෙ <a href="http://fpdownload.macromedia.com/get/flashplayer/xpi/current/flashplayer-win.xpi">මෙතන</a> Right Click කරල "Save Link As" දීල කොහෙ හරි ඉඩ තියන තැනකට බාගන්න.<br />
<br />
3. දැන් අර "Save Link As" කියල දීල බාගත්තු එකේ අගට ඇත්තෙ .xpi කියල, ඒක .zip කියල වෙනස් කරන්න. අගට තියන .xpi පෙන්නන්නෙ නැත්නම් Folder Option වල View Tab එකට ගිහින් "Hide extensions for known file types" කියන එක ඉස්සරහින් තියන Mark එක අයින් කරන්න. එතකොට පෙනෙයි. <br />
<br />
4. දැන් WinZip හරි WinRAR හරි පාවිච්චිකරල ඒක extract කරගන්න, ඒක ඇතුලෙ ඇති <b>flashplayer.xpt</b> සහ <b>NPSWF32.dll</b> කියල file දෙකක්. අන්න ඒ දෙක copy කරගන්න.<br />
<br />
5. දැන් Portable Firefox install වෙලා තියන තැනට යන්න. ඒකෙ App කියන folder එක ඇතුලෙ Firefox කියල තවත් folder එකක් ඇති, ඒකට ගියහම plugins කියල folder එකක් හොයාගන්න පුළුවන් වෙයි, අන්න ඒක ඇතුලට copy කරගත්තු files දෙක paste කරන්න.<br />
<br />
දැන් වැඩේ ඉවරයි, Portable Firefox restart කරල බලන්නකො. පොතේ හැටියටනම් ගොඩ ගිහින් තියෙන්න ඕන. අවුල් තියනවනම් අහන්නකො. එහෙනම් මේ සටහන දැන් ඉවර කරන්නයි යන්නෙ. කියවල බලල ප්රතිචාරයක් දෙන්නත් අමතක කරන්න එපා හොඳද. ඔබට ජය !Saranga Rathnayakehttp://www.blogger.com/profile/01103209861183518579noreply@blogger.com9tag:blogger.com,1999:blog-5286809515836634600.post-66440956962631817112009-12-23T15:44:00.001+05:302010-01-12T12:29:26.882+05:30Virus වලින් සැඟවුන Folders ගොඩගන්න හැටිWindows ඉතින් virus අතින් ගත්තහම අලනෙ. මේ කියන්න යන්නෙත් ඒ වගේ virus ඒකක් හින්ද වෙන්න ගිය ඇබැද්දියක් ගැන. අපිට ඉතින් campus ඒකේ තියනවනෙ නානාප්රකාර assignments. කීයක් තිබ්බත් ඔක්ක්කොම කරන්න මතක් වෙන්නෙ අන්තිම මොහොතෙ තමයි. <br />
<br />
වෙනද වගේම කලින් දවසෙ රෑ දඩ බඩ ගාල assignment එක ඉවර කරල pen drive එකට දාගත්ත copy එකක්. පහුවදා උදේ lab එකට ගියා upload කරන්න කියල හිතාගන. ගිහිල්ල pen එක ගහපුවාම ඒකෙ තිබිච්ච එක folder එකකටවත් වෙච්ච දෙයක් නෑ. මගෙ assignment එක තිබුනෙත් folder එකක් ඇතුලෙ. මට හොඳටම sure මම කලින් දවසෙ ඒක pen එකට දැම්ම කියලත්.<br />
<br />
Virus වල රාජකාරි දන්න හින්ද මට තේරුනා එහෙම වෙච්ච වැඩක් තමයි කියල. කෝකටත් කියල Folder Option යන්න බලද්දි ඒ option එකත් අතුරු දහන්. අහල පහල තිබ්බ computer වලත් Folder Option අතුරුදහන්. එව්වත් ඉතින් virus වල වැඩම තමයි. මෙව්වගෙ admin බලතලත් අපිට නැති එකේ Folder Option ගොඩ දාන එක පැත්තකින් තියල මම assignment එක ගොඩ ගන්න විදිහක් කල්පනා කෙරුව, මොකද දැන්ම upload කලේ නැත්නම් late submission, එහෙම වෙලා හම්බෙන ලකුණු ටිකෙනුත් තව කීයක් හරි කැපුනොත් ඉතුරු වෙන්න දෙයක් නෑ. ඔහොම කල්පනා කරනකොට තමයි මට මතක් උනේ <a href="http://www.computerhope.com/attribhl.htm">"attrib" command</a> එක. ඒ command එකෙන් අපිට පුලුවන් Command Prompt පාවිච්චි කරල files සහ folders වල උපලක්ෂණ (attributes) වෙනස් කරන්න. මෙහෙමයි කරන පිළිවෙල,<br />
<br />
Command Prompt එක open කරගන පහල තියන command ටික එකින් එක දෙන්න. මෙතන මම උපකල්පනය කරල තියනව pen එකේ letter එක "G" කියල ( දෙවෙනි පේළිය ), එතනට දෙන්න ඕන ඔයාගෙ pen එකට දැනට පෙන්වන letter එක.<br />
<br />
<div class="sourcecode" style="font-family: "Courier New",Courier,monospace;">cd\<br />
G:<br />
attrib -r -s -h /s /d<br />
</div><br />
වැඩේ ඉවර වෙලා බලද්දි මෙන්න අර හැන්ගිලා තිබිච්ච folders ටික උඩට ඇවිල්ල. මම දඩ බඩ ගාල assignment එක upload කරල දැම්ම, නැත්නම් ඉතින් sorry තමයි. මේ වැඩේ ඉතින් හැමදාමත් කරන්න බෑනෙ, අනික සමහර computers වල Command Prompt එකත් අල. ඒක හින්ද මම හදාගත්ත .bat file එකක්. ඒක pen එකේ දාල තියාගත්තහම folders hide වෙලානම් .bat file එක double click කරන්න විතරයි තියෙන්නෙ. මෙහෙමයි bat file එක හදාගන්න පිළිවෙල,<br />
<br />
1. මුලින්ම අලුත් Text Document එකක් හදාගන්න, ඒකට මේ පහල තියන පේළි ටික paste කරල save කරගන්න.<br />
<br />
<div class="sourcecode" style="font-family: "Courier New",Courier,monospace;">@echo Searching for hidden files...<br />
@attrib -r -s -h /s /d<br />
@echo All Done<br />
@pause<br />
</div><br />
2. ඊට පස්සෙ අග තියන .txt කියන එක .bat විදිහට වෙනස් කරන්න. දැන් හදා ගත්තු file එකේ copy එකක් pen එකේ folders වලින් පිට තියා ගන්න. එතකොට කොයි වෙලේ හරි folders hide උනොත් ලේසියෙන්ම ගොඩ ගන්න පුලුවන්. <br />
<br />
මටනම් මේක ගොඩක් වෙලාවට ප්රයෝජනවත් වෙනව. මොකද ගොඩක් වෙලාවට වැඩ කරන්නෙ lab එකේ හින්ද virus වලින් නිතරම pen එකට කරදර හිරිහැර වෙනව. මම හිතනව ඔයාලටත් ප්රයෝජනවත් වෙයි කියල. එහෙනම් ඉතින් මේ සටහන මෙතනින් ඉවරයි. ඔබට ජය !Saranga Rathnayakehttp://www.blogger.com/profile/01103209861183518579noreply@blogger.com10tag:blogger.com,1999:blog-5286809515836634600.post-54136339852990163072009-12-23T10:31:00.001+05:302010-01-12T12:28:51.427+05:30Windows මකපු GRUB2 ගොඩදැමීම ( බාගෙට )කට්ටියට මතකයිනෙ මට වෙච්ච ඇබැද්දිය, Ubuntu 9.10 තිබිච්ච මැසිමට Windows XP_sp2 දාන්න ගියාම GRUB එක load වෙන්නෙ නැතුව ගියානෙ. Ubuntu 9.10 වල තියෙන්නෙ GRUB2 හින්ද පරන විදිහට ගොඩයන්නත් බෑනෙ. මම ඉතින් මගෙ දුක කියල දාපු <a href="http://sarangasl-si.blogspot.com/2009/12/grub-setup-in-ubuntu-9.html">මේ සහහනට</a> ගොඩක් අය ප්රතිචාර දක්වල තිබුන. ඒ හැමෝටම ගොඩක් ස්තූතියි. ඒ ප්රතිචාර වල තිබිච්ච දේවල්වලයි Google ගෙයි සරණයි කියල හිතාගන මම ඊයෙ රෑම වැඩේට බැස්ස.<br />
<br />
මම ටිකක් රෑ වෙලා තමයි වැඩේ පටන් ගත්තෙ. එක එක ජාතියෙ forum , web site වල රස්තියාදු වෙලා ඒ වෙනකොටත් හොඳ පන ගිහින් තිබුනෙ. කොහොම හරි අන්තිමට මේ පහල තියන විදිහට errors නැතිව GRUB එක ආයෙ දාගන්න පුලුවන් උනා. බලන්නකො විස්තරේ, මම ඉතින් Ubuntu වලට අලුත් හින්ද සමහර දේවල් නම් වැඩිය තේරුනේ නෑ.<br />
<script type="syntaxhighlighter" class="brush: text; wrap-lines: false;highlight: [4,5,21,22,23,24,25,26,33,41,43,44,45,46]"><![CDATA[
To run a command as administrator (user "root"), use "sudo <command>".
See "man sudo_root" for details.
ubuntu@ubuntu:~$ sudo bash
root@ubuntu:~# fdisk -l
Disk /dev/sda: 82.3 GB, 82348277760 bytes
255 heads, 63 sectors/track, 10011 cylinders
Units = cylinders of 16065 * 512 = 8225280 bytes
Disk identifier: 0x31853184
Device Boot Start End Blocks Id System
/dev/sda1 * 1 1594 12803773+ c W95 FAT32 (LBA)
/dev/sda2 1595 2550 7679070 c W95 FAT32 (LBA)
/dev/sda3 2551 10011 59930482+ f W95 Ext'd (LBA)
/dev/sda5 2551 4144 12803773+ 7 HPFS/NTFS
/dev/sda6 4145 5053 7301511 83 Linux
/dev/sda7 5054 5100 377496 82 Linux swap / Solaris
/dev/sda8 5101 7650 20482843+ 7 HPFS/NTFS
/dev/sda9 7651 10011 18964701 7 HPFS/NTFS
root@ubuntu:~# mount /dev/sda6 /mnt
root@ubuntu:~# mount --bind /dev /mnt/dev
root@ubuntu:~# mount --bind /proc /mnt/proc
root@ubuntu:~# chroot /mnt
root@ubuntu:/# nano -w /etc/default/grub
root@ubuntu:/# grub-install /dev/sda
Installation finished. No error reported.
This is the contents of the device map /boot/grub/device.map.
Check if this is correct or not. If any of the lines is incorrect,
fix it and re-run the script `grub-install'.
(hd0) /dev/sda
root@ubuntu:/# grub-install --recheck /dev/sda
Installation finished. No error reported.
This is the contents of the device map /boot/grub/device.map.
Check if this is correct or not. If any of the lines is incorrect,
fix it and re-run the script `grub-install'.
(fd0) /dev/fd0
(hd0) /dev/sda
root@ubuntu:/# exit
exit
root@ubuntu:~# umount /mnt/dev
root@ubuntu:~# umount /mnt/proc
root@ubuntu:~# umount /mnt
root@ubuntu:~# reboot
]]></script><br />
ඊට පස්සෙ මම මැසිම reboot වෙනකන් බලාගන හිටිය. හෙට උදේට වැඩට යන්නත් ඕන හින්ද වැඩේ හරි ගියෙ නැත්නම් පස්සෙම කරනව කියල හිතාගත්ත. මොකද ඒ වෙනකොට රෑ 12 ත් පැනල. මම නිදි මතේ monitor එක දිහාබලාගන ඉද්දි මෙන්න බොලේ GRUB එක load උනා, මට මාර happy. මොකද අමාරුවෙන් වැඩක් ගොඩ දම්මම මාර ආතල් එකක් එක්නවනෙ. නිදි මතත් කොහේ ගියාද නෑ. ඊට පස්සෙ දඩබඩ ගාල Ubuntu වලට ගිහින් බැලුව වැඩද කියල, බබා වගේ වැඩ.<br />
<br />
දැන් කට්ටිය බලනව ඇති වැඩනම් මොකද මේ සටහනේ මාතෘකාවෙ බාගෙට කියල කෑල්ලක් දාල තියෙන්නෙ කියල. දැන් තමයි හොඳම හරිය, මට අමතක උනානෙ XP වැඩද කියල බලන්න. ඒකත් බලන්න ඕන හින්ද තව පාරක් boot කලා. List එකෙන් Windows තෝරල enter ගහපු ගමන් ආවෙ මේ පහල තියනව වගේ error එකක්.<br />
<div class="sourcecode">error : No such device 26856233...<br />
<br />
Press any key to continue ...<br />
</div>කට්ටියට මතකයිනෙ මේක අපේ Hostel Room එකේ මැසිම. දැන් ඉතින් අද හවසට හොඳට අහගන්න පුලුවන්. තවම කවුරුත් දන්නෙ නෑ සිද්දිය. කමක් නෑ මමත් වැඩේ අත හරින්නෙ නෑ. මේ වගේ case එකක් ගොඩදාපු කෙනෙක් ඉන්නවනම් කියන්න ඕන හොඳද. මේ සටහනත් මෙතනින් ඉවරයි. ඔබට ජය !Saranga Rathnayakehttp://www.blogger.com/profile/01103209861183518579noreply@blogger.com3tag:blogger.com,1999:blog-5286809515836634600.post-7838575013320265762009-12-22T11:55:00.001+05:302010-01-12T12:27:46.150+05:30Ubuntu 9.1 ආගිය අතක් නැත, සොයාදෙන්නමම මගෙ මැසිමට Ubuntu 9.1 සහ Windows_XP_sp2 දෙකම දාලයි තිබුනෙ. Windows වලට virus එකක් ගිහින් ගොඩගන්න බැරිම තැන ලඟදි format පාරක් දැම්ම. <br />
<br />
කලිනුත් Ubuntu තියෙද්දි Windows තිබිච්ච drive එක format කරල GRUB එක ආයෙත් setup කලහම ගොඩ ගිය හින්ද මේපාරත් Ubuntu Live CD එක දාල වැඩේට බැස්ස.<br />
<br />
වෙනද වගේම root ට ගිහින් sudo grub ගහපු ගමන් කියාපි එහෙම එකක් නෑ කියල, Google ගෙන් ඇහුවත් හරිහමන් උත්තරයක් හොයාගන්න බැරි උනා. දන්න කෙනෙක් ඉන්නවනම් GRUB එක ගොඩගන්න උදව්වක් දෙන්න. ඔබට ජය !<br />
<br />
<div class="sourcecode">පසු සටහන<br />
<a href="http://sarangasl-si.blogspot.com/2009/12/grub2-setup-in-ubuntu-9.html">Windows මකපු GRUB2 ගොඩදැමීම ( බාගෙට )</a><br />
</div>Saranga Rathnayakehttp://www.blogger.com/profile/01103209861183518579noreply@blogger.com8tag:blogger.com,1999:blog-5286809515836634600.post-19276870788676007602009-12-21T21:18:00.001+05:302010-01-12T12:27:18.924+05:30දිග බ්ලොග් සටහන් හකුලන හැටිඅද මම කියල දෙන්න යන්නෙ කොහොමද මාගල් වගේ දිගට යන සටහන්වල එච්චරම වැදගත් නැති දේවල් හකුලල පෙන්වන්නෙ කියල. වැඩි විස්ස්තර කියනවට වඩා මේ පහළ තියන පෙන්වන්න/හකුලන්න link එකට කොටන්නකො.<br />
<br />
<span style="font-size: large;"><a aiotitle="click to expand" href="javascript:togglecomments('tohide')">පෙන්වන්න/හකුලන්න</a></span><br />
<div class="commenthidden" id="tohide"><br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7nNRErRNOU5TVL-GU-Zalg1N7zd4RSpIB80MerJ5h1ifYeDAnX7ekNa1klbNtoEZNFkuZqptKo01GjcuOKWYxBy92Rcq9B3Y8SU5Nrh4h_zfQYwyjO16L4_Cg_B-BTg9Cz89sv_zYDZ4/s1600-h/hide-main_Full.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7nNRErRNOU5TVL-GU-Zalg1N7zd4RSpIB80MerJ5h1ifYeDAnX7ekNa1klbNtoEZNFkuZqptKo01GjcuOKWYxBy92Rcq9B3Y8SU5Nrh4h_zfQYwyjO16L4_Cg_B-BTg9Cz89sv_zYDZ4/s320/hide-main_Full.jpg" /></a><br />
</div>ඔයා දැන් කියවන මේ චේදය චේදෙයි පින්තූරෙයි හැංගිලා තිබ්බ එව්ව. <span style="color: #cc0000;">පෙන්වන්න/හකුලන්න</span> උඩ කොටල තමයි ඔයා ඒක දැන් බලන්නෙ. ආයෙත් <span style="color: #cc0000;">පෙන්වන්න/හකුලන්න</span> උඩ කෙටුවොත් මේ චේදෙයි පින්තූරෙයි හැංගෙනව. කොටලම බලන්නකො.<br />
</div><br />
කොහොමද වැඩේ, හොඳයි නේද? දැන් බලමු මේක කොහොමද බ්ලොග් එකට දා ගන්නෙ කියල.<br />
<br />
1. මුලින්ම බ්ලොග් එකට log වෙලා <span style="color: #cc0000;">Edit HTML</span> පිටුවට යන්න, දැනට තියන template එක download කරල save කරගන්න අමතක කරන්න එපා.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTaaAImG4knw80smzBWJt9b0psJ-geZM42qrFNvIpvcG2SQwG6K7Q7sVujsOc-4FsIJ7r30qShGd2JESe5833t0mIryTtdQvPmSxbfitNOVeedlW-t1GJAi2tl-hye4c4FN-caRlRpf7jo/s1600-h/1.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTaaAImG4knw80smzBWJt9b0psJ-geZM42qrFNvIpvcG2SQwG6K7Q7sVujsOc-4FsIJ7r30qShGd2JESe5833t0mIryTtdQvPmSxbfitNOVeedlW-t1GJAi2tl-hye4c4FN-caRlRpf7jo/s320/1.JPG" /></a><br />
</div><br />
2. ඔයාගෙ template එකේ <span style="color: #cc0000;"></head></span> tag එක තියන තැන හොයාගන්න, ඒකට කරන්න තියෙන්නෙ Ctrl + F ගහල Find කරන එක.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgB1gvYjoTxc39y6u_178cuMl8_K0GiFqZ_2O8lqiIF1BK7-sY3dCY5Qo9cHZdQVAUmKNNLmFiNgslvrDrHXUTV-8LrpF_5WDlag9tvjEuLYACbrBQ8zQpmN63iM43d8RDSxQ03OM8WBkpo/s1600-h/2.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgB1gvYjoTxc39y6u_178cuMl8_K0GiFqZ_2O8lqiIF1BK7-sY3dCY5Qo9cHZdQVAUmKNNLmFiNgslvrDrHXUTV-8LrpF_5WDlag9tvjEuLYACbrBQ8zQpmN63iM43d8RDSxQ03OM8WBkpo/s320/2.JPG" /></a></div><br />
ඊට පස්සෙ පහල තියන code එක අර හොයාගත්තු <span style="color: #cc0000;"></head></span> tag එකට උඩින් paste කරන්න.<br />
<script type="syntaxhighlighter" class="brush: js;wrap-lines: false"><![CDATA[
<style type='text/css'>
.commenthidden {display:none}
.commentshown {display:inline}
</style>
<script type='text/Javascript'>
function togglecomments (postid) {
var whichpost = document.getElementById(postid);
if (whichpost.className=="commentshown") {
whichpost.className="commenthidden"; }
else { whichpost.className="commentshown";
}
}
</script>
]]></script><br />
මම <span style="color: #cc0000;">පෙන්වන්න/හකුලන්න</span> කියන link එක දාල තියෙන්නෙ මෙන්න මේ විදිහට,<br />
<script type="syntaxhighlighter" class="brush: html;wrap-lines: false"><![CDATA[
<a aiotitle="click to expand" href="javascript:togglecomments('yourDivId')">පෙන්වන්න/හකුලන්න</a>
]]></script><br />
ඊට පස්සෙ ඔයාට හංගන්න ඕන හැම දෙයක්ම <span style="color: #cc0000;"><div class="commenthidden" id="yourDivId"></span> සහ <span style="color: #cc0000;"></div></span> මැද්දට දාන්න. උඩම තියන උදාහරණෙ මම කරල තියෙන්නෙ මෙන්න මේ විදිහට,<br />
<script type="syntaxhighlighter" class="brush: html;wrap-lines: false"><![CDATA[
<div class="commenthidden" id="yourDivId">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7nNRErRNOU5TVL-GU-Zalg1N7zd4RSpIB80MerJ5h1ifYeDAnX7ekNa1klbNtoEZNFkuZqptKo01GjcuOKWYxBy92Rcq9B3Y8SU5Nrh4h_zfQYwyjO16L4_Cg_B-BTg9Cz89sv_zYDZ4/s1600-h/hide-main_Full.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7nNRErRNOU5TVL-GU-Zalg1N7zd4RSpIB80MerJ5h1ifYeDAnX7ekNa1klbNtoEZNFkuZqptKo01GjcuOKWYxBy92Rcq9B3Y8SU5Nrh4h_zfQYwyjO16L4_Cg_B-BTg9Cz89sv_zYDZ4/s320/hide-main_Full.jpg" /></a>
ඔයා දැන් කියවන මේ චේදය චේදෙයි පින්තූරෙයි හැංගිලා තිබ්බ එව්ව. පෙන්වන්න/හකුලන්න උඩ කොටල තමයි ඔයා ඒක දැන් බලන්නෙ. ආයෙත් පෙන්වන්න/හකුලන්න උඩ කෙටුවොත් මේ චේදෙ හැංගෙනව. කොටලම බලන්නකො.
</div>
]]></script><br />
මේකෙදි මතක තියාගන්න ඕන දේ තමයි <span style="color: #cc0000;">yourDivId</span> කියන එක තවත් තැනක පාවිච්චි නොකරන්න වග බලා ගන්න එක. ඒ කියන්නෙ ඔයාට මේ සෙල්ලම එකම සටහනේ දෙතුන් පොළක කරන්න ඕනනම් <span style="color: #cc0000;">yourDivId</span> කියන එකට වෙන නමක් දෙන්න ඕන.<br />
<br />
ඔන්න ඉතින් මේ සටහනත් මෙතනින් ඉවරයි. අවුල් තියන තැන් අහන්න ඕන හොඳද. ප්රතිචාරයක් දෙන්නත් අමතක කරනව එහෙම නෙවේයි ඕං. ඔබට ජය !Saranga Rathnayakehttp://www.blogger.com/profile/01103209861183518579noreply@blogger.com12tag:blogger.com,1999:blog-5286809515836634600.post-62947341172199009622009-12-21T10:24:00.004+05:302011-05-10T22:55:52.083+05:30Gmail එකේ Body එකට පින්තූරයක් දාමුGmail වලට කොහොමද පින්තූරයක් දාගන්නෙ කියල ඇහුවොත් ගොඩක් කට්ටිය කියන්නෙ attach කරගන්න හැටිනෙ. ඒත් attach කරපුවාම තියන අවුල තමයි පින්තූරෙ වෙනම බලන්න වෙන එක, ඒක කම්මැලි වැඩක්නෙ. අද මම කියල දෙන්න යන්නෙ mail එකේ body එකට පින්තූරයක් දාගන්න හැටි. මේකනම් ගොඩක් කට්ටිය දන්නවත් ඇති, දන්නෙ නැති කට්ටිය බලාගන්නකො කරන හැටි.<br />
<br />
ඔයාගෙ තියෙන්නෙ අළුත් gmail interface එක නම් පහළ තියන රූපෙ විදිහට දැතිරෝද icon එක උඩ කොටල Labs වලට යන්න. ඊළඟට 3 පියවරේ ඉඳල කරගන යන්න ඕන.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><img border="0" height="96" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinuI86Db7WPT_BkOtMFWVvf-1ePi7QwKQEqh1Qi1s16bio-uytZs9UyClmBWqOOz7s_e39M2QUjMIr6gkJObCj5CnSJVaVgujHneHnVZMx1VdWiUB9W5WICjphibh60tQZr3Zk5Tl9DS4/s1600/Capture.JPG" /></div><br />
1. මුලින්ම ඔයාගෙ mail එකට log in වෙන්න, ඊට පස්සෙ Settings වලට යන්න, පහල තියන රූපෙත් බලන්නකො.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgb7r3kXDQqnfMCyislu2l2AvmgVcLo1e82C9z1zvG8xZe2hAdkxcrtXv7XUrAOt4k6rQTNlsK8Pc0wuC74hyphenhyphenjzbWMrJkfwkHwY36mysK4Gg01KMCPgjTEmNglZHxKk1mU9UXxug2eJBOw/s1600-h/settings.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgb7r3kXDQqnfMCyislu2l2AvmgVcLo1e82C9z1zvG8xZe2hAdkxcrtXv7XUrAOt4k6rQTNlsK8Pc0wuC74hyphenhyphenjzbWMrJkfwkHwY36mysK4Gg01KMCPgjTEmNglZHxKk1mU9UXxug2eJBOw/s320/settings.JPG" /></a></div><br />
2. දැන් එන window එකෙන් Labs කියන link එකට යන්න.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0tzDL9XGoG6jQgNjYqu58MMILbjsCvGpzrPfPk8lJnLaYJiWHN3LsX_7e3FV8hNn-7SNMrKfljLXwYWTyQEGvTkidzod8ICdUnj6wm1pAMrnzcA0npnv2RcyeoLJ3edwwRPADHxxokp4/s1600-h/labs.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0tzDL9XGoG6jQgNjYqu58MMILbjsCvGpzrPfPk8lJnLaYJiWHN3LsX_7e3FV8hNn-7SNMrKfljLXwYWTyQEGvTkidzod8ICdUnj6wm1pAMrnzcA0npnv2RcyeoLJ3edwwRPADHxxokp4/s320/labs.JPG" /></a></div><br />
3. ඊට පස්සෙ පොඩ්ඩක් පහලට ගියහම හම්බෙයි Inserting Images කියල එකක්, ඒක enable කරල save කරගන්න. පින්තූර ටික බැලුවොත් හොඳටම තේරෙයි කරන පිළිවෙල. <br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmFDk2Gl4UdPMY2DAc56I-P3gI9RdkHrlhPh5w4oA70OLiuvd-neawEYh7XNsgqYLm-JQV9fRDRu2o3vRYQamCcY0eDWlapCt_6rqvamK2U_eUIAwk3bQ4FiIRptfCnyCz-Y38qjUe3oQ/s1600-h/enable_insert_image.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmFDk2Gl4UdPMY2DAc56I-P3gI9RdkHrlhPh5w4oA70OLiuvd-neawEYh7XNsgqYLm-JQV9fRDRu2o3vRYQamCcY0eDWlapCt_6rqvamK2U_eUIAwk3bQ4FiIRptfCnyCz-Y38qjUe3oQ/s320/enable_insert_image.JPG" /></a></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghBmT7Sw_eAbd2hgaH8Py0bkwALra9T7nohoCG6AQJybI08Qs3LpSzKokMT9KGxQhc-vlXle_VeWvo_exMk-vqf_myLrU07FWAY9KB3pBn25HIb9PMWGL2HXhK4sy39wjQlo6wdFdSsBE/s1600-h/save.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghBmT7Sw_eAbd2hgaH8Py0bkwALra9T7nohoCG6AQJybI08Qs3LpSzKokMT9KGxQhc-vlXle_VeWvo_exMk-vqf_myLrU07FWAY9KB3pBn25HIb9PMWGL2HXhK4sy39wjQlo6wdFdSsBE/s320/save.JPG" /></a></div><br />
දැන්නම් වැඩේ ඉවරයි, අලුත් mail එකක් ලියන පිටුවට යන්නකො පින්තූරයක් දාගන්න හැටි කියන්න. ඔයාලට පෙනෙයි අලුත් icon එකක් ඇවිත් තියනව, ඒකට කොටපුවාම ඔයාට දාන්න ඕන පින්තූරෙ තෝරන්න පොඩි window එකක් එයි. දැන් කරන්න තියෙන්නෙ ඕන කරන පින්තූරෙ තෝරල Ok කරන්න විතරයි. <br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTW9R3VEQkYyB07KRsBPguanPPVB5cAjdYD8FvFIfZnQ0tMoaal3yWVRXuBqxk2ck9loHFn8qSEOq7hcbc_7dYohLnEaaXp3h4mCXLIgUB0apjfVWnngAR_10zjMSAZb3VzBgAnseSIdE/s1600-h/new_mail.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTW9R3VEQkYyB07KRsBPguanPPVB5cAjdYD8FvFIfZnQ0tMoaal3yWVRXuBqxk2ck9loHFn8qSEOq7hcbc_7dYohLnEaaXp3h4mCXLIgUB0apjfVWnngAR_10zjMSAZb3VzBgAnseSIdE/s320/new_mail.JPG" /></a></div><br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwJunC5pwoFkqRWIlaIQ9WxXx1HrbvqzYIU_NuE-9PSJ4MSZNR4GO4ffIneUMLh0CMpdy-k0lP6KbYIPEnQKwU-YQcvmImDNl0DRz_1sLviEdxilmaKk0IR8VjQ2ptLJ1XZJnTSNZJens/s1600-h/no_attach.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwJunC5pwoFkqRWIlaIQ9WxXx1HrbvqzYIU_NuE-9PSJ4MSZNR4GO4ffIneUMLh0CMpdy-k0lP6KbYIPEnQKwU-YQcvmImDNl0DRz_1sLviEdxilmaKk0IR8VjQ2ptLJ1XZJnTSNZJens/s320/no_attach.JPG" /></a></div><br />
උඩ තියෙන්නෙ දැන් මම කියපු විදිහට කරල දාගත්තු පින්තූරයක්. මමත් මේක කරන හැටි ගොඩක් කල් ඉඳන් හොය හොය හිටියෙ. අපේ බයිය නොහොත් උදයංග තමයි කරන හැටි කියල දුන්නෙ. හැම දෙනාටම දැනගන්න මම ඉතින් බ්ලොග් එකේ දැම්ම. වැඩේ හොඳයි නේද? අවුල් වගේනම් අහන්න ඕන හොඳද. දැන්නම් මේ සටහන ඉවර කරන්න වෙලාව හරි. ඔබට ජය !Saranga Rathnayakehttp://www.blogger.com/profile/01103209861183518579noreply@blogger.com20tag:blogger.com,1999:blog-5286809515836634600.post-72514673172871937172009-12-20T12:56:00.001+05:302010-01-12T12:26:09.329+05:30බ්ලොග් එකට Syntax Highlighter එකක් දාගමුඅදත් මම කියල දෙන්න යන්නෙ බ්ලොග් එකට පොඩි ගැජට් එකක් දාගන්න හැටි. ගැජට් එකේ නම තමයි SyntaxHighlighter. හැබැයි මේ ගැජට් එකනම් ගොඩක් ප්රයෝජනවත් වෙන්නෙ පරිඝණක භාෂා වල එන code කෑලි පලකරන අයට. මේකෙන් වෙන්නෙ ඒ ඒ භාෂාවට අදාල keywords ඉස්මතු කරල පෙන්වන එක. <a href="http://sarangasl-si.blogspot.com/2009/12/menubar4blog.html">බ්ලොග් එකට Menu Bar එකක් දාගන්න</a> එක ගැන ලියපු සටහනේ තියන code එක බැලුවොත් ඔයාලට තේරෙයි මොකක්ද ගැජට් එක කියල. දැන් බලමු ඒක අපේ බ්ලොග් එකට දාගන්නෙ කොහොමද කියල.<br />
<br />
1. මුලින්ම කරන්න තියෙන්නෙ බ්ලොග් එකට log in වෙලා Layout පිටුවට ගිහින් Edit HTML තෝරන එක, එතකොට ඔයාලට පහල තියන රූපෙ වගේ එකක් එයි. මතක ඇතුව ඔයාගෙ template එකේ backup එකක් ගන්න එක ඇඟට ගුණයි, මොකද නැත්නම් තියන ලස්සනත් නැති වෙන්න ඉඩ තියනව.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3aZ8E2Uca_sv9lc6zAHDMzmwImL_iDhZ-nVI76ilUOe-RcmQT33YxSWkkjjYU2nO2-7e892BS62cGB69JWd5DItFFW3qfFTHyQ_euCdtsBmrzXXr1nLbLRq_1f73-LZ3yTDgAwUn5gBU/s1600-h/edit_html.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3aZ8E2Uca_sv9lc6zAHDMzmwImL_iDhZ-nVI76ilUOe-RcmQT33YxSWkkjjYU2nO2-7e892BS62cGB69JWd5DItFFW3qfFTHyQ_euCdtsBmrzXXr1nLbLRq_1f73-LZ3yTDgAwUn5gBU/s320/edit_html.JPG" /></a><br />
</div><br />
2. ඊට පස්සෙ ඔයාගෙ template එකේ </head> තියන තැන හොයාගන්න, ඒ වැඩේ කරන්න Ctrl + F ඔබල Find කලාම ලේසියි. දැන් කරන්න තියෙන්නෙ හොයා ගත්තු </head> තියන තැනට උඩින් පහළ තියන code එක paste කරගන්න එක.<br />
<br />
<div class="sourcecode"><link href='http://alexgorbatchev.com/pub/sh/2.1.364/styles/shCore.css' rel='stylesheet' type='text/css'/> <br />
<link href='http://alexgorbatchev.com/pub/sh/2.1.364/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/> <br />
<script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shCore.js' type='text/javascript'></script> <br />
<script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushCSharp.js' type='text/javascript'></script> <br />
<script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushJava.js' type='text/javascript'></script> <br />
<script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushPhp.js' type='text/javascript'></script> <br />
<script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushXml.js' type='text/javascript'></script> <br />
<script language='javascript'> <br />
SyntaxHighlighter.config.bloggerMode = true;<br />
SyntaxHighlighter.config.clipboardSwf = 'http://alexgorbatchev.com/pub/sh/2.1.364/scripts/clipboard.swf';<br />
SyntaxHighlighter.all();<br />
</script> <br />
</div><br />
3. Code එකේ 1 සහ 3 වැනි පේළි වල තියන දෙක අනිවාර්යයෙන්ම තියෙන්න ඕන. දෙවෙනි පේළියෙ කරල තියෙන්නෙ style දාන එක. <a href="http://alexgorbatchev.com/wiki/SyntaxHighlighter:Themes">මෙතන්ට</a> ගිහින් බලන්න එක එක ජාතියෙ styles තියනව. කැමති එකක් දාගන්න පුලුවන්, හැබැයි එකයි.<br />
<br />
4. Code එකේ 3, 4, 5 සහ 6 වැනි පේළිවලින් කරල තියෙන්නෙ c#, Java, PHP සහ HTML/XML. වලට අදාල JavaScript link කරන එක. ඔක්කොම ඕන නෑ, තමන් ලියන බ්ලොග් එකේ ලියන දේවල් වලට අදාල JavaScript විතරක් එකතු කරගන්න. එකතුකරගන්න පුලුවන් JavaScript <a href="http://alexgorbatchev.com/wiki/SyntaxHighlighter:Brushes">මෙතනින්</a> බලාගන්න. ඊට පස්සෙ template එක save කරන්න. දැනට අවුලක් නෑ නේද?<br />
<br />
5. අපි දැන් බලමු මේ ගැජට් එක අපි ලියන සටහනක පාවිච්චි කරන්නෙ කොහොමද කියල. ඔයාගෙ සටහනේ කොතනකට හරි code කෑල්ලක් දාගන්න ඕනනම් මේ පහල තියන විදිහට ඒක සටහනට එකතුකරගන්න. මේකෙ brush: html කියල තියන තැනින් තමයි භාෂාව තෝරන්නෙ. මම දැන් html තෝරල තියෙන්නෙ. තෝරන්න පුලුවන් භාෂා <a href="http://alexgorbatchev.com/wiki/SyntaxHighlighter:Brushes">මෙතනින්</a> බලාගන්න.<br />
<br />
<div class="sourcecode"><script type="syntaxhighlighter" class="brush: html; wrap-lines: false;"><![CDATA[<br />
// code එක මෙතනට දාන්න<br />
]]></script><br />
</div><br />
<a href="http://alexgorbatchev.com/wiki/SyntaxHighlighter:Configuration">මෙතනට </a>ගිහින් බලන්න තව එක එක ජාතියෙ වැඩ දාන්න පුලුවන්. එහෙනම් මේ සටහන මෙතනින් ඉවරයි. ඔබට ජය !Saranga Rathnayakehttp://www.blogger.com/profile/01103209861183518579noreply@blogger.com5tag:blogger.com,1999:blog-5286809515836634600.post-76692218991867441572009-12-19T04:49:00.001+05:302010-01-12T12:25:28.862+05:30බ්ලොග් එකට Menu Bar එකක් දාගමුඔන්න ඉතින් මේක තමයි මගෙ මුල්ම සටහන. මම මේකෙන් කියල දෙන්න හදන්නෙ Blogger බ්ලොග් එකකට පොඩි වැඩ කෑල්ලක් දාන හැටි. අපි බලමු කොහොමද බ්ලොග් එකකට Horizontal Menu Bar එකක් දාගන්නෙ කියල. නිකන් එකක් නෙවෙයි Multilevel Menu Bar එකක්. පහළ තියන රූපෙ බලන්නකො. ඒක මම <a href="http://sarangasl.blogspot.com/">කඩ්ඩෙන් ලියන බ්ලොග්</a> එකට දාල තියන එක, ගිහින් බලන්නකො හොඳද කියල.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEis5NHyhOerizzNa1Oye9wSzoow5IduFQedDJjdhHo8DeB6sAjXZS9rr3l-91KUYiYgCVu9IY_iekLZE8zGIcj6Rnr5E-W_RagCvVWB7pzQYa6q3ZQB3kresw_c-iN78y_87Q7M2AeSvvM/s1600-h/menu_bar_blogger.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEis5NHyhOerizzNa1Oye9wSzoow5IduFQedDJjdhHo8DeB6sAjXZS9rr3l-91KUYiYgCVu9IY_iekLZE8zGIcj6Rnr5E-W_RagCvVWB7pzQYa6q3ZQB3kresw_c-iN78y_87Q7M2AeSvvM/s320/menu_bar_blogger.JPG" /></a><br />
</div><br />
හැමෝටම තේරෙන්න සරලවම කියන්නම්, වැඩ දන්න අයටනම් කියල තියන විදිය දැක්කහම හිනා යයිද දන්නෑ. මුලින්ම මේ පහල තියන තඩි code එක copy කරගන ඒක Text Editor එකේ save කරගන්න. ඒක දිග උනාට ගනන් ගන්න එපා, ඒකෙ එච්චර දෙයක් නෑ. <br />
<script type="syntaxhighlighter" class="brush: html;wrap-lines: false"><![CDATA[
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style type="text/css">
ul.cssMenu ul{display:none}
ul.cssMenu li:hover>ul{display:block}
ul.cssMenu ul{position: absolute;left:-1px;top:98%;}
ul.cssMenu ul ul{position: absolute;left:98%;top:-2px;}
ul.cssMenu,ul.cssMenu ul{
margin:0px;
list-style:none;
padding:0px 2px 2px 0px;
background-color:#d8d8d8;}
ul.cssMenu table {border-collapse:collapse}ul.cssMenu {
display:block;
zoom:1;
float: left;}
ul.cssMenu ul{
border-left:2px solid #444444;
border-bottom:1px solid #444444;
border-right:1px solid #444444;
border-top:0px;
z-index:9999;}
ul.cssMenu li{
display:block;
margin:2px 0px 0px 2px;
font-size:0px;}
ul.cssMenu a:active, ul.cssMenu a:focus {outline-style:none;}
ul.cssMenu a, ul.cssMenu li.dis a:hover, ul.cssMenu li.sep a:hover {
display:block;
vertical-align:middle;
background-color:#d8d8d8;
text-align:left;
text-decoration:none;
padding:4px;
_padding-left:0;
font:normal 11px Verdana;
color: #444444;
text-decoration:none;
cursor:default;}
ul.cssMenu span{
overflow:hidden;
font-weight:bold;
background-position:right center;
background-repeat: no-repeat;
padding-right:11px;}
ul.cssMenu li { float:left;}
ul.cssMenu ul li {float:none;}
ul.cssMenu ul a {
text-align:left;
white-space:nowrap;}
ul.cssMenu li.sep{
text-align:center;
padding:0px;
line-height:0;
height:100%;}
ul.cssMenu li.sep span{
float:none;
padding-right:0;
width:5;
height:16;
display:inline-block;
background-color:#AAAAAA;
background-image:none;}
ul.cssMenu ul li.sep span{width:80%;height:3;}
ul.cssMenu li:hover{position:relative;}
ul.cssMenu li:hover>a{
background-color:#eeeeee;
font:normal 11px Verdana;
color: #000000;
text-decoration:none;}
ul.cssMenu li a:hover{
position:relative;
background-color:#eeeeee;
font:normal 11px Verdana;
color: #000000;
text-decoration:none;}
ul.cssMenu li.dis a {color: #AAAAAA !important;}
ul.cssMenu img {border: none;float:left;_float:none;margin-right:4px;width:16px;height:16px;}
ul.cssMenu a:hover ul,ul.cssMenu a:hover a:hover ul,ul.cssMenu a:hover a:hover a:hover ul{display:block}
ul.cssMenu a:hover ul ul,ul.cssMenu a:hover a:hover ul ul{display:none}
</style>
</head>
<body>
<ul class="cssMenu">
<li><a href="#" title="test title"><span>SEO</span><!--[if gt IE 6]><!--></a><!--<![endif]--><!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="#" title="test title">Your Site in Google</a></li>
<li><a href="#" title="test title">Selecting Good Title</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]--></li>
<li><a href="#" title="test title"><span>Blogger Tips</span><!--[if gt IE 6]><!--></a><!--<![endif]--><!--[if lte IE 6]><table><tr><td><![endif]-->
<ul class="cssMenum">
<li><a href="#" title="test title">Expandable Blogger Posts</a></li>
<li><a href="#" title="test title">Blogger Title Tip</a></li>
<li><a href="#" title="test title">Adding META Tags</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]--></li>
<li><a href="#" title="test title"><span>SharePoint</span><!--[if gt IE 6]><!--></a><!--<![endif]--><!--[if lte IE 6]><table><tr><td><![endif]-->
<ul class="cssMenum">
<li><a href="#" title="test title">What is SharePoint</a></li>
<li><a href="#" title="test title"><span>Create Custom Features</span><!--[if gt IE 6]><!--></a><!--<![endif]--><!--[if lte IE 6]><table><tr><td><![endif]-->
<ul class="cssMenum">
<li><a href="#" title="test title">Removing Features</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]--></li>
<li><a href="#" title="test title">CAML in SharePoint</a></li>
<li><a href="#" title="test title">User Groups</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]--></li>
</ul>
</body>
</html>
]]>
</script><br />
දැන් කරන්න තියෙන්නෙ document එක .html විදිහට save කරගන්න එක. එහෙම කරන්නනම් File --> Save As ගිහින් නම අගට .html දෙන්න විතරයි තියෙන්නෙ. දැන් Browser එකක Open කරල බලන්න Menu Bar එක පේනවද කියල. පොතේ හැටියටනම් පේන්න ඕන. ඊට පස්සෙ කරන්න තියෙන්නෙ තමන්ට ඕන විදිහට Edit කරගන්න එක. මම එක උදාහරනයක් දෙන්නම්කො, code එක බැලුවොත් ඔයාලට පහල තියන පේළිය වගේ පේළි ගොඩක් පෙනෙයි.<br />
<br />
<div class="sourcecode"><a href="#" title="test title"><span>Blogger Tips</span><br />
</div><br />
දැන් ඔය "#" තියන තැන් වලට ඔයාගෙ සටහනේ Link එක දෙන්න, "test title" තියන තැන් වලට සටහන අදාල Title එකක් දෙන්න, එතකොට mouse එක ඒක උඩට ගෙනිච්චහම අපි දීපු title එක පෙන්නනව. උඩින්ම තියන රූපෙ බැලුවොත් පෙනෙයි. "Blogger Tips" කියන්නෙ අපිට පේන නම, ඒකත් ගැලපෙන විදිහට දෙන්න. ඔය විදිහට edit කලහම මෙන්න මේ වගේ එකක් එන්න ඕන, මේ විදිහට ඔයා හැම Link එකක්ම edit කර ගන්න. CSS එහෙම දන්නවනම් ඔයාට කැමති විදිහට styles වෙනස් කරගත්තට මගෙ කිසිම තරහක් නෑ.<br />
<br />
<div class="sourcecode"><a href="http://www.google.com" title="ගූගල් වලින් සොයන්න"><span>සොයන්න</span><br />
</div><br />
දැනට ගානට යනව නේද? දැන් තමයි හරියටම වැඩේට බහින්න යන්නෙ. ඔයාගෙ බ්ලොග් එකට Log වෙලා "Edit HTML" පිටුවට යන්න, එතකොට මේ වගේ එකක්නෙ එන්නෙ.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBdpj2DpyMzm1Obb8bnetGwwxEbrYBY2TCIV-5RKzHrQtE7EPoSJwtsmXRPbvEolPhWqFbrGYUEkyQdIxhbQ-6uOrnD3rFa-zuUfj5d0nXE2qeHes54Oinw4Sevf5poLd1Fv8sPHWvH2I/s1600-h/edit_template.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBdpj2DpyMzm1Obb8bnetGwwxEbrYBY2TCIV-5RKzHrQtE7EPoSJwtsmXRPbvEolPhWqFbrGYUEkyQdIxhbQ-6uOrnD3rFa-zuUfj5d0nXE2qeHes54Oinw4Sevf5poLd1Fv8sPHWvH2I/s320/edit_template.JPG" /></a><br />
</div><br />
<div style="color: red;">දැන් මුලින්ම කරන්න ඕන දේ තමයි දැනට තියන template එක download කරල save කරගන්න එක, මොකද කොච්චර වැඩ දන්න ඩයල් එකක් උනත් template එක අවුල් ගියොත් ගොඩ ගන්න අමාරු වෙන්න පුලුවන්.<br />
</div><br />
දැන් මම කියල දෙන පියවරවල් ටික ඒ විදිහට කලොත් ලේසියෙන්ම Menu Bar එක දා ගන්න පුලුවන්,<br />
<br />
1. ඔයාගෙ template එකේ "b:section class='header'" කියල එකක් තියනවද බලන්න, ඒකට කරන්න තියෙන්නෙ Ctrl + F ගහල Find කරන එක. එහම එකක් නෑම කියනවනම් "maxwidgets" කියල එකක් තියනවද බලන්න. "maxwidgets" ගොඩ සැරයක් තියනවනම් "header" වචනෙ අහල පහල තියන පේළිය තෝරගන්න.<br />
<br />
2. දැන් maxwidgets තියන ගානට වඩා දෙකක් වැඩි කරන්න, ඒ කිව්වෙ "1" තියනවනම් "3" දෙන්න. ඒත් එක්කම showaddelement වල "no" තිබ්බොත් "yes" කරන්න. උදාහරණයක් විදිහට මේ වගේ එකක් තමයි අන්තිමට තියෙන්න ඕන. (maxwidgets='3' showaddelement='yes')<br />
<br />
3. දැන් template එකේ </head> තියන තැන කලින් විදිහටම හොයාගන්න. ඊට පස්සෙ කරන්න තියෙන්නෙ අපි අර කලින් save කරගත්තු .html file එකේ styles ටික copy කර ගන්න එක. ඒකෙ <style type="text/css"> ඉඳන් </style> වෙනකන් copy කරගන්න. මතක ඇතුව ඒ කෑලි දෙකත් එක්කම copy කරගන්න ඕන. ඊට පස්සෙ අර හොයාගත්තු </head> තියන තැනට උඩින් ඒටික paste කරන්න.<br />
<br />
4. දැන් අපි වැඩේ ගොඩක් දුරට ඉවරයි. Template එක save කරල බලන්න අවුලක් නෑ නේද කියල. Save කරන්න බෑ අවුල් තියනව කියල කිව්වොත් කලබල නැතිව ආයෙ පාරක් බලන්න කොතනද අවුල කියල.<br />
<br />
5. ඊට පස්සෙ කරන්න තියෙන්නෙ "HTML/JavaScript" ගැජට් එකක් Headder එකට දාගන්න එක. ඒකනම් ඉතින් සුපුරුදු විදියම තමයි, වෙනසකට තියෙන්නෙ මේපාර දාන්නෙ Header එකට වීම. Layout ගිහින් Header එකට උඩින් තියන "Add a Gadget" යන්න. මේ රූපෙත් බලලම ඉන්නකො.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhyBebceyTunehjopwp2kJvkbUwci9fvOJOzbCJ_skH7M1-VsEvv5l7q_3sq480EUN32IQfaWCD0k6q7sn0Ke8gd77WJ0ja4V-OUvhqS0DR4aL-FGGIYag4hYqj_Bz6ze6P4UhuyJgRoFo/s1600-h/add_wedgit.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhyBebceyTunehjopwp2kJvkbUwci9fvOJOzbCJ_skH7M1-VsEvv5l7q_3sq480EUN32IQfaWCD0k6q7sn0Ke8gd77WJ0ja4V-OUvhqS0DR4aL-FGGIYag4hYqj_Bz6ze6P4UhuyJgRoFo/s320/add_wedgit.JPG" /></a><br />
</div><br />
6. දැන් අපි අර කලින් save කරගත්තු .html file එකේ <body> සහ </body> කියන code කෑලි ඇතුලෙ තියන ටික gadget එකේ content එකට දෙන්න. ඊට පස්සෙ save කරල බ්ලොග් එක බලන්න අලුතින් දාගත්තු Menu Bar එක වැඩද කියල.<br />
<br />
ඔන්න මගේ පළවැනි සටහන මෙතනින් ඉවර කරන්නයි යන්නෙ. කොතන හරි තේරෙන්නෙ නැති තැනක් තියනවනම් අහන්න ඕන හොඳද. සටහන ගැන අදහසකුත් දීලම ගියානම් තමයි හොඳ, මොකද මේක මම මුලින්ම ලියපු එකනෙ. ඔබට ජය !Saranga Rathnayakehttp://www.blogger.com/profile/01103209861183518579noreply@blogger.com12