Scroll to top

Haloo! Selamat Datang di Komunitas Private Training Web Development (32381 Members, 276 Projects, 2821 Topic, 7824 Comments)

Butuh karyawan baru? atau seorang Web Developer (Part-time/Freelance/Full-time) untuk mengerjakan project/aplikasi anda?, cari disini : Members Area Jobs!
Membuat popup di web kampus seperti members area phpmu ini
Miftahul Alfin Mengatakan : Members -
  1. Assalamualaikum Warahmatullahi Wabarakatuh...
  2. mas mau tanya, untuk membuat popup seperti di web member phpmu gmna ya?
  3. mau saya tambahkan di web kampus..
  4. thanks mas.. :)
Ada 1 File Kiriman :
1. php.PNG (236 KB)
Bukhari al Muslim Mengatakan :
Admin -
  1. Assalam,.. ini gan tinggal tambahkan modal box :
  2. <?php
  3. echo "<div class='modal fade' id='myModal' tabindex='-1' role='dialog' aria-labelledby='myModalLabel'>
  4. <div class='modal-dialog' role='document'>
  5. <div class='modal-content'>
  6. <div class='modal-header'>
  7. <button type='button' class='close' data-dismiss='modal' aria-label='Close' id='sub-button'><span aria-hidden='true'>×</span></button>
  8. <h4 class='modal-title' id='myModalLabel'>Klik Tombol Like / Suka ya</h4>
  9. </div>
  10. <div class='modal-body'>
  11. <center>
  12. <div class='fb-page' data-href='https://www.facebook.com/pehapemu/' data-tabs='timeline' data-width='500' data-height='355' data-small-header='false' data-adapt-container-width='true' data-hide-cover='false' data-show-facepile='true'><blockquote cite='https://www.facebook.com/pehapemu/' class='fb-xfbml-parse-ignore'><a href='https://www.facebook.com/pehapemu/'>phpmu.com</a></blockquote></div>
  13. </center><br>
  14. </div>
  15. </div>
  16. </div>
  17. </div>";
  18. ?>
  19.  
  20. Dan agar popup terbuka saat pertama kali load halaman
  21. dan jika di klik close maka tidak akan muncul dalam 24 jam ini scriptnya :
  22. <script type="text/javascript">
  23. $(document).ready(function(){
  24. if(!Cookies.get('hide')){
  25. $(window).load(function(){
  26. $('#myModal').modal('show');
  27. });
  28. }
  29.  
  30. $("#sub-button").click(function () {
  31. Cookies.set('hide', true, { expires: 1 });
  32. });
  33. });
  34. </script>
  35.  
  36. Semoga bermanfaat,.. :)

Bukhari al Muslim Mengatakan :
Admin -
  1. Assalam,.. Oo ya jangan lupa di include juga bootsrap css dan js nya, karena ini menggunakan bootsrap..
  2. kita lampirkan filenya dibawah ini.
  3.  

Ada 1 File Kiriman :
1. bootstrap_js_css_modifikasi_kampus.zip (32 KB)
Miftahul Alfin Mengatakan :
Members -
  1. Assalam,..
  2. yang modal box ini d tempatkan di template.php?

Miftahul Alfin Mengatakan :
Members -
  1. Assalam,..
  2. sama bootstrap css dan js nya d truh mana ya mas?
  3.  

Bukhari al Muslim Mengatakan :
Admin -
  1. Assalam,.. bootstrap.css dan js nya tempatkan di asset/css/bootstrap.css dan asset/js/bootstrap.js
  2. pemanggilannya dari file template.php, seperti ini :
  3. <link rel="stylesheet" type="text/css" href="<?php echo base_url(); ?>asset/css/bootstrap.css">
  4. <script type="text/javascript" src="<?php echo base_url(); ?>asset/js/bootstrap.js"></script>
  5.  
  6. script ini juga tempatkan pada template.php di atas tag </body> :
  7. <script type="text/javascript">
  8. $(document).ready(function(){
  9. if(!Cookies.get('hide')){
  10. $(window).load(function(){
  11. $('#myModal').modal('show');
  12. });
  13. }
  14.  
  15. $("#sub-button").click(function () {
  16. Cookies.set('hide', true, { expires: 1 });
  17. });
  18. });
  19. </script>

