Photoshop වල වැඩ ස්වයන්ක්‍රියව (automatically) කරගන්න action script සහ javascript

කාලෙකින් ආපහු අවා post එකක් දාලා යන්න. අද කියල දෙන්න හදන්නේ තවත් අලුත් දෙයක් ඒ photoshop වල සුපිරිම වැඩ කැල්ලක් ගැන, වැඩි කතා නැතුව එන්නම්කෝ මාතෘකාවට වැඩේ ගැන පැහැදිලි කිරීමක් කරන්න මං ගන්නම් මෙන්න මෙහෙම උදාහරණයක්, මං ලග තියෙනවා 800*400 image 100ක් මට ඕනේ මෙන්න මේ image ටික re-size කරන්න 400*200 වැඩේ ටිකක් සංකීර්ණයි නේද? image එකින් එක open කරලා re-size කරන්න ඕනේ. මෙන්න මේ වගේ වැඩක් තත්පර 10න් කරගන්න පුළුවන් මෙන්න මේ script බාවිත කරලා...මුලික වශයෙන් script වර්ග දෙකකට වෙන කරන්න පුළුවන් action script & javascript

action script බාවිත කරලා මං කලින් කියපු උදාහරණෙ වගේ ඒවා කරගන්න පුළුවන්, ඒත් ලොකු ලොකු වඩා කරන්න බැ..action script ගැන මීට කලින් trickslanka.com  වෙබ් අඩවියේ ලිපියක් පළවුණා නමුත් දැන් නම් එම ලිපිය නැහැ, මං මේ ලිපියේදී කියන්න බලාපොරොත්තු වෙන්න java script වලින් script හදාගන්න විදිහ මේකෙදි පුළුවන් ලොකු ලොකු වැඩකරන්න java script ගැන මුලික දැනුමක් අවශ්‍ය වෙනවා මේ වැඩේ කරගන්න. මේ තියෙන්නේ මම  java script ගැන ලියපු ලිපි කිහිපයක් මේ ලිපි පෙල අවසන් කරන්න නම් වුනේ නෑ 

action script 

simple action script එකක් හදමු..එතකොට තේරුම් ගන්න පුළුවන් මේවා වලින් වඩා ගන්නේ කොහොමද කියල 

photoshop වල action script active ගන්න 

action menu එක මෙන්න මේ වගේ open කරගන්න 

ඊට පස්සේ folder එකක icon එකක් තියෙනවා ඒක click කරලා set එකක් හදාගන්න . මේ set එකක් කියන්නේ folder එකක් වගේ මේක ඇතුලේ තමයි අපි හදන script එකේ හදන action save වෙන්නේ..

දැන් අපි හදාගත්ත set එක ඇතුලේ අපේ action ටික හදාගන්න ඕනේ. එකට කරන්න තියෙන්නේ set එක හදාගන්න click කල icon එකට right side එකේ තියෙන icon එක click කරලා action create කරගන්න පුළුවන්. රුපයේ ආකාරයට action එක හදාගෙන record කියල button එක click කරලා අපේ වැඩේ පටන් ගන්න පුළුවන් 

record on වුනාට පස්සේ මෙන්න මේ වගේ තමයි අපිට පෙන්නේ 

දැන් කරන්න තියෙන්නේ record කරන්න ඕන වැඩේ....මං සරල වැඩක් කරන්නම්

අලුත් layer එකක් හදාගෙන එක text එකක් add කරලා එකට color එකකුත් දාලා මගේ වැඩේ ඉවර කළා...දැන් අපහු action script menu එකට ගිහිල්ල stop එක click කරන්න.. දැන්  script එක හැදිලා ඉවරයි එක check කරලා බලන්නේ මෙන්න මෙහෙමයි. අපි හදපු document එක close කරල දාන්න..අපි හද ගත්ත script එකේ action එක select කරලා play කරල බලන්න මොකද වෙන්නේ කියල..ඔන්න ඕක තමයි සරලව මේකෙදි වෙන්නේ ..මේ වගේ නිතරම අපිට බවිත වන පොඩි පොඩි කොටස් record කරගෙන තියාගෙන අපේ වඩා ඉක්මනින් කරගන්න පුළුවන් .....

