Problem Modal Bootstrap Drupal Tidak Muncul Ketika Di Klik

Kaprikornus disini saya memakai template bootstrap dan membuat sub theme dimana di sub theme tersebut saya meload file css / javascript yang terdapat pada direktori website. Kurang lebih susunan file template infonya yaitu sebagai diberikut

name = Bootstrap Sub-Theme (CDN) description = Uses the jsDelivr CDN for all CSS and JavaScript. No source files or compiling is necessary and is recommended for simple sites or beginners. core = 7.x base theme = bootstrap   ;;;;;;;;;;;;;;;;;;;;; ;; Regions ;;;;;;;;;;;;;;;;;;;;;  regions[navigation] = 'Navigation' regions[header] = 'Top Bar' regions[highlighted] = 'Highlighted' regions[help] = 'Help' regions[content] = 'Content' regions[sidebar_first] = 'Primary' regions[sidebar_second] = 'Secondary' regions[footer] = 'Footer' regions[page_top] = 'Page top' regions[page_bottom] = 'Page bottom' regions[content_bottom] = 'Content bottom'   ;;;;;;;;;;;;;;;;;;;;; ;; Stylesheets ;;;;;;;;;;;;;;;;;;;;;  stylesheets[all][] = css/style.css stylesheets[all][] = bootstrap/css/bootstrap.min.css  ;;;;;;;;;;;;;;;;;;;;; ;; Scripts ;;;;;;;;;;;;;;;;;;;;;   scripts[] = 'bootstrap/js/affix.js' scripts[] = 'bootstrap/js/alert.js' scripts[] = 'bootstrap/js/button.js' scripts[] = 'bootstrap/js/carousel.js' scripts[] = 'bootstrap/js/collapse.js' scripts[] = 'bootstrap/js/dropdown.js' scripts[] = 'bootstrap/js/modal.js' scripts[] = 'bootstrap/js/tooltip.js' scripts[] = 'bootstrap/js/popover.js' scripts[] = 'bootstrap/js/scrollspy.js' scripts[] = 'bootstrap/js/tab.js' scripts[] = 'bootstrap/js/transition.js'

br />

Ketika saya mencoba memakai CDN, ada sebuah masalah, yaitu salah satunya Modal Bootstrap tidak sanggup tampil dengan baik. Kaprikornus ceritanya disini saya punya sebuah view galeri/gambar dimana dalam gambar tersebut saya memanfaatkan bootstrap modal, sehingga dikala thumbnail gambar di klik, maka gambar akan muncul, nah dikala saya memakai CDN bootstrap modal mengalami masalah. Saat saya klik gambarnya, gambar tidak muncul atau pada modal bootstrap gambar spesialuntuk ditampilkan sekejap, kemudian secara otomatis tertutup

Awalnya saya agak bingung, mengapa hal tersebut sanggup terjadi, namun usang – usang karenanya saya menemukan solusi bagaimana cara mengatasinya.

Teknik Mengatasinya :

Kaprikornus dikala kita memakai CDN, kurang lebih si Template Bootrap di Drupal akan meload file – file diberikut :

https://cdn.jsdelivr.net/bootstrap/3.3.7/css/bootstrap.css
https://cdn.jsdelivr.net/bootstrap/3.3.7/css/bootstrap.min.css
https://cdn.jsdelivr.net/bootstrap/3.3.7/js/bootstrap.js
https://cdn.jsdelivr.net/bootstrap/3.3.7/js/bootstrap.min.js


File – file diatas sesungguhnya sanggup di load dari lokal direktori website, tapi kita juga sesungguhnya sanggup merequestnya dari CDN. Kaprikornus dikala file – file dari CDN di load otomatis akan mempengaruhi beberapa file, termasuk file modal.js, artinya file bootstrap.js dengan modal.js mengalami konflik atau sederspesialuntuk terjadi error yang membuat gagalnya fungsi javascript yang ada. Jika saya hapus modal.js, tentu akan membuat modal bootstrap kembali normal. Konflik file JS Ini juga bukan besar lengan berkuasa pada modal saja, namun juga pada javascript untuk sub sajian akan mengalami kegagalan fungsi, dimana jikalau sajian di klik sub menunya tidak akan tampil

Kaprikornus pada dasarnya begini, kalau seandainya web drupal yang memakai template bootstrap dengan custom template pada sub theme dimana file – file js/css nya diload dari lokal, sebaiknya tidakboleh gunakan CDN, alasannya sanggup menjadikan terjadinya konflik file JS. Kalau memang mau memakai CDN, sebaiknya gunakan CDN sepenuhnya tidak usah meload file dari lokal atau meload file JS yang sanggup membuat antar file JS konflik sehingga ada fungsi tertentu yang mengalami kegagalan.

Hal ini sesungguhnya bukan spesialuntuk untuk kasus drupal bootstrap saja, tapi juga untuk jenis framework lainnya, kalau contohnya kita meload banyak file JS yang kita tidak ketahui fungsinya kemungkinan akan terjadi bentrok/error yang membuat fungsi tertentu pada Javascriptnya tidak bekerja sebagaimana mestinya. Bagi pengguna awam menyerupai aku, tentu mencari kesalahan menyerupai itu sangatlah menyusahkan.

Baca juga : Membuat Halaman Foto Galeri melaluiataubersamaini Bootstrap Modal di Drupal

 

Share :