Cara Gampang Memasang Facebook Messenger Kedalam Blog

Senin, 21 Oktober 2013

Artikel Kang Wira kali ini akan membahas ihwal Cara Praktis Memasang Facebook Messenger Kedalam Blog yang sanggup memudahkan para pengunjung blog untuk berinteraksi dengan admin blog tersebut via Facebook Chat.

Tutorial yang saya bagikan kali ini 100% bekerja pada blog.

Agar teman-teman sanggup melihat pola demo Facebook Messenger yang sudah saya terapkan pada blog dumi saya, teman-teman sanggup tekan tombol demonya dibawah ini.



D E M O

Cara penerapannya, kau sanggup eksklusif perhatikan tutorial dibawah ini dan eksklusif dipraktekkan dalam blog utama kamu. Langkah pertama yang kau harus kau lakukan yakni menyalin aba-aba CSS dibawah ini

<style> .chat_box{background:#fff;width:250px;height:160px;position:fixed;bottom:-125px;left:60px;transition:all .3s;border:1px solid transparent;border-radius:3px 3px 0 0;-webkit-box-shadow:rgba(0,0,0,0.0980392) 0 0 1px 2px;-moz-box-shadow:rgba(0,0,0,0.0980392) 0 0 1px 2px;box-shadow:rgba(0,0,0,0.0980392) 0 0 1px 2px;overflow:hidden;z-index:1000000} .pesan_chat{text-align:center;text-decoration:none;display:block;height:100%;padding:5px 5px 15px} .chat_button{background:#4d90fe;border:0;margin:0 auto;padding:5px 18px;font-size:18px;font-weight:700;color:#fff;text-align:center;display:inline-block;border-radius:3px;transition:all .3s;text-decoration:none} .chat_button:hover{background:#365899} .chatheader{margin:0 auto;padding:0 10px;height:35px;line-height:35px;font-size:18px;font-weight:700;color:#616161;text-align:center;display:block;cursor:pointer} .pesan_chat p{color:#616161;font-size:16px;margin:10px} </style>

Jika posisi tombolnya ingin berada di sebelah kanan, ganti aba-aba left yang saya tandai dengan right

Selanjutnya, kau masuk ke sajian edit HTML didalam blog, kemudian tempel aba-aba diatas sempurna diatas aba-aba </head>

Pada langkah selanjutnya silahkan kau salin Kode dibawah ini kemudian tempelkan sempurna diatas aba-aba </body>.

<div class="chat_box" id="chat">   <div class="chatheader" onclick='showhidechat()'>Chat Room   </div>   <div class="pesan_chat">     <p>Kamu sanggup chat bareng Admin di sini dengan Messenger,       <br/> Terima kasih.</p>     <a href="javascript: void(0)" onclick="popup('https://m.me/admin.kangwira');showhidechat()" title="Cara Praktis Memasang Facebook Messenger Kedalam Blog">       <span class="chat_button">Chat on Messenger</span></a>   </div> </div> <script> //<![CDATA[ function showhidechat(){var o=document.getElementById("chat");"0px"!==o.style.bottom?o.style.bottom="0px":o.style.bottom="-125px"}function popup(o){var t=650,n=400,e=(screen.width-t)/2,i=(screen.height-n)/2,s="width="+t+", height="+n;return s+=", top="+i+", left="+e,s+=", directories=no",s+=", location=no",s+=", menubar=no",s+=", resizable=no",s+=", scrollbars=no",s+=", status=no",s+=", toolbar=no",newwin=window.open(o,"windowname5",s),window.focus&&newwin.focus(),!1}; //]]> </script>

Silahkan kau rubah kalimatnya sesuai harapan kamu, dan ganti goresan pena yang saya tandai berwarna merah dengan dengan Username Profile Facebook kamu.

Simpan, Lalu lihatlah akhirnya dalam blog.

Sekian Toturial Cara Praktis Memasang Facebook Messenger Kedalam Blog kali ini, baca juga Cara Cepat Posting Masal Kesemua Group Facebook.

Silahkan isi komentar dibawah ini apabila ada pertanyaan. Terimakasih

Share This :