තව පොඩි අවස්ථාවක් මේ විදිහට කරලා පෙන්වන්නම්...මං උදහරනේදී කිව්වා image 100 re-size කරන කතාවක් එකෙති අපිට image open කරගන්න එක resize කරන එක save කරල close කරන එක, එක් වරක් කරලා අපි එක කලින් වගේ record කරනවා..

දැන් ඉතුරු image මේ ටිකම කරන්න ඕනේ නෙ..අන්න එකට මෙන්න මේ script එක බවිත කරන්න පුළුවන්..නමුත් මෙතැනදී මේ අපි හදාගත්ත script එක loop එකක් විදිහට image තියෙන ප්‍රමාණයට නැවත නැවත run වෙන්න ඕනේ එක කරගන්නේ මෙන්න මේ විදිහට 

මෙතන set එක විදිහට අපේ script එක තියෙන set එක select කරන්න 

action එක විදිහට අපිට නැවත නැවත කරන්න ඕනේ action එක select කරලා දෙන්න 

දැන් අපි ඉතුරු image ටික තියෙන තැන select කරල දෙන්න ඕනේ , එකට කරන්න තියෙන්නේ choose කියන එකෙන් image folder path එක select කරලා දාන එක....ඊට පස්සේ ok කරන්න image සිල්ලම අපි හදපු script එකේ විදිහට වඩා කරලා අපි save කරපු තැනම save වෙනවා....

 මෙන්න මේ විදිහටයි action script එකේන් වඩා ගන්නේ..නමුත් මෙන්න මේ action script වලින් අපිට අවාසියක් තියෙනවා, මෙන්න මෙහෙම හිතමුකෝ අපි කලින් හද ගත්ත script එකේ image තියෙන path එක වෙනස් කරන්න ඕනේ, ඊට අමතරව resize කරන size වෙනස් කරන්නත් ඕනේ ..මෙන්න මේ වෙනස් කම් ටික කරගන්න නම් අපිට අපහු action script එකක් record කරගන්න වෙනවා. මේකට විසදුමක් විදිහට තමයි javascript බවිතා කරන්නෙ ..මේ මන් කිව්වේ ඉතා සරල අවස්ථාවක් ඊට වඩා ගොඩක් දේවල් කරගන්න පුළුවන් ...අනික loop එකක් run කරන්න ඕන අවස්ථාවට කලින් කල වගේ batch file හදාගෙන දගලන්න ඕනේ නෑ එකත් coding කරල ලෙසියෙන්ම වැඩේ ගොඩ දාගන්න පුළුවන්..javascript එක run කරලා බලන් ඉන්න විතරයි තියෙන වැඩේ ලස්සනට වෙලා තියෙයි...

Javascript

ඕනෑම text editor එකක් මේ සදහා අපිට බවිත කරන්න පුලුවන් නමුත් adobe වලින් මේ සදහා අපිට දීල තියෙනවා tool එකක් මේ tool එකන් photoshop වලට විතරක් නෙමේ ඕනෑම adobe product එකක් සදහා java script ලිය ගන්න පුළුවන්..ලියන විදිහත් එකමයි වෙනස් වෙන්නේ keyword විතරයි...ඇත්තටම මේ ගැන සම්පුර්ණයෙන් කියල ඉවරකරන්න අමාරුයි..මේ post එකෙන් මන් බලාපොරොත්තු වෙන්නේ මේ සම්බන්දව දල අදහසක් දෙන්න සහ සරල වැඩක් කරගන්නේ කොහොමද කියල කියල දෙන්න පමණයි..

