3/20/14

BLOGGER SEARCH BAR

බ්ලොග් ලියන යාලුවන්ට කරන උදවුවක් විදිහට මම මේ ලිපිය ලියන්නේ අපේ බ්ලොග් ලියන සහෝදර යාලුවන්ට තියෙන ප්‍රධානම ප්‍රශ්නයක් තමයි මෙන්න මේ බ්ලොග් වලට අවශ්‍ය ටෙම්ප්ලේට් එකක් යොදාගන්න එක සමහර ටෙම්ප්ලේට්ස් හොද උනාට ඒවගේ තියෙන අඩුපාඩුකම් බොහොමයි ඉතින් ඒ අඩුපාඩුකම් වලින් විශාලම එකක් වෙන්නේ මේ ටෙම්ප්ලේට්ස් වල සර්ච් ගැජට් එකක් නැති එක ගූගල් එකෙන් බ්ලොග් සදහා මේ පහසුකම දුන්නත් අපේ ඒකෙන් සර්ච් වෙන්නේ අපේ බ්ලොග් එකේ ටයිටල් එක නෙමේ ඒකෙන් සර්ච් වෙන්නේ පොස්ට් වල ඇතුලේ තියෙන කීවර්ඩ්ස් අපේ ලංකාවේ බ්ලොග් ලියන කට්ටිය පාවිච්චි කරන්නේ සිංහල නිසා මේ සර්ච් එන්ජින් එකෙනුත් වැඩක් නෑ මේ අඩුපාඩුව මග හරවා ගන්න අපි දැන් හොදම සර්ච් ගැජට් එකක් ඔබේ බ්ලොග් එකට එකතු කරගන්නේ කොහොමද කියලා කියල දෙනවා මේ ගැජට් එකෙන් අපේ ටයිටල් එක විතරක් නෙමේ අපේ පොස්ට් වල අන්තර්ගතය පවා පෙන්නනවා...එහෙනම් අපි වැඩේට බහිමු...වැඩේ කරන්න කලින් ඔයාගේ ටෙම්ප්ලේට් එක Backup කරගන්නත් අමතක කරන්න එපා ඔයාගේ අතින් අත්වැරැද්දක් උනොත් පහසුවෙන්ම නැවත බ්ලොග් එක කලින් තිබුන විදිහටම හදාගන්න පුළුවන් 

මුලින්ම TEMPLATE => EDIT HTML යන්න 

Ctrl+F භාවිතයෙන් ]]>
සොයා ගන්න දැන් ]]> වලට පහල දීල තියෙන කෝඩ්ස් ටික කොපි කරගෙන පේස්ට් කරන්න 



/*Start Css For Google Style Search Box*/ /* div container containing the form */ #searchContainer { margin:0px; } /* Style the search input field. */ #field { float:left; width:180px; height:27px; line-height:27px; text-indent:10px; font-family: Source Sans Pro, sans-serif; font-size:1em; color:#333; background: #fff; border:solid 1px #d9d9d9; border-top:solid 1px #c0c0c0; border-right:none; } /* Style the "X" text button next to the search input field */ #delete { float:left; width:16px; height:29px; line-height:27px; margin-right:15px; padding:0 10px 0 10px; font-family: "Lucida Sans", "Lucida Sans Unicode",sans-serif; font-size:22px; background: #fff; border:solid 1px #d9d9d9; border-top:solid 1px #c0c0c0; border-left:none; } /* Set default state of "X" and hide it */ #delete #x { color:#A1B9ED; cursor:pointer; display:none; } /* Set the hover state of "X" */ #delete #x:hover { color:#36c; } /* Syle the search button. Settings of line-height, font-size, text-indent used to hide submit value in IE */ #submit { cursor:pointer; width:60px; height: 31px; line-height:0; font-size:0; text-indent:-999px; color: transparent; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEtdChrSL0eZINlKPzwHNy7jJuJgpB6dZB5tnoEU5eW4jxtcxvmDOguSgGWbzqTSaip1AgKGU4QxrU_qalRULXgTzrXZPoiG0h_MMPAyFVUfDX3102mOt5jUE2DAOXvUIjZfePPKp6nmly/s1600/iconsearch.png) no-repeat #088a4b center; border: 1px solid green; -moz-border-radius: 2px; -webkit-border-radius: 2px; } /* Style the search button hover state */ #submit:hover { background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEtdChrSL0eZINlKPzwHNy7jJuJgpB6dZB5tnoEU5eW4jxtcxvmDOguSgGWbzqTSaip1AgKGU4QxrU_qalRULXgTzrXZPoiG0h_MMPAyFVUfDX3102mOt5jUE2DAOXvUIjZfePPKp6nmly/s1600/iconsearch.png) no-repeat center #088a4b; border: 1px solid green; } /* Clear floats */ .fclear {clear:both}

දැන් නැවතත්  Ctrl+F භාවිතයෙන්
 ටැග් එක හොයාගෙන ඒ ටැග් එකට ඉහලින් පහල තියෙන කෝඩ් ටික කොපි කරලා පේස්ට් කරන්න 


දැන් ටෙම්ප්ලේට් එක Save කරගන්න 

හරි දැන් කරන්න තියෙන්නේ බොහොම සුළු දෙයක් විතරයි 

Layout => Add a Gadget => HTML/JAVE SCRIPT වලට ගිහින් පහලින් තියෙන කෝඩ් ටික එකතු කරගන්න 


x

දැන් SAVE කරගන්න දැන් අපේ වැඩේ හරි ඔයාලට ඔයාගේ බ්ලොග් එකට ගිහින් බලන්න පුළුවන් සර්ච් බාර් එක කොහොමද කියලා මම නම් හිතන්නේ ඒක අපිට වටිනවා කියලා

1 comment:

Comment කරලා යන්න අමතක කරන්න එපා...