How to Create Image to text converter Website || With Advance Features || In Blogger || By Techno Sahil ||

Hello Friends तो जैसा कि आप लोग जानते हैं कि बहुत सारे लोग Blogging के द्वारा पैसे गवा रहे है। अपने पैसों को बेस्ट कर रहे हैं। उन्हें समझ नहीं आ रहा है कि कैसे Blogger पर Traffic लाया, कैसे Adsense का Approval ले।




तो ऐसे समय में मैंने आपके लिए Image to Text Converter Tool Website का Script  लाया है। इसके बारे में आप Article लिख सकते है की कैसे लोगो इसे Use करना है और इसे अपने Blogger के Site पर लगाकर आप पैसे कमा सकते हैं। इस तरह की Website पर जल्दी Adsense Approval होता है। तो कैसे  आपको इसे Blogger में Create करना है और कैसे Code को Copy करना है यह सब Process मैं आपको इस Article में बताऊंगा।

So friends इस कोड को Copy करने के लिए आपको नीचे दिए गए Steps को पूरा करना होगा।


Image to Text Converter Tool

बहुत सारे दोस्तों को शायद पता भी नाम हो की ये Image to Text Converter क्या होता है? तो मैं आपको बता देना चाहता हूँ की किसी भी Blog Post या Blog Page में जो Source Code उपलब्ध करवाया जाता है. और उसे जिस Format में Post में Add किया जाता है उसे हम Image to Text Converter के नाम से जानते है.

पंरतु अब समय के साथ साथ सब कुछ Advance होता जा रहा है. ऐसे में अब Normal Online Image to Text Converter को भी Advance बना दिया गया है. अब इसमें आपको Image to Text Converter with 3d Background भी देखने को मिल जाता है. और इसका फायदा यह है की सभी Codes तो अच्छे दिखते ही है लेकिन उसके साथ-साथ Text Area Box और Site भी अच्छे दिखते है। जिसके कारण Sites पर ज्यादा से ज्यादा Traffic आते हैं



इन्हें भी पढ़े:-




Steps To Get The Code:-

● नीचे दिए गए Download Button पर Click करें

तो यह आपको एक नये Page पर Redirect कर देगा

● अब आपको नीचे से Scroll करके Continue Download पर Click करना है।

● अब आप नीचे Scroll करके Captcha को Solve कर दें और Click Here To Download पर Click करें।

● फिर आपको Countdown Timer मतलब की उल्टी गिनती करता हुआ बक्सा एक गोल घेरे में दिख रहा होगा तब तक Wait करें और फिर Get Link पर Click करें।

● अब आपको Blue या Green Colour के बक्से में Code दिख रहा होगा।

