Skip to main content

Blog එකට ලස්සන Search bar එකක් දාමු




 



පහුගිය දවසක මට අපේ හිරුව කලින් ලියපු හුඹස් මැටි ලිප ගැන පෝස්ට් එක හොයාගන්න ඕන උනා. ඒත් බ්ලොග් එකට ගිහින් බැළුවම කොහෙ හොයන්නද.. අනේ ඉතිං මුළ ඉඳල පෝස්ට් එක හම්බ වෙනකම් බල බල ආවා..
ම්හු... එපා උනා .. ඒ පාර වැඩේ අතෑරල දාන්න හදන කොට ගූගල් අයියව මතක් උනා. තරහටත් එක්ක search keyword එක දුන්නෙ මෙහෙමයි. මෙන්න බොලේ පට ගාලා ආවා..


මොකක් උනත් ඒකත් හැම තිස්සෙම හරියන්නෙ නෑ. seo index කරන්න බැරි template තියෙන බ්ලොග් Google එකට මෙහෙම අහු වෙන්නෙ නෑ.. සමහර template වලට නම් Search bar එකක් එනවා. ඒත් බොහෝ ඒවට නෑ. blogger එකෙන් දීල තියෙන Custom search widget එකත් මාර අසාර්ථකයි. ඒකෙන් පෝස්ට් එකක් හොයන්න පෝස්ට් එක දාල මාසයක් විතර බලං ඉන්න වෙනවා.

ඉතිං අද මේ ගෙනාවෙ ඒකට පුංචි විසඳුමක්. කැමති පාටකින් එකක් තෝරගෙන ඒකෙ code එක copy කරගන්න.
  • Layout >> Add a Gadget >> HTML/Java widget එකක් අරන් ඔය කෝඩ් එක දාල save කරන්න. වැඩේ එච්චරයි.



<style type="text/css"> #abt-searchbox{ border-radius:5px; background:URL(http://2.bp.blogspot.com/-vGjST2sX6Ts/T88uy-eRYUI/AAAAAAAAAog/xhJ2A0nGnpw/s1600/black.png) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;} form#abt-searchform{display: block;padding: 10px 12px;margin:0;} form#abt-searchform #s{padding-left:16px !important; padding:7.5px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;} form#abt-searchform #sbutton{margin:0;padding:0;height:40px; width:44px;vertical-align: top;border:none;background:transparent;} </style> 
<div id="abt-searchbox">
<form action="/search" id="abt-searchform" method="get">
<input id="s" name="q" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Search...&quot;;}" onfocus="if (this.value == &quot;Search...&quot;) {this.value = &quot;&quot;}" type="text" value="Search..." />     <input id="sbutton" src="http://img1.blogblog.com/img/blank.gif" type="image" /> </form>
</div>




<style type="text/css"> #abt-searchbox{ border-radius:5px; background:URL(http://4.bp.blogspot.com/-hxd1468RbE4/T88u0xTfk1I/AAAAAAAAApQ/BZ1WB9VG_3g/s400/whitez%2Bby%2Babt.png) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;} form#abt-searchform{display: block;padding: 10px 12px;margin:0;} form#abt-searchform #s{padding-left:16px !important; padding:7.5px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;} form#abt-searchform #sbutton{margin:0;padding:0;height:40px; width:44px;vertical-align: top;border:none;background:transparent;} </style> <div id="abt-searchbox"> <form id="abt-searchform" action="/search" method="get"> <input type="text" id="s" name="q" value="Search..." onfocus='if (this.value == "Search...") {this.value = ""}' onblur='if (this.value == "") {this.value = "Search...";}'/> <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton" /> </form> </div>




<style type="text/css"> #abt-searchbox{ border-radius:5px; background:URL(http://4.bp.blogspot.com/-Z_Bf8C64sWs/T88uy_rLu3I/AAAAAAAAAow/EcYyd6sKjxA/s400/bluez%2Bby%2Ballbloggingtips.png) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;} form#abt-searchform{display: block;padding: 10px 12px;margin:0;} form#abt-searchform #s{padding-left:16px !important; padding:7.5px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;} form#abt-searchform #sbutton{margin:0;padding:0;height:40px; width:44px;vertical-align: top;border:none;background:transparent;} </style> <div id="abt-searchbox"> <form id="abt-searchform" action="/search" method="get"> <input type="text" id="s" name="q" value="Search..." onfocus='if (this.value == "Search...") {this.value = ""}' onblur='if (this.value == "") {this.value = "Search...";}'/> <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton" /> </form> </div>




