হ্যালো বন্ধুরা, অনলাইন কাজে ব্লগে স্বাগতম আজ এই পোস্টে, আমরা ব্লগার পোস্টে রিজপন্সসিপ ট্যাবিল তৈরি সম্পর্কে জানব। এবং এমন পরিস্থিতিতে, আজকাল অনেক বন্ধু ব্লগিং করতে ব্লগার বা ব্লগস্পট ব্যবহার করে।
এমন পরিস্থিতিতে ব্লগারের জন্য কোনও প্লাগইন ইনস্টল করার কোনও সুবিধা নেই। সুতরাং এটির জন্য ব্লগার এইচটিএমএল দিয়ে তৈরি করা হয়েছে। এইভাবে, নতুন ব্লগার রিজপন্সসিপ ট্যাবিল কোডিংয়ের মাধ্যমে তৈরি করা হয়েছে।
রিজপন্সসিপ ট্যাবিল ও সার্চ বার স্ক্রিপ্ট কোডঃ
আপনি যদি ব্লগিংও করেন এবং আপনার ব্লগের জন্য ব্লগার প্লেটফর্ম ব্যবহার করুন। সুতরাং আপনি জানবেন যে ব্লগারে আমরা কিভাবে রিজপন্সসিপ ট্যাবিল যুক্ত করার বৈশিষ্ট্যটি গুলি। এমন পরিস্থিতিতে, কোডিংয়ের মাধ্যমে আমাদের এইচটিএমএল, সিএসএস এবং জাভাস্ক্রিপ্ট ব্যবহার করে একটি রিজপন্স টেবিল তৈরি করতে হবে।
| Name | Country |
|---|---|
| Alfreds Futterkiste | Germany |
| Berglunds snabbkop | Sweden |
| Island Trading | UK |
| Koniglich Essen | Germany |
| Laughing Bacchus Winecellars | Canada |
| Magazzini Alimentari Riuniti | Italy |
| North/South | UK |
| Paris specialites | France |
এমন পরিস্থিতিতে এখন সার্চ বারের বৈশিষ্ট্যযুক্ত সার্চ বারও চালু করা হয়েছে। তারপরে যদি আমাদের এটি আমাদের ব্লগারে যুক্ত করতে হয় তবে আমাদের ব্লগারের জন্য সার্চ বার স্ক্রিপ্ট সহ একটি রিজপন্স টেবিলের প্রয়োজন হবে
রিজপন্সসিপ টেবিল এবং সার্চ বার কিভাবে এ্যড করেন?
- সবার আগে ব্লগার ড্যাশবোর্ডে যান
- এখন Theme এ যান> থিম Edit Html করুন এবং সার্চ করুন <Head> নিচে
- এখানকার সিএসএস কোড CSS এবং উপরে পেস্ট করুন তারপর সেভ করুন।
<style>* {box-sizing: border-box;} #myInput {background-image: url('/css/searchicon.png');background-position: 10px 10px;font-size: 16px;background-repeat: no-repeat; width: 100%;margin-bottom: 12px;padding: 12px 20px 12px 40px; border: 1px solid #ddd; } #myTable {font-size: 18px;border-collapse: collapse; width: 100%; border: 1px solid #ddd; background-color: #15ff0038;border-bottom: 1px solid #ddd;} #myTable th, #myTable td { text-align: left; padding: 12px; } #myTable tr { }</style>#myTable tr.header, #myTable tr:hover { background-color: #f1f1f1;}
- এখন নতুন পোস্টে ক্লিক করুন
- এইচটিএমএল কোড যান
- এইচটিএমএল ভিউ এবং স্ক্রিপ্ট স্ক্রিপ্ট এ যান
<input type="text" id="myInput" onkeyup="myFunction()" placeholder="Search for names.." title="Type in a name"><table id="myTable"> <tr class="header"> <th style="width:60%;">Name</th></tr><th style="width:40%;">Country</th> </tr> <tr> <td>Alfreds Futterkiste</td> <td>Germany</td> <tr><tr><td>Berglunds snabbkop</td> <td>Sweden</td> </tr> <tr> <td>Island Trading</td> <td>UK</td> </tr> <td>Koniglich Essen</td><td>Magazzini Alimentari Riuniti</td><td>Germany</td> </tr> <tr> <td>Laughing Bacchus Winecellars</td> <td>Canada</td> </tr> <tr> <td>Italy</td> </tr> <tr>var input, filter, table, tr, td, i, txtValue;<td>North/South</td> <td>UK</td> </tr> <tr> <td>Paris specialites</td> <td>France</td> </tr> </table> <script> function myFunction() {for (i = 0; i < tr.length; i++) {input = document.getElementById("myInput"); filter = input.value.toUpperCase(); table = document.getElementById("myTable"); tr = table.getElementsByTagName("tr");} else {td = tr[i].getElementsByTagName("td")[0]; if (td) { txtValue = td.textContent || td.innerText; if (txtValue.toUpperCase().indexOf(filter) > -1) { tr[i].style.display = "";</script>tr[i].style.display = "none"; } } }}
Post a Comment
By commenting you acknowledge acceptance of Whatisloved.com-Terms and Conditions