adobe package එක install කරනකොටම මන් කලින් කිව්වා tool එකත් install වෙනවා එහෙම නැත්නම් මෙතනින් download කරගන්න (5Mb)  මීට අමතරව අපිට අවශ්‍ය වෙනවා adobe javascript guide එක ඔයාල ලග තියෙන photoshop version එකට අදාල එක මෙතතින් තෝරාගෙන download කරගන්න

දැන් අපේ tool එක open කරගන්න..මෙන්න මේ ආකාරයට අපි script එක run කරන්න බලපොරොත්තු වන photoshop version එක select කරන්න

දැන් අපි මේ tool එක photoshop වලට link කරන්න ඕනේ , එකට කරන්න තියෙන්නේ රතු  පාටින් පෙනෙන link එක උඩ click කරන්න එක 

ඊටපස්සේ මෙන්න මේ වගේ massage එකක් එනවා එක yes කරලා photoshop එක open කරගන්න

 ඊටපස්සේ තමයි ලොකුම වැඩේ තියෙන්නේ script එක ලිය ගන්න එක..tool එකෙන් තියෙන වාසිය තමයි script ලියනකොට මේකේ තියෙන code library එකෙන් අපිට code suggest කරනවා

කලින් download කරගත්ත adobe javascript guide එකෙන් අපිට හැම code එකම හොයාගන්න පුළුවන්...එහෙනම් වැඩේ try කරල බලන්න..ඉල්ලීමක් තිබුනොත් code කන හැටිත් මං ඉදිරියේ ලිපියකින් කියල දෙන්නම්..මෙන්න තියෙනවා මං හදපු පොඩි java script එකක්..මේකෙන් වෙන්නේ අපි select කරන folder එකේ තියෙන image අරගෙන image stack එකක් හදනවා...script එක run කරලම් බලන්නකෝ වැඩේ හරිම පහසුයි...තවදෙයක් මෙන්න මේ වගේ ඒවානම් action script එකෙන් හදන්නවත් බෑ..දැන් ත්රුම් ගන්න පුළුවන්නේ මෙකක්ද හොද කියල ????

script එක run කරන්නේ මෙන්න මේ විදිහට

browse කරලා script එකක් load කරලා බලන් ඉන්න....ටික වෙලාවකින් alert එකක් එනවා එතනට image තියෙන folder එකක් select කරලා ok කරන්න...මන් code කරලා තියෙන විදිහනම් ටිකක් අපැහැදිලි තේරුම ගන්න try කරල බලන්නකෝ බැරි වෙන එකක් නැ

script එක download කරගන්න

ප්‍රශ්න තියෙනවනම් comment කරන්න පුළුවන් විදිහට විසදුම් දෙන්නම් ....තාක්ෂණික ලිපි ලියන්න කැමති ය ඉන්නවනම් මගේ blog එකෙක් ඔයාලට තැනක් දෙන්න මට පුළුවන්..contact form එකෙන් ඔයාලට පුළුවන් මං සමග සම්බන්ද වෙන්න...

හැමතැනම අන්තර්ජාලයෙන් මුදල් සෙවීම ගැන තමයි මේ දවස් වල කතා වෙන්න ටිකක් කල්පනා කලොත් මේ පොස්ට් එකෙනුත් වැඩක් අරගෙන ගානක් හොයාගන්න පුළුවන්.....
එහෙනම් සමුගන්නවා අපහු අලුත් ලිපියකින් හමුවෙමු
ජයවේව !!!

Read More

FB like popup box එකක් බ්ලොග් ඒකට දාගමුද?

පොඩි දෙයක් අරගෙන අවා ඔන්න..ඔයා රුපයේ තියෙනවා වගේ popup box ඔයාලගේ බ්ලොග් එකටත් දාගන්න කැමතිද ? ඒකට කරන්න තියෙන්නේ පොඩි වැඩයි..ඔයා පහල තියෙන java script ඔයාලගේ බ්ලොග් ඒකට දාගන්න තියෙන්නේ....