<style type="text/css"> #abt-searchbox{ border-radius:5px; background:URL(http://4.bp.blogspot.com/-T2F6d51MVw8/T88u0v_kIqI/AAAAAAAAApE/pB5bbugoVoM/s400/transparent%2Bby%2Ballbloggingtips.png) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;} form#abt-searchform{display: block;padding: 10px 12px;margin:0;} form#abt-searchform #s{padding-left:16px !important; padding:7.5px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;} form#abt-searchform #sbutton{margin:0;padding:0;height:40px; width:44px;vertical-align: top;border:none;background:transparent;} </style> <div id="abt-searchbox"> <form id="abt-searchform" action="/search" method="get"> <input type="text" id="s" name="q" value="Search..." onfocus='if (this.value == "Search...") {this.value = ""}' onblur='if (this.value == "") {this.value = "Search...";}'/> <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton" /> </form> </div>




<style type="text/css"> #abt-searchbox{ border-radius:5px; background:URL(http://1.bp.blogspot.com/-D98wjamWcwk/T88u0dnSPuI/AAAAAAAAAo4/U4Oy3x-zhRg/s400/pinkz.png) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;} form#abt-searchform{display: block;padding: 10px 12px;margin:0;} form#abt-searchform #s{padding-left:16px !important; padding:7.5px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;} form#abt-searchform #sbutton{margin:0;padding:0;height:40px; width:44px;vertical-align: top;border:none;background:transparent;} </style> <div id="abt-searchbox"> <form id="abt-searchform" action="/search" method="get"> <input type="text" id="s" name="q" value="Search..." onfocus='if (this.value == "Search...") {this.value = ""}' onblur='if (this.value == "") {this.value = "Search...";}'/> <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton" /> </form> </div>




තව පුංචි උදව්වක් බලාපොරොත්තු වෙනවා. මේක මං බ්ලොග් ලියන යාළුවන්ගෙන් ඉල්ලන මුල්ම උදව්ව..
ඔයාල කැමති නම් , ප්‍රජෝජනවත් වැඩක් කියල හිතෙනව නම් මගේ මේ Software බ්ලොග් එකේ පුංචි ලින්ක් එකක් ඔයාගෙ බ්ලොග් එකෙත් දාල සන්හිඳ follower කෙනෙක් වෙන්න කියල ආරාධනා කරනවා...


Grab button for SANHIDA.COM










මේ දෙකෙන් කැමති එකක කෝඩ් එක Layout >> Add a Gadget >> HTML/Java widget විදියටම දාන්න පුළුවන්..

