Cara Membuat Page Masking Blogspot untuk Redirect URL

Bibit.WS – Kali ini saya mau buka rahasia bagaimana cara membuat page masking blogpsot untuk redirect url ke halaman lain. Pada kasus ini akan saya contohkan untuk keperluan redirect menuju tracking link main CPS Ecomobi, khususnya dari hasil import postingan WP Harga Pro ke Blogger.com.

Sebagai catatan, disini saya tidak akan membahas secara rinci, dan jika artikel ini dirasa TIDAK “newbie friendly“, saya minta maaf.

Silakan dipelajari dan mohon untuk tidak mengubah script bagian credit 😀

Cara Membuat Page Masking Blogspot untuk Redirect URL

1. Buat Halaman Baru di Blogspot

• Silakan buat Halaman / Page baru di dasbor Blogger.com
• Misalnya buat judul “BELI” (tanpa petik), agar nantinya URL halaman itu menjadi: https://blogku.blogspot.com/p/beli.html
• Kolom postingan, klik tab HTML (sebelah Compose).
• Isikan script page masking blogspot berikut:

Info: Edit beberapa baris yang saya tandai dengan warna-warni sesuai dengan data blog anda!

<style type='text/css'>
/* --- Standar Custom CSS --- */
header, #main, #sidebar, footer { display: none !important; visibility: hidden !important; }
#bwscepot { display: block; text-align: center; margin: 20px; }
</style>
<script language='javascript' type='text/javascript'>
/* --- Page Masking for Blogspot | https://bibit.ws/ --- */
var bwscepot = 'bibit.ws';
function PageQuery(q) {
	if(q.length > 1) this.q = q.substring(1, q.length); else this.q = null;
	this.keyValuePairs = new Array();
	if(q) { for(var i=0; i < this.q.split("&").length; i++) { this.keyValuePairs[i] = this.q.split("&")[i]; } }
	this.getKeyValuePairs = function() { return this.keyValuePairs; }
	this.getValue = function(s) { for(var j=0; j < this.keyValuePairs.length; j++) { if(this.keyValuePairs[j].split("=")[0] == s) return this.keyValuePairs[j].split("=")[1]; }
	return false; }
	this.getParameters = function() { var a = new Array(this.getLength()); for(var j=0; j < this.keyValuePairs.length; j++) { a[j] = this.keyValuePairs[j].split("=")[0]; }
	return a; }
	this.getLength = function() { return this.keyValuePairs.length; }
}
function queryString(key){ var page = new PageQuery(window.location.search); return unescape(page.getValue(key)); }
if('b'+'ib'+'i'+'t.w'+'s'==bwscepot){ var cur_url=queryString("url");
if(cur_url !== 'false' && cur_url !== 'undefined' && cur_url !== null && cur_url !== '') {
document.write ("<meta http-equiv=\"refresh\" content=\"3; url=//go.ecotrackings.com/?token=jtOD4qKnccctQrsDPZPbd&url="+cur_url+"&sub1=blogku.blogspot.com&sub2=bwscepot\">");
}
else {
document.write ("<meta http-equiv=\"refresh\" content=\"0; url=//blogku.blogspot.com\">");
}} else { document.write ("<meta http-equiv=\"refresh\" content=\"0; url=//"+bwscepot+"/\">"); }
</script>

Nah, setelah disimpan dan pastikan URL halaman tersebut sudah sesuai harapan, anda bisa edit lagi lalu ganti judulnya. Misalnya tadinya judulnya “BELI“, anda bisa ganti judul jadi “Mengarahkan ke toko…” , dll 😉

2. Custom CSS Sesuai Tema Blogspot

Jika anda paham dalam membuat custom CSS untuk tema blogger yang dipakai, silahkan bisa tambahkan script custom page redirect berikut di atas </body>

<b:if cond='data:blog.url == "https://blogku.blogspot.com/p/beli.html" or data:blog.url == "https://blogku.blogspot.com/p/beli.html?m=1"'>
<div id='bwscepot'><p>Mohon tunggu, kami sedang mengantar Anda ke toko tujuan...</p><p><img alt='Loading...' border='0' data-original-height='100' data-original-width='100' height='200' src='https://3.bp.blogspot.com/-IZ9eEj50g7A/W_1MLdNtTHI/AAAAAAAAAE8/1htm07ZYKaI-Y5066UcVOrusB7KNo95mwCLcBGAs/s200/lazy-load.gif' width='200'/></p></div>
</b:if>

3. DEMO

• Anda bisa menengok contoh page masking blogspot di blog: Harga Smartphone
• Silakan buka salah satu postingan, lalu klik salah satu tombol “Cek Toko” yang ada.

===
Gunakan dengan bijak, karena sistem blogspot tidak suka ada javascript redirect atau manipulasi pengalihan seperti ini!

Semua akibat atau kerugian yang timbul dan/atau terjadi karena penggunaan artikel ini menjadi tanggungjawab masing-masing!