Go To Blogger > Design > choose a gadget > Select HTML/javascript widget > පහල code ඒක code කරන්න

<style>

    /* Jquery Facebook Likebox Popup Version 2.0 by MBT    MyBloggerTricks.com
    */
    #colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
    #cboxOverlay{position:fixed; width:100%; height:100%;}
    #cboxMiddleLeft, #cboxBottomLeft{clear:left;}
    #cboxContent{position:relative;}
    #cboxLoadedContent{overflow:auto;}
    #cboxTitle{margin:0;}
    #cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
    #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
    .cboxPhoto{float:left; margin:auto; border:0; display:block;}
    .cboxIframe{width:100%; height:100%; display:block; border:0;}
    /*

       User Style:
       Change the following styles to modify the appearance of ColorBox.  They are
       ordered & tabbed in a way that represents the nesting of the generated HTML.
    */
    #cboxOverlay{background:#000;opacity:0.5 !important;}
    #colorbox{
            box-shadow:0 0 15px rgba(0,0,0,0.4);
           -moz-box-shadow:0 0 15px rgba(0,0,0,0.4);
            -webkit-box-shadow:0 0 15px rgba(0,0,0,0.4);
           }
       #cboxTopLeft{width:14px; height:14px; background:url(http://imgboot.com/images/cybersidh/controls.png) no-repeat 0 0;}
       #cboxTopCenter{height:14px; background:url(http://imgboot.com/images/cybersidh/border.png) repeat-x top left;}
       #cboxTopRight{width:14px; height:14px; background:url(http://imgboot.com/images/cybersidh/controls.png) no-repeat -36px 0;}
       #cboxBottomLeft{width:14px; height:43px; background:url(http://imgboot.com/images/cybersidh/controls.png) no-repeat 0 -32px;}
       #cboxBottomCenter{height:43px; background:url(http://imgboot.com/images/cybersidh/border.png) repeat-x bottom left;}
       #cboxBottomRight{width:14px; height:43px; background:url(http://imgboot.com/images/cybersidh/controls.png) no-repeat -36px -32px;}
       #cboxMiddleLeft{width:14px; background:url(http://imgboot.com/images/cybersidh/controls.png) repeat-y -175px 0;}
       #cboxMiddleRight{width:14px; background:url(http://imgboot.com/images/cybersidh/controls.png) repeat-y -211px 0;}
       #cboxContent{background:#fff; overflow:visible;}
           #cboxLoadedContent{margin-bottom:5px;}
           #cboxLoadingOverlay{background:url(http://imgboot.com/images/cybersidh/loadingbackground.png) no-repeat center center;}
           #cboxLoadingGraphic{background:url(http://imgboot.com/images/cybersidh/loading.gif) no-repeat center center;}
           #cboxTitle{position:absolute; bottom:-25px; left:0; text-align:center; width:100%; font-weight:bold; color:#7C7C7C;}
           #cboxCurrent{position:absolute; bottom:-25px; left:58px; font-weight:bold; color:#7C7C7C;}
           #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{position:absolute; bottom:-29px; background:url(http://imgboot.com/images/cybersidh/controls.png) no-repeat 0px 0px; width:23px; height:23px; text-indent:-9999px;}
           #cboxPrevious{left:0px; background-position: -51px -25px;}
           #cboxPrevious.hover{background-position:-51px 0px;}
           #cboxNext{left:27px; background-position:-75px -25px;}
           #cboxNext.hover{background-position:-75px 0px;}
           #cboxClose{right:0; background-position:-100px -25px;}
           #cboxClose.hover{background-position:-100px 0px;}
           .cboxSlideshow_on #cboxSlideshow{background-position:-125px 0px; right:27px;}
           .cboxSlideshow_on #cboxSlideshow.hover{background-position:-150px 0px;}
           .cboxSlideshow_off #cboxSlideshow{background-position:-150px -25px; right:27px;}
           .cboxSlideshow_off #cboxSlideshow.hover{background-position:-125px 0px;}
    /*-----------------------------------------------------------------------------------*/
    /*   Facebook Likebox popup For Blogger Version 2.0
    /*-----------------------------------------------------------------------------------*/
    #subscribe {
        font: 12px/1.2 Arial,Helvetica,san-serif; color:#666;
    }
    #subscribe a,
    #subscribe a:hover,
    #subscribe a:visited {
        text-decoration:none;
    }
    .box-title {
       color: #F66303;
       font-size: 18px !important;
       font-weight: bold;
       margin: 10px 0;
    border:1px solid #ddd;
    -moz-border-radius:6px;
    -webkit-border-radius:6px;
    border-radius:6px;
    box-shadow: 5px 5px 5px #CCCCCC;
    padding:10px;
    line-height:25px; font-family:arial !important;
    }

    .box-tagline {
       color: #999;
       margin: 0;
       text-align: center;
    }
    #subs-container {
        padding: 35px 0 30px 0;
        position: relative;
    }
    a:link, a:visited {
    border:none;
    }
    .demo {
    display:none;
    }