Comments

  1. ඔන්න වැඩ දෙකම හරි. 'සර්ච්' option ඒක ෙහාදට වැඩ නම් පරණ 'සර්ච්' ඒක අයින් කරනවා.

    ReplyDelete
    Replies
    1. ගොඩක් ස්තූතියි ! ඔව් මේක අනිව වැඩ. මමත් දාල තියෙන්නෙ මේක :)

      Delete
  2. තෑන්ක්ස් හොඳේ.
    ඉදිරියෙදී එක් කර ගැනීමට සුදුසු ගැජට්ටුවක්.

    ReplyDelete
    Replies
    1. අනාගතයට කල් දමන කාර්යයන් කිසිදු විටෙක නොකෙරෙනු ඇත :P

      Delete
  3. මගෙත් එකක් නෑනේ.. දානවද නැද්ද කියලා මේ කල්පනා කලේ..

    ReplyDelete
    Replies
    1. Search කරන්න ඕන වෙන්නෙ tech blog විතරක්ම නෙවෙයි.. ඕනම එකක ලස්සන පෝස්ට් එකක් තිබුනොත් ආපහු ඇවිත් කියවන්න හිතෙනවා.. :/

      Delete
  4. මේ බ්ලොග් එකට නම් ඔය ගැජට් එක වැඩක් නැහැ.මොකෝ සර්ච් කරන්න තරම් වැදගත් දේවල් නැහැනේ...:D

    ReplyDelete
    Replies
    1. බ්ලා... බ්ලා... බ්ලා.... @-) @-) @-) @-) @-) @-)

      Delete
  5. වැඩේ නම් හොදයි... මලය දන්නවනේ මේ වගේ තාක්ෂණික දේවල් වලට මගේ උනන්දුව නිල් කියලා..

    ReplyDelete
    Replies
    1. තාක්ෂණය නැති ලොවක අපි මොකුන් වම්හ ? :D

      Delete
  6. ලස්සණ වැඩක්. එකතු කරල බලන්නම්කෝ....

    ReplyDelete
    Replies
    1. කෝ කිව්වට එකතු කරල නෑනේ :((

      Delete
    2. ඒකතු කළා පොඩි වැඩකුත් දාලා :)

      Delete
  7. කෝ බොල මගෙ ක්මෙන්ට් එක? :/ ඒක හොයලා දාපිය

    ReplyDelete
    Replies
    1. කොහෙන් හොයන්නද ? ස්පෑම් වලත් නැති කොට X( එනව මෙතන කෙප්ප ගහගෙන :P

      Delete
    2. හත්වලාමේ දැම්මා බොලව් :/

      Delete
  8. cach වලින් හිරු ට මඩකුත් වැදිලා ... :P

    මෙකෙන් search වෙන්නෙත් google හරහා නේද ?

    ReplyDelete
    Replies
    1. නෑ... නිකංම ජාව කෝඩ් කෑල්ලකින්

      Delete
  9. මාව කාලා මේ ගෙම්බා... හි හි.... මං කිව්වේ ගූගල් ගෙම්බා... බලන්නකෝ සර්ච් එකට ඇව්ල්ලා තියෙන කතන්දර ටික.. ෂික්..

    දැන් ඒ කියන්නේ මං ඔය කෑල්ල එල්ලන්න ඕනද මලයෝ.. ඇයි අර වැදගත් විදියට පැත්තකින් එල්ලලා තියෙන ලේබල් වලින් අපේ මහත්තයගේ වීරකම් කියන එකට කෙටුවනං ඔය අගේට එන්නේ ලිපේ විස්තරේ...

    ReplyDelete
  10. ඔන්න මමත් ගත්තා තැඹිලි පාට එක මගේ සොඳුරු මංපෙතට දාන්න.

    ReplyDelete
    Replies
    1. මෑත කාලීන ව ධාරාගේ අධ්‍යයන කටයුතුවල මතු වී ඇති උග්‍ර අර්බුද හේතුවෙන් බ්ලොගයට ලිපි ලිවීම බලධාරියා විසින් තාවකාලික ව අත් හිටුවා ඇති බව කරුණාවෙන් සලකන්න.

      :)) :)) :))

      Delete
    2. බොට එහෙම නං හිනා! හිටු, යසිත් අයියාට එළඹෙන වසර පුරා ම නිමක් නැති විභාගවලට මුහුණ දෙන්න ලැබේවා! ඒ හැම එකක් ම අමාරු ‍වී ‍චොර වී යැවේවා! හනී බනී අක්කාගෙන් වැඩි වැඩියෙන් බැනුම් ඇසීමට ම ලැබේවා!
      මේ තමයි බොල අවංක සහෝදර ප්‍රේමය :D

      Delete
    3. කවුද අෆ්ෆා විභාග වලට බය :P මට නම් විභාග කියන්නෙ මාර කම්මැලි වැඩක් :D ලියන්න දේකුත් නෑනේ :))

      Delete
    4. ඒක නං අමූලික ඇත්ත කතාවක්.

      Delete
  11. ගැජට් එක දාන්න නම් පුලුවන් ඒත් වැඩක් වෙයිද කියල කල්පනා කලේ :-/

    ReplyDelete
    Replies
    1. ඔයාට වැඩක් නොවුනට කියවන අයට වැඩක් වේවි :D

      Delete
  12. මට ඕක දාන්න නම් සුට්ටක් විතර එඩිට් කොරන්න වෙනව. බ්ලොග් එකේ සයිඩ් බාර් එක පලල මදි. ඒකට මේ දවස් වල වෙලාව මදි. වැඩේ නම් හොඳයි.

    ReplyDelete
    Replies
    1. Post එකට උඩින් දාන්න පුළුවන්නේ.. :)

      Delete
  13. මම නම් ඒ ගැජට් එක දාන්න කැමතියි. ඒත් හොයන්න තරම් ලිපි ගොඩක් නැනෙ. හැබැයි ඔයාගෙ බ්ලොග් එකේ ලින්ක් එකක් නම් දාල තියෙනවා.

    ReplyDelete
  14. max hithuve oyaage blog ekei link ekak kiyala. dhanna try karannam. hari yayidha dhanne naea.

    ReplyDelete
    Replies
    1. ලින්ක් එක දැම්ම. හරි ගියෙ නැ. ඇවිත් බලන්න.

      Delete
    2. මට හොයා ගන්න බෑනේ.... :(
      මං හිතුවෙ සන්හිඳ එකේ ලින්ක් එක දැම්ම කියල අර මාතලන්ගේ සින්ඩිය වගේ :)

      Delete
    3. ඔබ දාන්න කියපු ලින්ක් එක දාල තියෙන්නෙ . මගෙ බ්ලොග් එකේ වම් පැත්තෙ බලන්න. ඒක වැරදියි. හරියට ලින්ක් එක දාන හැටි තව පැහැදිලි කරන්න.

      Delete
  15. වැඩේ තියෙන්නේ බං පොස්ට් එකක් වත් ලියා ගන්න මේ දවස් වල කාලේ නැති එකයි

    ReplyDelete
    Replies
    1. කාර්යා..... බහුලා... වෙලාද ? :D

      Delete
  16. හුම් .....දාමු බලන්ට .. :D

    ReplyDelete
    Replies
    1. හරේ... දාන්න දාන්න.. :)

      Delete
  17. දානවද? නැද්ද? දානවද? නැද්ද? :-w අනේ මගේ එකේ නම් සර්ච් කරලා කියවන්න තරම් දෙයක් නැති නිසා ඔන්න ඔහේ ඕනි නෑ.....

    ReplyDelete
    Replies
    1. බ්ලා.....බ්ලා......බ්ලා.

      Delete
  18. වැදගත් වැදගත් මේක ...

    ReplyDelete
  19. Kollo , meke Search Button eka wada nadda ?? Nath nam mage eke Aulak da ??

    ReplyDelete
  20. වැඩේනම් ගිංදර මචම් :-*

    ReplyDelete