● अब आप Code को Copy कर ले।


 <!DOCTYPE html> 
 <html> 
 <head> 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
      <title>Image to text converter</title> 
      <link href='https://fonts.googleapis.com/css?family=Lato:300,400' rel='stylesheet' type='text/css'> 
   <link rel="stylesheet" type="text/css" href="https://drive.google.com/uc?id=1Bq-ZLpjxELPzbarPXn3cwOdYYueaTsU2"/> 
 </head> 
 <body ondragover="return false"> 
     <section class="top-section"> 
         <div class="main-bg" style="background-image:url(https://images.unsplash.com/photo-1579546929662-711aa81148cf?ixid=MnwxMjA3fDB8MHxzZWFyY2h8MXx8Y29sb3JmdWwlMjB3YWxscGFwZXJ8ZW58MHx8MHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60)"></div> 
         <div class="container"> 
      <div id='demo'> 
 <!--           <div class="commentary"> 
                <div id='demo-title'>Image to text converter</div> 
           </div> 
  -->      
           <div class='commentary'> 
           </div> 
           <div id='demo-body'> 
                <div id='drop-instructions-main'><h2>Drop <span class='drop-instructions'></span>an image on this page to convert it into text!</h2></div> 
                <div id='demo-content'> 
                     <div> 
                          <canvas id='input-overlay'></canvas> 
                          <img id='input' src="https://tesseract.projectnaptha.com/img/eng_bw.png"/>      
                     </div> 
                     <div id='arrow'></div> 
                     <div> 
                          <!-- <div id='output-overlay'></div> --> 
                          <!-- <textarea id='output-text'></textarea> --> 
                          <div id='log'></div> 
                          <div id='demo-instructions'> 
                               <span id='clickme' onclick='play()'>Click here to recognize text in the demo image</span>, or drop <span class='drop-instructions'>an English</span> image anywhere on this page. 
                          </div> 
                          <!-- <canvas id='output'></canvas>      --> 
                     </div> 
                </div> 
   <script src="https://drive.google.com/uc?id=172Yq5asL6eeQmSlwx3MuiMlFapCsXQMh"></script> 
      <script src="https://drive.google.com/uc?id=10zu9bcO9rtb3ClwqvUS8DMu-ql-anR--"></script> 
           <script type="text/javascript"> 
             var dimensions = { 
      width:0, 
      height:0, 
      getWidth: function () { 
           if (window.innerWidth) { 
              return window.innerWidth; 
           } 
           if (document.documentElement && document.documentElement.clientHeight){ 
                return document.documentElement.clientWidth; 
           } 
           if (document.body) { 
                return document.body.clientWidth; 
           } 
           return 0; 
      }, 
      getHeight: function () { 
           if (window.innerWidth) { 
              return window.innerHeight; 
           } 
           if (document.documentElement && document.documentElement.clientHeight){ 
                return document.documentElement.clientHeight; 
           } 
           if (document.body) { 
                return document.body.clientHeight; 
           } 
           return 0; 
      }, 
      update: function () { 
           var curW = this.getWidth() 
           var curH = this.getHeight() 
           if (curW!=this.width||curH!=this.height){ 
                this.width=curW 
                this.height=curH 
                return true 
           } 
           return false 
      }      
 } 
           </script> 
      <script src="https://drive.google.com/uc?id=1kPHaDU4D_Ls0nkW7P_GBnozUuAx5Mt9Q"></script> 
      <script src="https://drive.google.com/uc?id=1AxwzasisWGmBjhktSjp7U9OrvAZBUlaV"></script> 
      <script src="https://unpkg.com/tesseract.js@2.0.0/dist/tesseract.min.js" integrity="sha384-MTEb82ufpBJ2VCTmPZlD/+vgiT5z6zmOwqU/uDO9IobYm9xCOUEN0WH3czf6ppl8" crossorigin="anonymous"></script> 
 <script type="text/javascript"> 
 var input = document.getElementById('input') 
 var input_overlay = document.getElementById('input-overlay') 
 var ioctx = input_overlay.getContext('2d') 
 // var output = document.getElementById('output') 
 // var output_overlay = document.getElementById('output-overlay') 
 var output_text = document.getElementById('log') 
 var demo_instructions = document.getElementById('demo-instructions') 
 var drop_instructions = [].slice.call(document.querySelectorAll('.drop-instructions')) 
 var options = [].slice.call(document.querySelectorAll('.option')) 
 // var octx = output.getContext('2d') 
 var language = 'eng' 
 var demoStarted = false 
 var lang_demo_images = { 
      eng: 'img/eng_bw.png', 
      chi_sim: 'img/chi_sim.png', 
      rus: 'img/rus.png' 
 } 
 var lang_drop_instructions = { 
      eng: 'an English', 
      chi_sim: 'a Chinese', 
      rus: 'a Russian' 
 } 
 var worker = new Tesseract.createWorker({ 
   logger: progressUpdate, 
 }); 
 function setUp(){ 
      input_overlay.width = input.naturalWidth 
      input_overlay.height = input.naturalHeight 
      output_text.style.height = input.height + 'px' 
 } 
 setUp() 
 input.onload = setUp 
 function isOutputVisible(){ 
      return output_text.getBoundingClientRect().top < dimensions.height 
 } 
 function startDemoIfVisible(argument) { 
      if(isOutputVisible() && !demoStarted) startDemo(); 
 } 
 function startDemo(){ 
      demoStarted = true 
      async function start(){ 
     await worker.load(); 
     await worker.loadLanguage('eng'); 
     await worker.initialize('eng'); 
     const { data } = await worker.recognize(input); 
     result(data); 
           input.removeEventListener('load', start) 
      } 
      if(input.complete) start(); 
      else input.addEventListener('load', start) 
 } 
 // function progress(p){ 
 //      var text = JSON.stringify(p) 
 //      // octx.clearRect(0, 0, output.width, output.height) 
 //      // octx.textAlign = 'center' 
 //      // octx.fillText(text, output.width/2, output.height/2) 
 //      output_overlay.style.display = 'block' 
 //      output_overlay.innerHTML += output_overlay.innerHTML.length ? "\n" + text : text 
 //      output_overlay.scrollTop = output_overlay.scrollHeight; 
 // } 
 function progressUpdate(packet){ 
      var log = document.getElementById('log'); 
      if(log.firstChild && log.firstChild.status === packet.status){ 
           if('progress' in packet){ 
                var progress = log.firstChild.querySelector('progress') 
                progress.value = packet.progress 
           } 
      }else{ 
           var line = document.createElement('div'); 
           line.status = packet.status; 
           var status = document.createElement('div') 
           status.className = 'status' 
           status.appendChild(document.createTextNode(packet.status)) 
           line.appendChild(status) 
           if('progress' in packet){ 
                var progress = document.createElement('progress') 
                progress.value = packet.progress 
                progress.max = 1 
                line.appendChild(progress) 
           } 
           if(packet.status == 'done'){ 
                var pre = document.createElement('pre') 
                pre.appendChild(document.createTextNode(packet.data.text)) 
                line.innerHTML = '' 
                line.appendChild(pre) 
           } 
           log.insertBefore(line, log.firstChild) 
      } 
 } 
 function result(res){ 
      // octx.clearRect(0, 0, output.width, output.height) 
      // octx.textAlign = 'left' 
      console.log('result was:', res) 
      // output_overlay.style.display = 'none' 
      // output_text.innerHTML = res.text 
      progressUpdate({ status: 'done', data: res }) 
      res.words.forEach(function(w){ 
           var b = w.bbox; 
           ioctx.strokeWidth = 2 
           ioctx.strokeStyle = 'red' 
           ioctx.strokeRect(b.x0, b.y0, b.x1-b.x0, b.y1-b.y0) 
           ioctx.beginPath() 
           ioctx.moveTo(w.baseline.x0, w.baseline.y0) 
           ioctx.lineTo(w.baseline.x1, w.baseline.y1) 
           ioctx.strokeStyle = 'green' 
           ioctx.stroke() 
         // octx.font = '20px Times'; 
         // octx.font = 20 * (b.x1 - b.x0) / octx.measureText(w.text).width + "px Times"; 
         // octx.fillText(w.text, b.x0, w.baseline.y0); 
      }) 
 } 
 document.addEventListener('scroll', startDemoIfVisible) 
 startDemoIfVisible() 
 function clearOverLayAndOutput(){ 
      ioctx.clearRect(0,0, input_overlay.width, input_overlay.height) 
      output_text.style.display = 'none' 
      demo_instructions.style.display = 'block' 
      // octx.clearRect(0,0,output.width, output.height) 
 } 
 // function displayPlayButtonFor(lang){ 
 //      output.addEventListener('click', function play(){ 
 //           output.removeEventListener('click', play) 
 //           tessWorker.recognize(input, lang) 
 //           .progress( progress ) 
 //           .then( result ) 
 //      }) 
 // } 
 async function play(){ 
      demo_instructions.style.display = 'none' 
      output_text.style.display = 'block' 
      output_text.innerHTML = '' 
      // output_overlay.innerHTML = '' 
   await worker.load(); 
   await worker.loadLanguage(language); 
   await worker.initialize(language); 
   const { data } = await worker.recognize(input); 
   result(data); 
 } 
 options.forEach(function(option){ 
      option.addEventListener('click', function(){ 
           clearOverLayAndOutput() 
           drop_instructions.forEach(function(di){ 
                di.innerHTML = lang_drop_instructions[option.lang] 
           }) 
           language = option.lang 
           options.forEach(function(option){option.className = 'option'}) 
           option.className = 'option selected' 
           if(option.lang in lang_demo_images){ 
                input.src = lang_demo_images[option.lang] 
                // displayPlayButtonFor(option.lang) 
           } 
      }) 
 }) 
 document.body.addEventListener('drop', async function(e){ 
      e.stopPropagation(); 
     e.preventDefault(); 
     var file = e.dataTransfer.files[0] 
      var reader = new FileReader(); 
      reader.onload = function(e){ 
           input.src = e.target.result; 
           input.onload = function(){ 
                setUp(); 
           } 
      }; 
      reader.readAsDataURL(file); 
   await worker.load(); 
   await worker.loadLanguage(language); 
   await worker.initialize(language); 
   const { data } = await worker.recognize(file); 
   result(data); 
 }) 
           </script> 
       </div> 
             </div> 
      </div> 
       </div> 
 </body> 
 </html>


