Spider Blogging - The Ultimate Blogging Solution

Home
Blogger

How To Make Safelink On Main Blog | Redirect All External Links to Safelink Page | Spider Blogging

 Hello Guys, Today in this post am going to show you how to redirect all your external link to safelink page in blogger , its not manual , this code will help you to automatically redirect all your links to a static safelink page. Let's go through the post.....


How To Make Safelink On Main Blog | Redirect All External Links to Safelink Page


Safelink Scenarios and Benefits:

The way it works is almost the same as other safelinks, it's just that the safelink page remains on the main domain. The scenario is that when visitors want to download certain files on the blog, they will be directed to a certain page of the blog before finally heading to the file download page.




There are many benefits that can be obtained from this version of Safelink, some of which are:

  • No need to create a new blog and buy a new domain
  • It's easier to customize
  • Stay on the main blog, meaning that it automatically increases the number of visitors on the main blog
  • Increase blog pagerank because visitors increase
  • Reducing the bounce rate of the main blog
  • Adsense placement means to increase blog income.
  • 100% Safe because it is still in the same domain as the main blog


Step 1 - Creating a Safelink Page:

  1. First of all, make a blogger page, it doesn't have to be a static page, the post page can also be used for this safelink. We assume you understand and can create it, then save the page and then edit it again ' in html mode
  2. We have prepared a template that you can use for the layout of the safelink page so you only need to copy and paste the script code below on the safelink page that you have created.


<div class='ad-placement'>
  <!--[ Your_ad_code_here ]-->
</div>

<div class='safelink-button' id='safelink'>
  <div style='text-align: center'>
    <div class='button outline' id='safelink-wait'>Please wait...</div>
    <script>/*<![CDATA[*/ var currentURL = location.href; var str = currentURL; var res = str.replace('https://your_blog_address.com/p/safelink.html' + '?url=', " "); function changeLink(){ var decodedString = Base64.decode(res); window.open(decodedString, '_blank')}; document.write('<a href="#getLink" id="safelink-download" class="button">Create link</a>'); var linkDL = document.getElementById("safelink-download"); var notif = document.getElementById("safelink-wait"); var time = 5; var textTime = document.createElement("span"); linkDL.parentNode.replaceChild(textTime, linkDL); var id; id = setInterval(function () { time--; if (time < 0) { textTime.parentNode.replaceChild(linkDL, textTime); clearInterval(id); notif.style.display = "none"; linkDL.style.display = "inline-block"; } else { textTime.innerHTML = "Link will appear in " + time.toString() + " second"; }}, 1000); /*]]>*/</script>
  </div>
</div>

<div class='safelink-content'>

  <!--[ Write_your_content_here ]-->

</div>

<div class='safelink-create' style='text-align:center'>
  <div class='ad-placement'>
    <!--[ Your_ad_code_here ]-->
  </div>

  <div id='getLink'>
    <a class='button' href='javascript:;' onclick='changeLink();' rel='noreferrer noopener' target='_blank'>Get link</a>
  </div>

  <div class='ad-placement'>
    <!--[ Your_ad_code_here ]-->
  </div>
</div>
  • Place your articles and Adsense code in the marked section. The recommended size of the appropriate adsense is responsive for the top and 336x280 on the left and right of the safelink.
  • Don't forget to copy the page url / link that you created earlier and replace the url in the code above with the url of your safelink page
  • You can also change the sentence on the link button to your liking by changing the sentence 'Towards Link'and'Wait a minute...'and others that we've marked.
  • Numbers 5In the code above is the time parameter (seconds) that the destination link is displayed for, you can change it to be faster or slower. You can also customize the display time text by changing the 'The link will appear in','second'.
  • It is recommended that your blog support 'https'because this will affect the experience of visitors

      3. Save the page you ignore if in case there is an error message ' Your HTML cannot be accepted: Tag break: BUTTON ' or so by clicking close on the notification , until here the first stage is finished and please continue to the second stage. It should be noted that this second part will be a little complicated so pay close attention because if there is even a little error then the safelink will not work.