Post a Comment

◘ සිංහල අක්ෂර භාවිතා කිරීමට : වම්පස පහල "සිංහල" බොත්තම click කරන්න.
◘ Photo comment දැමීමට : [im]http://1.bp.blogspot.com/-jk5ApMyd4VM/UnkD_bWnI9I/AAAAAAAACAQ/gedRQoN9cmQ/s1600/image.png[/im]
♥ පෞද්ගලික පණිවිඩ සඳහා : info@yasith.net

You May Like Also,

පන්සිය පණස් ජාතක පොත

මේක දෙන්නෙ හිටියෙ මීට ගොඩ දවසකට කලින් උනත් විවිධ හේතු නිසා අතපසු උනා.. අද පෝය දවසෙ කොහොම හරි දානව කියල හිතා ගත්තා... පන්සිය පණස් ජාතකය, ඔව් බුදුරජාණන් වහන්සේ පෙර ආත්ම 550 ක , උන්වහන්සේ විසින් දේශණා කරපු ජාතක කතා මේකෙ ඇතුලත්.. අපි සාමාන්‍යයෙන් දන්න විදියට පන්සිය පණස් ජාතකය කිව්වට දැනට නිකුත් වී තියෙන ග්‍රන්ථයේ ඇතුළත් වෙන්නෙ ජාතක කථාංග 447 හෝ 446.. අනිත් 3 හෝ 4 ගැන සඳහනක් නෑ.. නමුත් මේ විද්‍යූත් ලේඛන පිටපතේ ජාතක කථාංග 550 ම ඇතුළත්.. අවසන් කථාංග 4 බුදුරජාණන් වහන්සේ දේශනා නොකළ නමුත් කටවහරෙන් පැවතෙන ජාතක කථාංග ඇතුලත් කරල තියෙනවා.. මට මේක හම්බ උනේ වෙන වෙනම කොටස් විදියට. මං සියල්ල එකතු කරල තනි PDF file එකකට merge කරා... අවශ්‍ය තැන් bookmark කරන් කියවන්න පුළුවන්නෙ... 19.9 MB  ඔබගේ පරිගණකයේ මෙහෙයුම් මෘදුකාංගය Windows XP හෝ Windows 7 නම්, PDF file reader එකක් නැතිනම් මෙතනින් adobe reader එක අරගන්න..

බ්ලොග් එකේ Navigation Bar එක අයින් කරමුද ?

