Cara Membuat Pop Up Fans Page Facebook Dengan Tombol Close di Blog

Pekanan.com- Cara Membuat Pop Up Fans Page Facebook Dengan Tombol Close di Blog | Pada kali ini saya akan mecoba untuk membrikan tutorial cara memasang fanspage facebook melayang di blog dengan tombol close, sehingga memudahkan kepada para pengunjung untuk melihat sosial media blog anda.

Popup fanspage facebook ini sudah diedit dengan sedemikian rupa, sehingga tampilan semakin cantik dan unik, sehingga akan membuat blog sobat semakin ramah di mata.

Tombol like fanspage ini sangat bermanfaat untuk menunjukan kepada pengunjung bahwa blgo yang anda kelola memiliki akun sosial media yang bisa meraka ikuti.

Selain untuk mempromosikan sosial media, tombol like box ini juga sangat berguna untuk menarik perhatian pengunjung untuk melihat fansage blog anda.

Untuk anda yang tertarik untuk memasangnya tombol like box melayang ini, anda bisa langsung mengikuti tutorialnya dibawah ini.

Tombol Pop Up Fanspage Untuk Blog:

1. Silahkan masuk ke blogger anda Dashboard > Template > Edit HTML lalu taru kode dibawah ini diatas kode </style> atau bisa juga diatas kode ]]></b:skin>


/*=============== CSS Popup Like box  ======================*/ 
.mspopup{position:fixed;top:0;left:0;right:0;bottom:0;z-index:90000;background:rgba(0,0,0,.6);overflow-x:hidden;overflow-y:auto;display:none} .mspopup-container{background:#fff url(http://i.imgur.com/2twQjiN.gif) no-repeat 50% 50%;padding:0;font-size:14px;height:236px;position:fixed;top:50%;left:50%;z-index:90001;-webkit-box-shadow:0 0 15px 0 rgba(50,50,50,0.8);transform:translateY(-50%) translateX(-50%)} 
.mspopup .mspopup-close{position:absolute;top:9px;right:20px;font-weight:700;font-family:Verdana;font-size:18px;cursor:pointer;color:#fff} 
.mspopup .mspopup-close:hover{color:#535353} 
.mspopup .mspopup-header{font-size:20px;padding:10px;text-align:center;color:#fff;font-family:Open Sans;background-color:#3B5998;text-shadow:1px 2px 4px #838383} 
.mspopup .mspopup-header p{font-size:10px;padding:0;margin:0;font-weight:400;text-transform:initial} 
.mspopup .mspopup-content{padding:10px 20px}

2. kemudian letakan kode dibawah ini sebelum kode </body>


<script src='https://cdn.rawgit.com/msdesign92/ms-design/master/mspopup.js' type='text/javascript'/> <script type='text/javascript'> $(&#39;#popup-box&#39;).mspopup({ &#39;autoOpen&#39;: true }); </script>

3. Kemudian buka Tataletak> Add a gadget > HTML/Javascript lalu paste kode dibawa ini


<div class="fb-page" data-href="https://www.facebook.com/pekanan" data-width="400" data-height="300" data-small-header="true" data-adapt-container-width="true" data-hide-cover="true" data-show-facepile="true" data-show-posts="false"><div class="fb-xfbml-parse-ignore"></div></div>

Perhatiah: Silahkna ganti nama PEKANAN dengan shortcode fanspage anda

Demikian cara Cara Membuat Pop Up Fans Page Facebook Dengan Tombol Close di Blog, semoga bermanfaat.