/* ---------MBT Subscribe Form---------- */

    .box-title1 {
    border:1px solid #ddd;
    -moz-border-radius:6px;
    -webkit-border-radius:6px;
    border-radius:6px;
    box-shadow: 5px 5px 5px #CCCCCC;
        padding:10px;
  margin: 10px 0;
    }

    .enteryouremail{
background: #fff !important;

border: 1px solid #d2d2d2;
padding: 0px 8px 0px 8px;
color: #a19999; font-size: 12px;
height: 25px; width: 165px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
margin:0px;
}

    .submitbutton{
background:#F66303;
border: 1px solid #F66303;
text-shadow: 1px 1px 1px #333;
box-shadow: 3px 3px 3px #666;
font:bold 12px Arial, sans-serif;
color: #fff;
height: 25px;
padding: 0 12px 0 12px;
margin: 0 0 0 5px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
cursor:pointer;}

    </style>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js'></script>
<script src="http://mybloggertricks.googlecode.com/files/jquery.colorbox-min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
   if (document.cookie.indexOf('visited=true') == -1) {
       var fifteenDays = 1000*60*60*24*30;
       var expires = new Date((new Date()).valueOf() + fifteenDays);
       document.cookie = "visited=true;expires=" + expires.toUTCString();
   $.colorbox({width:"400px", inline:true, href:"#subscribe"});
       }
});
</script>
 
 
        <div style='display:none'>
       <div id='subscribe' style='padding:10px; background:#fff;'>
            <h3 class="box-title">Receive all updates via Facebook. Just Click the Like Button Below<center><p style="line-height:3px;" >▼</p></center></h3>
          <center>

<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Ffb user name&amp;width=300&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23ffffff&amp;stream=false&amp;header=false&amp;height=258" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:258px;" allowtransparency="true"></iframe>

</center>
<div class="box-title1 ">

<center>
<h3 style="color:#F66303;">You can also receive Free Email Updates:</h3>
    <form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=tntbystc', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><input gtbfieldid="10" class="enteryouremail" name="email" value="Enter your email here..." onblur="if (this.value == &#39;&#39;) {this.value = &#39;Enter your email here...&#39;;}" onfocus="if (this.value == &#39;Enter your email here...&#39;) {this.value = &#39;&#39;;}" type="text" /><input value="tntbystc" name="uri" type="hidden" /><input value="Submit" class="submitbutton" type="submit" /></form>

</center>
</div>

<!--Please Do not Remove the Credits -->
    <p style=" float:right;  margin-right:35px;  font-size:9px;" >Powered By <a style=" font-size:9px; color:#3B78CD; text-decoration:none;" href="http://www.mybloggertricks.com">Blogger Widgets</a></p>
    </div>
    </div>

tntbystc  මෙතනට ඔයාලගේ feed title ඒක දාන්න 