අපි බ්ලොගර් වලින් බ්ලොග් එකක් හැදුවම මෙන්න මෙහෙම බ්ලොග් එකට උඩින් Navigation Bar එකක් වැටෙනවනෙ. කැතයි වගේ නේද ? එහෙනම් ඉතින් අයින් කරමු. මේක අයින් කරාම බ්ලොග් එකේ SEO වඩා හොඳින් වෙනව කියල  digitalpoint forum එකේ තිබුන. නමුත් ඒ ගැන නම් මං හරියට කියන්න දන්නෑ. මෙන්න මෙහෙමයි වැඩේ , ඔයා පැරණි blogger interface එක නම් පාවිච්චි කරන්නෙ, Dashboard  >> Design >> Edit HTML වෙත යන්න. අළුත් blogger interface එකේ නම් කෙලින්ම Template කියල තියෙනව. දැන් මේක කරන්න කලින් full template එකම download කරන් ඉන්න. නැත්නම් වරද්දගෙන මට බනින්න එප. (වරදින්න දේකුත් නෑ හැබැයි ) දැන් අළුත් blogger interface එකේ අයත් තමන්ගෙ දැනට active template එකේ Edti HTML වෙත යන්න. දැන් මෙහෙම පණිවිඩයක් ආවනෙ. එතන Proceed ක්ලික් කරන්න.  දැන් ඔයාගෙ template එකේ HTML කෝඩ් තියෙනව පෙනෙයි. දැන් මේ පහත රූපෙ විදියට variable definitions කියන තැන හොයා ගන්න. අමාරු නම් Ctrl + F ගහල හොයා ගන්නකො.  දැන් ඔන්න ඔය කෝඩ් එකෙන් උඩට, ඒ කියන්නෙ *variable definitions තැනයි උඩ කඩ ඉරි පේලියයි අතරට මෙන්න මේ පුංචි කෝඩ් එ

පෙම්වතියක් තෝරගන්නෙ කොහොමද ?

හනී බනී වෙන් වෙලා දැන් මාස 8ක් විතර ඇති. ගොඩක් දෙනා අහන දෙයක් තමයි එච්චර  ආදරේ කරා නම් කොහොමද දැන් ගානක් නැතුව ඉන්නෙ කියන එක. ඕකට හොඳ උදාහරණයක් කියන්නම්. අපේ තාත්තගෙ මිත්‍රයෙක්ගෙ wife ළඟදි Cancer එකකින් නැති උනා. පෞද්ගලිකවම මං දන්න දෙයක් තමයි ඒ දෙන්න අතරෙ පුදුම ආදරයක් තිබුනෙ. එයාලගෙ විවාහ ජීවිතේට අවුරුදු 19කටත් වැඩියි. ඒත් මළ ගෙදරදි, ආදාහන කටයුතු කරද්දිවත් ඒ අංකල් පොඩ්ඩක්වත් ඇඬුවෙ නෑ. කිසිම දුකක් පේන්න තිබුනෙත් නෑ. හිස් බැල්මෙන් බලාගෙන හිටිය විතරයි. කටයුතු ඉවර වෙලා අපි ආපහු යනකොට ඒ මනුස්සය කිව්ව හරි අපූරු කතාවක්, "නෝන නැති උනාට මට දුකක් නෑ.. ඒත් එයා නැති පාළුව මගේ ජීවිත කාලෙම තියේවි. පහුගිය අවුරුදු 19ටම එයා මටත්, මගෙන් එයාටත් වෙන්න ඕන යුතුකම් ටික ඉටු කරා. අපි දෙන්න දෙන්නටම ණය නෑ.." එච්චරයි.. මමත් කාටවත් ණය නෑ.. ඒත් අද (ඔක්තෝම්බර් 30) තමන්ගෙ 20 වෙනි උපන් දිනේ සමරන හනී බනීගෙ සියළු කටයුතු, අනාගතේ, බලාපොරොත්තු සාර්ථක වෙන්න කියල මං හදවතින්ම ප්‍රාර්ථනා කරනවා.. ඇත්තටම ඇයි කොල්ලෙකුයි කෙල්ලෙකුයි (සම්මතයට අනුව) යාළු වෙන්නෙ/ ආදරේ කරන්නෙ/සම්බන්ධයක් ඇති කර ගන්නෙ ?? කෙල්ලන්ගෙ පැත්ත