Step 2 Final:

It should be noted that this second part will be a little complicated so watch carefully because if there is even a little error then the safelink will not work


Please edit your template in ' edit HTML ' mode. In short, please click on the theme and click edit html as shown below; If necessary, backup your template first to avoid editing errors.


1. CSS :

This CSS code serves to display the layout on the safelink page and to hide the safelink widget from appearing on the blog.

/* Safelink */
:root {
--link-outline-color: #48525c ;
--link-bg-color: #204ecf ; // Warna background tombol link
}

.button{display: inline-flex;align-items: center;margin: 15px 15px;padding: 10px 20px;outline: 0;border: 0;border-radius: 2px;color: #fefefe;background-color: var(--link-bg-color);font-size: 14px;white-space: nowrap;overflow: hidden;max-width: 100%;line-height: 2em}
.button.outline{color: var(--link-outline-color);background-color: transparent;border: 1px solid #ebeced}
.button.outline:hover{border-color: var(--link-bg-color)}
.safelink-button, .safelink-create > *{margin: 1.8em 0}
.safelink-button span{display: block;font-size: 12px}
#getLink{margin: 5px 0}
#getLink .button{display: none}
#getLink:target .button{display: inline-flex}

2. Javascript:

Look for the code </head> on your blog and place the code below just above the code </head>:
<b:if cond='data:view.isPage'>
  <script>/*<![CDATA[*/ var uri = window.location.toString(); if (uri.indexOf("?m=1","?m=1") > 0) {var clean_uri = uri.substring(0, uri.indexOf("?m=1"));window.history.replaceState({}, document.title, clean_uri); }; var protocol = window.location.protocol.replace(/\:/g,''); if(protocol == 'http'){ var url = window.location.href.replace('http','https'); window.location.replace(url);} /*]]>*/</script>
</b:if>
  • The code above serves to delete the code '& m = 1'which usually appears when the page is accessed via mobile, if code'& m = 1'not deleted, safelink will not function when visitors access it via the mobile platform. This code also serves to redirect visitors through 'http'to'https'. If your blog has not been set up support 'https'then you can delete the section; 

var protocol = window.location.protocol.replace(/\:/g,''); if(protocol == 'http'){ var url = window.location.href.replace('http','https'); window.location.replace(url);}
Blog that is set in mode 'http'will not work if opened via'https'and the reverse mode applies'https'will not work if opened via'http'.


3. Javascript Code for Encode Url

This script serves to change all external links on the blog to Base64, after adding the script below all external links will be automatically encoded to be as in the example below


https://safekate2blogspot.com.com/p/safelink.html?url=aHR0cHM6Ly93d3c2NS56aXBweXNoYXJlLmNvbS92L3F3V1FhTDdWL2ZpbGUuaHRtbA
The easiest way to place javascript code is to place it before the tag </body>. Look for the tag at the bottom of the template and paste the Javascript code below just before the </body> tag.
<b:if cond='data:view.isSingleItem'>
  <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(/\r\n/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 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://your_blog_address.com/p/safelink.html" ]; 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 = "noopener noreferrer"; a_to_vb++; a_to_vc += i + ":::" + a_to_ve[i].href + "\n";} } var a_to_vj = ""; var a_to_vk = ""; 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>

  <!--[ Protect link from encode ]-->
  <script>protected_links = "facebook.com, instagram.com, twitter.com"; auto_safelink(); </script>
</b:if>

4. Click on Save Template:

At this point, your safelink page has been completely created, if you follow all the steps correctly, we can guarantee that the safelink page is working properly. Please test it by clicking the download link on your blog. If there are questions or sections that are not understood, please write down questions through the comments column provided.

If You are facing any issue you can comment below

Reference: http://www.jagodesain.com