Currency converter tool script for blogger

Dhanjee Rider

Aasani Se Currency Convert Kare: Yeh Hai Simple Aur Effective Currency Converter Tool

Currency converter tool script for blogger

Aaj kal global market mein invest karna ya vyapar karna ek aam baat ho gayi hai. Lekin jab hum international transactions ya investments ke liye currencies convert karte hain, tab yeh kaam thoda mushkil ho sakta hai. Lekin chinta mat kijiye, hum aapke liye laye hain ek aasan aur effective solution - ek currency converter tool, jiski madad se aap kisi bhi currency ka rate jan skte hai

Currency converter tool script and features

Is tool ka upyog karna bilkul aasan hai. Bas aapko niche diye gaye steps follow karne hain:

Demo

Step 1: Apni Pasand Ki Currencies Chune

Pahle dropdown menu se aapko apni base currency choose karni hai. Yeh wo currency hai jisme aapke paas paise hain.

Fir dusre dropdown menu se aapko convert karne wali currency choose karni hai. Yeh wo currency hai jisme aap apne paise ko convert karna chahte hain.

Step 2: Amount Daale

Ab aapko base currency mein kitne paise hain wo amount enter karna hai.

Step 3: Convert Button Dabaye

Jab aapne dono currencies choose kar li aur amount enter kar liya, toh bas ab Convert button par click karein.

Step 4: Result Dekhein

Currency converter tool script code 👇

    <style media="screen">
  .crns .container{
  background-color: white;
  padding: 40px 24px;
  border-radius: 12px;
}

.crns h1{
  color: #364547;
  margin-left: 72px;
  font-size: 31px;
  margin-bottom: 1.8em;
  font-family: sans-serif;
}


.crns .container .box{
  width: 100%;
  display: flex;
}

.crns .box div{
  width: 100%;
}

.crns select{
  width: 95%;
  height: 45px;
  font-size: 1.2em;
  cursor: pointer;
  background: #1177c6;
  color: white;
  outline: none;

  margin: 0.2em 0;
  margin-bottom: 30px;
  padding: 0 1em;
  border-radius: 5px;
  border: none;
}


.crns input{
  width: 95%;
  height: 45px;
  font-size: 1.2em;
  margin: 0.2em 0;
  border-radius: 5px;
  border: none;
  color: black;
  margin-bottom: 30px;
  background: #cccccc;
  outline: none;
  padding: 0 1em;
}


.crns .btn{
  width: 98%;
  height: 45px;
  background: #1177c6;
  color: white;
  border-radius: 5px;
  border: none;
  cursor: pointer;
  font-size: 1.1em;
  margin: 0.5em 0;
  margin-top: 20px;
}

    </style>
</head>
<body>
  <div class="crns"> <div class="container">
        <h1>Currency Convertor</h1>
        <div class="box">
            <div class="left_box">
                <select name="currency" class="currency"></select>
                <input type="number" name="" id="num">
            </div>
            <div class="right_box">
                <select name="currency" class="currency"></select>
                <input type="text" name="" id="ans" disabled>
            </div>
        </div>
        <button class="btn" id="btn">Convert</button>
    </div>
</div>

    <script>
      const select = document.querySelectorAll(".currency");
const btn = document.getElementById("btn");
const num = document.getElementById("num");
const ans = document.getElementById("ans");

fetch("https://api.frankfurter.app/currencies")
  .then((data) => data.json())
  .then((data) => {
    display(data);
  });

function display(data) {
  const entries = Object.entries(data);
  for (var i = 0; i < entries.length; i++) {
    select[0].innerHTML += `<option value="${entries[i][0]}">${entries[i][0]}</option>`;
    select[1].innerHTML += `<option value="${entries[i][0]}">${entries[i][0]}</option>`;
  }
}

btn.addEventListener("click", () => {
  let currency1 = select[0].value;
  let currency2 = select[1].value;
  let value = num.value;

  if (currency1 != currency2) {
    convert(currency1, currency2, value);
  } else {
    alert("Choose Different Currencies !!!");
  }
});

function convert(currency1, currency2, value) {
  const host = "api.frankfurter.app";
  fetch(
    `https://${host}/latest?amount=${value}&from=${currency1}&to=${currency2}`
  )
    .then((val) => val.json())
    .then((val) => {
      console.log(Object.values(val.rates)[0]);
      ans.value = Object.values(val.rates)[0];
    });
}

    </script>
</body>
</html>

Kuch hi samay mein aapko converted amount dikh jayega.

Yeh sab kuch karne ke liye, aapko kisi bhi additional software ya website ki zarurat nahi hai. Humne aapke liye yeh tool taiyar kiya hai jo aap seedhe yahaan se istemal kar sakte hain.

Yah tool apne users ko currency conversion ke liye Frankfurter API ka upyog karta hai, jo ki reliable aur accurate hai.

Conclusion

Toh dosto, ab aapko currency conversion ke liye kisi aur platform par depend karne ki zarurat nahi hai. Aap apne transactions ko easily aur confidently handle kar sakte hain.

Last word

In this post we will provided information about Currency converter tool script for blogger , If you enjoy this post, kindly share it with your friends. For any queries, feel free to join our Telegram channel, where we share exclusive and informative content. Many valuable tips are exclusively available on our Telegram channel. Stay updated with your favorite source, DK Technozone.

Dhanjee Rider

Dk Technozone An Editor,Programmer, grafix Designer Website Designer,Android Geek, Instagram Filter Seller,Blloger, Seo Expert, Wordpress Geek etc. Telegram