Saturday, April 29, 2017

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

author photo
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.



Advertisement
Blogger
Disqus
Pilih Sistem Komentar Yang Anda Sukai

No comments

Selamat Datang di Blog Pekanan.com

Next article Next Post
Previous article Previous Post