උදාහරණ :

http://feedburner.google.com/fb/a/mailverify?uri=tntbystc

දැන් වැඩේ ඉවරයි..save කරලා බ්ලොග් ඒක load කරලා බලන්නකෝ 

Read More

popular post animate කරමුද?

තවත් gadget එකක් අරගෙන ආවා..වැඩි විස්තර ඕනේ නැනේ ඔය රුපය දැක්කම හිතා ගන්න පුළුවන්නේ මේක මොකක්ද කියල. මේක blog ඒකට දාගන්න හරිම පහසුයි. පහල කියල තියෙන විදිහට මේක දාගන්නකෝ...

option > layout > add gadget > HTML/Java script >පහල තියෙන code ඒක copy කරලා past කරන්න


<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<style type="text/css" media="screen">
<!--
#spylist {
overflow:hidden;
margin-top:5px;
padding:0px 0px;
height:350px;
}
#spylist ul{
width:220px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:208px;
padding: 5px 5px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:70px;
overflow: hidden;
background:#fff url(http://dl.getdropbox.com/u/708209/scriptabufarhan/recentspy/post.jpg) repeat-x;
border:1px solid #ddd;
} #spylist li a {
text-decoration:none;
color:#4B545B;
font-size:11px;
height:18px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}

#spylist li img {
float:left;
margin-right:5px;
background:#EFEFEF;
border:0;
}
.spydate{
overflow:hidden;
font-size:10px;
color:#0284C2;
padding:2px 0px;
margin:1px 0px 0px 0px;
height:15px;
font-family:Tahoma,Arial,verdana, sans-serif;
}

.spycomment{
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:10px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}
-->
</style>
<script language='javascript'>


imgr = new Array();

imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
showRandomImg = true;

boxwidth = 255;

cellspacing = 6;

borderColor = "#232c35";

bgTD = "#000000";

thumbwidth = 60;

thumbheight = 60;

fntsize = 9;

acolor = "#666";

aBold = true;

icon = " ";

text = "comments";

showPostDate = false;

summaryPost = 0;

summaryFontsize = 9;

summaryColor = "#666";

icon2 = " ";

numposts = 10;

home_page = "http://it-harsha.blogspot.com/";

limitspy=4
intervalspy=4000

</script>

<div id="spylist">
<script src='http://dl.getdropbox.com/u/708209/scriptabufarhan/recentspy/recentpostthumbspy-min.js' type='text/javascript'></script></div>


http://it-harsha.blogspot.com/ මෙන්න මෙතනට ඔයාලගේ blog එකේ url ඒක දෙන්න දැන් වැඩේ හරි..හොදද බලන්නකෝ..හොදනම් comment එකක් දාගෙනම යන්නකෝ

Read More

Blog එකේ අකුරු ලොකු කරගන්න {Java Script}

ඔන්න අද කට්ටියට දෙන්න හදන්නේ තවත් java script එකක්....ආ...මුලින්ම කියන්න ඕනේ මේක මගේ නිර්මාණයක් නෙමේ මේකත් අන්තර්ජාලයෙන් ඇහිදගත්ත එකක් ඒත් මේක හම්බුනේ කොහෙන්ද කියලනම් මතක නැ කොහොම වුනත් මේක හදපුකෙනට ස්තුතිවන්ත වෙනවා....මෙන්න පහල තියෙනවා code එක ඔයාලගේ බ්ලොග් එකටත් දාගෙනම බලන්නකෝ

( පළමුව සදහන් කර තිබු java script එකේ යම් අඩුපාඩුවක් හේතුවෙන් එය ඉවත් කරන ලදී. නව script ඒක ඒ සදහා යොදාගන්න )


මුලින්ම dashboard--> layout- -> Edit HTML මෙතනට ඇවිත් ctrl + f බවිත් කර </head>
 tag ඒක හොයා ගන්න...ඒ tag ඒකට උඩින් පහත සදහන් code ඒක ඇතුලත් කර  save කරගන්න

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>

