কিভাবে ব্লগারে কারেন্সি কনভার্টার টুল তৈরি করবেন:HTML javaScript ব্যবহার করে।

হ্যালো বন্ধুরা, আপনাকে অনলাইন কাজ ওয়েবসাইটে স্বাগতম আজ এই পোস্টে আমরা ব্লগারে: এইচটিএমএল জাভাস্ক্রিপ্ট ব্যবহার করে কিভাবে কারেন্সি কনভার্টার টুল তৈরি করে তা সম্পর্কে জানব। যাইহোক, আপনি যদি ব্লগার ডেভেলপার হন বা আপনি নিজের ব্লগার হোস্টিংয়ের উপর একটি কারেন্সি কনভার্টার টুল  তৈরি করতে চান। সুতরাং এর জন্য আপনার পিএইচপি স্ক্রিপ্টে লাইভ কারেন্সি কনভার্টার টুল তৈরি করতে প্রয়োজন হবে।

ফ্রি অনলাইন কারেন্সি কনভার্টার টুল তৈরি করুনঃ

কিভাবে ব্লগারে কারেন্সি কনভার্টার টুল তৈরি করবেন:HTML javaScript ব্যবহার করে।
বন্ধুরা, আপনি যদি জানেন না যে কোনও অনলাইন কারেন্সি কনভার্ট করার টুল আছে? সুতরাং আমি আপনাকে বলি যে এটি একটি অনলাইন ওয়েব টুল। যার সাহায্যে আপনি যে কোনও দেশের মুদ্রাকে অন্য যে কোনও মুদ্রায় সহজেই রূপান্তর করতে পারবেন। বেশিরভাগ লোক এটি ব্যবহার করে। কারণ তারা আজ ইউএসআর ডলারের মূল্য কত তা যাচাই করে নেয়।

মানি এক্সচেঞ্জ রেটটি জানার জন্য এই অনলাইন টুল প্রেরণ করা সর্বদা সবচেয়ে বেশি ব্যবহৃত হয়। কারণ পুরো বিশ্বে, প্রতিদিন মুদ্রার মান ও দাম কমতে থাকে। যাইহোক, আপনি ইন্টারনেটে বিনামূল্যে Google কারেন্সি কনভার্ট করার টুল তৈরি করে আপনার ব্লগে থেকে টাকা ইনকাম করতে পারবেন।

অনলাইন কারেন্সি কনভার্টার টুল

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

আটির্কেল বা পেজে যেভাবে কারেন্সি কনভার্ট টুল তৈরি করবেন।

Code-
<style>
*{
margin: 0;
padding: 0;
font-family: 'Nunito',sans-serif;
outline: 0; }
padding: 8px 16px;
.container h2{
background-color: #00796b;
text-align: center;
border-radius: 8px 8px 0 0;
color: #fafafa; } .app{
border: none;
padding: 8px 16px; } .app button{
border-radius: 3px;
background-color: #00796b; color: #fafafa;
padding: 8px 15px;
padding: 8px 12px; margin: 8px 10px; } .app input{
border: 1px solid #00796b;
margin: 8px 10px; border-radius: 5px; } .app select{
border: 1px solid #00796b;
padding: 8px 15px; margin: 8px 10px; border-radius: 5px; } .app p{
margin: 15px 0;
text-align: center; font-size: 20px; font-weight: bold; } </style>
<input id="value" type="text">
<h2>Currency Exchanger</h2> <div class="app"> <label>From : </label>
<button id="btn">Convert</button><br>
<select id="from"></select> <label>To :</label> <select id="to"></select> <p id="result"></p>
let currency_code = ["CAD","HKD","ISK","PHP","DKK","HUF","CZK","AUD","RON","SEK","IDR","INR","BRL","RUB","HRK","JPY","THB","CHF","SGD","PLN","BGN","TRY","CNY","NOK","NZD","ZAR","USD","MXN","ILS","GBP","KRW","MYR","EUR"];
</div> </div> <script> //Fetching the Code list let from = document.querySelector('#from'); let to = document.querySelector('#to');
let opt1 = document.createElement('option');
let btn = document.querySelector('#btn'); let input = document.querySelector('#value') let rslt = document.querySelector('#result'); for(let i = 0;i<currency_code.length;i++){
opt2.appendChild(document.createTextNode(currency_code[i]));
opt1.appendChild(document.createTextNode(currency_code[i])); opt1.value = currency_code[i]; let opt2 = document.createElement('option'); opt2.value = currency_code[i]; from.appendChild(opt1); to.appendChild(opt2); }
fetch(url)
btn.addEventListener('click', function(){ let from_value = from.value; let to_value = to.value; let url = "https://api.exchangeratesapi.io/latest?base="+from_value; let val = input.value; console.log(val);
rslt.innerHTML = res;
.then(response =>response.json().then(data => { console.log(data.rates[to_value]) let rate = data.rates[to_value]; console.log(val * rate) let res = val+" "+from_value+" = "+ (val * rate)+ " " + to_value; })) .catch(err =>{
</script>
console.log(err); });
});
  • প্রথমে আপনি আপনার ব্লগার ডাসবোডে যান।
  • তারপর পজে ওপশেন যান
  • এখন একটি নিউ পেজে ক্রিয়েটে ক্লিক করুন। 
  • তারপর HTML মুড অন করুন এখন আমার দেওয়া কোডটি পেস্ট করুন 
  • এখন পাবলিশ বাটনে ক্লিক করুন। 

