baserマーケット/商品詳細ページ
  • RSS
  • facebook
  • X

ようこそゲスト 様 ログイン

  • お買い物ガイド
  • 販売したい方へ
  • マイページ
  • 新規会員登録
  • カートを見る

プラグイン

コードエディタ拡張 Pro baserCMS 5対応

画像を拡大する
このエントリーをはてなブックマークに追加
550 円(税込)

難しい設定はゼロ!有効化するだけで、コード編集がグッと簡単に。

「テーマファイル編集」機能における標準テキストエリアを、高度な開発支援機能を備えたコードエディタ(CodeMirror5)に置き換えるプラグインの上位版(Pro版)です。
複雑な設定画面は一切なく、インストールして有効化するだけで、どなたでも簡単かつ直感的に使い始めることができます。検索・置換や簡易構文チェックといった強力な機能を、マニュアルに頼ることなくスムーズにご利用いただけます。


 


Pro版(上位版)の独自機能


  • 検索・置換機能:「前へ」「次へ」の操作で一致箇所へ素早く移動・選択できます。「該当行マーク」を利用すれば、一致する行全体をハイライト表示することが可能です。「すべて置換」を実行した際は、完了後に置換件数が表示されます。
  • 簡易チェック機能:ボタン一つでコードを解析し、構文エラーやCSSの重複、PHPの記述ミスなどをカテゴリ別にわかりやすく表示します(解析結果はあくまで参考表示です)。
  • 元に戻す(Undo)/やり直し(Redo):ツールバーのボタン操作により、簡単に編集履歴を行き来できます。
  • ローカルファイルの 開く/保存:サーバー保存とは別に、PC上のファイルを直接エディタに読み込んだり、編集中のコードをローカルへダウンロード(保存)できます。

基本機能(無料版共通)


  • エディタの置き換え:テーマ内の各種テンプレートなどの編集画面にCodeMirrorを適用し、行番号やシンタックスハイライトを表示します。
  • 編集モードの自動判定:拡張子やURLから、最適な編集モード(CSS / JavaScript / HTML混在 / PHP)を自動判定してコードをハイライトします。
  • 全画面表示と配色切り替え:編集領域をブラウザの全画面に広げることが可能です。また、ライト背景とダーク背景の切り替えに対応しています(選択状態はブラウザに記憶されます)。
  • 離脱防止の確認ダイアログ:編集内容が変更されている状態で誤って「一覧に戻る」ボタンを押してしまった際、確認ダイアログを表示して大切なデータ消失を防ぐ安全設計です。

対象となる画面


管理画面で、テーマ内のファイルを新規作成・編集するときにのみCodeMirrorが適用されます。


【対象ファイルの例】


  • レイアウトテンプレート(例: default.php)
  • エレメントテンプレート(例: header.php)
  • コンテンツテンプレート(例: default.php)
  • CSS スタイルシート(例: style.css)
  • JavaScript スクリプト(例: common.js)

対応環境


  • baserCMS 5.2.0 ~ 5.3.0 で動作確認済み BcThemeFileプラグインが有効であること
  • PHP 8.1 以上

インストール方法


  1. baserマーケットのマイページから、本プラグインのZIPファイルをダウンロードします。
  2. baserCMS管理画面にログインし、「プラグイン管理」を開きます。
  3. 「新規追加」ボタンからZIPファイルを選択し、アップロードします。
  4. プラグイン一覧に「BcCodeEditorPro(コードエディタ拡張Pro)」が表示されたら、「インストール」をクリックします。

仕様・制限事項


  • 適用されない画面について:本プラグインは「テーマファイル編集」専用です。ブログ記事や固定ページなどの本文エディタ(WYSIWYGエディタ)や、他のプラグインの設定画面などには適用されません。用途の取り違えにご注意ください。
  • 入力中のピンク背景(シンタックスハイライト)について:HTMLテンプレートなどで属性の引用符に欠落や不整合があると、入力と同時に該当箇所以降がピンク背景になることがあります。これはCodeMirrorのシンタックスハイライトによる標準的な表示仕様であり、不具合ではありません。引用符などを正しく修正すると消えます。本プラグイン独自の「簡易チェック」機能とは異なります。
  • ライブラリの同梱について:CodeMirror本体(MIT License)をプラグイン内に完全同梱しています。外部CDNサーバーへの通信が発生しないため、管理画面の読み込み遅延を防ぎ、サードパーティに依存しない安定した動作を実現します。
  • 無料版(BcCodeEditor)との併用について:無料版と両方有効にした場合、Pro版のエディタが優先されるため動作は競合しません。ただし、管理画面のロード量がわずかに増えるため、本プラグインを利用する場合は無料版を無効化することをおすすめします。

配色切り替え


レイアウトテンプレート例(ライト背景)

コードエディタ拡張 Pro

レイアウトテンプレート例(ダーク背景)

コードエディタ拡張 Pro

簡易チェック機能のダイアログ

コードエディタ拡張 Pro

ローカルファイルを開く際の上書き防止の確認ダイアログ


 

コードエディタ拡張 Pro

離脱防止の確認ダイアログ

コードエディタ拡張 Pro

評価とレビュー

この商品に対するご感想をぜひお寄せください。