Ads 720 x 90

Fiksioner Free Blogger Theme Download

Membuat Safelink Blogger Menggunakan Template Keinginan Sendiri

B-KREATIF - Untuk membuat safelink menggunakan template sesuai keinginan sendiri sangatlah mudah. karna banyak permintaan dari teman-teman untuk membuatnya, pada kesempatan kali ini saya ingin berbagi cara membuat safelink menggunakan template sesuai selera hati kita.


Untuk membuatnya anda tidak perlu mengupgrade blog kedalam keadaan berdomain TLD. dengan menggunakan blogspot saja anda sudah bisa membuatnya. berikut ini adalah cara membuat safelink blogger menggunakan Template keinginan sendiri.

MEMBUAT SAFELINK BLOGGER

Untuk Membuat Safelink Blogger menggunakan template keinginan sendiri ada 3 langkah, dan berikut langah-langkah untuk membuat safelink blogger menggunakan template sesuai keinginan anda sensdiri.

STEP 1 : Pasang Script Encrypt
  1. Silahkan masuk ke akun blog kamu yang ingin dibuat safelink atau bisa menggunakan blog baru.
  2. Download Template yang ingin digunakan safelink, bebas  kamu bisa menggunakan template segala hal.
  3. Jika sudah di download dan diganti silahkan pilih TEMPLATE > EDIT HTML
  4. Cari tag <b:skin> dan masukan css tombol dibawah ini.
  5. /* Tombol Download */
    .buttonDownload {
     border-radius: 3px;
     display: inline-block;
     position: relative;
     padding: 10px 25px;
     background-color: $(body.link.color);
     color: white !important;
     font-weight: bold; 
     font-size: 0.9em;
     text-align: center;
     text-indent: 15px;
     transition:all 0.4s;
     -moz-transition:all 0.4s;
     -webkit-transition:all 0.4s;
    }
    .buttonDownload:hover {
     opacity: .85;
    }
    .buttonDownload::before, .buttonDownload::after {
     content: ' ';
     display: block;
     position: absolute;
     left: 15px;
     top: 52%;
    }
    .buttonDownload::before {
     width: 10px;
     height: 2px;
     border-style: solid;
     border-width: 0 2px 2px;
    }
    .buttonDownload::after {
     width: 0;
     height: 0;
     margin-left: 3px;
     margin-top: -7px;
     border-style: solid;
     border-width: 4px 4px 0 4px;
     border-color: transparent;
     border-top-color: inherit;
     animation: downloadArrow 2s linear infinite;
     animation-play-state: paused;
    }
    .buttonDownload:hover::after {
     animation-play-state: running;
    }
    @keyframes downloadArrow {
     0% {
      margin-top: -7px;
      opacity: 1;
     }
     0.001% {
      margin-top: -15px;
      opacity: 0;
     }
     50% {
      opacity: 1;
     }
     100% {
      margin-top: 0;
      opacity: 0;
     }
    }
    .hidden{visibility:hidden;height:0;overflow:hidden;display:none}
    
  6. Kemudian cari tag </body> dan masukan ketiga script dibawah ini tepat diatasnya
  7. <script src='https://cdn.jsdelivr.net/gh/Indzign/theme@master/thetimer.js' type='text/javascript'/>
    <script src='https://min.gitcdn.link/repo/zenorocha/clipboard.js/master/dist/clipboard.min.js' type='text/javascript'/> 
    <script src='https://rawcdn.githack.com/nandakrisbianto/JAVASCRIPT/25beed5e849d52b81594e20032b0d6058a172d28/nanda.js' type='text/javascript'/>
  8. Setelah itu silahkan pasang juga css timer tepat diatas </body>
  9. <style>
    #timer{margin:auto;width:80px}
    .pietimer{position:relative;font-size:200px;width:1em;height:1em}
    .pietimer &gt; .percent{position:absolute;top:18px;left:5px;width:3.33em;font-size:18px;text-align:center;display:none}
    .pietimer &gt; .slice{position:absolute;width:1em;height:1em;clip:rect(0px,1em,1em,0.5em)}
    .pietimer &gt; .slice.gt50{clip:rect(auto,auto,auto,auto)}
    .pietimer &gt; .slice &gt; .pie{border:0.1em solid #c0c0c0;position:absolute;width:0.8em;/* 1 - (2 * border width) */height:0.8em;/* 1 - (2 * border width) */clip:rect(0em,0.5em,1em,0em);-moz-border-radius:0.5em;-webkit-border-radius:0.5em;border-radius:0.5em}
    .pietimer &gt; .slice &gt; .pie.fill{-moz-transform:rotate(180deg)!important;-webkit-transform:rotate(180deg)!important;-o-transform:rotate(180deg)!important;transform:rotate(180deg)!important}
    .pietimer.fill &gt; .percent{display:none}
    .pietimer.fill &gt; .slice &gt; .pie{border:transparent;background-color:#c0c0c0;width:1em;height:1em}
    #sidebarleft,#sidebarright {text-align:center}
    </style>
  10. Kemudian save

STEP 2 : Membuat Halaman Generate
  1. Buatlah Sebuah halaman dengan nama generate
  2. Jika sudah silahkan masuk pada html
  3. Copy Script dibawah ini dan taruh di di dalam mode HTML halaman
  4. <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"></link>
    <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css" rel="stylesheet"></link>
    <br />
    <div class="panel panel-primary primary-color-border">
    <div class="panel-heading primary-color">
    <div class="panel-title text-center">
    <h2>
    <i class="fa fa-shield">
    </i>
    <strong>Generate Link</strong>
    </h2>
    </div>
    </div>
    <div class="panel-body">
    <div class="form-group">
    <div class="input-group">
    <span class="input-group-addon">
    <i class="fa fa-link">
    </i>
    </span>
    <input class="form-control" id="generateurl" placeholder="http://example.com" type="url" />
    <span class="input-group-btn">
    <button class="btn btn-primary primary-color primary-color-border" id="btngenerate" type="button">
    <i class="fa fa-shield">
    </i>
    <strong>Submit</strong>
    </button>
    </span>
    </div>
    </div>
    <div class="hidden text-center" id="generateloading">
    <i class="fa fa-spinner fa-spin"></i></div>
    <div class="hidden" id="generatelink">
    <div class="form-group has-success">
    <div class="input-group">
    <span class="input-group-addon">
    <strong>Result:</strong>
    <i aria-hidden="true" class="fa fa-check">
    </i>
    </span>
    <input class="form-control" id="resulturl" onclick="this.focus();this.select()" readonly="readonly" type="text" />
    </div>
    <br />
    <div class="text-center">
    <button class="copytoclipboard btn-sm btn btn-success" data-clipboard-action="copy" data-clipboard-target="#resulturl" id="copytoclipboard"><span class="fa fa-floppy-o"> Copy URL</span></button>
    </div>
    </div>
    </div>
    </div>
    </div>
  5. Kemudian Publikasikan

STEP 3 : Pasang Timer dan Button Pada  Artikel.
  1. Buatlah sebuah artikel
  2. Kemudian Taruh Script Timer dibawah ini tepat diatas artikel Kamu
  3. <center>
    <div id='timer'/>
    <div class='text-center'>
    <button class='buttonDownload hidden' disabled='' id='getlink'>Get Link Tekan 2X</button>
    <!-- Taruh iklan Dibawah Sini -->
    </div>
    </center>
  4. Lalu pasang Script Tombol dibawah ini dibawah timer kamu.
  5. <center>
    <!-- taruh iklan disini-->
    <br/>
    <button class='buttonDownload hidden' disabled='' id='gotolink'>Go to Link</button>
    </center>
  6. Usahakan penempatan script tombol ada di tengah artikel.
  7. Kemudian publish artikel.

Itulah cara membuat Safelink Blogger menggunakan template keinginan sendiri. Jika ada pertanyaan seputar artikel ini silahkan memberikan pertanyaan di komentar dibawah artikel ini.

Untuk memasang safelink ke blog utama silahkan gunakan script dibawah ini :
 <script type="text/javascript">
//<![CDATA[
var setting = {
 exceptionurl : "www.b-template.zone.id,google.com",
 path : "#?o="
};
//]]>
</script>
<script src="https://rawcdn.githack.com/bianKOPI/nanda.js/7d927cda1225d1557fd514707199f94e6af08f9b/autoconvert.js"></script>
<script src="https://www.blogger.com/feeds/3449960210941506547/posts/default?alt=json-in-script&max-results=150&callback=showurl"></script> 

Untuk atur silahkan ganti 3449960210941506547 dengan id blog safelink kamu dan untuk atur url yang dilewati safelink tambahkan pada exceptionurl

Related Posts

Subscribe Our Newsletter