How to Make Safelink on Main Blog in Blogger

Maybe most readers of this article already know what safelink is, but as a reminder, it will be explained again here. Safelink is a page of a website or blog used to identify whether the intended URL/link is safe from viruses and malware, in short, safelink is a redirect page before the user goes to the intended page.

What is Safelink?

Safelink is usually found on blogs/websites with download themes, but what is often seen is that safelink is not on the original blog with a different domain. This secure link type has some disadvantages but will not be discussed here. Thinking about the various benefits maximized from safe links, we have tried to load a safelinks page that resides on the main blog and works perfectly.

Creating a Safelink Page

Create a new page and paste this code in HTML view

 <div style="display:block">
  <!-- Fill AdSense code here-->
</div>
<div class="safelink" id="safelink">
  <center>
    <div class="S_Button outline" id="AT_SAFELINK">Wait for a while...</div>
    <script>
      /*<![CDATA[*/ var currentURL=location.href; var str = currentURL; var res = str.replace('https://blogbrackets.com' + '?url=', ""); function changeLink(){var decodedString = Base64.decode(res); window.open(decodedString,'_blank')}; document.write('<a href="#go-link" id="download-safelink" class="S_Button outline">Click to go to the link</a>'); var linkDL = document.getElementById("download-safelink"); var notif = document.getElementById("AT_SAFELINK"); var time = 30; var text_time = document.createElement("span"); linkDL.parentNode.replaceChild(text_time, linkDL); var id; id = setInterval(function () { time--; if (time < 0) { text_time.parentNode.replaceChild(linkDL, text_time); clearInterval(id); notif.style.display = "none"; linkDL.style.display = "inline-block"; } else { text_time.innerHTML = "The link will appear in time " + time.toString() + " second"; }}, 1000); /*]]>*/
    </script>
  </center>
</div>
	<!-- Your Post Content Here-->
<div class="blockLink" style="text-align: center;">
  <div class="ads-left" id="ads-left">
    <!-- Fill AdSense code here-->
  </div>
  <div id="go-link">
    <a
      class="S_Button"
      href="javascript:void(0)"
      onclick="changeLink();"
      rel="nofollow noreferrer"
      >Go to link</a
    >
  </div>
  <div class="ads-right" id="ads-right">
    <!-- Fill AdSense code here-->
  </div>
</div>

Warning!
Don't forget to copy the page url/link that you created earlier and replace the url
https://blogbrackets.com with the url of your safelink page.

Add Some CSS

Add this CSS code before ]]></b:skin>

 /* Safelink */
