bootstrapのjsとlightning.min.jsの関係について
bootstrapのjsとlightning.min.jsの関係について
タグ: bootstrap.min.js, lightning.min.js, マージ, 方法
- このトピックには8件の返信、2人の参加者があり、最後に
DRILL LANCERにより5年、 8ヶ月前に更新されました。
-
投稿者投稿
-
2018年12月13日 8:38 PM #14009
DRILL LANCERモデレーター
上記のトピックでbootstrapのcssについては解決しましたが、
bootstrapのjsはlightning(-pro)/assets/lightning.min.js
にマージされているようです。
lightning.min.jsに別バージョンのbootstrapを適用する場合どのようにすればいいのか教えていただければ幸いです。2018年12月14日 7:41 PM #14027あー・・・そうですね・・・
これはbootstrapのjsをマージしないで別ファイルを読み込む方式にテーマを変更しないと無理ですね・・・
テーマ側でちょっと改修しますね。
2018年12月14日 8:24 PM #14032
DRILL LANCERモデレーター現在bootstrapのcssはスキンに内蔵、jsはテーマに内蔵という形をとっているようですが、
テーマならテーマ、スキンならスキンとどちらかに統一したほうが
後々の混乱を招かずに済むと思うのですがいかがでしょうか?-
この返信は5年、 8ヶ月前に
DRILL LANCERが編集しました。
2018年12月14日 9:22 PM #14034CSSは、今の段階のものはBS3をベースに作られているので、bootstrapのバージョン違いと組み合わせるとどうしても見た目の不具合の出るところがあると思います。
なので、もともと BS3をベースに開発したスキンなのにBS4に変更されて「表示がおかしくなるんですよー」みたいな状況になるとキツイなと。それもあってbootstrapのcssはあらかじめマージした状態でスキンに入れてます。BS4にしたいとは思ってますが、全体をBS4に変更すると今まで本文欄などにBS3を前提とした書き方をしてる人に影響が出るので、
例えばデフォルトスキンの Origin についても 現行の BS3版とBS4版のCSSを追加する事は検討しています。JSについてはそうですねー・・・
確かにテーマに入れてるので、今後バージョン違いになる事はありますが…
んー・・・js部分についてはどのスキンでも使うので、
やはりテーマ側に入れておいて、ユーザーがフックで外して切り替えたりできるようにして、
スキンでBS4版が用意出来てきたら、管理画面でBSのjsのバージョン指定もできるようにしようかなと思ってます。2018年12月15日 5:01 AM #14037
DRILL LANCERモデレーターhttps://getbootstrap.com/docs/4.1/migration/
上記にBS3とBS4の差分が書かれています。
執筆で使いそうなものはbuttonとtable関連だと思われますが・・・ちなみに、子テーマのCSSはどのタイミングで読み込まれますか?
2018年12月16日 8:13 AM #14054
DRILL LANCERモデレーター提案ですが、以下のようにすればカスタマイズ性が向上しより使いやすく成ると思います。
マージによってBSのCSSが上書きされていた場合は読み込む量が増えるかもしれませんが・・・①管理画面でbootstrapのバージョンを指定する。(v3・v4・・・)
②BSオプションを条件に
BS3の場合はBS3のv3.3.7のbootstrap.min.cssとbootstrap.min.js(とbootstrap-theme.min.css)
BS4の場合はBS4のv4.1.3のbootstrap.min.cssとbootstrap.bundle.min.js(←popper.jsをマージしたもの)を読み込む
(BS5が登場した場合も同様)③bootstrapの後にfontawesomeやicomoon等のテーマやスキン以外のCSS・JSを読み込む
④親テーマ共通(全スキン共通とも)のCSS(上記以外)を読み込む
⑤BSオプションとスキンオプションを条件にBS3用・BS4用それぞれに対応したのスキンのCSS・JSを読み込む
⑥子テーマのCSS・JSを読み込む
⑦②~⑥は1つの関数にまとめ、この関数は子テーマ側でオーバーライド可能にする
P.S.
fontawesomeは5.6.1が出ています。2018年12月16日 8:27 AM #14055
DRILL LANCERモデレーター2018年12月16日 7:11 PM #14065ご提案ありがとうございます。
いろいろと変更したいとは思うのですが、既存で既に2万以上のウェブサイトが稼働しており、
スキンシステムやhtmlの構造などに手を入れると受託案件でカスタマイズして使っている方に結構影響が出るので、回避するための処理をいろいろ入れたり、入れてもそれが原因で不具合が発生したりと(FontAwesomeのバージョン切り替え機能を入れた時もそんなに重くないだろうと思って着手したが地獄絵図になった)、対応工数が結果的にかなりかかるので、ちょっと今の段階では他の優先順位の高い実装・不具合修正もあり手を出せない状況です。取り急ぎjsの読み込み分離に関して構造変更しましたので、
以下のようなコードにて変更可能になります。function my_after_setup_function() { // Lightningで読み込んでいるJSの処理を解除する remove_action( 'wp_enqueue_scripts', 'lightning_addJs' ); // JS読み込みの処理を新たに追加する add_action( 'wp_enqueue_scripts', 'my_lightning_addJs' ); } add_action( 'after_setup_theme', 'my_after_setup_function' ); function my_lightning_addJs() { // Bootstrap4のJSを読み込み wp_enqueue_script( 'bootstrap4-js', 'https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.bundle.min.js', array( 'jquery' ), '4.1.3', true ); // 標準のjsを読み込み wp_enqueue_script( 'lightning-js', get_template_directory_uri() . '/assets/js/lightning.min.js', array( 'jquery' ), LIGHTNING_THEME_VERSION, true ); }
せっかくご提案いただいたのにご希望に添える回答が出来ず恐れ入ります。
次にスキンシステム変更を含むメジャーバージョンアップの際にいただいたご提案を参考にさせていただきます。2018年12月16日 9:42 PM #14067
DRILL LANCERモデレーターそうですか、今までのテーマで非常に使いやすいテーマだったのですが、
ソースコードが思った以上に複雑だったのでびっくりしました。
メジャーバージョンアップで対応するとのことなので
Lightningのv7.0.0を楽しみにお待ちしております。
それでは失礼します。 -
この返信は5年、 8ヶ月前に
-
投稿者投稿
- このトピックに返信するにはログインが必要です。