বাছ! আপনার টুল তৈরি টাকা রেট কনভার্ট করার জন্য।

বন্ধুরা, স্ক্রিপ্টটি আমি আপনাকে উপরে দিয়েছি। এর সাহায্যে আপনি যে কোনও ওয়ার্ডপ্রেস বা ব্লগার পোস্ট বা পেজে সহজেই এই কারেন্সি টুল তৈরি করতে পারবেন। তবে এখন আমি আপনার জন্য ব্লগার স্ট্যটিক টুল ওয়েবসাইট স্ক্রিপ্ট প্রভাইড করব। যার জন্য আমি কারেন্সি কনভার্টর এইচটিএমএল টেম্পলেট বিনামূল্যে ডাউনলোড করে নিতে পারবেন। আপনাকে যা করতে হবে তা হ'ল কপি পেস্ট করে এই স্ক্রিপ্টটি সেফ করে দিন এবং এটি আপনার ব্লগারের এডিট এইচটিএমএল বিভাগে সেফ করুন।বাছ!

কারেন্সি কনভার্ট টুল স্ট্যাটিক ওয়েবসাইট জন্য


কারেন্সি কনভার্টার স্ট্যাটিক ওয়েবসাইট তৈরি করার জন্য আপনাকে নিচে দেওয়া কিছু পদক্ষেপ ফলো করতে হবে।

  • প্রথমে আপনি আপনার ব্লগ ড্যাসবোর্ডে যান 
  • তারপর থিম ওপশনে Edit Html ক্লিক করুন। 
  • আপনার থিমের আগের সমস্ত কোড ctrl+alt ক্লিক করে রিমুভ করুন। 
  • এখন নিচে দেওয়া কোড Ctrl+ copy করে পেস্ট করুন। 
  • তারপর আপনার থিমটি সেভ করুন।ভিউ ব্লগে ক্লিক করুন। 
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Currency Exchanger</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<link rel="stylesheet" href="main.css">
<link href='https://www.onlinekaj.com' rel='canonical'/> </head> <style>
padding: 0;
@import url('https://fonts.googleapis.com/css?family=Nunito+Sans&display=swap'); *{ margin: 0; outline: 0; font-family: 'Nunito',sans-serif; } .container{
.container h1{
position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); background: #fafafa; box-shadow: 0px 2px 8px rgba(30,30,30,.3); } padding: 8px 16px;
background-color: #00796b;
text-align: center; background-color: #00796b; color: #fafafa; border-radius: 8px 8px 0 0; } .app{ padding: 8px 16px; } .app button{ border: none; color: #fafafa;
padding: 8px 15px;
border-radius: 3px; padding: 8px 12px; margin: 8px 10px; } .app input{ padding: 8px 15px; margin: 8px 10px; border-radius: 5px; border: 1px solid #00796b; } .app select{
<div class="container">
margin: 8px 10px; border-radius: 5px; border: 1px solid #00796b; } .app p{ text-align: center; font-size: 20px; font-weight: bold; margin: 15px 0; } </style> <body>
<select id="from"></select>
<h1>Currency Exchanger</h1> <div class="app"> <input id="value" type="text"> <label>From : </label> <label>To :</label>
</body>
<select id="to"></select> <button id="btn">Convert</button><br> <p id="result"></p> </div> </div> <script src="main.js" async defer></script> <script>
let from = document.querySelector('#from');
//Fetching the Code list let currency_code = ["CAD","HKD","ISK","PHP","DKK","HUF","CZK","AUD","RON","SEK","IDR","INR","BRL","RUB","HRK","JPY","THB","CHF","SGD","PLN","BGN","TRY","CNY","NOK","NZD","ZAR","USD","MXN","ILS","GBP","KRW","MYR","EUR"];
opt1.appendChild(document.createTextNode(currency_code[i]));
let to = document.querySelector('#to'); let btn = document.querySelector('#btn'); let input = document.querySelector('#value') let rslt = document.querySelector('#result'); for(let i = 0;i<currency_code.length;i++){ let opt1 = document.createElement('option');
let from_value = from.value;
opt1.value = currency_code[i]; let opt2 = document.createElement('option'); opt2.appendChild(document.createTextNode(currency_code[i])); opt2.value = currency_code[i]; from.appendChild(opt1); to.appendChild(opt2); } btn.addEventListener('click', function(){
let rate = data.rates[to_value];
let to_value = to.value; let url = "https://api.exchangeratesapi.io/latest?base="+from_value; let val = input.value; console.log(val); fetch(url) .then(response =>response.json().then(data => { console.log(data.rates[to_value]) console.log(val * rate)
</html>
let res = val+" "+from_value+" = "+ (val * rate)+ " " + to_value; rslt.innerHTML = res; })) .catch(err =>{ console.log(err); }); });
</script>
বাছ! তৈরি আপনার কারেন্সি এক্সচেন্ছার স্ট্যাটিক ওয়েবসাইট। 

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

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

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