Membuat Safelink DI Blog Utama (Random Post + Generator)

Safelink adalah situs web atau blog yang dibuat dengan tujuan untuk mengarahkan pengunjung ke suatu halaman tertentu sebelum di alihkan pada link tuju

Safelink adalah situs web atau blog yang dibuat dengan tujuan untuk mengarahkan pengunjung ke suatu halaman tertentu sebelum di alihkan pada link tujuan, Namun beberapa diantaranya ada juga safelink yang harus melewati iklan sebelum di alihkan pada tujuan.

Namun, saya rasa hal itu akan sangat menggangu pengunjung. saya sendiri menggunakan safelink pada blog utama dengan tujuan untuk meningkatkan visitor saja, sehingga tidak begitu terganggu dengan banyaknya redirect pada beberapa iklan.

Safelink yang saya bagikan ini sangat simple, hanya untuk meningkatkan visitor saja. karna sebelum kita dialihkan pada link tujuan, kita akan melewati dulu 1 post artikel yang ada di blog kita dengan hitungan detik barulah muncul tombol untuk mengakses link tujuan. 

Hal ini bertujuan agar tidak begitu menggangu pengunjung karna banyaknya pengalihan sebelum mengakses link yang akan dituju. Untuk pemasangannya pada blog utama silahkan ikuti langkah-langkah di bawah ini.

Cara Membuat Safelink Di Blog Utama

Pastikan template kalian sudah ada script JQuery, jika belum silahkan salin code di bawah ini dan letakan code tsb tepat diatas code </head>atau &lt;!--</head>--&gt;&lt;/head&gt;

<script async='async' src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js'/>

Selanjutnya salin kode CSS dibawah ini dan letakan pada penyimpanan code CSS di dalam template blog anda. atau letakan saja tepat diatas code ]]></b:skin>

