কিভাবে অনলাইন বয়স ক্যালকুলেটর ওয়েবসাইট তৈরি করবেন?

বয়স ক্যালকুলেটর স্ক্রিপ্টঃ হ্যালো বন্ধুরা! অনলাইন কাজ ব্লগে আপনাকে স্বাগতম, বন্ধুরা আজকের এই পোস্টে আমরা (কীভাবে ব্লগারের ভিতর-এ বয়স ক্যালকুলেটর টুল তৈরি করব) সে সম্পর্কে কথা বলতে যাচ্ছি। এবং এই ব্লগার.কমে কিভাবে অনলাইন বয়স ক্যালকুলেটর ওয়েবসাইট বানানো যায় সে সম্পর্কেও জানব। সুতরাং আমরা এই আটির্কেলে এই সমস্ত জিনিস জানব। সুতরাং আমাদের সাথে থাকুন এবং পুরোটা জানুন।

অবশ্যই পড়ুন-

এখনকার দিনে ব্লগিং স্তরে বিভিন্ন বিভাগ রয়েছে, অনলাইন বয়স ক্যালকুলেটর টুল এটি ওয়েব টুলগুলির মধ্যে একটি। আমার অনেক ভিউয়ার  আমাকে কমেন্টে জিজ্ঞাসা করেছেন, যে আমরা কিভাবে ব্লগার / ব্লগস্পট প্ল্যাটফর্মে “Age Calculatot Tool” তৈরি করতে পারি?

    আমি আপনাকে পরিষ্কারভাবে বলতে পারি যে বয়স ক্যালকুলেটরটির একটি আলাদা চাহিদা রয়েছে। সুতরাং  সমস্ত নতুন ব্লগারই চাই তাদেরও নিজস্ব বয়স বের করার ক্যালকুলেটর টুল তাদের ওয়েবসাইট বা পেজ থাক। সুতরাং, এই পোস্টে আমি কীভাবে আপনি সহজেই একটি “বয়স বের করার টুল”  তৈরি করতে পারবেন তা বিস্তারিতভাবে ব্যাখ্যা করেছি।

    বয়স ক্যালকুলেটর টুল কী?

    এমন অনেক নতুন ব্লগার আছেন যারা সবেমাত্র ব্লগিংয়ের ক্ষেত্রে পা রেখেছেন। যা তাদের এখন এই ব্লগিং ইন্ডাস্ট্রিজে নতুন কিছু করতে হবে। সুতরাং এই পরিস্থিতিতে, সমস্ত ব্লগারই চায় যে কোনও কিছু আলাদা করা হোক। সুতরাং এই পদ্ধতিতে একটি  (বয়স বের করার টুল) নামে আসে।

    এমন অনেক নতুন ব্লগার আছেন যারা সবেমাত্র ব্লগিংয়ের ক্ষেত্রে পা রেখেছেন। যা তাদের এখন এই ব্লগিং ইন্ডাস্ট্রিজে নতুন কিছু করতে হবে। সুতরাং এই পরিস্থিতিতে, সমস্ত ব্লগারই চায় যে কোনও কিছু আলাদা করা হোক। সুতরাং এই পদ্ধতিতে একটি  (বয়স বের করার টুল) নামে আসে।

    অবশ্যই পড়ুন-

    তাই অনেকে এই (বয়স ক্যালকুলেটর স্ক্রিপ্ট) সম্পর্কে জানেন না। সুতরাং আমাকে এজ ক্যালকুলেটর টুল সাহায্যে তাদের বলি, আমরা সহজেই আমাদের বয়সটি জানতে পারি। যাইহোক, প্রচুর বয়স এবং তথ্য উত্তোলনের অনেকগুলি উপায় রয়েছে। তবে আপনি যদি এই টুল ব্যবহার করেন তবে আপনি একটি সেকেন্ড মধ্যে আপনার সঠিক বয়সটি জানতে পারবেন। 

    DEMO

    ব্লগারে অনলাইন বয়স ক্যালকুলেটর টুল তৈরি করার উপায়ঃ

    বন্ধুরা, এখন আমি আপনাকে কিছু পদক্ষেপগুলি বলেছি, যা আপনি সহজেই অনুসরণ করে আপনার ব্লগার ব্লগে এই “বয়স ক্যালকুলেটর টুল ফ্রিতে তৈরি  করতে পারবেন”। উপায় দ্বারা, আপনি ইন্টারনেটে এই রকম ক্যালকুলেটর টুল সম্পর্কিত অনেক ওয়েবসাইট সার্চ করতে পারেন।

    এবং বেশিরভাগ ডিজাইনের পরিবর্তিত হয়। সুতরাং আজকে আমি নীচে আপনাকে সরবরাহ করব এমন টুল সম্পূর্ণ আলাদা। আমি নীচে এই টুল তৈরি করতে এইচটিএমএল, সিএসএস এবং জাভাস্ক্রিপ্ট কোড সরবরাহ করব। এবং আপনাকে সমস্ত পদক্ষেপগুলি অনুসরণ করতে হবে।

    পদক্ষেপ # 1 -Blank Template Installed

    সর্বাধিক গুরুত্বপূর্ণ বিষয় হ'ল নীচের  বক্সে  ফাঁকা ব্লগার টেম্পলেটটি কপি করুন।
    <?xml version="1.0" encoding="UTF-8" ?>
    <!DOCTYPE html>
    <html b:css='false' b:responsive='true' expr:dir='data:blog.languageDirection' lang='en-US' xmlns='http://www.w3.org/1999/xhtml'
    xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
    <link href='https://www.onlinekaj.com' rel='canonical'/>
    <head> <meta content='width=device-width, initial-scale=1' name='viewport'/> <b:include data='blog' name='all-head-content'/>
    <b:section class='main' id='main' showaddelement='yes'/>
    <title><data:blog.pageTitle/></title> <b:skin><![CDATA[ body{background:#fff} ]]></b:skin> </head> <body> </body>
    </html>
    তারপরে এটিকে নোটপ্যাডে ওপনে করুন এবং এটি আপনার ব্লগার থিম ওপশন Edit HTML ক্লিক করুন এবং Ctrl+Alt করে আপনার কোড গুলো ডিলেট করুন, এখন উপরে দেওয়া কোডটি এখানে পেস্ট করুন। এখন থিম Save বাটনে ক্লিক করুন।

    পদক্ষেপ # 2 - Installed JavaScript

    বন্ধুরা, এখন আমি নীচের বক্সে জাভাস্ক্রিপ্ট কোড সরবরাহ করেছি।প্রথমে আপনাকে এটি কপি করতে হবে। এখন আপনাকে >Layout>Add a Gadget>HTML/JavaScript যেতে হবে। আপনি আপনার কোডটি এখানে এই কোডটি পেস্ট করুন এবং এটি সেভ বাটনে করুন।
    <script>
    let display = document.getElementById("display");
    let input = document.getElementsByTagName("input");
    let button = document.getElementsByTagName("button");
    let time = document.getElementById("time");
    let disBD = document.getElementById("disBD");
    let disBlock = document.getElementById("disBlock");
    let credit = document.getElementById("credit");
    let creditBlock = document.getElementById("postCredit"); let about = document.getElementById("about");
    let dob = new Date(), today = new Date(), calTime;
    disBlock.style.display = "none"; creditBlock.style.display = "none"; function samay() { let d = new Date();
    function calculate() {
    time.innerHTML = d.getHours() + " Hours, " + d.getMinutes() + " Minutes, " + d.getSeconds() + " Seconds Old"; }
    let x = input[1].value.split("-");
    disBlock.style.display = "block"; creditBlock.style.display = "block"; credit.innerHTML = "Thank You For Visiting<br>I am Techly360.com";
    if(today.getDate() > dob.getDate()) {
    dob.setDate(x[2]); dob.setMonth(x[1] - 1); dob.setFullYear(x[0]); let year, month, day, HBD; day = (function() {
    }
    return today.getDate() - dob.getDate() - 1; } else if(today.getDate() == dob.getDate()) { return today.getDate() - dob.getDate(); else {
    month = (function() {
    let calDate = new Date(dob.getFullYear(), dob.getMonth() + 1, 0); return (today.getDate() + calDate.getDate()) - dob.getDate() - 1; } }()); if(today.getMonth() >= dob.getMonth()) {
    return (today.getMonth() - 1) - dob.getMonth();
    if(today.getDate() >= dob.getDate()) { return today.getMonth() - dob.getMonth(); } else { if((today.getMonth() - 1) >= dob.getMonth()) { } else {
    else {
    return ((today.getMonth() - 1) + 12) - dob.getMonth(); } } } else { if(today.getDate() >= dob.getDate()) { return (today.getMonth() + 12) - dob.getMonth(); }
    else {
    return ((today.getMonth() - 1) + 12) - dob.getMonth(); } } }()); year = (function() { if(dob.getMonth() == today.getMonth()) { if(dob.getDate() > today.getDate()) { return (today.getFullYear() - 1) - dob.getFullYear(); }
    }
    return today.getFullYear() - dob.getFullYear(); } } else { if(dob.getMonth() > today.getMonth()) { return (today.getFullYear() - 1) - dob.getFullYear(); } else { return today.getFullYear() - dob.getFullYear(); } }()); HBD = (function(){
    display.innerHTML = "Hi Dear " + input[0].value + ", <br/>You are " + year + " Years, " + month +
    if(today.getMonth() == dob.getMonth()) { if(today.getDate() == dob.getDate()) { disBD.innerHTML = "OMG it's your Birthday<br>Happy Birthday To You<br>"; } else { disBD.innerHTML = ""; } } else { disBD.innerHTML = ""; } }()); " Months, " + day + " Days, ";
    </script>
    calTime = setInterval(samay, 1000); } button[0].onclick = calculate;//when calculate button is clicked function reset() { input[0].focus(); display.innerHTML = ""; time.innerHTML = null; clearInterval(calTime); disBlock.style.display = "none"; creditBlock.style.display = "none"; }
    button[1].onclick = reset;//when the reset button is clicked

    পদক্ষেপ # 3 -Installed CSS Scripts

    এখন আপনি নীচে কিছু সিএসএস স্ক্রিপ্ট পাবেন। সুতরাং আপনাকে এটিকে কপি করতে হবে এবং উপরের প্রদত্ত পদক্ষেপগুলি অনুসরণ করে এটি  করতে হবে এবং সহজেই এটি সেভ করে দিতে হবে।
    <style>
    @import url('https://fonts.googleapis.com/css?family=Gotu&display=swap');
    body { background-color: dodgerblue; font-family: 'Gotu', sans-serif;
    text-align: center;
    color: white; } label { font-size: 20px; } form { } input { border: 0;
    h2 {
    padding: 10px 20px; font-size: 20px; border-radius: 50px; margin: 5px; }
    font-size: 20px;
    text-align: center; } button { padding: 10px; width: 300px; margin: 10px 0; border: 0; }
    div {
    button:focus, button:hover { background-color: black; color: white; } p { text-align: center; } border: 1px solid white;
    text-decoration: none;
    background-color: black; text-align: center; } #postCredit { background-color: powderblue; color: black; } a { color: black; display: block;
    padding: 10px;
    padding: 10px; background-color: white; } a:hover { background-color: cyan; } h1 { background-color: black; margin: 0 0 20px 0; text-align: center; }
    </style>

    পদক্ষেপ # 4 - Installed HTML Code

    এখন আমি আপনাকে নীচে কয়েকটি এইচটিএমএল স্ক্রিপ্ট দিয়েছি এবং সেগুলি কপি করে উপরে বর্ণিত পদক্ষেপগুলি অনুসরণ করে পেস্ট করুন।
    <h1>Age Calculator Tool</h1>
    <h2>Hey Dear, What's your name? <br /><input type = "text" placeholder = "Enter Your Name" autofocus/></h2>
    <div id = "disBlock"> <p id = "disBD"></p> <p id = "display"></p>
    <a id = "about" href="https://www.onlinekaj.com/" target="_blank">Know More About Me</a>
    <p id = "time"></p> </div> <div id = "postCredit"> <p id = "credit"></p> </div> <form>
    <button type = "button">Calculate</button>
    <label>Enter Your Date of Birth: <input type = "date"/></label><br /> <button type = "reset">Reset</button>
    </form>

    কিভাবে বয়স ক্যালকুলেটর টুল তৈরি করব ব্লগ পেজেঃ

    বন্ধুরা নিচে আমি আপনাকে কিভাবে ব্লগ পোস্টে বা পেজে বয়স ক্যালকুলেটর টুল তৈরি করবেন সে বিষয় নিয়ে আলোচনা করবো।  নিচের দেওয়া (বয়স ক্যালকুলেটর স্ক্রিপ্ট) ব্যবহার করে আপনি পার্টিকুলার কোনো পোস্টে বা পেজে টুলটি তৈরি করতে পারবেন। 

    <center>
    <script>
    var mS = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
    var dat = new Date(); var curday = dat.getDate(); var curmon = dat.getMonth() + 1;
    var endyear = dat.getFullYear();
    var curyear = dat.getFullYear(); var startyear = dat.getFullYear()-100; function checkleapyear(datea) {
    } else {
    if (datea.getYear() % 4 == 0) { if (datea.getYear() % 10 != 0) { return true;
    function DaysInMonth(Y, M) {
    if (datea.getYear() % 400 == 0) return true; else return false; } } return false; } with(new Date(Y, M, 1, 12)) {
    d1 = date1.getDate(),
    setDate(0); return getDate(); } } function datediff(date1, date2) { var y1 = date1.getFullYear(), m1 = date1.getMonth(),
    if (m1 < m2) {
    y2 = date2.getFullYear(), m2 = date2.getMonth(), d2 = date2.getDate(); if (d1 < d2) { m1--; d1 += DaysInMonth(y2, m2); } y1--;
    var calmon = document.birthday.month.options[document.birthday.month.selectedIndex].value;
    m1 += 12; } return [y1 - y2, m1 - m2, d1 - d2]; } function calage() { var calday = document.birthday.day.options[document.birthday.day.selectedIndex].value;
    alert("please fill all the values..!!");
    var calyear = document.birthday.year.options[document.birthday.year.selectedIndex].value; if (curday == "" || curmon == "" || curyear == "" || calday == "" || calmon == "" || calyear == "") { } else { var curd = new Date(curyear, curmon - 1, curday);
    document.birthday.age.value = dife[0] + " years, " + dife[1] + " months, and " + dife[2] + " days";
    var cald = new Date(calyear, calmon - 1, calday); var diff = Date.UTC(curyear, curmon, curday, 0, 0, 0) - Date.UTC(calyear, calmon, calday, 0, 0, 0); var dife = datediff(curd, cald); var monleft = (dife[0] * 12) + dife[1]; var secleft = diff / 1000 / 60;
    document.birthday.min.value = secleft + " minutes since your birth";
    var hrsleft = (secleft / 60); var daysleft = (hrsleft / 24); document.birthday.months.value = monleft + " Month since your birth"; document.birthday.daa.value = daysleft + " days since your birth"; document.birthday.hours.value = hrsleft + " hours since your birth";
    document.birthday.nbday.value = datee + " days left for your next birthday";
    document.birthday.sec.value = (secleft*60) + " seconds since your birth"; var as = parseInt(calyear) + dife[0] + 1; var diff = Date.UTC(as, calmon, calday, 0, 0, 0) - Date.UTC(curyear, curmon, curday, 0, 0, 0); var datee = diff / 1000 / 60 / 60 / 24; } } /* Date: 31/08/2020 Author: Rocky Islam Website: www.Onlinekaj.com */ </script>
    <select name="day" size="1" >
    <h1>Age Calculator</h1> <p>Advance Age Calculator - Calculate your age in years, months, days, hours, minutes, seconds</p> <table width="320px;;" border="0" cellspacing="0" cellpadding="0"> <tbody> <tr> <td> <p><b>Select Date of Birth:</b></p> <form name="birthday"> <span class="date">Date</span>&nbsp;<b>:</b>&nbsp;
    <script type="text/javascript">for(var i=1;i<13;i++)document.write("<option value="+i+">"+mS[i-1]+"</option>");</script>
    <script type="text/javascript">for(var j=1;j<32;j++)document.write("<option value="+j+">"+j+"</option>");</script> </select> <span class="date">Month</span>&nbsp;<b >:</b>&nbsp; <select name="month" size="1" > </select> <span class="date ">Year</span>&nbsp;<b >:</b>&nbsp; <select name="year" size="1">
    <p class="date1">You have been living for:</p>
    <script type="text/javascript">for(var k=startyear;k<=endyear;k++)document.write("<option value="+k+">"+k+"</option>");</script> </select> <p style="text-align:center;"> <input class="button" name="start" onclick="calage()" value="Calculate" type="button" style="width:100px; margin: 0 auto;"> </p> <input name="age" value="Result" style="width:100%;"> <table class="table-condensed" style="width:100%"> <tbody>
    </tr>
    <tr> <td class="date-red">In months</b></td> <td><input name="months" style="width:100%;"></td> </tr> <tr> <td class="date-red">In days</td> <td><input name="daa" style="width:100%;"></td> </tr> <tr> <td class="date-red">In hours</td> <td><input name="hours" style="width:100%;"></td> <tr>
    <td colspan="2"><input name="nbday" style="width:100%;"></td>
    <td class="date-red">In minutes</td> <td><input name="min" style="width:100%;"></td> </tr> <tr> <td class="date-red">In seconds</td> <td><input name="sec" style="width:100%;"></td> </tr> <tr> <td colspan="2" class="date-red">Your next birthday will be in:</b></td> </tr> <tr> </tr> </tbody> </table> </form>

    </td> <td width="10">&nbsp;</td> </tr> </tbody> </table> <br/> <b>Made By ?? <a href="https://www.onlinekaj.com" target="_blank">OnlineKaj</a></b>
    </center>
    প্রথমে আপনাকে আপনার ব্লগার ড্যাসবোডে যেতে হবে তারপর "Page" ক্লিক করুন এখন Create New Page বাটনে ক্লিক করুন তারপর HTML মুড ওন করুন এখন নিচে দেওয়া অনলাইন বয়স ক্যালকুলেটর স্ক্রিপ্ট কোডটি পেস্ট করুন এখন পাবলিশ বাটনে ক্লিক করুন বাছ! আপনার বয়স ক্যালকুলেটর টুল তৈরি।  

    আমাদের শেষ কথা,

    আশা করি এখন আপনি নিজের বয়স ক্যালকুলেটর ওয়েবসাইট তৈরি করতে পারবেন, আমাদের ফ্রী  বয়স ক্যালকুলেটর স্ক্রিপ্টটি ব্যবহার করে। এবং যদি আপনার এখনও কোনও প্রশ্ন এবং পরামর্শ থাকে তবে আপনি নীচে কমেন্ট  বক্সে আমাদের বলতে পারেন।

    বন্ধুরা আশা করি,  ব্লগারে “বয়স ক্যালকুলেটর টুল  তৈরি” করা যায় সে সম্পর্কে আপনার এই পোস্টি পছন্দ হয়েছে। বয়স ক্যালকুলেটর টুল স্ক্রিপ্ট নিয়ে কোনো প্রশ্ন থাকলে বা সমস্যা হলে কমেন্ট করে আমাকে জানানবেন।
    #tag
    #বয়স ক্যালকুলেটর এইচটিএমএল কোড #জাভাস্ক্রিপ্ট বয়স ক্যালকুলেটর #অনলাইন বয়স ক্যালকুলেটর #বয়স ক্যালকুলেটর ডাউনলোড #বয়স ক্যালকুলেটর ওয়েবসাইট স্ক্রিপ্ট

    By commenting you acknowledge acceptance of Whatisloved.com-Terms and Conditions

    Post a Comment

    By commenting you acknowledge acceptance of Whatisloved.com-Terms and Conditions

    Post a Comment (0)

    Previous Post Next Post