Monday, October 10, 2011

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 -->


6 comments:

  1. ඉතාමත් වටින ලිපියක් .හැබැයි සිංහල යුනිකෝඩ්ස් වලින් හදපු බ්ලොග් වලටත් සපෝට් කරනවාද කියලා දැන ගන්න කැමැතියි.

    ReplyDelete
  2. අනිවාර්යයෙන්ම වැඩ කරන්න ඕනේ..මොකද මේක java script එකක්නේ ඒකට යුනිකෝඩ් වලින් බලපෑමක් නෑ...java script run වෙන්න ඕනේ browser ඒක විතරයි

    ReplyDelete
  3. මාත් හොය හොයා හිටියෙ බොහොම ස්තූතියි. ඒත් මේකෙදි ඔයාගේ body text වලට වැඩි වෙනසක් පේන්න නෑනේ?

    ReplyDelete
  4. ප්ප්‍රතිචාරයට බොහොමත්ම ස්තුති..
    script ඒක වෙනස් කලා..දැන් try කරලා බලන්න

    ReplyDelete
  5. එල ලිපියක් ස්තුතිය

    ReplyDelete

ලිපි පිළිබද ඔබේ අදහස් ,යෝජනා,චෝදනා පහත තිරයේ දක්වන්න.....
ස්තුති

ජනප්‍රිය ලිපි

අපේ තත්වය මෙහෙමයි