.wcSafeShow{position:relative;width:35px;height:35px;display:flex;margin:auto} .safeWrap{position:fixed;top:0;left:0;bottom:0;right:0;background:rgba(0,0,0,.5);z-index:999999;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.panel-primary{background:#fff;text-align:center;display:block;overflow:hidden;width:100%;max-width:80%;padding:0 0 25px 0;border-radius:5px;margin:15% auto;box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24)}.panel-body{position:relative;margin:0 25px}.panel-heading h2{background:#102767;color:#fff;margin:0 auto 25px auto;font-weight:400;padding:15px;font-size:20px}.panel-body input{background:rgba(0,0,0,0.04);width:100%;padding:15px;border-radius:5px;border:1px solid transparent;font-size:16px;color:#000;outline:none;text-indent:60px;transition:all .3s}.panel-body input:focus{background:#fff;color:#000;border-color:#102767;outline:none;box-shadow:0 0 5px rgba(0,0,0,0.1)}.panel-body .input-group-btn{position:absolute;top:0;right:0}.panel-body button{border-radius:0 5px 5px 0;background:#102767;color:#fff;border:0;padding:17px 52px;font-weight:500;outline:none;transition:all .3s}.panel-body button:hover,.panel-body button:focus{background:#102767;outline:none}#generatelink{margin:20px auto 0 auto}#generatelink button{background:#102767;border-radius:5px;font-size:14px;padding:14px 32px}#generatelink button:hover,#generatelink button:focus{background:#102767;border-radius:5px;font-size:14px}#generatelink input{background:rgba(0,0,0,0.05);text-indent:0}#generatelink input:hover,#generatelink input:focus{background:#102767;border-color:transparent;box-shadow:none}#generateloading{margin:20px auto 0 auto;font-size:20px;color:#102767;font-weight:normal}.panel-body:before{content:'\279C';background:rgba(0,0,0,0.05);position:absolute;left:0;top:0;color:#888;padding:17px 20px;border-radius:5px 0 0 5px;border-right:1px solid transparent;transition:all .6s}.panel-body:focus-within:before{content:'\279C';background:#102767;color:#fff}.bt-success{display:inline-flex;align-items:center;margin:15px 15px;padding:10px 20px;outline:0;border:0;border-radius:2px;color:#fefefe;background-color:#102767;font-size:14px;white-space:nowrap;overflow:hidden;max-width:100%;line-height:2em}.bt-success:hover{color:#102767;background-color:transparent;border:1px solid #102767}.hidden,.bt-success.hidden{display:none}.wcSafeClose{display:inline-flex;align-items:center;margin:15px auto -15px;padding:5px 15px;outline:0;border:0;border-radius:2px;color:#fefefe;background-color:#102767;font-size:14px;white-space:nowrap;overflow:hidden;max-width:100%;line-height:2em}.copytoclipboard{margin:10px auto 5px}#timer{margin:0 auto 20px auto;width:80px;text-align:center}.pietimer{position:relative;font-size:200px;width:1em;height:1em}.pietimer > .percent{position:absolute;top:25px;left:12px;width:3.33em;font-size:18px;text-align:center;display:none}.pietimer > .slice{position:absolute;width:1em;height:1em;clip:rect(0px,1em,1em,0.5em)}.pietimer >.slice.gt50{clip:rect(auto,auto,auto,auto)}.pietimer > .slice > .pie{border:0.06em solid #c0c0c0;position:absolute;width:1em;height:1em;clip:rect(0em,0.5em,1em,0em);border-radius:0.5em}.pietimer > .slice > .pie.fill{-moz-transform:rotate(180deg)!important;-webkit-transform:rotate(180deg)!important;-o-transform:rotate(180deg)!important;transform:rotate(180deg)!important}.pietimer.fill > .percent{display:none}.pietimer.fill > .slice > .pie{border:transparent;background-color:#c0c0c0;width:1em;height:1em}.wcSafeShow svg{fill:none!important;stroke:#48525c;stroke-linecap:round;stroke-linejoin:round;stroke-width:1;width:22px;height:22px}#generateloading svg{width:22px;height:22px;fill:#102767}.btn-primary svg,.darkMode .btn-primary svg{fill:none;stroke:#fff;stroke-width:1.5;width:22px;height:22px;vertical-align:-5px;margin-right:10px}@media screen and (max-width:768px){.panel-body .input-group-btn{display:block;position:relative;overflow:hidden;margin:20px auto 0 auto}.panel-body button{border-radius:5px;width:100%}}@media screen and (max-width:480px){.panel-primary{margin-top:30%}} .darkMode .panel-primary{background:#2d2d30;color:#fefefe}.darkMode .panel-body input,.darkMode .panel-body input:focus{background:#2d2d30;color:#fefefe}.darkMode .wcSafeClose{color:#fefefe}

Kemudian letakan code generator safelink di tempat yang anda inginkan, seperti contoh saya meletakannya pada bagian header di samping kanan tombol dark mode

Jika anda pengguna template Median UI 1.5 silahkan salin kode dibawah ini dan letakan diatas kode <!--[ Search button ]-->tepat di bawah kode tombol dark mode

<div class='wcSafeShow'><svg class='line' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(3.500000, 2.000000)'><path d='M8.4845,19.6057 C10.8195,19.6057 16.1565,17.2837 16.1565,10.8787 C16.1565,4.4747 16.4345,3.9737 15.8195,3.3577 C15.2035,2.7417 11.9935,0.7507 8.4845,0.7507 C4.9755,0.7507 1.7655,2.7417 1.1505,3.3577 C0.5345,3.9737 0.8125,4.4747 0.8125,10.8787 C0.8125,17.2837 6.1505,19.6057 8.4845,19.6057 Z'/><polyline points='5.8859 9.8748 7.7779 11.7698 11.6759 7.8698'/></g></svg></div>

Selanjutnya cari code <data:post.body/>biasanya code seperti itu ada lebih dari satu, tergantung pada template yang kalian gunakan. Namun diusahakan untuk penempatan kedua kode di bawah berada di dalam post.

<!-- letakkan di atas kode <data:post.body/> --><div id='timer'/><div style='text-align: center'><button class='bt-success hidden' disabled='' id='wcGetLink'>Get Link</button></div><!-- letakkan di bawah kode <data:post.body/> --><div style='text-align: center'><button class='bt-success hidden' disabled='' id='gotolink'>Go to Link</button></div>

Selanjutnya salin dan letakan kode di bawah ini berada pada tag html footer seperti ini <footer setiap tag footer juga berbeda, tergantung bagaimana pembuat template membuatnya. intinya cari saja tag footer seperti itu.

<div class='safeWrap hidden'><div class='panel-primary'><div class='panel-heading'><h2>Generate Link</h2></div><div class='panel-body'><input autocomplete='off' id='generateurl' oninvalid='this.setCustomValidity(&apos;Please Enter valid link&apos;)' placeholder='Enter your link here...' required='required' type='url'/><span class='input-group-btn'><button class='btn-primary' id='btngenerate' oninvalid='this.setCustomValidity(&apos;Please Enter valid link&apos;)' required='required' type='button'><svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M18.865 5.1238C19.302 5.2768 19.594 5.6888 19.594 6.1518V12.9248C19.594 14.8178 18.906 16.6248 17.691 18.0248C17.08 18.7298 16.307 19.2788 15.486 19.7228L11.928 21.6448L8.364 19.7218C7.542 19.2778 6.768 18.7298 6.156 18.0238C4.94 16.6238 4.25 14.8158 4.25 12.9208V6.1518C4.25 5.6888 4.542 5.2768 4.979 5.1238L11.561 2.8108C11.795 2.7288 12.05 2.7288 12.283 2.8108L18.865 5.1238Z'/><path class='svg-c' d='M9.32251 11.9177L11.2145 13.8107L15.1125 9.91269'/></svg>Generate</button></span><div class='hidden' id='generateloading'><svg viewBox='0 0 50 50' x='0px' y='0px'><path d='M25.251,6.461c-10.318,0-18.683,8.365-18.683,18.683h4.068c0-8.071,6.543-14.615,14.615-14.615V6.461z'><animateTransform attributeName='transform' attributeType='xml' dur='0.6s' from='0 25 25' repeatCount='indefinite' to='360 25 25' type='rotate'/></path></svg></div><div class='hidden' id='generatelink'><input id='resulturl' onclick='this.focus();this.select()' readonly='readonly' type='text'/><button class='copytoclipboard' data-clipboard-action='copy' data-clipboard-target='#resulturl' id='copytoclipboard'>Copy URL</button></div></div><a class='wcSafeClose' href='javascript:void'>Close</a>

Kemudian yang terakhir salin kode di bawah dan letakan tepat diatas kode </body>atau &lt;!--</body>--&gt;&lt;/body&gt;jika sudah, jangan lupa untuk save.

Pada bagian yang saya tandai bisa kalian edit dan di sesuaikan dengan kebutuhan kalin

<script>//<![CDATA[var setTimer=10; //waktu detikvar setColor='#102767'; //warna loading timervar setText='Harap Tunggu...'; //pesan pada tombolvar setCopyUrl='Salin URL'; // generator salinvar setCopied='URL Tersalin'; //generator tersalin// global script version 1.1 open source codedocument.addEventListener ("DOMContentLoaded", globalscript);function globalscript(){let script=document.createElement('script');script.defer=true;script.src="https://cdn.jsdelivr.net/gh/choipanwendy/safelink-v1.1@main/wcsafelink.js";document.body.append(script)};//]]> </script

Silahkan dicoba hasilnya, semoga artikel ini bermanfaat. Dan jangan lupa untu share artikel ini, jika ada masalah ketika pemasangan safelink silahkan berkomentar.

Pembelian

Membuat Safelink DI Blog Utama (Random Post + Generator)
Rp. 20rb / $2
*Pembelian dapat melalui Gopay, OVO dan lainnya detail info

Metode pembayaran

Bank Transfer Paypal
sudah membayar? konfirmasi di sini

6 komentar

  1. pertama jadi panik sih kok link yang sudah di ganerate menuju page 404 eh rupanya link yang di generate harus awalan https://blablabla wkwkw terimakasih banya tutorial nya min
    1. Sama-sama bro
  2. Request tutorial masang icon svg di label untuk gantikan in di median UI 1.5 min
  3. icon-nya kok gak bisa di klik ya?
    1. Icon untuk generate safelinknya kah? pastiin dulu di template yg abang gunakan udah terpasang script JQuery

      <script async='async' src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js'/>

      Atau jika icon generate safelink tetap tidak muncul, coba tempatkan icon generate di halaman blog saja.
  4. solusi iklan tidak muncul dari safelink gimana bg... kalau dari artikel biasa iklan muncul tp kalau dari hasil safelink ngk ada iklannya...
Tinggalkan komentar sesuai topik tulisan, centang Notify me untuk mendapatkan notifikasi via email ketika komentar kamu di balas.
Masukkan URL Gambar atau Potongan Kode, atau Quote, lalu klik tombol yang kamu inginkan untuk di-parse. Salin hasil parse lalu paste ke kolom komentar.


image quote pre code
© subangXploits. All rights reserved. Premium By Raushan Design