CARA MEMBUAT KOTAK PESAN POP-UP MUNCUL DI HALAMAN BLOG

Pada kesempatan ini saya akan memberikan tutorial bagaimana cara membuat kotak pesan pop-up di blogspot.

Tahukah kalian, jika pesan pop-up yang muncul di halaman blog itu bisa kalian manfaatkan dengan menyapa pengunjung, kata pengantar singkat, pesan peringatan, disclaimer artikel, memberi pesan atau ucapan selamat pada moment-moment hari besar atau sekedar ucapan terima kasih kepada pengunjung blog/website mu.

Jika niche/tema blog kalian manfaatkan dengan berjualan online, maka kalian juga bisa memperkenalkan new product, best seller product ataupun big sale product kalian melalui pesan pop-up tersebut.

Dengan begitu, setiap orang yang berkunjung ke halaman blog mu, secara otomatis kotak pesan pop-up akan muncul pada halaman tersebut.

Tapi jika pesan ini terlalu sering muncul pada halaman blog/website mu, bukannya memberikan manfaat, tapi malah akan mengganggu dan membuat tidak nyaman orang yang berkunjung ke halaman blog/website mu.

Disini saya akan memberikan kode script yang bisa kalian gunakan pada blog mu. Script ini bisa kalian sematkan ke semua halaman blog mu, dan bisa juga kalian sematkan hanya pada halaman tertentu saja, jika kalian tidak ingin menampilkan kotak pesan pop-up ini ke semua halaman blog kalian.

Pesan pop-up ini hanya akan muncul sekali saja dalam sehari dan pada web browser yang sama. Jadi dengan begitu, kotak pesan pop-up yang muncul tidak akan mengganggu pengunjung blog mu.

Cara Pasang Script Kotak Pesan Pop-Up Pada Semua Halaman Blog

Kalian bisa menampilkan pesan pop-up ke semua halaman blog kalian sekaligus dengan menggunakan 2 cara di bawah ini;

#CARA PERTAMA

1. Masuk ke menu TEMA

2. Pilih EDIT HTML

3. Kemudian Salin/Copy kode di bawah dan letakkan di bawah kode <head>

4. Kemudian SIMPAN/SAVE

#CARA KEDUA

Selain itu ada cara KEDUA yang lebih mudah dan praktis

1. Masuk ke menu TATA LETAK

2. Tambahkan GADGET

3. Pilih HTML/JavaScript

4. Kemudian Tempelkan/Paste kan kode script di bawah dan SIMPAN

Cara Pasang Script Kotak Pesan Pop-Up Pada Halaman Tertentu di Blog

Kalian juga bisa memunculkan pesan pop-up nya hanya ke halaman tertentu saja dengan cara;

1. Buka Artikel blog yang ingin di pasang kotak pesan pop-up

2. Pilih Tampilan HTML

3. Kemudian Tempel/Paste kode script di bawah ini (terserah mau di tempelkan dimana saja)

4. SIMPAN/SAVE

🟥SALIN/COPY KODE SCRIPT KOTAK PESAN POP-UP DI BAWAH INI

<!--PopUp GiztaPop Start-->
<style>
#giztapop-pad{display:none;background:rgba(0,0,0,.5);width:100%;height:100%;position:fixed;top:0;left:0;right:0;bottom:0;z-index:99999;box-sizing:border-box}
#giztapop-content{background:#fdfdfd;position:relative;width:98%;height:98%;max-width:400px;max-height:220px;border:4px solid #ccc;border-radius:10px;margin:12% auto;overflow:hidden;box-sizing:border-box}
.giztapop-display {width:100%;height:100%;display:block;padding:8px;box-sizing:border-box}
.giztapop-name {display:block;font-size:22px;font-weight:600;color:#555;margin-bottom:8px;padding:0 5px 5px;border-bottom:1px solid #ccc}
.giztapop-item {font-size:16px;font-weight:300;color:#555;line-height:1.6;box-sizing:border-box}
.giztapop-hide{background:#000000;position:absolute;right:8px;bottom:8px;font-size:14px;font-weight:400;color:#fff;padding:3px 8px;border-radius:3px;border:1px solid #ccc;cursor:pointer}
</style>
<div id="giztapop-pad">
    <div id="giztapop-content">
        <div class="giztapop-display">
            <span class="giztapop-name">INFO OJOL</span>
            <div class="giztapop-item">
                Hai..selamat datang di blog saya 
                    <br /> <p>
            SELAMAT MENUNAIKAN IBADAH PUASA BAGI YANG MENJALANKANNYA ...🙏
            </p>
</div>
            <div class="giztapop-hide" id="giztapop-hide"><span>TUTUP</span></div>
        </div>
    </div>
</div>
<script>
//<![CDATA[
function setCookie(cname,cvalue,exdays){var d=new Date;d.setTime(d.getTime()+exdays*24*60*60*1e3);var expires="expires="+d.toUTCString();document.cookie=cname+"="+cvalue+";"+expires+";path=/"}function getCookie(cname){var name=cname+"=";var decodedCookie=decodeURIComponent(document.cookie);var ca=decodedCookie.split(';');for(var i=0;i<ca.length;i++){var c=ca[i];while(c.charAt(0)==' '){c=c.substring(1)}if(c.indexOf(name)==0){return c.substring(name.length,c.length)}}return""}document['\x62\x6f\x64\x79']['\x6f\x6e\x6c\x6f\x61\x64']=function checkCookie(){var _0x9a2885='\x67\x69\x7a\x74\x61\x43\x6f\x6f\x6b\x69\x65',_0x1274eb=getCookie(_0x9a2885),_0x49098d=document['\x67\x65\x74\x45\x6c\x65\x6d\x65\x6e\x74\x42\x79\x49\x64']('\x67\x69\x7a\x74\x61\x70\x6f\x70\x2d\x70\x61\x64'),_0x2dd7c1=document['\x67\x65\x74\x45\x6c\x65\x6d\x65\x6e\x74\x42\x79\x49\x64']('\x67\x69\x7a\x74\x61\x70\x6f\x70\x2d\x68\x69\x64\x65');_0x1274eb!=''?_0x49098d['\x73\x74\x79\x6c\x65']['\x64\x69\x73\x70\x6c\x61\x79']='\x6e\x6f\x6e\x65':(_0x1274eb=_0x49098d['\x73\x74\x79\x6c\x65']['\x64\x69\x73\x70\x6c\x61\x79']='\x62\x6c\x6f\x63\x6b',_0x1274eb!=''&&_0x1274eb!=null&&setCookie(_0x9a2885,_0x1274eb,1)),_0x2dd7c1['\x6f\x6e\x63\x6c\x69\x63\x6b']=function(){_0x49098d['\x73\x74\x79\x6c\x65']['\x64\x69\x73\x70\x6c\x61\x79']='\x6e\x6f\x6e\x65';};};
//]]>
</script>
<!--PopUp GiztaPop End→

NB. Tulisan yang berwarna Merah bisa diganti dengan Kata-Kata mu sendiri

Dengan pesan yang muncul setiap kali visitor blog mu berkunjung, pasti tidak akan luput dari pandangan mata mereka. Jadi saran saya, sebaiknya tampilkan pesan yang betul-betul penting dan yang dibutuhkan pengunjung blog mu.

Itulah cara membuat kotak pesan pop-up muncul di halaman blog.

Jika masih kurang paham, bisa tanyakan langsung pada kolom komentar di bawah.

Terima Kasih..