Miftahul Alfin Mengatakan :
Members -
  1. Assalam,..
  2. maaf mas, msih belum bisa muncul popup nya..
  3. apa saya naruh modal boxnya yg salah?
  4. lebih tepatnya dmna ya mas buat naruh script modal boxnya?
  5. maaf merepotkan mas,, :)

Bukhari al Muslim Mengatakan :
Admin -
  1. Assalam,.. coba share file template.php yang sudah masnya setting disini,
  2. saya coba lihat kesalahannya, sekalian di info juga dimana ditempatkan file bootstrap.css dan bootstrap.js nya.

Miftahul Alfin Mengatakan :
Members -
  1. Assalam,..

Ada 1 File Kiriman :
1. template1.zip (1 KB)
Miftahul Alfin Mengatakan :
Members -
  1. Assalam,..
  2. ini gambar file bootstrap css dan js nya

Ada 2 File Kiriman :
1. css1.PNG (87 KB)
2. js.PNG (80 KB)
Bukhari al Muslim Mengatakan :
Admin -
  1. Assalam,.. oke coba ubah ini :
  2. <script type="text/javascript">
  3. $(document).ready(function(){
  4. if(!Cookies.get('hide')){
  5. $(window).load(function(){
  6. $('#myModal').modal('show');
  7. });
  8. }
  9.  
  10. $("#sub-button").click(function () {
  11. Cookies.set('hide', true, { expires: 1 });
  12. });
  13. });
  14. </script>
  15.  
  16. Menjadi seperti ini :
  17. <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/ekko-lightbox/5.1.1/ekko-lightbox.js"></script>
  18. <script type="text/javascript">
  19. $('.horizon-swiper').horizonSwiper();
  20. </script>
  21. <script src="https://cdnjs.cloudflare.com/ajax/libs/js-cookie/2.1.2/js.cookie.js"></script>
  22. <script type="text/javascript">
  23. $(document).on('click', '[data-toggle="lightbox"]', function(event) {
  24. event.preventDefault();
  25. $(this).ekkoLightbox();
  26. });
  27.  
  28. $(document).ready(function(){
  29. if(!Cookies.get('hide')){
  30. $(window).load(function(){
  31. $('#myModal').modal('show');
  32. });
  33. }
  34.  
  35. $("#sub-button").click(function () {
  36. Cookies.set('hide', true, { expires: 1 });
  37. });
  38. });
  39. </script>

Miftahul Alfin Mengatakan :
Members -
  1. Assalam,..
  2. untuk mengganti konten popup nya dengan gambar gmna ya mas?
  3. tolong koreksinya

Ada 1 File Kiriman :
1. ban.PNG (188 KB)
Bukhari al Muslim Mengatakan :
Admin -
  1. Assalam,.. tinggal ganti source fans page FB Likes :
  2. <div class='fb-page' data-href='https://www.facebook.com/pehapemu/' data-tabs='timeline' data-width='500' data-height='355' data-small-header='false' data-adapt-container-width='true' data-hide-cover='false' data-show-facepile='true'><blockquote cite='https://www.facebook.com/pehapemu/' class='fb-xfbml-parse-ignore'><a href='https://www.facebook.com/pehapemu/'>phpmu.com</a></blockquote></div>
  3.  
  4. Ubah Menjadi :
  5. <img scr='".base_url()."asset/folder_gambar/nama_gambar.jpg'>

Miftahul Alfin Mengatakan :
Members -
  1. Assalam,..
  2. alhamdulillah..sudah bisa mas
  3. terimakasih..

Maaf, Untuk Memberikan Komentar Anda Harus Login !!!