Membuat Popup Pada Link Share Media Sosial

Jika Anda memakai custom social media sharing tool di blog Anda, biasanya tidak akan muncul popup saat menyebarkan ke media umum dengan klik link-nya, namun akan menuju ke halaman penuh.

Nah kebetulan aku menemukan sebuah javascript yang sanggup dengan gampang untuk menciptakan popup pada custom social media sharing tool. Namun aku modifikasi sedikit sehingga popup-nya muncul di tengah-tengah layar.

Sebagai contoh, di bawah ini ialah tumpuan link untuk sharing ke Linkedin.

 <a href="//www.linkedin.com/shareArticle?mini=true&amp;url=http://www.kompiajaib.com/" target="_blank" title="Share This On Linkedin">Share This On Linkedin</a>

Nah untuk menciptakan popup pada link di atas tadi silahkan tambahkan javascript di bawah ini di atas aba-aba </body>

 <script>
 //<![CDATA[
 var postEl=document.getElementsByClassName("social-popup"),postCount=postEl.length;for(i=0;i<postCount;i++)postEl[i].addEventListener("click",function(e){var t=this.getAttribute("href"),o=screen.width/2-250,s=screen.height/2-250;window.open(t,"popUpWindow","width=500,height=500,left="+o+",top="+s+",resizable=yes,scrollbars=yes,toolbar=yes,menubar=no,location=no,directories=no,status=yes")});
 //]]>
 </script>

Kemudian tambahkan kode class="social-popup" pada link-nya sehingga menjadi menyerupai berikut ini, tambahkan juga pada link lainnya jikalau ada.

 <a class="social-popup" href="//www.linkedin.com/shareArticle?mini=true&amp;url=http://www.kompiajaib.com/" target="_blank" title="Share This On Linkedin">Share This On Linkedin</a>

Bagaimana, gampang bukan? Selamat mencoba.
Sumber https://www.kompiajaib.com/

Share this post