How to Make Google Drive Direct Link Generator on Blogger

Royal_Ahmed 0

How to Make Google Drive Direct Link Generator on Blogger

Image


What is Google Drive Direct Link Generator?

Google Drive Director Link Generator is the most popular tool which is used to generate direct download link of any files that is uploaded on Google drive. When we are trying to download any files from Google drive. First of all Google drive will open and then you will press the download button to start downloading. But this tool will create a directed download link, the user when clicking on this link, no jump on Google drive, direct downloading start just like file upload on website sever.

What is the Benefit of the Google Drive Direct Link Generator?

Google Drive Director Link Generator is tool based website. Tool / Script-based website is very popular for making money online. Just select your desired script and upload it on blogger and start earning. No need to do work on a daily basis. One-time work and lifetime earning. But most people are worried about how to make google drive a direct download link generator website on blogger. This is task is very easy. Follow the below step and make your own google drive direct link generator within a few minutes.

How to Make Google Drive Direct Link Generator on Blogger?

If you want to make your own Glink Generator website, just follow the 4 easy steps below: -

  • Install Blank Template on Blogger
  • install CSS
  • Install Javascript
  • Install HTML

1:How to Install Blank Template on Blogger?

  • Copy code is given below in the theme window

  • <?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'>  
 <head>  
 <meta content='width=device-width, initial-scale=1' name='viewport'/>  
 <b:include data='blog' name='all-head-content'/>  
 <title><data:blog.pageTitle/></title>  
 <b:skin><![CDATA[  
 body{background:#fff}  
 ]]></b:skin>  
 </head>  
 <body>  
 <b:section class='main' id='main' showaddelement='yes'/>  
 </body>  
 </html>

  • Sign in to Your Blogger account
  • Go to the theme option
  • and Edit HTML

a4you

  • Delete All First Code
  • And Past This Code
  • Save the theme

2:How to Install CSS?

  • Copy code is given below in the theme window 
     <style>  
 body{  
 background-image: url(img/bg.jpg);  
 background-repeat: no-repeat;  
 background-attachment: fixed;  
 background-size: 100% 100%;  
 }  
 img {  
 max-width: 100%;  
 height: auto;  
 }  
 .bg-img{  
 background-image: url('https://1.bp.blogspot.com/-36L0_XP933U/Xh7aT2CC4MI/AAAAAAAABlY/l08p2AAJKqIWfb6rEQvaPaNCnVnbcabgQCLcBGAsYHQ/s1600/bg.jpg');  
 }  
 .card{  
 width:100%;  
 max-width: 500px;  
 margin: 0 auto;  
 float: none;  
 border:2px solid #343a40!important;  
 position: absolute;  
 left: 50%;  
 top: 50%;  
 -webkit-transform: translate(-50%, -50%);  
 transform: translate(-50%, -50%);  
 }  
 .form-control:focus {  
 color: #495057;  
 background-color: #fff;  
 border-color: #343a40;  
 outline: 0;  
 box-shadow: 0 0 0 0.2rem rgba(216,217,219,.5);  
 }  
 </style>
  • Go to Blogger Dashboard
  • And go to Layout Menu

    Under the main menu, you see Add a Gadget

  • Click to Add a Gadget

Image

  • Select the HTML/Javascript
  • Past this code under the Content
  • And click the save button

  • 3:How to Install Javascript?

  • Copy code is given below in the theme window 
     <script>  
 (function($) {  
 $(function() {  
 var $shareLink = $('#sharelink'),  
 $downloadLink = $('#downloadlink'),  
 $copyButton = $('#copylinkbtn'),  
 clipboard;  
 $shareLink.on('keyup paste click', function() {  
 var link = $shareLink.val(),  
 l = link.replace(/\/file\/d\/(.+)\/(.+)/, "/uc?export=download&id=$1");  
 if(l !== link) {  
 $downloadLink.val(l);  
 $copyButton.removeAttr('disabled');  
 $('#toast').toast('show');  
 } else {  
 $downloadLink.val('');  
 $copyButton.attr('disabled', 'disabled');  
 if (is_url(link) && link.length > 10) {  
 $('#error').toast('show');  
 }  
 }  
 });  
 $downloadLink.on('click', function() {  
 $downloadLink.select();  
 });  
 });  
 })(jQuery);  
 function is_url(str)  
 {  
 regexp = /^(?:(?:https?|ftp):\/\/)?(?:(?!(?:10|127)(?:\.\d{1,3}){3})(?!(?:169\.254|192\.168)(?:\.\d{1,3}){2})(?!172\.(?:1[6-9]|2\d|3[0-1])(?:\.\d{1,3}){2})(?:[1-9]\d?|1\d\d|2[01]\d|22[0-3])(?:\.(?:1?\d{1,2}|2[0-4]\d|25[0-5])){2}(?:\.(?:[1-9]\d?|1\d\d|2[0-4]\d|25[0-4]))|(?:(?:[a-z\u00a1-\uffff0-9]-*)*[a-z\u00a1-\uffff0-9]+)(?:\.(?:[a-z\u00a1-\uffff0-9]-*)*[a-z\u00a1-\uffff0-9]+)*(?:\.(?:[a-z\u00a1-\uffff]{2,})))(?::\d{2,5})?(?:\/\S*)?$/;  
 if (regexp.test(str))  
 {  
 return false;  
 }  
 else  
 {  
 return true;  
 }  
 }  
 function copy() {  
 /* Get the text field */  
 var copyText = document.getElementById("downloadlink");  
 copyText.select();  
 copyText.setSelectionRange(0, 99999); /*For mobile devices*/  
 document.execCommand("copy");  
 alert("Copied the text: " + copyText.value);  
 document.getElementById('copylinkbtn').innerHTML = "Copied";  
 };  
 var getUrlParameter = function getUrlParameter(sParam) {  
 var sPageURL = window.location.search.substring(1),  
 sURLVariables = sPageURL.split('&'),  
 sParameterName,  
 i;  
 for (i = 0; i < sURLVariables.length; i++) {  
 sParameterName = sURLVariables[i].split('=');  
 if (sParameterName[0] === sParam) {  
 return sParameterName[1] === undefined ? true : decodeURIComponent(sParameterName[1]);  
 }  
 }  
 };  
 </script>
  • The same process like install CSS

    4:How to Install HTML?

  • Copy code is given below in the theme window 
     <!doctype html>  
 <!-- Required meta tags -->  
 <!-- Bootstrap CSS -->  
 <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous" />  
 <link rel="stylesheet" type="text/css" href="style.css" />  
 <!-- Image and text -->  
 <nav class="navbar navbar-light bg-dark">  
 <div class="container">  
 <a class="navbar-brand text-light" href="/">  
 <img src="https://1.bp.blogspot.com/-9f1y6C8_JXs/Xh7aTrxHVAI/AAAAAAAABlU/sVev-47Xk30W-7sBT-kawV4919tvZIjbwCLcBGAsYHQ/s1600/logo.png" width="30" height="30" class="d-inline-block align-top" alt="" />  
 Glink Creater  
 </a></div>  
 </nav>  
 <div class="container bg-img">  
 <div class="row">  
 <div class="card rounded-lg border-dark">  
 <div class="card-header bg-dark text-white">  
 <img src="https://1.bp.blogspot.com/-9f1y6C8_JXs/Xh7aTrxHVAI/AAAAAAAABlU/sVev-47Xk30W-7sBT-kawV4919tvZIjbwCLcBGAsYHQ/s1600/logo.png" width="40" />  
 <button type="button" class="btn btn-light float-right " data-toggle="modal" data-target=".instructions">  Show instructions</button>  
 </div>  
 <div class="card-body bg-light">  
 <h2 class="card-title">GDrive Direct Link</h2>  
 <form>  
 <label for="exampleInputPassword1">Share Link</label>  
 <div class="input-group mb-3">  
 <input type="url" id="sharelink" class="form-control" placeholder="https://drive.google.com/file/d/..../view?usp=sharing" />  
 </div>  
 <label for="exampleInputPassword1">Direct Link</label>  
 <div class="input-group mb-3">  
 <input type="text" id="downloadlink" class="form-control" placeholder="Direct Download Link.." readonly />  
 <div class="input-group-append">  
 <button id="copylinkbtn" class="btn btn-dark" type="button" data-clipboard-target="#downloadlink" disabled="" onclick="copy()"> link</button>  
 </div>  
 </div>  
 </form>  
 </div><!--end card body-->  
 </div><!--end card-->  
 </div><!--end row-->  
 </div><!--end container-->  
 <footer class="bg-dark py-2 text-center text-white fixed-bottom">  
 <p>Powerd By@ <a href="https://a4you0.blogspot.com" target="_blank">A4YOU.</a></p>  
 </footer>  
 <!--link created success or failed alert-->  
 <div aria-live="polite" aria-atomic="true" data-autohide="false style=" position:relative;="" min-height:="" 200px;"="">  
   <div class="toast" id="toast" data-delay="3000" style="position: absolute; bottom: 75px; right: 30px;">  
     <div class="toast-header bg-success text-white">  
       <img src="https://1.bp.blogspot.com/-9f1y6C8_JXs/Xh7aTrxHVAI/AAAAAAAABlU/sVev-47Xk30W-7sBT-kawV4919tvZIjbwCLcBGAsYHQ/s1600/logo.png" class="rounded mr-2" alt="logo_ico" width="10" />  
       <strong class="mr-auto">Ok, Done !</strong>  
       <small>3 sec ago</small>  
       <button type="button" class="ml-2 mb-1 close" data-dismiss="toast" aria-label="Close">  
         <span aria-hidden="true">×</span>  
       </button>  
     </div>  
     <div class="toast-body">  
       Link Creted Success ! You can copy it Now !  
     </div>  
   </div>  
   <div class="toast error" id="error" data-delay="3000" style="position: absolute; bottom: 75px; right: 30px;">  
     <div class="toast-header bg-danger text-white">  
       <img src="img/logo.png" class="rounded mr-2" alt="logo_ico" width="10" />  
       <strong class="mr-auto">Error !</strong>  
       <small>3 sec ago</small>  
       <button type="button" class="ml-2 mb-1 close" data-dismiss="toast" aria-label="Close">  
         <span aria-hidden="true">×</span>  
       </button>  
     </div>  
     <div class="toast-body">  
       Invalid Url ! Plz check again .  
     </div>  
   </div>  
 </div>  
   <!-- Modal -->  
   <div class="modal fade instructions" tabindex="-1" role="dialog" aria-labelledby="myExtraLargeModalLabel" aria-hidden="true">  
     <div class="modal-dialog modal-xl">  
       <div class="modal-content">  
         <img src="https://1.bp.blogspot.com/-49fCzhCq6Xk/Xh7aUwT1NsI/AAAAAAAABlc/IIXFBmJWRL80Rc-F1dxnfleg9feownWMgCLcBGAsYHQ/s1600/instructions.gif" />  
       </div>  
     </div>  
   </div>  
     <!-- Optional JavaScript -->  
     <!-- jQuery first, then Popper.js, then Bootstrap JS -->  
     <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>  
     <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>  
     <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>  
     <script src="js/script.js"></script>  
 </!doctype>
  • The same process like install CSS

Now your Glink Generator website is ready. If you don’t know about using this tool website, you can watch our video.



        Tags

        Post a Comment

        Please don't enter any faux falt and link within the comment box.

        Post a Comment

        Please don't enter any faux falt and link within the comment box.

        Previous Post Next Post