Add Number To Words Converter Widgets For Blogger Blog

Add Number To Words Converter Widgets In Blogger Blog 

• 1.) Go to www.blogger.com.

• 2.) Login using your Gmail Account.

• 3.) After login, the Blogger Dashboard will open

• 4.) Click and Select The Blog where you want to add the code

• 5.) From the left menu, click on Layout and go to layout 

• 6.) Click +Add a Gadget where you want to show the widget (Sidebar / Footer / Header)

• 7.) From the gadget list, click HTML/JavaScript

Enter a Title (optional)

Copy the HTML/JavaScript code provided below and paste it into the Content Box.

• 8.) Click Save.

• 9.) Click Save Arrangement.

• 10.)  Click View Blog and Check Your Blog.

• 11.) Your HTML / JavaScript widget is Now Live

Number To Words Converter Widgets For Blogger Blog : 

<div class="amt-card">

  <h3> 🔂 Amount to Words Converter</h3>

  <input type="number" id="amtInput" placeholder="Enter amount or number">

  <button onclick="convertAmt()">Convert</button>

  <div id="amtResult">Result will appear here</div>

  <button class="copyBtn" onclick="copyAmt()">Copy Text</button>

</div>

<style>

.amt-card{

  max-width:420px;

  margin:25px auto;

  padding:22px;

  border-radius:18px;

background:linear-gradient(135deg,#ffffff,#f1f5ff);

  box-shadow:0 15px 35px rgba(0,0,0,0.15);

  font-family:'Segoe UI',sans-serif;

  text-align:center;

}

.amt-card h3{

  margin-bottom:16px;

  font-size:20px;

  color:#2c2c2c;

}

.amt-card input{

  width:100%;

padding:12px;

  border-radius:10px;

  border:1px solid #ccd3ff;

  font-size:16px;

  outline:none;

}

.amt-card button{

  margin-top:14px;

  padding:11px 22px;

  border:none;

  border-radius:10px;

  background:linear-gradient(135deg,#5f72ff,#9a5cff);

  color:#fff;

font-size:15px;

  cursor:pointer;

}

.amt-card button:hover{

  opacity:0.9;

}

#amtResult{

  margin-top:16px;

  padding:12px;

  background:#ffffff;

  border-radius:10px;

  font-weight:600;

color:#333;

  box-shadow:inset 0 0 6px rgba(0,0,0,0.08);

}

.copyBtn{

  background:linear-gradient(135deg,#00c6ff,#0072ff);

}

</style>

<script>

function convertAmt(){

  let num = document.getElementById("amtInput").value;

  if(num===""){

document.getElementById("amtResult").innerText="Please enter an amount or number";

    return;

  }

  document.getElementById("amtResult").innerText = numToWords(num);

}

function numToWords(num){

  const a=["","One","Two","Three","Four","Five","Six","Seven","Eight","Nine","Ten",

  "Eleven","Twelve","Thirteen","Fourteen","Fifteen","Sixteen","Seventeen","Eighteen","Nineteen"];

const b=["","","Twenty","Thirty","Forty","Fifty","Sixty","Seventy","Eighty","Ninety"];

  if(num==0) return "Zero";

  function words(n){

    if(n<20) return a[n];

    if(n<100) return b[Math.floor(n/10)]+" "+a[n%10];

    if(n<1000) return a[Math.floor(n/100)]+" Hundred "+words(n%100);

    if(n<100000) return words(Math.floor(n/1000))+" Thousand "+words(n%1000);

    if(n<10000000) return words(Math.floor(n/100000))+" Lakh "+words(n%100000);

return words(Math.floor(n/10000000))+" Crore "+words(n%10000000);

  }

  return words(num).trim();

}

function copyAmt(){

  let text=document.getElementById("amtResult").innerText;

  navigator.clipboard.writeText(text);

  alert("Copied Successfully!");

}

</script>