How To Make Safelink On Main Blog With Easy Update
What is Safelink ?
Perhaps a large portion of the perusers of this article definitely know what safelink is, yet as an update, it will be made sense of again here. Safelink is a page on a site or blog that is utilized to identify regardless of whether the expected url/interface is protected from infections and malware, so, safelink is a divert page before the client goes to the planned page.
Safelink is normally found on web journals/sites with download topics, however what is frequently experienced is that the safelink isn't on the principle blog with an alternate space. There are a few hindrances of this sort of safelink however won't be talked about here. Thinking about the different advantages that can be augmented from safelink, we attempted to explore different avenues regarding stacking a safelink page that remaining parts on the primary blog and works impeccably.
Safelink Scenarios and Benefits
The manner in which it works is practically equivalent to other safelinks, it's simply that the safelink page stays on the primary area. The situation is that when guests need to download specific documents on the blog, they will be coordinated to a specific page of the blog before at long last going to the record download page.
There are many advantages that can be gotten from this adaptation 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 page rank 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
Safelink Tutorial on Main Blog
This instructional exercise will be partitioned into two sections, the initial segment is making the safelink page and the subsequent part is altering the source or blog code. We use blogger since this instructional exercise is likewise liked for blogger clients, for other assistance clients you can change this instructional exercise.
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 arranged a format that you can use for the design of the safelink page, so you just need to reorder the content code beneath on the safelink page that you have made.
<div class='separator' style='text-align:center'>
<div class='ads-top'><!-- Fill AdSense code here--></div>
<div class='safelink' id='safelink'>
<center>
<div class='asbutton outline' id='daplong'>
Wait a minute...</div>
<script>/*<![CDATA[*/ var currentURL=location.href; var str = currentURL; var res = str.replace('https://danisheditzyt.blogspot.com/p/safe-link.html' + '?url=', ""); function changeLink(){var decodedString = Base64.decode(res); window.open(decodedString,'_blank')}; document.write('<a href="#go-link" id="download-safelink" class="asbutton outline">Click to go to the link</a>'); var linkDL = document.getElementById("download-safelink"); var notif = document.getElementById("daplong"); var waktu = 20; var teks_waktu = document.createElement("span"); linkDL.parentNode.replaceChild(teks_waktu, linkDL); var id; id = setInterval(function () { waktu--; if (waktu < 0) { teks_waktu.parentNode.replaceChild(linkDL, teks_waktu); clearInterval(id); notif.style.display = "none"; linkDL.style.display = "inline-block"; } else { teks_waktu.innerHTML = "Link will appear in " + waktu.toString() + " second"; }}, 1000); /*]]>*/</script></center>
</div>
<div class='separator-text'><!-- Write your article content here --></div>
<div class='blockLink' style='text-align:center'>
<div id='ads-left' class='ads-left'><!-- Fill AdSense code here --></div>
<div id='go-link'>
<a class='asbutton outline' href='javascript:void(0)' onclick='changeLink();' rel='nofollow noreferrer'><i class ='icon demo'> </i>Go to the link</a>
</div>
<div id='ads-right' class='ads-right'><!-- Fill AdSense code here --></div>
</div>- Place your articles and Adsense code in the marked section. The recommended adsense size 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 https://www.asthemesworld .com/p/safelink.html with the url of your safelink page.
- You can also change the sentence on the link button to your liking by changing the sentence 'Click here to go to link' and 'Wait a minute...'and others that we've marked.
- Number 20 in 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 there is a goof message ' Your HTML can't be recognized: Tag break: BUTTON ' or so by clicking close on the notice , until here the initial step is done and kindly proceed to the subsequent stage. It ought to be noticed that this subsequent part will be somewhat muddled so give close consideration since, supposing that there is even a little blunder then the safelink won't work.
Step 2 - Final
Note: The second part will be a little complicated so look carefully because if there is a slight error then the safelink will not work.
If it's not too much trouble, alter your layout 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 toshow the design on the safelink page and to stow away the safelink gadget from showing up on the blog.
/* Safelink */
.asbutton.outline{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;}
.asbutton.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}
.ads-top{margin: 0 0 20px 0;text-align: center}
#HTML99,#HTML99 .widget-content{border: 0 !important;margin: 0 !important;padding: 0 !important}
/* 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}}
If you have trouble finding a place to put the css code above you can search for the code </head> and put the css code right above the code </head> with notes must be squeezed in the code <style> --- </style>. It looks like this:
<style>
<!-- Fill in the CSS code above -->
</style>
Sometimes the </head> code is not found in certain templates, instead you can look for code like this: & lt; / head & gt; or & lt;! - <head /> - & gt; & lt; / head & gt;
2. Javascript
Look for the code </head>on your blog and place the code below just above the code </head>:
<b:if cond='data:blog.pageType == "static_page"'>
<script>/*<![CDATA[*/ var uri = window.location.toString();
if (uri.indexOf("%3D","%3D") > 0) { var clean_uri = uri.substring(0, uri.indexOf("%3D"));
window.history.replaceState({}, document.title, clean_uri);} var uri = window.location.toString();
if (uri.indexOf("%3D%3D","%3D%3D") > 0) { var clean_uri = uri.substring(0, uri.indexOf("%3D%3D"));
window.history.replaceState({}, document.title, clean_uri);} 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 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 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. Create a New Widget
Look for the sidebar widget section of your template which is usually tagged with code <b: section> or <b: widget>please look for your template code like this. Add another gadget by reordering the code below.
If you have trouble please find the code</ b: widget> </ b: section> on your template and place the code below right in the middle of that code to be </ b: widget> fill in the code below </ b: section>
<b:widget cond='data:view.isSingleItem' id='HTML99' locked='false' title='Safelink' type='HTML' version='1'>
<b:widget-settings>
<b:widget-setting name='content'/>
</b:widget-settings>
<b:includable id='main'>
<div class='widget-content'>
<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 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://danisheditzyt.blogspot.com/p/safe-link.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 = "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>
</div>
</b:includable>
</b:widget>
- Put your safelink page url back in the marked section.
- By default all external links will be directed to the safelink page, add a few exclusion sites such as your blog's facebook page and so on in the section 'protected_links', separate with commas (,) if you want to add some exception sites.
- cond = 'data: view.isSingleItem' make the widget appear only on post pages and static, will not appear on other pages.
4. Click Save Theme on your template.
Add More Than 1 Safelink Pages
You can slightly modify the script above in order to display more than two safelink pages to be selected randomly. The trick is to change the code section:
var daftarPostingan = [ "https://danisheditzyt.blogspot.com/p/safe-link.html" ];Add a new url separated by a comma( ,) so that the code becomes as below; You can also add some other safelink pages
var daftarPostingan = [ "https://danisheditzyt.blogspot.com/p/safe-link.html", "https://danisheditzyt.blogspot.com/p/safe-link.html" ];This is optional, you can add it or decide to keep using one safelink page only.