Design > Add Gadget > HTML/JavaScript > ..............
මෙන්න මෙතනට මේ පහල තියෙන code එක copy කරලා past කරන්න....


<!-- Code Begins -->
<!-- http://TheUnnecessaryWorld.co.cc -->
<style type="text/css">
/** TUW Font Color and Size Change widget begins **/
#tuw-font-change-widget {width: auto;}
#tuw-font-change-widget h2 {margin: 0 0 8px 0 !important;font: 12px Tahoma !important;font-weight: normal !important;border: 0 !important;}
#tuw-font-change-widget ul {width: auto; overflow: hidden;margin: 0 0 20px !important;padding: 0 !important;list-style; none !important;}
#tuw-font-change-widget ul li {width: 20px !important;height: 20px !important;overflow: hidden;margin: 0 10px 0 0 !important;padding: 2px !important;display: block !important;float: left !important;border: 1px solid #CCCCCC !important;}
#tuw-font-change-widget ul li a {width: 20px !important;height: 20px !important;display: block !important;line-height: 18px !important;text-align: center !important;color: #FFFFFF !important;font-size: 11px !important;font-family: Tahoma !important;text-decoration: none !important; outline: 0 !important;}
#fcw-black { background: #000000 !important; } #fcw-white { background: #FFFFFF !important; } #fcw-blue { background: #0066CC !important; } #fcw-gray { background: #666666 !important; }
#fcw-color a { text-indent: -999px !important; }
#fcw-size a { text-indent: 0 !important; background: #333333 !important; }
/** TUW Font Color and Size Change widget begins **/
</style>
<script type="text/javascript">
$(document).ready(function(){
// Change Font Color -- begins
$(" #fcw-color #fcw-black ").click(function() {
$(" .post-body ").css({ color: "#000000" });
return false;
});

$(" #fcw-color #fcw-white ").click(function() {
$(" .post-body ").css({ color: "#FFFFFF" });
return false;
});

$(" #fcw-color #fcw-blue ").click(function() {
$(" .post-body ").css({ color: "#0066CC" });
return false;
});

$(" #fcw-color #fcw-gray ").click(function() {
$(" .post-body ").css({ color: "#666666" });
return false;
});
// Change Font Color -- ends

// Change Font Size -- begins
$(" #fcw-size #fcw-10 ").click(function() {
$(" .post-body ").css({ fontSize: "10px" });
return false;
});

$(" #fcw-size #fcw-12 ").click(function() {
$(" .post-body ").css({ fontSize: "12px" });
return false;
});

$(" #fcw-size #fcw-14 ").click(function() {
$(" .post-body ").css({ fontSize: "14px" });
return false;
});

$(" #fcw-size #fcw-16 ").click(function() {
$(" .post-body ").css({ fontSize: "16px" });
return false;
});
// Change Font Size -- ends
});
</script>
<!-- TUW Blogger Change Font color and size widget begins -->
<div id="tuw-font-change-widget">
<div class="tuw-fcw">
<h2> Change Font Color </h2>
<ul id="fcw-color">
<li> <a id="fcw-black" href="#">black</a> </li>
<li> <a id="fcw-white" href="#">white</a> </li>
<li> <a id="fcw-blue" href="#">blue</a> </li>
<li> <a id="fcw-gray" href="#">gray</a> </li>
</ul>
</div>

<div class="tuw-fcw">
<h2> Change Font Size </h2>
<ul id="fcw-size">
<li> <a id="fcw-10" href="#">10</a> </li>
<li> <a id="fcw-12" href="#" title="Default Size">12</a> </li>
<li> <a id="fcw-14" href="#">14</a> </li>
<li> <a id="fcw-16" href="#">16</a> </li>
</ul>
</div>
</div>
<!-- TUW Blogger Change Font color and size widget ends -->
<!-- Code ends -->

Read More