अब रही बात की इस Script को कहां पर Paste करना है कैसे Image to Text Converter Website बनाना है। तो Image to Text Converter Website बनाने के लिए आपको नीचे दिए गए Steps को पुरा करना होगा।


Steps to CreateOnline Image to Text Converter Website:-


● अब आप Blogger के Dashboard में जाए या फिर blogger लिखकर Search करे।

● आप New Blog पर Click करें और फिर नाम Create कर Subdomain Create करके Save करें।

● यहाँ तक आपका काम हो गया है आपका Blogger का Website Create हो गया है।

● अब आप Theme पर Click कर Simple Blog के Theme को Choose कर Apply करें।

● अब Arrow पर Click कर Mobile Settings में जाकर Mobile View से Desktop View कर दें।

● फिर से Arrow पर Click करके Switch to first generation classic theme पर Click करके Without A backup को Choose करे।

● अब Edit Html पर Click कर Select All करके Code को Paste कर दे।

● अब Save के Icon पर Click कर Save कर दे।

Congratulations your Online Image to Text Converter Website has been created successfully.


Important Notice:- अगर आपको इसे अपने दुसरे Site पर लगाना है तो इस Tool का Use करे।

IFrame Generator Tool

निस्कर्ष:- तो दोस्तों आपको Image to Text Converter Script For Blogger के बारे में यह Article  कैसा लगा Comment में जरूर बताएं। या आप भी किसी प्रकार का सुझाव देना चाहते हैं, तो आप नीचे Comment Box में अपनी राय हमसे Share कर सकते हैं।

Post a Comment

2 Comments

  1. Can I make a PDF tools website like the PDF Insider site..?

    ReplyDelete
    Replies
    1. Hey Maya, Do you want to say that I have to make PDF tools website like https://pdfinsider.com/en .

      Delete