.S_Button{display: inline-flex;display: -webkit-inline-flex;flex-wrap: wrap;-webkit-flex-wrap: wrap;align-items: center;-webkit-align-items: center;margin-bottom: 10px;padding: 9px 20px;border-radius: 10px;font-size: .8rem;line-height: 1.3rem;background-color: #282828;color: #fff;border: 1px solid #fff;}}
.S_Button.outline{background-color:#282828;box-shadow: 0 2px 5px 0 rgba(0,0,0,.1);}
.safelink span{display: block;font-size: 12px}
.blockLink{display: flex;display: -webkit-flex;flex-wrap: wrap;-webkit-flex-wrap: wrap;align-items: center;-webkit-align-items: center}
.blockLink > div{display: block;width: 35%;}
.blockLink > div#go-link{width: 30%;}
.blockLink > div#go-link a{display: none;margin: 0}
.blockLink > div#go-link:target a{display: inline-flex;
    text-decoration: none;
}
.ads-top{margin: 0 0 20px 0;text-align: center}

/* Responsive */
@media screen and (max-width: 768px){.blockLink > div{width: 100% !important;margin: 0 0 15px;text-align: center}.blockLink > div:last-child{margin: 0}}

Finally Add Some JavaScript

Add this JavaScript code before </body>

<script>/*<![CDATA[*/ var Base64 = {_keyStr: "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=", encode: function (input) {var output = ""; var chr1, chr2, chr3, enc1, enc2, enc3, enc4; var i = 0; input = Base64._utf8_encode(input); while (i < input.length) {chr1 = input.charCodeAt(i++); chr2 = input.charCodeAt(i++); chr3 = input.charCodeAt(i++); enc1 = chr1 >> 2; enc2 = ((chr1 & 3) << 4) | (chr2 >> 4); enc3 = ((chr2 & 15) << 2) | (chr3 >> 6); enc4 = chr3 & 63; if (isNaN(chr2)) {enc3 = enc4 = 64;} else if (isNaN(chr3)) {enc4 = 64;} output = output + this._keyStr.charAt(enc1) + this._keyStr.charAt(enc2) + this._keyStr.charAt(enc3) + this._keyStr.charAt(enc4);} return output; }, decode: function (input) {var output = ""; var chr1, chr2, chr3; var enc1, enc2, enc3, enc4; var i = 0; input = input.replace(/[^A-Za-z0-9+/=]/g, ""); while (i < input.length) {enc1 = this._keyStr.indexOf(input.charAt(i++)); enc2 = this._keyStr.indexOf(input.charAt(i++)); enc3 = this._keyStr.indexOf(input.charAt(i++)); enc4 = this._keyStr.indexOf(input.charAt(i++)); chr1 = (enc1 << 2) | (enc2 >> 4); chr2 = ((enc2 & 15) << 4) | (enc3 >> 2); chr3 = ((enc3 & 3) << 6) | enc4; output = output + String.fromCharCode(chr1); if (enc3 != 64) {output = output + String.fromCharCode(chr2);} if (enc4 != 64) {output = output + String.fromCharCode(chr3);} } output = Base64._utf8_decode(output); return output;}, _utf8_encode: function (string) {string = string.replace(/rn/g, "n"); var utftext = ""; for (var n = 0; n < string.length; n++) {var c = string.charCodeAt(n); if (c < 128) {utftext += String.fromCharCode(c);} else if ((c > 127) && (c < 2048)) {utftext += String.fromCharCode((c >> 6) | 192); utftext += String.fromCharCode((c & 63) | 128);} else {utftext += String.fromCharCode((c >> 12) | 224); utftext += String.fromCharCode(((c >> 6) & 63) | 128); utftext += String.fromCharCode((c & 63) | 128); }} return utftext;}, _utf8_decode: function (utftext) {var string = ""; var i = 0; var c = c1 = c2 = 0; while (i < utftext.length) {c = utftext.charCodeAt(i); if (c < 128) {string += String.fromCharCode(c); i++;} else if ((c > 191) && (c < 224)) {c2 = utftext.charCodeAt(i + 1); string += String.fromCharCode(((c & 31) << 6) | (c2 & 63)); i += 2;} else {c2 = utftext.charCodeAt(i + 1); c3 = utftext.charCodeAt(i + 2); string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63)); i += 3;}} return string; }}; var encode = document.getElementById('encode'), decode = document.getElementById('decode'), output = document.getElementById('output'), input = document.getElementById('input'); var User_ID = ""; var protected_links = ""; var a_to_va = 0; var a_to_vb = 0; var a_to_vc = ""; function auto_safelink() {auto_safeconvert();}; function auto_safeconvert() {var a_to_vd = window.location.hostname; if (protected_links != "" && !protected_links.match(a_to_vd)) {protected_links += ", " + a_to_vd;} else if (protected_links == "") {protected_links = a_to_vd;} var a_to_ve = ""; var a_to_vf = new Array(); var a_to_vg = 0; a_to_ve = document.getElementsByTagName("a"); a_to_va = a_to_ve.length; a_to_vf = a_to_fa(); a_to_vg = a_to_vf.length; var a_to_vh = false; var j = 0; var daftarPostingan = [ "https://blogbracket.com" ]; var randomPostingan = daftarPostingan[Math.floor(Math.random()*daftarPostingan.length)]; var a_to_vi = ""; for (var i = 0; i < a_to_va; i++) {a_to_vh = false; j = 0; while (a_to_vh == false && j < a_to_vg) {a_to_vi = a_to_ve[i].href; if (a_to_vi.match(a_to_vf[j]) || !a_to_vi || !a_to_vi.match("https")) {a_to_vh = true;} j++; } if (a_to_vh == false) {var encryptedUrl = Base64.encode(a_to_vi); a_to_ve[i].href = randomPostingan + "?url=" + encryptedUrl; a_to_ve[i].rel = "nofollow noreferrer"; a_to_vb++; a_to_vc += i + ":::" + a_to_ve[i].href + "n"; }} var a_to_vj = document.getElementById("anonyminized"); var a_to_vk = document.getElementById("found_links"); if (a_to_vj) {a_to_vj.innerHTML += a_to_vb;} if (a_to_vk) {a_to_vk.innerHTML += a_to_va;} }; function a_to_fa() {var a_to_vf = new Array(); protected_links = protected_links.replace(" ", ""); a_to_vf = protected_links.split(","); return a_to_vf; }; /*]]>*/</script>
<script>/*<![CDATA[*/ protected_links = "facebook.com,instagram.com,twitter.com";auto_safelink(); /*]]>*/</script>

Warning!
Don't forget to copy the page url/link that you created earlier and replace the url
https://blogbrackets.com with the url of your safelink page.

Completed

Save your theme and make anchor link button

Content Creator, Graphic Designer, Front-end Developer
Bookmark This Blogger: Blog Brackets